[Tutoriel] Créer son premier Web Component. Ce petit tuto est un voyage dans le futur. Actuellement, il ne fonctionne que sous les versions les plus récentes de Chrome, mais il vous donne un aperçu de ce que pourra être le développement avec les web components dans quelques années, sans les polyfills (pour l’utilisation desquels il existe déjà des tutoriels en Français). Créer son premier composant La première chose indispensable pour créer une page avec des composants, c’est les custom elements. Il est en effet possible de créer sa propre balise HTML avec un peu de JavaScript.
Maintenant, nous pouvons utiliser notre balise dans notre page. Notre navigateur affichera alors “Hello world!” Attention au nommage de notre balise. Nous avons utilisé, pour créer notre balise la fonction createdCallback, qui comme son nom l’indique, est appelée à la création. Si on veut quelque chose d’un peu plus classe qu’un Hello world! Si on se contente d’insérer cela dans notre navigateur, il ne se passe rien. Le shadow DOM Et en insérant notre élément : Tuts+ Premium | The best way to learn creative and technical skills.
New structural elements in HTML5. By Chris Mills, Bruce Lawson Introduction HTML5 brings two new things to the table: new APIs that add essential new features to the open standards web development model, and new structural elements that define specific web page features with much more accurate semantics than were available in HTML 4. You can find articles covering many of the new APIs by looking for Dev.Opera articles marked with the HTML5 tag. This article, on the other hand, focuses on the latter — we will briefly look at how the new semantic elements were chosen, what the main new features are and how they are used, how headings work in HTML5, and browser support for these new elements, including how you can support them in older browsers.
The contents are as follows: Introducing HTML5 structural elements HTML4 already has a lot of semantic elements to allow you to clearly define the different features of a web page, like forms, lists, paragraphs, tables, etc. But it could be so much better. <figure> and <figcaption>
Design exemple. Can I use... Support tables for HTML5, CSS3, etc. WebPlatform.org — Your Web, documented. 5 Free Tools that Test and Optimize Web Performance - DZone Performance. Real Favicon Generator.