Monthly Archives: janvier 2013

Un petit redesign de Gmail (bonus : supprimer la barre noire des sites Google)

Je me suis amusé (est-ce le bon mot ?) à faire deux feuille de style pour améliorer un peu l’interface de Google. Pour ceux qui ne connai­traient pas, avec un addon pour son navi­ga­teur et un peu de CSS, on peut person­na­liser l’apparence d’un site. On peut les trouver ici.

La première fait gicler la barre de navi­ga­tion noire des services de Google, vu que je ne m’en sers pas et qu’elle est mal inté­grée à Search : elle fait doublon avec les boutons « Images », « Maps », etc. tout en se compor­tant légè­re­ment diffé­rem­ment. Je ne suis pas à le premier à faire ça, mais celle-ci est plus exhaus­tive et marche mieux que celles que j’ai trouvé (sans doute parce qu’elle est encore récente, hin hin).

La seconde réar­range le layout (parler de rede­sign est sans doute un grand mot) pour quelque chose de plus mini­ma­liste. Pour résumer, les deux barres d’actions sont compri­mées en une seule, sont supprimés Google Chat, la colonne à droite d’un mail, les fonc­tions de G+… la barre noire est trans­formée en petite liste en bas à droite. Évidemment, c’est accordé à mes préfé­rences et inuti­li­sable pour pas mal de monde. Mais c’était un exer­cice inté­res­sant de voir jusqu’on pouvait aller.

gmail_full

Le résultat n’est pas parfait et je ne garantis pas la peren­nité du CSS. Il y a beau­coup de règles vilaines et il suffit que Google change le nom d’une classe pour que les choses se gâtent. En atten­dant, si vous avez Firefox et l’addon Stylish, vous pouvez les essayer depuis .

Une confusion courante à propos du kerning

En typo­gra­phie, l’approche (tracking ou letter-spacing, en anglais), c’est l’espacement uniforme entre les carac­tères d’un texte.

Le crénage (kerning), c’est une varia­tion sur cet espa­ce­ment, effec­tuée au cas par cas, pour certaines paires de lettres. Par exemple, à cause de leur forme oblique, un A et un V adja­cents appa­raissent trop éloi­gnés. On peut donc les rappro­cher. Ce sera plus clair avec ce schéma, tiré de Wikipedia.

Dans l’imprimerie à carac­tère mobile, on faisait dépasser la lettre de la pièce pour qu’elle chevauche sa voisine.

Les deux peuvent être facteurs de blagues et de gêne, mais ce n’est pas la même chose.

Glitchy web design

screenshot twitter

screenshot twitter

Appelez-ça Glitch art, blague potache ou truc anec­do­tique, mais je trouve ça assez fasci­nant. Obtenu en pivo­tant tous les éléments d’une page (ici, Tout ce qui bouge et Twitter) d’un facteur aléa­toire.

Ornementations

Quelques tenta­tives pour dessiner des orne­men­ta­tions servant à séparer des sections de texte, et qui changent des arabesques clas­siques de ce genre.

Ornementation 2

Ornementation 2

Ornementation 3