fév

7

The art of title

Catégorie: Divers | Laisser un commentaire | 3 lectures

Vous vous êtes déjà certainement retrouvé au cinéma devant un écran noir sur lequel défile le générique à travers des fondus au noir. C'est ennuyeux au possible. On souhaite que ça finisse rapidement pour enfin se divertir. À côté de ça, il existe d'autres techniques pour intégrer ces éléments textuels dans le film. Dans certains cas, c'est un fabuleux travail d'animation, de mise en scène et on peut apprécier au passage le choix typographique. La forme créative et originale introduisent favorablement le spectateur et le plonge directement dans le décor du film.


Capture Artofthetitle.com

The art of the title agrège un certain nombre de génériques réussis. Une véritable mine d'or. Cette idée présentée sous la forme d'un blog met en lumière le travail fascinant des artistes concepteurs. Dorénavant, vous ne regarderez plus les génériques comme avant.

jan

27

Taxe sur les clés USB

Catégorie: Web | Commentaires fermés | 12 lectures

Début février, il faudra prendre en compte une énième taxe sur les supports de stockage tels que la clé USB (c'est franchement ridicule, une clé USB à un tout autre usage), le disque dur ou le lecteur MP3. Eh oui, il fallait compléter l'offre et s'adapter aux nouvelles habitudes. Une taxe existait déjà sur les CD, DVD et graveurs DVD mais il fallait compléter l'offre et s'adapter aux nouvelles habitudes. Au lieu de proposer une réflexion en profondeur et lancer des pistes de solutions, le gouvernement agit et profite du crime délit. On nous traite de voleurs mais ça ne les empêche pas de se sucrer. Enfin, pas tout à fait car c'est mis dans un pot commun et redistribué aux ayants droits. C'est magnifique ! Les artistes sont payés mais ça ne nous donne certainement pas le droit de copier. Bien au contraire. On reste les vilains bandits, les malpropres et les assassins de la culture. Bon, si c'est comme ça, mon prochain achat se fera en ligne sur un site étranger.

Une taxe pour tous, c'est ça la solidarité. Ne dites pas que vous n'avez jamais téléchargé illégalement, on ne vous croit pas. Selon certains [¹], c'est une pratique qui concerne pratiquement 95 % des internautes, autrement dit tout le monde. Et si c'est tout le monde, il y a vraiment un gros problème, vous ne trouvez pas ?

Disques durs amovibles

[¹] Intermedias: « La fin du gratuit sur le web »

jan

25

Polices WOFF sur Firefox 3.6

Catégorie: Typographie | Commentaires fermés | 18 lectures

Firefox 3.6 est sorti il y a quelques jours. Au programme, pas mal de changements dont les polices WOFF (Web Open Font Format). Ce format est compressé entre 30 et40 % sans perte de qualité. Pour l'instant, WOFF n'est supporté que par la toute dernière version de Firefox 3.6 mais, selon Tristan Nitot, il sera progressivement intégré aux autres navigateurs.

Cette innovation est une façon de répondre aux inconvénients du téléchargement de police sur le poste client. Pas de secret, la rapidité de l'affichage d'une page dépend du poids du fichier complet de la page (texte, images, javascript, CSS...). En dessous de la seconde, la page se charge presque instantanément et l'utilisateur n'a pas l'impression d'attendre le chargement. Si je me souviens bien, Jokob Nielsen préconise de ne pas dépasser les 5 secondes, auquel cas le risque de fuite est important. Pour avoir essayé, il y a un très léger décalage entre l'affichage du texte et le chargement des polices.

L'autre intérêt réside dans l'insertion de métadonnées sur l'origine de la police. Surtout utile pour les nombreuses fontes gratuites. Au niveau technique, l'insertion se fait via une règle CSS de type @font-face. Dans l'exemple, le navigateur télécharge la super-police.woff ou la super-police.ttf si ce dernier ne gère pas le nouveau format.

@font-face {
font-family: SuperPolice;
src: url(fonts/super-police.woff) format("woff"),
url(fonts/super-police.ttf) format("truetype");
}

Pour approfondir le sujet et tester: « WOFF for Firefox 3.6 ».

jan

24

Dix billets populaires sur Tutoweb

Catégorie: Blog | Commentaires fermés | 9 lectures

J'en connais certains qui aimeraient bien connaître les sujets qui cartonnent. Pour y arriver, il faut parfois lancer des bouteilles à la mer et patienter. On est parfois bien surpris des résultats. Le billet le plus populaire est sans nul doute celui où je proposais des icônes gratuites à télécharger (avis aux furieux de l'Adsense). Et puis il y a des notes sur lesquelles j'ai sué sang et eau et qui sont totalement délaissées. Voici donc le top 10 depuis juillet 2007.

jan

24

Couleur de sélection du texte

Catégorie: Web | Commentaires fermés | 87 lectures

Quand je lis un article, j'utilise souvent la sélection pour me repérer dans la page surtout si les paragraphes sont longs. De manière générale, les navigateurs affichent un fond bleu sur du texte blanc pour la sélection. Dans certains cas, Firefox se comporte différemment et inverse les couleurs.

Capture Oxfam
Capture Oxfamsol.be

Capture Emakina
Capture Emakina.com - sélection sous Firefox

Je n'ai pas trouvé les règles qui définissent l'inversion des couleurs. C'est problématique dans la mesure où les teintes de sélection se rapprochent fortement des couleurs du site. Dans certains cas, cela pose problème. Dans l'exemple ci-dessous, le texte courant est sélectionné mais n'affiche aucun repère visuel.

Capture Ergonomie-web
Capture Ergonomie-web.be - sélection sous Firefox

Avec l'arrivée de CSS3, il est possible de personnaliser les couleurs de la sélection grâce à la balise ::-selection. Comme toujours, on risque de rencontrer des accords harmonieux et puis des mélanges hasardeux. Ça me rappelle l'époque des ascenseurs colorés sur Internet Explorer.

Capture Blog d'André Gunthert
Capture Arhv.lhivic.org - sélection sous Firefox

Capture CSS Tricks
Capture css-tricks.com - sélection sous Firefox

Pour l'instant, cet attribut n'est pas reconnu par Firefox. Il faut donc lui ajouter un code spécifique. Ci-dessous, le code repris de la feuille de style sur CSS Tricks. 

::selection { background: #ffcc89; color: #222;}
::-moz-selection { background: #ffcc89; color: #222;}