Des pixels et du code #40
Une semaine très orientée code, animations et surtout responsive webdesign, avec deux articles français sur le sujet, et des tutoriels et démonstrations d’API HTML5. Pour ceux plus orientés design, quelques belles ressources pour améliorer son workflow dans Photoshop, et sur l’expérience utilisateur.
Les tutoriels de la semaine
#Animation
Sprite sheet animation with steps() des animations CSS3 qui utilisent la propriété step()
Animation in a Flashless world un second tutoriel plutôt impression pour créer un chat qui cours dans l’herbe
#Email et Font
Using web fonts in email , il serait possible d’utiliser une font “exotique” dans un mail avec un @import (‘lienversgoogleAPI); par contre le support n’est pas génial
#HTML5 API
Fun with the File API une petite démo des possibilités de plusieurs API, pour transformer une video ou une video prise par webcam en gif animé.
#jQuery
Les gestionnaires d’évènements en jQuery: différences et avantages de bind(), live(), delegate() et on(). pour les débutants en jQuery, un petit article qui vous aidera à comprendre la différences entre tous ces éléments.
#CSS3
Lining up your backgrounds un petit tutoriel pour créer un effet de lignes de fond (comme un cahier) qui s’adapte à la taille du texte en gradients CSS3
Des ressources utiles
#HTML5 API
Vibration-api l’API qui permet de faire vibrer un téléphone en JS ça existe (pas très bien supporté par contre)
#Photoshop
30+ tips to improve your iOS design workflow (in Photoshop) des conseils pour améliorer ses méthodes de travail lorsque l’ont fait du design mobile sous Photoshop
Les outils et plugins pour vous faciliter la vie
#Icônes
Weloveiconfonts.com un service de hosting de font icons en ligne, comme Google Web Font en fait, mais uniquement composé d’icônes.
#Loader
Cssload.net un petit site pour créer des loaders et spinners en CSS en quelques cliques
Les articles à lire
#Responsive Webdesign
Définir ses points de rupture , pour ceux qui croient encore qu’il faut définir les points de rupture en fonction des périphériques, j’espère vous faire changer d’avis avec cet article.
Responsive Webdesign : cas d’études à lire le retour d’expérience sur le site responsive de Nealite
Responsive Images: What We Thought We Needed un retour sur les solutions d’image responsive et une analyse sur ce dont on a vraiment besoin en web
#Mobile
Nine Ways to Improve User Experience in Mobile Design 9 astuces et patterns de design pour améliorer l’expérience utilisateur sur mobile de manière très simple
#Typographie et inspiration
Tanamachistudio.com de la typographie retro à la croie sur tableaux noirs géants pour ce superbe portfolio
#video #client
F*ck you, pay me, une petite vidéo datant de 2011 mais toujours d’actualité ou Mike Monteiro explique comment s’en sortir avec des clients qui refusent de payer
#UX
Les concepteurs de sites internet ne sont pas (tous) des utilisateurs comme les autres car il est bien de rappeler de temps en temps qu’il est difficile de se mettre dans la peau d’un utilisateur lorsque que l’on est le concepteur du site
#Strasbourg
Résumé de l’apéro #4 WdStr, le résumé de notre 4em apéro sur le thème de l’avenir du webdesign, avec de belles discussions durant la soirée
Les démos sympas et impressionnantes
Et la vidéo fun de la semaine, What happens when you pick the wrong font? It ain’t pretty.
