Ponctuation et CSS content

© Emily Mathews

La propriété content en CSS permet d’afficher du texte en CSS pour bien des navigateurs. Cette propriété est d’ailleurs plutôt bien supportée, car même Internet Explorer 8 est en mesure de la comprendre. Bon, Internet Explorer 7 ne comprend pas cette propriété, mais comme dirait Uma Turman pour Schweppes "Hey, what did you expect ?". :) Seulement voilà, on peut parfois se retrouver bien embêté à l’utilisation de cette propriété content, car certains caractères, liés à la ponctuation, ne sont pas correctement encodés directement dans les feuilles de style. Il faut en réalité utiliser la valeur Unicode de ces caractères si l’on souhaite les voir s’afficher avec les sélecteurs :before et :after. Les valeurs Unicode commencent toujours par un antislash. Je vous … Continuer la lecture de « Ponctuation et CSS content »

Une police d’icônes de réseaux sociaux

© DRiNCHEV

Je viens de tomber sur le lien utile du jour : une police entièrement faite d’icônes de réseaux sociaux. Ça pourrait vous sembler être une idée farfelue, ou alors un lien simplement utile pour les graphistes. Mais grâce à la propriété font-face en CSS, un panel de possibilités s’ouvre également aux développeurs. Quoi qu’il en soit, profitez ici de la Mono Social Icons Font. Celle-ci propose un grand nombre de réseaux sociaux représentés : 500px, Amazon, AOL, Apple, Behance, Bing, Blogger, Delicious, Deviantart, Ebay, Facebook, Google +, Grooveshark, iTunes, LinkedIn, MSN, Soundcloud, Twitter, et bien d’autres encore ! Et avec Mono Social Icons, il est aussi possible de profiter de toutes ces icônes sous la forme d’un carré et d’un cercle. Les avantages d’une … Continuer la lecture de « Une police d’icônes de réseaux sociaux »

Les 24 termes solaires chinois selon Oamul

© Wikimedia

En Chine, on appelle un terme solaire un point précis sur le calendrier lunaire solaire asiatique traditionnel correspondant souvent à un phénomène naturel précis. En effet, un calendrier chinois prend également en considération la révolution de la Terre autour du Soleil et le mouvement de la Lune autour de la Terre. Une année chinoise se découpe donc en 24 termes solaires, le premier étant 立春, Lìchūn en pinyin (le début du printemps) et le dernier étant 大寒, Dàhán (le grand froid). Oamul, illustrateur et animateur d’origine chinoise reconnu, nous propose sa propre version des 24 termes solaires. En plus de nous offrir des images aux tons doux, ce dessinateur en fait des GIFs possédant de manière calligraphiée les caractères chinois … Continuer la lecture de « Les 24 termes solaires chinois selon Oamul »

La césure typographique en CSS

© Ken Zirkel

On y pense rarement, et pourtant, la césure, autrement dit la coupure de mots dans un texte, aussi hyphens en anglais, est un procédé typographique très courant. Dans le monde du web, rares sont les sites qui mettent en œuvre cette pratique : certains ne reconnaissent pas les avantages de la césure, d’autres ne sont tout simplement pas au courant de la possibilité d’une telle pratique. Quoi qu’il en soit, j’ai décidé aujourd’hui de vous proposer un petit exemple concret de l’utilisation de cette propriété en CSS. Règles de typographie Afin de fournir aux lecteurs d’un texte un confort optimal, certaines règles de typographie ont été mises en place de manière standard. Ainsi, on apprend que la césure dans un texte … Continuer la lecture de « La césure typographique en CSS »

Alex Gopher, The Child

© Miguel Udaondo

The Child est une animation faisant appel à la motion typography que j’ai découverte en cours de "Poésies Numériques". La Motion Typography — aussi appelée par les anglophones kinetic typography, que l’on pourrait traduire par typographie cinétique en français — est une technique d’animation consistant à introduire des textes en mouvement. Ces derniers sont souvent accompagnés d’éléments sonores qui complètent la signification des mots utilisés dans l’animation. Contrairement à un texte écrit de manière conventionnelle, c.-à-d. horizontalement, la motion typography emmène le spectateur à être attentif aux mouvements, aux couleurs et aux formes représentées des mots. Il faut savoir qu’aucun élément n’est laissé au hasard dans ce type d’animations et que, chacune des mises en forme appliquées possède alors, une … Continuer la lecture de « Alex Gopher, The Child »