Quoi de mieux (ou de pire) qu’une liste de liens résultant d’une veille technique et stratégique triée sur le volet ? Une liste de listes de liens, pardi ! Voici donc devant vos yeux ébahis, plus de 20 listes thématiques dans le domaine du Webdesign, de l’intégration Web (HTML, CSS et Javascript) et de WordPress. →
Rédigé sur Alsacréations par Benjamin De Cock, ce tutoriel pour faire une galerie d’image avec jQuery est un cas d’école pour qui veut obtenir le résultat le plus simple possible visuellement tout en prenant en compte l’accessibilité le plus largement possible avec une démarche non intrusive. Je vous laisse avec la démo qui vaudra sûrement mieux qu’un long discours.
JQuery Slide Effect est un tutoriel concis mais complet qui explique comment parvenir à un effet d’animation de texte (slide) sur une image pour faire apparaitre des informations complémentaires (titre, description, lien, etc.) au survol d’icelle. La démo du Slide sera sûrement plus parlante 😉
Après les croquis réalisés plus ou moins rapidement sur un coin de table face au client ou de retour à l’atelier, il est parfois nécessaire de passer à une phase plus industrielle afin de réaliser les maquettes « fil de fer » de la Home et des pages intérieures. Illustrator et Fireworks ont beaucoup d’atouts pour faire les Wireframes d’une page Web, mais InDesign n’est pas en reste. Il permet de mettre en place une grille dès la création d’un nouveau document. Dans la suite de cet article, nous verrons comment créer un colonage compatible avec votre framework CSS préféré et utiliser les gabarits InDesign pour les différentes déclinaisons des pages de votre site Internet. →
Les logiciels de création graphique proposent un menu Fichier avec une entrée Nouveau pour créer un nouveau document en réglant des paramètres comme la taille, la couleur de fond, le nombre de couleur, la résolution, etc. J’ai déjà abordé la question des paramètres par défaut pour le Webdesign dans l’article Quelques notes sur les grilles de mise en page et je me demande aujourd’hui dans quelle mesure les frameworks CSS peuvent être considérés comme l’expression des réglages de base pour commencer la création d’un site Web ? →
Le dernier thème du WDFriday (#wdfr sur Twitter) était consacré aux croquis, maquettes et autres fils de fer (Wireframe) qui précèdent souvent le travail sur un logiciel de création comme Illustrator ou Photoshop. J’ai toujours un petit calepin à carreaux de 5 mm de côtés pour prendre des notes graphiques. Comme j’utilise une grille dans Illustrator bien au chaud dans un calque « grille » verrouillé, je me suis dit qu’il serait intéressant de l’imprimer en plusieurs exemplaires pour m’en servir de support. Pour les croquis, je me contente d’imprimer cette grille à 50% de sa taille réelle pour ne pas gâcher inutilement l’encre et le papier (petit geste écolo). Je réserve l’impression en taille réelle pour les maquettes grandeur nature (Mockup) sur lesquelles je peux utiliser des post-it pour placer et déplacer mes éléments à volonté. →
Les développeurs n’aiment pas les frameworks CSS et les graphistes n’aiment pas l’idée de travailler avec une grille de mise en page. Mais ça ne m’empêche pas de leur trouver un intérêt (aux FW, aux dévs et aux créas). Je suis certainement une espèce mutante, le chainon manquant entre les matheux (le code n’est poétique que dans WordPress ^^) et les graphistes ! Pour autant, je ne pense pas que les frameworks CSS doivent être utilisés partout ou que le design dans le navigateur remplacera votre graphiste ou votre logiciel de création préféré. Il s’agit d’une méthode de travail qui s’ajoute aux précédentes ; elle ne prétend pas s’y substituer. L’article Framework CSS — Sémantique, maquette dynamique et autres notes vous permettra de défricher le terrain sur leur utilisation et leurs avantages. →
Easy Slider est un diaporama horizontal ou vertical avec une navigation numérique qui propose un défilement doux lorsque l’on saute une ou plusieurs diapos. Une vingtaine de paramètres permettent d’adapter le Slider à vos besoins les plus fous. Voir les démonstrations slides continu, navigation numérique ou slides multiples. Via @FlemArt.
La typographie (souvent abrégée «typo») est à la fois l’art de créer des polices de caractère et de s’en servir. Il peut s’agir également de l’ensemble des règles en usage dans l’imprimerie pour la composition des différentes ouvrages imprimés (cf. Code typographique). Sur le Web, la typographie à longtemps été maltraitée. Toutefois, avec les progrès réalisés ces dernières années par les navigateurs grâce aux standards du web, la typo revient sur le devant de la scène. L’étude des polices de caractère devient trendy, et on ne peut que s’en réjouir. Voici quelques 60 ressources à mettre dans vos favoris, bookmarks ou comptes Delicious ! →
Pour les injecter les balises HTML5 dans le DOM et leur appliquer la propriété CSS display: block pour les styler, Remy Sharp a mis au point html5shiv qui est toutefois sans effet lorsque les balises HTML5 sont affichées via innerHTML. Heureusement, HTML5 innerShiv est là pour que les version 6 à 8 d’Internet Explorer tiennent compte des nouvelles balises HTML5 créées à la volée.
