A presentation at @ 3pc in in Berlin, Germany by Gunnar Bittersmann
HTML elementary
AMERICAN LAND Written by Bruce Springsteen Tonight we want to add our voices to the thousands of Americans who are protesting at airports around the country the Muslim Ban and the detention of foreign nationals and refugees. America is a nation of immigrants and we find this anti-democratic and fundamentally un-American. —Bruce Springsteen, Adelaide, Australia, 30 January 2017
AMERICAN LAND Written by Bruce Springsteen Tonight we want to add our voices to the thousands of Americans who are protesting at airports around the country the Muslim Ban and the detention of foreign nationals and refugees. America is a nation of immigrants and we find this anti-democratic and fundamentally un-American. —Bruce Springsteen, Adelaide, Australia, 30 January 2017 The McNicholas, the Posalskis, the Smiths, Zerillis, too The Blacks, the Irish, Italians, the Germans and the Jews Come across the water a thousand miles from home With nothing in their bellies but the fire down below They died building the railroads worked to bones and skin They died in the fields and factories names scattered in the wind They died to get here a hundred years ago they’re still dying now The hands that built the country we’re always trying to keep out
✘
<div class=main> <h1> AMERICAN LAND </h1> <div class=credits> Written by Bruce Springsteen </div> <div class=quote> Tonight we want to add our voices to the thousands of Americans who are protesting at airports around the country the Muslim Ban and the detention of foreign nationals and refugees. America is a nation of immigrants and we find this anti-democratic and fundamentally un-American. <div class=quote-credits> —Bruce Springsteen, Adelaide, Australia, 30 January 2017 </div> </div> <div class=verse> The McNicholas, the Posalskis, the Smiths, Zerillis, too <br/> The Blacks, the Irish, Italians, the Germans and the Jews <br/> Come across the water a thousand miles from home <br/> With nothing in their bellies but the fire down below </div> <div class=verse> </div> They died building the railroads worked to bones and skin <br/> They died in the fields and factories names scattered in the wind<br/> They died to get here a hundred years ago they’re still dying now<br/> The hands that built the country we’re always trying to keep out </div>http://img.youtube.com/vi/vqeVGnWwnxM/maxresdefault.jpg
http://codepen.io/gunnarbittersmann/pen/QdmZQQ
http://codepen.io/gunnarbittersmann/pen/GrQVEV http://codepen.io/gunnarbittersmann/pen/RKyjGV
http://codepen.io/gunnarbittersmann/pen/OWxYBq
Custom Elements
✘ <x-sortable-table> <caption>Bruce Springsteen’s studio albums</caption> <thead> <tr> <th>title</th> <th sorted>release date</th> </tr> </thead> <tbody> <tr> <td>Greetings from Asbury Park, N.J.</td> <td> <time>1973-01-05</time> </td> </tr> ▼
var XSortableTableElementPrototype = Object.create(HTMLTableElement.prototype); var XSortableTableElement = document.registerElement(‘x-sortable-table’, { prototype: XSortableTableElementPrototype, extends: ‘table’ });
http://codepen.io/gunnarbittersmann/pen/XXwZpP
https://www.etsy.com/de/shop/jessman5Stuff
There’s a common misconception that progressive enhancement means that you’ll spend your time dealing with older browsers, but in fact the opposite is true. Putting the basic functionality into place doesn’t take very long at all. And once you’ve done that, you’re free to spend all your time experimenting with the latest and greatest browser technologies, secure in the knowledge that even if they aren’t universally supported yet, that’s okay: you’ve already got your fallback in place. —Jeremy Keith
The key to thinking about web development this way is realising that there isn’t one final interface— there could be many, slightly different interfaces depending on the properties and capabilities of any particular user agent at any particular moment. And that’s okay. Websites do not need to look the same in every browser. —Jeremy Keith
Once you truly accept that, it’s an immensely liberating idea. Instead of spending your time trying to make websites look the same in wildly varying browsers, you can spend your time making sure that the core functionality of what you’re building works everywhere, while providing the best possible experience for more capable browsers. —Jeremy Keith
An escalator can never break, it can only become stairs. You would never see an “Escalator Temporarily Out Of Order” sign, just “Escalator Temporarily Stairs. Sorry for the convenience. We apologize for the fact that you can still get up there.” —Mitch Hedberg
progressive enhancement
On the journey through the realm of HTML elements we learn what new elements come with HTML5, and why it is important to the users that developers use them appropriately. There is cure for divitis.
Auf der Reise durch die Welt der HTML-Elemente erfahren wir, welche neuen Elemente HTML5 mit sich bringt und warum es für die Nutzer wichtig ist, dass Entwickler das jeweils richtige Element verwenden. Divitis ist heilbar.
The following code examples from the presentation can be tried out live.
