Des pixels et du code #28

Ce contenu a été rédigé il y a 12 ans. Il se peut qu'il ne soit plus à jour.

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

Make a scalable newsletter with Fireworks un tutoriel pour créer le design d’une newsleter dans 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 :/