loupe est un plugin jQuery qui permet d’appliquer un effet loupe sur une image lorsque le curseur passe au-dessus. Avec un poids plume de moins d’un kb un fois minifié, ce script devrait trouver une place dans votre boite à outils web. Son utilisation est simple, il suffit d’initialiser le script de la façon suivante : →
L’accessibilité des sites web est une choses dont on parle souvent, sans forcément avoir une idée très précise de la manière dont les mal-voyants utilisent les sites que nous concevons « pour le plus grand nombre ». Les enjeux sont importants car le web permet aux mal-voyants de communiquer, de s’informer et de gérer une partie de leur vie quotidienne. Cette série de vidéos proposée par Access-Key de l’Université Nice Sophia-Antipolis devrait fixer les idées sur des cas concrets, pour nous permettre d’améliorer la lisibilité et le décodage de nos sites web. →
Ce billet est une sorte de «Note pour plus tard» pour garder sous le coude quelques outils en ligne que j’utilise régulièrement ou que j’ai redécouverts dernièrement. Ils vous permettront de partager des bouts de code, prendre des notes, créer des penses-bêtes, sauvegarder vos bookmarks, partager des textes, valider votre prose (CSS, HTML, XML, RDF), placer du faux-texte et des fausses images (placeholders) dans vos pages web. Vous (re)découvrirez également des dictionnaires, des correcteurs orthographiques et des ressources web à garder sous la souris. Le tout réparti entre développement web, édition & travail collaboratif et dictionnaires et ressources. →
Cette liste de liens pour le développeur web front-end et l’intégrateur HTML & CSS est issue de la veille documentée que j’effectue depuis deux ans sur le blog Javascript & Webdesign. Elle reprend les 139 ressources Javascript et jQuery déjà publiées sur ce site, auxquelles j’ai ajouté les 78 nouveaux liens publiés depuis, ainsi que 73 tutoriels pour créer des diaporamas et autres Slideshows. Last but not least, vous pourrez accéder à une dernière liste composée d’une bonne centaine de bibliothèques Javascript (Polyfills) pour émuler HTML5 dans les navigateurs qui ne prennent pas les nouvelles API’s en charge. A quelques exceptions près, les liens pointent directement sur les sources d’origine.
Le webdesign réactif (traduction approximative de Responsive Webdesign) est un ensemble de techniques permettant d’adapter la mise en page d’un site web selon le périphérique de l’utilisateur. Avec l’arrivée des Media Queries en CSS3, le webdesign réactif devient de plus en plus utilisé. Il manquait toutefois des carousels réactifs. C’est le cas de Elastislide qui profitera au mieux des caractéristiques de l’écran. Via @guerrier. →
HTML5 Boilerplate et WordPress ♥ Basics par la même occasion contiennent quelques classes CSS utiles pour masquer du contenu de différentes manières en fonction de vos besoins : .hidden, .visuallyhidden, .invisible and .ir. Après un rapide survol des trois premières classes, nous allons nous attarder un peu sur la dernière classe .ir pour régler une bonne fois pour toutes le problème des images de fond non cliquables. →
Une fois n’est pas coutume, je vais aborder la question du web design sous l’angle du graphisme, sans considération de langage de développement ou de technique en général. Je n’aborderai pas les questions liées à l’architecture de l’information, à l’ergonomie ou à l’accessibilité. A la place, après un aperçu sur le travail du Directeur artistique et du graphiste, je vous propose une liste commentées des éléments graphiques que l’on trouve de manière récurrente sur les sites web, avec pour chacun un rapide commentaire. →
Lors de la mise en place d’un site web, il est parfois utile d’utiliser du faux-texte en attendant les contenus définitifs. Pour signaler l’emplacement des images, j’utilise souvent des aplats gris. Plus rarement, je vais chercher des images proches de la thématique des contenus que je mets en page, lorsque la part des visuel est importante. Grâce à Lorem Pixum, la tâche parfois fastidieuse du recadrage des visuels trouvés est déjà un lointain souvenir. →
jQuery SuperBox est une lightbox jQuery créée par Pierre Bertet. Accessible (SuperBox est généré grâce à l’attribut rel de votre lien), extensible (sous licence MIT), SuperBox permet d’afficher des images seules ou faisant partie d’une galerie, du contenu chargé en Ajax et last but not least, il est même possible de charger un fragment de la page via une ancre interne pointant vers l’identifiant d’un élément qui sera copié dans la SuperBox. →
Full background image slider est un script qui permet d’afficher un diaporama occupant toute la fenêtre du navigateur (ou le container que vous voulez). Outre le changement de background de votre site — ce qui pourrait s’avérer fatiguant pour les yeux –, ce script pourra se rendre utile pour présenter des visuels sur une page séparée. →
