Une astuce pour afficher une image en pleine largeur d'écran dans un bloc ne faisant pas toute la largeur.
Comment utiliser des unités relatives pour bâtir des composants redimensionnables
Quelques principes pour designer des blocs réutilisables en HTML/CSS
Le web design moderne, c'est aussi ça ! Des animations dont la vitesse varie dans le temps pour les rendre plus "humaines".
<Ahref="#URL_PAGE{login}" onclick="jQuery.modalbox('[(#URL_PAGE{login}|parametre_url{url,#SELF}|parametre_url{var_zajax,contenu})]');return false;" >Se connecter</A>
Dans ce cas, si on dispose de javascript, seul le contenu de la page de login sera affiché dans une boite modale, sans quitter la page en cours. Mais si on ne dispose pas de javascript, le lien se comportera normalement, en nous envoyant sur la page de login complète. Le point fort de cette technique est qu’on ne mets en place et maintient qu’une seule page de login. Si on vient à faire une modification sur le contenu de cette page, les deux scenarii seront automatiquement mis à jour. On peut donc très facilement et rapidement enrichir l’expérience utilisateur à l’aide de javascript et d’ajax sans devoir compliquer la charge de développement !
Du bon usage de @supports pour enrichir une page web en fonction de ce que le navigateur gère.
Parfois, le design, c'est tenir compte des illusions de perception pour donner un rendu parfait sur une base technique qui choque la raison.
« Les contraintes poussent à la créativité. » Exemple avec les emails
Un site qui donne accès à pleins de sites d'images libres de droit. Pratique pour illustrer un site.
Une liste des bugs Flexbox selon les navigateurs et des méthodes de contournement.
Un carrousel responsive, optimisé, adapté aux touch des mobiles. Et open source !
Quand un intégrateur de talent explique en détail comment il a réalisé sa page web... Ça décoiffe !
De l'art de concevoir une mise en page typographique s'adaptant aux différents supports en RWD
Un moteur de recherche de photos libres de droit. Possibilité de rechercher par teinte !
SVG et accessibilité. Bonnes pratiques et mise en œuvre.
Avec la pseudo classe :target et :not, on peut masquer du contenu tant qu'il n'est pas ciblé. Ça permet des animation du genre spoiler sans Javascript
Une vidéo (en boucle) qui montre combien un carrousel peut-être source de frustration pour un visiteur.
Comment les affichages haute densité (Retina) peuvent modifier votre manière de designer un site web
Quelques notions sur l'accessibilité et le contraste des textes.
Du bon usage des couleurs dans un design, avec des astuces !