J’arrive un peu après la bataille, mais que voulez-vous, il fallait bien que mon pauvre Modem Olitec 56K (1) prenne le temps de charger les 80+ plus belles polices de caractères pour un design professionnel que nous propose Smashing Magazine. Si je n’ai jamais douté de la qualité des articles publiés par ce qu’on peut considérer comme l’un des 10 meilleurs blogs du monde, je dois avouer que mon passé d’infographiste print amoureux de la belle typo a refait surface pour traquer la faute de goût… Voulez-vous en savoir plus ?
tag » Mise en page
Les habitudes de scrolling à la loupe (Eyetracking)
Il y a certainement de la vie en dessous des 600px (fold). Mais quelle vie ? D’après l’étude Scrolling and attention réalisée par Jacob Nielsen, les utilisateurs passent 80% de leur temps à chercher des informations au-dessus du fold. Si le scroll est une pratique qui s’est répandue depuis quelques années, il ne concernerait donc que 20% du temps passé sur une page. Voulez-vous en savoir plus ?
Framework CSS — Sémantique, maquette dynamique et autres notes
Les frameworks CSS ont fait couler beaucoup de pixels : d’un côté, ils proposent une méthode à l’épreuve des balles pour placer les blocs sur sur la page en tenant compte des contraintes cross-browser ; de l’autre, ils ajoutent des classes CSS superflues dans le code HTML pour la présentation des contenus, ce qui n’est pas jugé «sémantique» par les farouches défenseurs d’une séparation entre le fond et la forme. Voilà en gros l’avantage principal et l’inconvénient majeur qu’on peut dégager si on met de côté le faux problème du poids de ces frameworks. Après avoir donné mon point de vue sur cette question de «sémantique» j’expliquerais comment l’ajout de classes liées à la présentation dans le HTML peut s’avérer très pratique à l’heure du web «sur-mesure». Voulez-vous en savoir plus ?
Grid — Gardez le contrôle sur votre design web
Les grilles de mise en page font partie de la boite à outils du web designer qu’il s’agisse pour lui de s’y soumettre ou de s’en écarter. Pour faciliter notre travail, Allan Jardine propose Grid, un bookmarklet qui prendra place dans la barre d’outils de votre navigateur préféré (ou pas car pour l’instant Google Chrome n’est pas totalement pris en charge). Plutôt qu’un long discours, voici une capture d’écran de Grid avec les valeurs de la grille que j’ai élaborée pour css 4 design. Voulez-vous en savoir plus ?
Afficher / masquer votre grille de base avec jQuery
Si vous travaillez avec une grille pour harmoniser la disposition des blocs sur la page, vous passez certainement du temps à afficher puis masquer cette grille pour vérifier que tout est en ordre. Pour cela on peut ajouter une classe CSS dans le code HTML ou mettre entre commentaires une ligne concernant le background de la page dans la feuille de style… Les deux solutions sont assez fastidieuses. C’est pourquoi, je vous propose une petite astuce toute simple qui s’applique à tout type d’intégration avec toutefois un bonus pour WordPress que vous adapterez sans peine à votre CMS préféré. Voulez-vous en savoir plus ?
Nombre d’or, suite de Fibonacci et autres grilles de mise en page pour le design web
Dans la série des thèmes WordPress minimalistes voilà The Ideal Website 1.1 proposé par Information Architect (iA). L’équilibre graphique de ce thème provient essentiellement de l’application de la suite de Fibonacci — qui fournit des rapports très proches du nombre d’or — aux différentes proportions des éléments du design. Le résultat est ce que j’ai vu de mieux en matière de mise en page pour un blog. C’est la démontration réussie que l’on peut appliquer les règles de mise en page du monde de l’imprimé à l’écran, sans rien sacrifier. Je l’avais presque oublié. Voulez-vous en savoir plus ?
Commentaires récents