blog

Vestiges d’un CSS Guru

Catégorie : Best Of

Billet

Refonte de “On ne dit pas…”

On ne dit pas : le site des hypocrites

Ça devait faire 2 ans que j’avais pas visité On ne dit pas…, un petit site que j’avais monté y a quelques années. Même sans nouveau contenu et sans lien vers le site, tous les mois j’avais environ 1000 visiteurs uniques. Cette semaine encore Twitter m’envoyait des notifications comme quoi des gens tweetaient des phrases du site.

Bref, j’ai eu envie de mettre à jour le site, tant au niveau du contenu, du design, et du back-end. Résultat :

  • le site est responsive
  • on peut à nouveau proposer une phrase
  • les boutons de partage Twitter et Facebook ne s’affichent qu’au hover : ça évite de charger 20 boutons en une fois pour rien
  • il y a (enfin !) une section Best of qui recense les phrases les plus partagées (sur Twitter et Facebook)
  • il y a un système de score : c’est l’addition du nombre de partages Twitter et Facebook
  • tous les jours, ce score est mis à jour automatiquement (le site se connecte aux API Twitter/Facebook pour récupérer le nombre de partages). Pour éviter une surcharge du site, le score de chaque phrase est récupéré par intervalle de 5 minutes. Ça évite d’avoir 300 connexions aux API en quelques secondes et de me faire blacklister.

J’irai de temps en temps voir si de nouvelles phrases ont été postées. Hier, j’en avais 200 en attente de modération…

Billet

Une collection d’astuces CSS

Dans la famille des “Cadeaux Web Design qu’il vaut mieux donner que jeter à la poubelle”, voici une petite liste d’astuces CSS glanées au fil du temps. Elles est destinée à tous les niveaux, et peut être agrandie par vous-même en m’envoyant vos supers astuces, ou bien par moi-même si jamais d’autres idées lumineuses me reviennent…

Billet

WordPress : le Tutoriel pour créer un site de A à Z

Après mon tutoriel CSS : l’Art et la Science, voici un tutoriel sur l’autre partie importante de mon expérience d’intégrateur : WordPress le Tutoriel.

Je considère mes connaissances comme étant open-source. Et, de peur de les voir perdues à jamais, je préfère les écrire et les faire partager gratuitement avec la communauté des intégrateurs que nous sommes.

Ce tutoriel WordPress vous aidera à créer vous-même votre propre thème WordPress, mais contient aussi un thème WordPress vide gratuit sur lequel vous pouvez vous baser.

Billet

[Portfolio] Australie Trip : un carnet de voyage 2.0

Mon amie Corine voulait partir en Australie pour 1 an. Désireuse de découvrir de nouveaux paysages et vivre de nouvelles expériences, tout en améliorant son niveau d’anglais, elle voulait raconter au fur et à mesure des kilomètres parcourus son voyage à travers le pays. Il lui fallait donc un blog : Australie Trip.

Si vous êtes friands de paysages arides, de reptiles sauvages ou encore de culture aborigène, abonnez-vous au flux RSS !

Billet

Introduction à WordPress 3 : custom post type et custom taxonomy

J’ai écrit un tutoriel complet pour réaliser un thème WordPress de A à Z.
Il est plus récent et parle aussi des Custom Post Type et Custom Taxonomy. Du coup, je vous invite à aller le lire.

WordPress vient d’annoncer une Release Candidate pour la version 3. J’ai pour ma part installé et mis en prod la version Beta 2 qui, ma foi, est très stable. Si vous comptez l’installer, allez-y! Les mises à jour se font comme les WP actuellement, c’est à dire automatiquement. Et le système de template pour les thèmes est identique donc vos thèmes marcheront sans souci! Le seul souci est qu’il n’y a pas de version française encore mais bon, c’est uniquement pour l’admin qui est vraiment très simple en anglais.

Nouveautés WordPress 3

Dans les nouveautés, il y a :

  • choisir son login et son mot de passe : au lieu d’avoir “admin” et un mot de passe généré automatiquement, on peut les choisir soi-même.
  • un nouveau thème par défaut, bourré de nouvelles fonctions et qu’on va customiser dans ce tutoriel
  • custom background : un outil dans l’admin pour pouvoir choisir un fond pour le site. Si vous développez des thèmes vous même, ça vous est inutile.
  • Multi-sites! En fait, WordPress et WordPress µ ont fusionné : il est donc possible avec 1 seule installation WP de mettre en place autant de blogs différents que l’on veut. Par exemple : css.bbxdesign.com pour un blog de CSS, inspiration.bbxdesign.com pour un blog d’inspiration etc.
  • Custom Post Types
  • Custom Taxonomies

Je vais développer ces 2 derniers points car ils sont les plus intéressants.
Lire la suite →

Billet

Lancement de DDDSGN, un site d’inspiration web design

Tumblr c’est magnifique. C’est très facile à utiliser, que ce soit pour poster des images, des liens, des vidéos… C’est un gros aggrégateur de tout et n’importe quoi, on a pas besoin de se soucier de l’hébergement, on peut utiliser son propre nom de domaine, il y a pas mal de services intégrés (Twitter, Feedburner entre autres) et surtout : créer un thème Tumblr est un jeu d’enfant!

Avec cette facilité pour poster tout ce que je veux (et vite!), et un système de template vraiment simple, je me suis dit que j’allais lancer mon petit site d’inspiration en web design, qui regroupera pleins de sites et d’éléments de sites (formulaires, headers, icônes…) : DDDSGN.

Pourquoi “DDDSGN” ?

Je voulais un nom court, simple et fun. Il fait bien évidemment référence à ffffound.

Pourquoi c’est tout noir et blanc ?

J’ai testé beaucoup de couleurs et de palettes de couleurs pour des designs parfois sympas mais qui ne mettaient pas assez le contenu en valeur. Avec un site en fond blanc et le texte en nuances de gris, les couleurs des images ressortent très bien! D’ailleurs, il n’y a aucune image appelée par la CSS. C’est que de la typographie et des couleurs. Plus simple à entretenir, tiens.

Je vous invite à visiter le site et pourquoi pas à vous y abonner !

Billet

Refonte de Task This, site d’une appli iPhone

Vous connaissez tous ces sites d’appli iPhone ? Depuis 2 ans, c’est devenu une tendance, une catégorie à part dans les designs de site. Personnellement, je les trouve très créatifs, modernes et pertinents. Et je m’en inspire pas mal, comme par exemple dans cette liste de 40 sites d’appli. Malheureusement, je n’ai jamais eu l’occasion de bosser sur un tel site.

C’est pourquoi j’ai forcé le destin. En découvrant Task This, une appli française gratuite de gestion de taches, j’ai tout de suite eu envie de proposer mes services pour faire la refonte. Lire la suite →

Billet

Proposition de refonte du site d’American Airlines

aa

Dustin Curtis, un designer d’interfaces, devait réserver un billet sur le site (horrible) d’American Airlines. J’ai déjà eu à le faire aussi lorsque je suis allé à New York. Son expérience en tant qu’utilisateur n’ayant pas été très plaisante, il s’est dit qu’il allait proposer sa propre refonte du site.

american-airlines-refonte

Je suis personnellement très fan de cette refonte du bloc le plus important du site : la réservation. Il y a un côté aéré, léger (pour une compagnie aérienne, que demander de mieux ?) et efficace dans sa refonte. Je me rappelle que je voulais proposer une refonte du site l’Equipe.fr (un tout autre domaine, un tout autre rôle) mais j’ai pas pris le temps de le faire et entre-temps, leur refonte est plutôt réussie. 🙂

La réponse d’American Airlines

Ok, Dustin Curtis ne connaissait sans doute pas les raisons qui amènent American Airlines à garder leur site tel quel. Mais il a reçu une réponse de la part du User Experience Architect. Un extrait (repris sur Words on Design – “shameless self promotion…”) :

We could even redesign the AA.com home page without having to slog through endless review and approval cycles with their requisite revisions and re-reviews.

En résumé, dans sa lettre de réponse, il dit qu’American Airlines est une boîte trop grosse avec beaucoup trop de gens impliqués dans le design pour que l’équipe de design puisse faire son boulot correctement, ou devrais-je dire, puisse faire son boulot tout court.

Je sais exactement ce qu’il veut dire.

American Airlines a les compétences en interne pour avoir un site intéressant, mais ne les utilise pas. Un problème politique ? Je pense aussi.

La peur du vide ?

C’est sans doute la crainte des grosses entreprises d’avoir un site aussi aéré et léger, avec peu de contenu. Ils se disent peut-être qu’avec tout leur argent et la taille du trafic du site, ils doivent forcément avoir un site avec beaucoup de fonctionnalités, de contenu, des liens partout, des promos par ci par là…

Je sais pas. Le peur d’innover ? De faire confiance aux plus jeunes ? A ceux qui savent ? A ceux dont c’est le boulot ?

Je pense sincèrement que la qualité d’un design est (quasiment) inversement proportionnelle au nombre de personnes (ignares?) qui donnent leur avis dessus. Avoir une équipe de plusieurs designers, OK. Mais lorsque les services commercial ou technique y mettent leur nez, ça commence à sentir le roussis. Chacun son taf et tout ira bien!