Des pixels et du code #28
Et le mot de la semaine est… « responsive webdesign » ! Des tutoriels, des plugins, des sliders, des solutions pour les images ou pour détecter le User Agent de l’appareil, tout pour vous aider à afficher votre site correctement sur mobile. Ça tombe bien, en plus des PSDs iPhone 5 sont diponibles.
Les tutoriels de la semaine
#WordPress
How To: Make Your WordPress Themes Retina Display Ready quelques plugins utiles et thèmes pour avoir un WordPress dont les images sont en retina sur les appareils qui le supportent
#RWD
Big Menus, Small Screens: Responsive, Multi-Level Navigation un tutoriel qui propose une solution responsive pour un gros menu à trois niveaux
#Fireworks
#SVG
Un logo cliquable SVG avec alternatives, la version française de mon article.
Des ressources utiles
#JS #SVG
Bonsaijs.org une librairie JavaScript pour crée facilement des API graphiques avec un rendu SVG
#RWD
Base un framework responsive qui a l’air très léger
#Bootstrap
Bootsnipp.com un petit site qui répertorie des bouts de code HTML et CSS pour Bootstrap
#Googlefont
Web Fonts Performance: Making Pretty, Fast, des conseils et astuces pour optimiser le chargement de vos polices Google Font
#CSS3
Table of CSS3 border-radius Compliance, un tableau des rendus de border-radius en CSS3 en fonction des navigateurs.
#iPhone PSD
Ressources vectorielles, PSD, images de l’iPhone5 et autres smartphones , tout est dans le titre, des PSD et ressources utiles pour le nouvel iPhone chez Creativ Juiz
iPhone-5-Template une template d’iPhone5 pour présenter vos applications sous un autre angle
Les outils et plugins pour vous faciliter la vie
#jQuery
Allofthelights.js, un plugin jQuery pour “‘éteindre la lumière” autour des vidéos, entendez pas là mettre un arrière plan noir.
Eualize.js un plugin pour égaliser la hauteur ou largeur d’éléments d’une page web
#RWD
Jquerypicture.com un plugin jQuery qui utilise <figure> pour faciliter le chargement d’images responsive sur des écrans et navigateurs plus petits
Full-screen-responsive-jquery-image-and-content-sliderrslider un slider responsive en plein écran léger et facile à implémenter
Frescojs.com un plugin de lightbox responsive
Responsive jquery image slider plugins au cas où vous n’auriez toujours pas trouvé de slider responsive qui vous plaise
#Mobilité
Device.js un script qui détect le User Agent de votre mobile et ajoute une classe au body en fonction.
Les articles à lire
#UX
Au delà du web : le portant de piscine* ou l’expérience utilisateur au quotidien un chouette article qui nous rappelle que dans la vie courante, l’expérience utilisateur de certains objets devrait être revue, et il en va de même pour certains sites webs
#WordPress
Les 10 commandements pour bien choisir son plugin WordPress , à lire, mettre en favoris et appliquer pour chaque choix de plugin.
#Android
Stock Android Isn’t Perfect: These Are The Things I Can’t Stand About Jelly Bean même si l’UI et UX d’Android s’améliorent, il reste du boulot. Moi c’est avec les icones copier/coller que j’ai le plus de mal :/