Les dernières actualités d'Alsacreations.com
Le web est désormais typographie. La liberté permise par les nouvelles techniques embarquant des polices, notamment grâce à CSS3, ajoute une nouvelle dimension à la création graphique. Ce livre est consacré à la lisibilité optimale de la typographie sur Internet. Il l'aborde de prime abord de façon très intéressante par la théorie historique et les différentes études effectuées autour du sujet ; puis par les différents concepts applicables au web : forme des lettres, lecture sur écran, lissage, contraste, et outils.
Y sont abordés le rendu des police selon les moteurs graphiques (systèmes d'exploitation, navigateurs) et les instructions CSS pour les manipuler, autant via l'échelle et ses unités que le positionnement, l'espacement ou le choix des caractères. Tout ceci pour optimiser le confort de lecture sur écran, qui influence considérablement nos sens, et aboutir à des pages plus efficaces.
C'est un bon ouvrage pour connaître l'essentiel de la pratique typographique pour le web. Un seul petit regret : les blocs de code indiqués en exemples n'utilisent pas de police à pas fixe, ni d'indentation ;)
dotJS.eu est la plus grande conférence française sur le JavaScript. Elle aura lieu le 30 novembre 2012 au Théâtre des Variétés à Paris.
De nombreux orateurs renommés sont annoncés dont :
En avant-première, Alsacréations et dotJS vous annoncent aujourd'hui 2 nouveaux orateurs :
Vous pouvez découvrir tous les orateurs sur le site web officiel : http://www.dotjs.eu
La conférence est à seulement 100€ et il reste encore quelques places sur http://www.amiando.com/dotjs.html donc n'hésitez pas !
Encore un nouveau livre sur CSS me direz-vous ! Certes, mais celui-ci capte enfin un public différent.
Il se pose en quelque sorte comme un chaînon manquant entre les livres de CSS purement dédiés aux designers et les autres plus techniques. Celui-ci s'adresse vraiment aux intégrateurs confrontés à des projets CSS quotidiennement.
Le sous-titre de l'ouvrage ("avec SASS et Compass") porte à confusion d'entrée de jeu, car... il ne s'agit pas d'un livre sur SASS et Compass. Ou plus précisément, il ne parle pas *que* de ces deux préprocesseurs : à vrai dire, seuls deux chapitres leurs sont entièrement consacrés.
Le reste de l'ouvrage traite plus généralement (et heureusement selon moi) de bonnes pratiques, de conventions, d'outils et d'astuces. Il regroupe et condense tous les ingrédients permettant de faire de l'intégration HTML / CSS propre, dans un environnement de production.
Mon ressenti sur ce livre est extrêmement positif : pour moi, il s'agit ni plus ni moins du livre que l'attendais depuis très longtemps sur le domaine des CSS; thème déjà très souvent traité mais rarement voire jamais dans un contexte de production et de bonnes pratiques.
Mon regret principal au sujet de ce livre est sa (relative) concision : 252 pages pour traiter de ce domaine vaste, intrigant et souvent mal traité, m'a semblé bien trop court. Il y aurait encore tant de choses à dire et à consolider.
Un dernier petit regret en atteignant la fin de l'ouvrage : pas de chapitre de synthèse, ni même un petit paragraphe de conclusion générale. Du coup, c'est un peu abrupt et on reste sur sa faim.
La principale lacune de CSS est… sa simplicité : à trop vouloir en faire un langage intuitif et facile à interpréter, il en devient répétitif, fastidieux et parfois réducteur.
Less est ce que l'on appelle un "Préprocesseur CSS", basé sur le langage Ruby et peut s’apparenter à une extension du langage CSS dans le but de lui apporter les fonctionnalités qui lui manquent parfois cruellement, telles que la notion de variables, les opérations de calculs dynamiques, la factorisation de parties de code ou encore les imbrications de sélecteurs.
Dans sa version de base, le code Less génère des fichiers CSS après avoir été interprété et compilé via un serveur en Ruby, mais il existe une version exploitable via PHP (http://leafo.net/lessphp/).
Il s’agit d’un projet jeune issu de groupes de travail de développeurs, c’est pourquoi il demeure encore quelque peu ardu à mettre en oeuvre et nécessite un minimum de connaissances en langages et administration de serveur.
Toutefois, avec un peu de pratique, on en vient à se demander pourquoi un langage tel que CSS ne propose pas encore un mode d’emploi aussi logique et productif que celui de la surcouche Less.
Les Microformats, ça vous dit encore quelque chose ? Sinon, rendez-vous au tutoriel parlant des Microformats sur Alsacreations, vous pourrez combler cette lacune ;p (d'ailleurs pour être sûr d'avoir bien compris ce que vous avez appris, allez donc vous faire les dents sur le quiz Microformats).
Pour expliquer de manière très concise, ce sont des attributs (en général class
et rel
) ajoutés aux balises HTML dans le but d'améliorer la sémantique du code et ainsi faciliter sa lecture par les machines (par exemple les robots) mais prioritairement par les humains.
µF 2 a été développé afin de simplifier la tâche des auteurs (ceux qui créent les microformats) et des développeurs d'analyseurs de microformats mais ils permettront également une meilleure utilisation des développeurs Web qui souhaitent ajouter des éléments sémantiques au contenu de leurs publications. Voici en détail les apports intéressants de cette nouvelle mouture.
On nous propose d'ajouter des préfixes (j'en connais certains qui commencent déjà à pester ;D) pour améliorer l'identification des classes, des propriétés. La liste de ces préfixes à l'heure actuelle :
h-
pour les noms de classes racines (exemples : h-card
, h-event
, h-entry
,…)p-
pour les propriétés simples (exemples : p-fn
, p-summary
,…)u-
pour les propriétés url (exemples : u-url
, u-photo
,…)dt-
pour les propriétés de date (exemples : dt-start
, dt-end
,…)e-
pour les propriétés dont la valeur est le contenu entier d'une portion de page (exemple : e-content
)Mais pourquoi diable est-on passé à ce type de syntaxe ? A-t-on succombé à la mode du préfixage que l'on retrouve dans les feuilles de style (-moz-, webkit-, -o-, …) ? Plusieurs raisons à cela :
Voici les classes racines et leurs propriétés correspondantes détaillées sur le site microformats.org : h-adr, h-card, h-entry, h-event, h-geo.
En clair, toutes les propriétés d'un microformat donné sont optionnelles et il n'y a plus de sous-propriétés. Cela simplifie et clarifie énormément leur utilisation. Prenons un exemple, voici une hCard "classique" :
<span class="vcard">
<span class="fn n">
<span class="given-name">Toto</span>
<span class="family-name">Schmitt</span>
</span>
</span>
Beaucoup de balises <span>
, la propriété fn
est obligatoire, une hiérarchie des différentes classes obligatoire (given-name
et family-name
doivent être des sous-propriétés de fn
) pour que le contenu microformaté soit correctement analysé.
Voici ce que cela pourrait donner avec la syntaxe microformat 2 :
<span class="h-card">
<span class="p-given-name">Albert</span>
<span class="p-family-name">Schmitt</span>
</span>
Plus de sous-propriétés, moins de balises.
On peut utiliser des classes racines sans utiliser aucune propriété, ces propriétés seront automatiquement déduites à partir du contenu. Un exemple simple à nouveau :
<a class="h-card" href="http://www.tomiungerer.com/">Tomi Ungerer</a>
Les outils d'analyse de ce code vont pouvoir ainsi obtenir le type de microformat et les propriétés, à savoir :
Quelques autres particularités des microformats 2 en bref :
Les microformats 2 sont à présent considérés comme étant prêt à être utilisés en production, vous pouvez donc vous lancer ;).