Astuces et snippets

5 astuces et bouts de code pour personnaliser WordPress

Cet article regroupe cinq ressources utiles pour améliorer la personnalisation de WordPress : définir un thème par défaut différent de Twenty Eleven lors de la création d’un site avec les fonctions multi-sites ; créer une page d’option pour personnaliser le look and feel du thème ; gérer l’affichage des billets dans les boucles multiples ; effectuer des redirections 301 pour les pages d’archives afin d’améliorer la structure «SEO» ; et ajouter la possibilité de trier les éléments de la bibliothèque des médias par type MIME pour finir. →

Applications autonomes

Lawnchair — Le stockage JSON simplifié

Lawnchair est une solution souple et légère (3.4K pour la version minifiée) pour assurer la persistance des données de vos applications mobiles HTML5 grâce au format de données JSON. Par défaut, Lawnchair utilise les fonctions natives du navigateur, et utilise des solutions alternatives si les fonctions Storage ne sont pas prises en charge. Cerise sur le gâteau, cette solution ne dépend pas de jQuery ou d’un autre framework pour fonctionner. →

Helper HTML

jQuery.Storage — Plugin jQuery pour manipuler Storage HTML5

jQuery.Storage est un plugin jQuery qui permet d’utiliser simplement les fonctions d’enregistrement de données (localStorage et sessionStorage) disponibles dans HTML5. Son intérêt réside dans simplification de la sérialisation des données et dans la possibilité de basculer vers les cookies pour les navigateurs qui ne prennent pas en charge les nouvelles fonctionnalités Storage.  jQuery.Storage est disponible sur Github.

Typographie

« Average font » : à la recherche de la police de caractère universelle

« Average font » est un projet qui consiste à faire émerger l’essence même de la police de caractère universelle. Pour y parvenir, Moritz Resl à écrit un programme qui a superposé les 900 fontes installées sur son système en ajoutant une faible opacité. Il en ressort la forme intemporelle de chaque lettre de l’alphabet pour un résultat paradoxalement organique et fantomatique. →

Design & Graphisme

Design dans le navigateur : tous les chemins mènent au DOM !

A la lecture des articles et des commentaires sur le thème du design dans le navigateur, j’ai l’impression que l’on confond deux choses pourtant bien distinctes, voire trois, si l’on ajoute au design et au graphisme, la notion de direction artistique. Si dans certains cas, il est possible de faire la direction artistique, les wireframes et les graphismes dans le navigateur, cette méthode intégrale ne saurait s’appliquer à la majorité des projets. →

Plugin jQuery

carouFredSel — Carousel circulaire et responsive

jQuery.carouFredSel est un plugin jQuery qui transforme n’importe quel élément HTML en carousel «responsive». Le déplacement peut concerner un ou plusieurs éléments simultanément, dans le sens horizontal ou vertical, de manière infinie et circulaire, automatiquement ou suite à une action de l’utilisateur (clic ou clavier). Si toutes les options sont optionnelles, le site propose Configuration Robot : il suffit de répondre à quelques questions pour configurer le plugin à la mode de chez vous.

Conception de site web

Bazardez Photoshop et rapprochez-vous de votre navigateur

Le design dans le navigateur est une méthode de conception de plus en plus utilisée pour produire des sites web proches des besoins des utilisateurs. Pour ses détracteurs, cette méthode se limite à ne plus utiliser Photoshop au profit de HTML, CSS3 et Javascript. Le titre de l’article est volontairement provocateur car dans les faits, le design dans le navigateur n’interdit pas d’utiliser Photoshop ou Illustrator pour concevoir les pages. Il faut juste garder à l’esprit que ces logiciels pourraient — dans la plupart des cas — être délaissés au profit d’un simple crayon à papier pour faire un croquis qui sera directement transformé en page web sans passer par la case Photoshop. La suite de l’article est une traduction libre de Throw away Photoshop and be true to your medium de James Weiner (@jamesweiner) paru sur Government Digital Service (GDS). →

Revue de Web

jQuery List — 600 plugins jQuery qui n’attendent que vous

jQuery List est une liste de près de 600 plugins et exemples de code jQuery répartis dans plus de 30 rubriques. Nous y trouvons à peu près tout ce qui est nécessaire pour faire des sites web interactifs : Ajax, animation, effet, graphiques, DOM, CSS, Flash, formulaires, jeux, tableaux, calendriers, sélecteurs de couleurs, etc. →

HTML & CSS

Guide de bonnes pratiques HTML & CSS par Google

Soyez cohérent. C’est la conclusion que nous propose Google dans ce guide des bonnes pratiques de codage à l’usage des développeurs web et autres intégrateurs HTML et CSS. Lorsque vous reprenez du code, il est important de tenir compte du style d’écriture d’origine. Si votre prédécesseur utilise des espaces de part et d’autre des opérateurs arithmétiques, faites de même. Si les commentaires sont encadrés de symboles pour dessiner un bloc, faites de même aussi. Soyez cohérent. →

HTML & CSS

Editeur de dégradés CSS3 à la mode de Photoshop

ColorZilla, connu pour ses extensions couleur pour Mozilla et Chrome, met à notre disposition Ultimate CSS Gradient Generator. C’est un générateur de dégradés CSS3 en ligne qui reprend grosso modo l’interface utilisateur de Photoshop pour fournir les déclarations CSS pour l’ensemble des préfixes propriétaires -moz-, -webkit-, -o-, -ms-. Pour Internet explorer 6 à 8, l’outil génère la propriété filter ; pour les versions IE9 et au-delà il y a même le commentaire conditionnel à ajouter pour annuler filter et basculer sur la génération du dégradé via SVG en base 64. →