Des pixels et du code #31
Une semaine très orientée CSS et CSS3, avec toujours autant de liens utiles sur le responsive webdesign et la mobilité.
Les tutoriels de la semaine
#CSS
Animer les pseudo-éléments avec les transitions CSS une technique a base d’inherit pour pallier (tricher?) au fait qu’à part Firefox, aucun navigateur ne comprend les transitions sur les pseudo classes pour le moment
Three line menu navicon , trois façons de créer une icône en 3 lignes à utiliser comme icône de navigation
Simple yet amazing css3 border transition effects des effets hover funs et pourtant très simples avec des transitions CSS3
#Favicon
Don’t Forget About Favicons on Retina Screens un petit tutoriel pour gérer les favicons de différente taille pour les sites mobiles
Des ressources utiles
#mobile inspiration
Mobilemozaic.com une autre gallerie d’interface mobiles classées par type d’interface
#WordPress
How to Create Grid Column Content in WordPress the “Right” Way un plugin pour créer un système de colonnes à base de shortcode
#CSS3
Nthmaster.com un site pour comprendre visuellement la pseudo classe nth child
#RWD
Responsivedesignweekly.com toutes les semaines les actus et astuces concernant le responsive Webdesign
#Typo
Fontdropper un bookmarklet pour jouer avec les fonts d’un site
Les outils et plugins pour vous faciliter la vie
#QRcode
Qrhacker.com un générateur de qrcode pour en faire des sympas et originaux
#Accessibilité
ContrastA un petit outil en ligne pour tester les contrastes entre deux couleurs pour les normes d’accessibilité
Les articles à lire
#mobile
Safari for iPhone ignores viewport settings on .mobi domains
#Mobilité
A pixel is not a pixel la conférence de Peter-Paul Koch sur la relativité de l’unité pixel
#Optimisation SVG
svgs are cool, but icon fonts are just 10% of their file size un petit comparatif SVG vs font icon
#HTML5 Pishing
Using the HTML5 Fullscreen API for Phishing Attacks, non vous ne revez pas, on parle bien d’utiliser l’API HTML5 fullscreen pour créer du pishing. Impressionnant et inquiétant à la fois.
#CSS
Cssrefresh.frebsite.nl un petit JavaScript à placer dans les pages en cours de dev, pour que leur CSS se rafraichisse automatiquement.
#Inspiration
20 Simply Gorgeous Examples of User Interface Design un peu d’inspiration pour du design d’interface