Ceci est une copie de liens et références de ressources qui date de 2010 que je viens de retrouver. A rafraichir pour voir les évolutions et ce qui peut encore être pertinent...
Guideline css traitant beaucoup de points :
http://cssguidelin.es/
Notamment l’utilisation de BEM syntaxe et les erreurs à ne pas commettre, la liaison avec le javascript, les questions sur la longueur des lignes et le saut de lignes, etc.
Des PNG moins lourds depuis photoshop
https://github.com/pornel/pngquant-photoshop
Avec ce plugin on gagne en moyenne 40%-50% par PNG pour une qualité visuelle équivalente
Un navigateur entièrement développé en Javascript et Nodejs.
Console pour tester les API
https://apigee.com/console est très pratique pour ceux qui doivent bosser avec des API.
Cette console vous donne les méthodes disponibles, vous permet de faire les requêtes et vous affiche direct les réponses.
Styles guides :
Voici une liste de styleguides, plus ou moins complets. Ça pourrait être intéressant de s’en inspirer sur certains projets.
C’est vraiment bénéfique sur le long terme pour la cohérence d’un projet, d’une marque avec un turnover des designers, développeurs ou chefs de projets .
Des définitions typographiques plus poussées avec les exemples d’utilisation (ou en fonction des langues par exemple) : https://www.mozilla.org/en-US/styleguide/products/firefox-os/typeface/
La définition des couleurs sur fond clair ou foncé : http://rizzo.lonelyplanet.com/styleguide/design-elements/typography
Etc…
GreenSock documentation :
http://greensock.com/docs/#/HTML5/
Page transition :
Pour réaliser assez simplement sur un site des transitions CSS3 In-Out
http://git.blivesta.com/animsition/
https://github.com/blivesta/animsition
Mobile Web App Checklist
http://www.luster.io/blog/9-29-14-mobile-web-checklist.html
Vraiment pas mal de petits points abordés pour les webapps :
- UX/UI
- Animations tips
- Performances
- Offline
Google design material : click effect jquery plugin
https://github.com/fians/Waves
Media querie in JS
http://wicky.nillia.ms/enquire.js/
enquire.js is a lightweight, pure JavaScript library for responding to CSS media queries. (~0.8kb without polyfills)
- JavaScript callbacks for media queries matching and unmatching.
- Clean & intuitive API
CSS Triggers
Quand les perfs deviennent importantes en CSS (mobile, applications devices) :
- http://csstriggers.com/ liste des principaux éléments en CSS avec ce que ce qu’ils impliquent en terme de rafraichissement navigateurs
- http://aerotwist.com/blog/css-triggers/
- http://addyosmani.com/blog/devtools-visually-re-engineering-css-for-faster-paint-times/ article expliquant les repaints
- http://www.html5rocks.com/en/tutorials/speed/high-performance-animations/ quelles sont les propriétés qui sont safe à animer et celle à éviter