La semaine en pixels – 16 september 2016

La semaine en pixels – 16 september 2016

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

Comme chaque semaine,  un condensé de mes lectures et ma veille web design et graphisme, expérience utilisateurs, design d’interface et mobilité, mais aussi des outils et ressources pour le web design et de l’inspiration en tout genre : illustrations, photos, sites web, etc.

Au programme : email et sécurité, astuces Sketch, SEO et UX, conseils mobile (navigation, UX), effet de surcharge cognitive, style guides, typographie responsive, tutoriels CSS pour créer des effets de glitch et gérer le line-height et tutoriel Photoshop. Du côté des outils et de l’inspiration, des galeries d’éléments d’interface, une checklist performance et des filtres CSS.

Pour plus de liens chaque matin vous pouvez me suivre sur twitter. Bonne lecture :)

tl;dnr, s’il devait n’en rester qu’un ?

#UX

Un tableau comparatif des outils d’UX: uxtools.co

Les articles de la semaine

#Security

The 100% correct way to validate email addresses, au final, la seule façon de valider 100% une adresse mail est d’envoyer un mail à l’utilisateur

#Sketch

Sketch Shortcut Set-up that Saves Me a Couple of Hours a Day, quelque raccourcis Sketch

#SEO

Advocating love between UX & SEO, au final le SEO et l’UX sont des domaines très complémentaires sur beaucoup de points

#Mobile

Basic Patterns for Mobile Navigation, différents systèmes de navigation mobile pour les applications natives

#UX

Reducing Cognitive Overload For A Better User Experience, réduire la surcharge cognitive

#Style guide

Style Guides: Best Practices and Workflow for Web Developers, les bonnes pratiques de style guide pour un workflow efficace

#Typography

3 things to keep in mind to master Responsive Typography, des conseils pour une typographie responsive

#UX #Mobile

23 mobile UX mistakes that Google doesn’t like, 23 erreurs à éviter sur mobile. Je suis pas tout à fait d’accord avec le point 10, à mon avis masquer ou non la recherche dépend du site et de l’utilisation que vos utilisateurs vont en faire. En e-commerce il vaut mieux la laisser, mais si vous avez un blog où un site où elle est très peu utilisée, à mon avis la masquer et la garder comme moyen de navigation secondaire est plus pertinent.

#Design

5 Delightful Ways to Onboard New Users – Hook them. Teach them. Keep them.

#Navigation #Usability

Universal Navigation: Connecting Subsites to Main Sites


De l’inspiration et de jolies idées

#UI

uitemple.com and uidb.io, two online UI element galleries for your inspiration

L’actualité webdesign

#Gmail

Support des media queries pour gmail, YEAHY

Les tutoriels de la semaine

#CSS

Autoprefixing, with CSS variables!

#Design #Illustration

How To Create an Abstract Polyscape in Adobe Photoshop, un joli tutoriel illustration bien sympa

#CSS

In CSS, set line-height first, padding second, un tutoriel CSS pour améliorer les interlignes

#CSS

How to create CSS Glitch Effect, la technique pour créer un effet de glitch CSS est fun, mais à ne pas utiliser sur un vrai site :D

#SEO

Balises Meta: le guide complet du rédacteur SEO

Des ressources utiles, outils et plugins pour vous faciliter la vie

#Fonts

A mettre de côté un tableau de compatibilité des fonts locales sur différents OS

#Inspiration

Une sélection de pages de checkout : www.checkoutpages.xyz

#Performance

Web Performance Checklist for designers, une checklist performance pour les designers

#Calendar

Un remplaçant pour sunrise kin.today

#CSS #Filters

Un outil en ligne pour créer des filtres CSS par dessus vos photos <3 Quand je vous dit en conf qu’on peut refaire instagram dans le navigateur aujourd’hui ;)

#SVG

SVGO (un outil de compression SVG compression) a une interface en ligne