Le petit journal du web

Le petit journal du Web — Décembre 2010

Comme à son habitude, le petit journal du Web fait le point sur les sites et les services (re)découverts pendant les 30 derniers jours. Pour décembre, ce petit journal vous propose : à la Une, un site consacré à l’accessibilité Web ; dans la rubrique Graphisme et Ergonomie, un bookmarklet pour afficher les Wireframes ; dans la catégorie CSS, CSS3 et HTML5, une piqûre de rappel sur l’organisation des feuilles de styles CSS ; et nous terminons avec un rappel des éléments à prendre en compte lors de la migration d’un blog WordPress et une mine de ressources pour les chefs de projet Web ! →

HTML & CSS

HTML 5 Outline — Quelques notes sur la structure des pages Web avec h1 et section

Après l’article Quelques notes sur la balise h1 avec HTML5 dans lequel j’ai abordé l’utilisation des niveaux d’en-tête `h1 — h6` pour savoir dans quelle mesure il est judicieux d’utiliser une ou plusieurs balises `h1` dans une même page Web, je continue sur ma lancée avec la notion d’Outline. Cette dernière fournit la liste des sections imbriquées impliquant les éléments de type Sectioning Content ou Sectioning Root. Chaque section peut être associée à un niveau d’en-tête et peut contenir autant de sections imbriquées que l’on veut. Notez que les sections dont on parle ne sont pas nécessairement l’élément `section` lui-même (même si ce dernier fait partie des éléments ayant une portée de Sectioning Content). →

HTML & CSS

Quelques notes sur la balise h1 avec HTML5

La réponse courte à la question « Combien de balises `h1` dans une page Web HTML5 ? » est : « Autant que nécessaire ! » En gros, chaque fois que vous avez une nouvelle section, vous pouvez mettre un `h1`. D’une manière générale, `h1` accompagnera `article`, `aside`, `nav` ou `section` avec brio ! (cf. Sectioning content). Allons voir ce que nous disent les spécifications HTM5 sur l’emploi des balises de titre `h1` — `h6`, notamment les exemples concernant les niveaux de titre. Ils sont assez parlant bien que parfois déroutant lorsqu’on a l’habitude du balisage utilisé jusqu’à présent. Les éléments `h1` — `h6` représentent les niveaux d’en-têtes de leurs sections respectives. Quant à l’élément `hgroup`, il regroupe un ensemble d’en-têtes composé d’au moins deux niveaux de titre, comme un titre et son sous-titre ou un titre et le slogan associé (un bon candidat pour Logo et Motto, faute de mieux). →

Google & Référencement

8 composés HTML pour le logo et la « baseline » et leur potentiel SEO

Mon petit manifeste concernant la création des balises logo et motto dans les spécifications HTML5 n’a pas encore eu l’effet escompté. En attendant que le W3C valide cette modeste proposition, les enveloppeurs Web font preuve d’imagination. Voici un florilège de composés HTML (HTML Compound) plus ou moins sémantiques pour baliser l’identité d’un site internet. Cerise sur le SEO, j’ai demandé à Didier Sampaolo de nous dire ce qu’il pense — ou ce que Google pense — des différentes solutions présentées. @dsampaolo est éditeur du site Brave New World et consultant e-business spécialisé en référencement naturel. →

Design & Graphisme

24 listes pour Webdesigners

Quoi de mieux (ou de pire) qu’une liste de liens résultant d’une veille technique et stratégique triée sur le volet ? Une liste de listes de liens, pardi ! Voici donc devant vos yeux ébahis, plus de 20 listes thématiques dans le domaine du Webdesign, de l’intégration Web (HTML, CSS et Javascript) et de WordPress. →

Helper CSS

innerShiv — Le contenu HTML5 généré par innerHTML fonctionne enfin dans IE

Pour les injecter les balises HTML5 dans le DOM et leur appliquer la propriété CSS display: block pour les styler, Remy Sharp a mis au point html5shiv qui est toutefois sans effet lorsque les balises HTML5 sont affichées via innerHTML. Heureusement, HTML5 innerShiv est là pour que les version 6 à 8 d’Internet Explorer tiennent compte des nouvelles balises HTML5 créées à la volée.

HTML & CSS

Manifeste pour la création des éléments LOGO et MOTTO dans HTML5

Ce manifeste pour la création des balises `logo` et `motto` dans une prochaine révision des spécifications HTML5 — puisque rien n’est fixé pour l’instant, nous dit-on — est né du constat que le nom du site et sa tagline se retrouvent sur la quasi-totalité des sites web sans qu’aucun marquage HTML spécifique ne leur soit dédié. Je regrette que les concepteurs des standards du web n’aient pas fait d’entorse à leur régime 100% structurel. Il semble pourtant assez facile de créer les balises `logo` et `motto`, ce qui aurait le mérite d’être assez rigolo, en plus d’être utile. →

Le petit journal du web

Le petit journal du web : HTML5, CSS3, jQuery, WordPress, Métiers du Web, Vie quotidienne et Nostalgeek

Vous l’attendiez, il est là, c’est le petit journal du web ! A la Une cette semaine : des ressources pour exploiter au mieux les propriétés CSS3, un dossier sur l’ARIA-nisation et la HTML5-nisation de WordPress, le point sur display: inline-block, un tutoriel conséquent sur Javascript, le bilinguisme et l’optimisation des performances dans WordPress (et tout un tas d’astuces très pratiques). Vous aurez aussi un modèle de cahier des charges et des informations pour partir du bon pied avec vos projets de sites Web. Deux nouvelles rubriques font timidement leur apparition dans cette revue de presse : La vie quotidienne du geek et Nostalgeek. →

Le petit journal du web

Le petit journal du web — Non, Twitter n’a pas tué les Backlinks… La preuve !

A force de refiler des bons tuyaux aux plus de 4 300 abonnés de mon compte Twitter j’en avais presque oublié mon petit journal du web. Cette rubrique qui me permets d’arrêter le temps, l’instant d’un billet, pour jeter un oeil dans le rétro, histoire de me remémorer les sites ou les articles qui ont attiré mon attention. En ce qui me concerne, il ne sera pas dit que Twitter sera un dévoreur de Backlinks ! Pour vous donner le goût des autres, ce billet est composé de sites que j’ai découvert récemment. →