JT

bbxdesign

Vestiges d'un CSS Guru

Mode normal → (affichage complet du blog)

Suivant

Précédent

Design

iconPot : plus de 2500 icônes gratuites et libres de droit

Billet

iconpot

Je viens de tomber sur un site assez fou: iconPot.

Ce site recense des packs d’icônes gratuites et utilisables à des fins commerciales. Une mine d’or pour les web designers freelance!

Readability : un outil pour rendre le web plus lisible

Billet

readability

C’est quoi ?

Si vous trouvez que le web est difficile à lire, que ce soit à cause de la taille, la police, les couleurs, les marges… voici un outil qui peut vous faciliter la vie. Readability est un bookmarklet qui transforme n’importe quelle page web en un texte bien présenté.

Exemple

Exemple avec un article de A List Apart :

readability-alistapart

Readability enlève tout le contenu annexe, contextuellement (navigation) et visuellement (images), pour ne laisser que l’essentiel de la page : le corps du texte.

Prendre A List Apart n’est peut-être pas particulièrement pertinent car la présentation du site est déjà excellente en soi, mais j’ai pris cet exemple parce que le contenu y est long et intéressant, et c’est la cible de l’outil Readibility.

Stylez et bookmarklettez

Vous pouvez choisir le style de vos pages, en jouant sur la typographie, les couleurs, la taille et les marges. Puis vous drag-droppez le bookmarklet pour l’utiliser dès que vous visitez une page au contenu intéressant mais mal présenté.

readability-styles

Instapaper-like

Ca me rappelle forcément Instapaper, cet outil qui, en un clic, sauvegarde une version texte de la page pour la rendre disponible par la suite, sur le site, et en offline sur l’iPhone. Un must (gratuit qui plus est).

Card Observer : une galerie de cartes de visite

Billet

Il y a souvent par ci, par , des posts traitants de cartes de visite originales. Card Observer en regroupe sous forme de galerie. Le site est simple et sympa, même si j’aurais apprécié une navigation plus originale et plus pratique entre chaque carte (avec au moins un aperçu).

card-observer1

Axa rate sa refonte de site

Billet

Je viens de découvrir sur 2803 que Axa avait fait une refonte de son site. Ce qui m’a le plus surpris dans le post de 2803, c’est que ce soit un post sponsorisé (traduisez par “post subjectif et honteusement élogieux”). Parce que la nouvelle version du site d’Axa ne manque pas de lacunes.

axa-menu

Un carrousel bien lourd

Malgré le fait que Flash gère le streaming, l’internaute doit attendre d’avoir bien chargé les 7 livres virtuels pour voir s’afficher quelque chose (presque 10 secondes d’attente). Même si l’effet “carrousel” est sympathique à voir, il est très loin d’être pratique. Et si les pages derrière ne suivent pas en terme de design et d’ergonomie, je ne vois pas l’intérêt d’inciter l’internaute à cliquer si ce n’est pour le perdre à la page suivante.

Pourquoi un menu en Flash ?

L’élément qui m’a surpris en premier est le menu de gauche, en Flash. Pourquoi en Flash? Pour le pivoter bizarrement et le rendre presque illisible (lisez-vous “Entrer vos mots clés” qui d’ailleurs devrait être “Entrez vos mots clés”)? Le fait qu’il soit pivoté suggère qu’il n’est pas intéractif, alors qu’il l’est.

Et le champ de recherche prédictif qui fait partie de ce que l’on peut considérer comme “l’état de l’art de ce qui peut se faire en terme d’interfaces riches” (si je reprend les mots du post de 2803) aurait facilement être réalisé en JS, et il en aurait été bien plus lisible.

Disposition bancale des éléments de navigation

Axa est à la fois banque et assurance. On peut accéder à l’un ou à l’autre en cliquant sur l’un des liens placés au-dessus du carrousel. Au lieu de dire “placés” je devrais dire “flottants” parce qu’ils semblent avoir été déposés là malencontreusement. Il faut d’ailleurs attendre que le carrousel ait été chargé en entier pour enfin voir ces liens qui a priori sont primordiaux. Et ne cliquez pas sur “Banque” car vous vous retrouverez sur un autre site (sans que cela soit indiqué…).

Et le reste…

Les pages intérieures du site mériteraient que l’on s’y penche très longuement. Les erreurs d’ergonomie sont multiples : checkboxes utilisées à mauvais escient, mauvaise présentation de l’information, incohérence du contenu…

Ce qui me choque le plus est qu’un bon blog comme 2803 ai décidé de jouer au jeu du post sponsorisé, qui n’est rien d’autre qu’une fenêtre de communication privilégiée, où la charte habituelle du blog s’efface devant les intérêts de l’entreprise commanditaire. Je continuerai bien sûr de lire 2803 qui regorge de très bons articles, mais j’espère vraiment ne plus voir ce genre de post.

PS: ne désactivez surtout pas JS pour aller sur le site d’Axa… Vous verrez ceci :

axa-sans-js

Colorsplash : un fond d’écran pour votre Mac

Billet

Pour les Mac users d’entre vous (je sais qu’il y en a au moins un:-) ), un fond d’écran spécialement conçu pour vous.
Bien sûr, vous pouvez l’installer sous Windows mais l’esprit y est moins…

colorsplash

Via SimpleBits

Générateur de nuancier à partir d’une image

Billet

En uploadant une image sur le Colors Palette Generator de CSS Drive, vous obtenez un 4 nuanciers différents, ainsi que des fichiers CSS et .aco (pour Photoshop) associés.

Un exemple en utilisant une de mes photos prises récemment à New York:

empire-palette

Magnifiques fonds d’écran de jeux vidéo

Billet

Les jeux vidéo sont une grande source d’inspiration pour beaucoup de graphistes. Le côté culte couplé aux talents de dessinateurs offrent souvent d’incroyables rendus, comme ces wallpapers d’Orioto :

orioto-sonicorioto-marioorioto-zeldaorioto-mario-02

Ces créations, mêmes statiques, me laissent espérer que les développeurs (notamment la Sonic Team…) s’en inspireront fortement. Je doute que les capacités actuelles de hardware soient insuffisantes pour arriver à ce rendu.

Imaginez que cette image de Zelda soit tirée d’un véritable gameplay? Ce serait délicieusement envoûtant…

Source : Lifehacker

Un thème aérien pour KDE 4.3

Billet

Petit à petit, KDE semble devenir la distribution l’environnement de bureau à absolument adopter pour Linux. Que ce soit au niveau fonctionnel ou au niveau graphique, comme avec le thème AIR par Pinheiro :

kde-air

kde-air-dock

Interface New York Times expérimentale

Billet

L’excellent site du NY Times propose un prototype de présentation différente de l’information.

nytimes-prototype

bbxportfolio en ligne!

Billet

Depuis le temps que je veux en faire un… Voici enfin mon portfolio. Il m’aura fallu :

  1. Regrouper et trier mes travaux en 3 catégories (web, graphisme, intégration)
  2. Créer une interface simple mais sympa
  3. L’intégrer sous forme de page et sous-page WordPress (en essayant de garder un maximum dynamique)
  4. Trouver un système de galerie léger et sympa : slideViewer
  5. Créer des images pour cette galerie (en cours)

Voici le résultat :

bbxportfolio

Populaire Tutoriels Fun

Idées de cadeaux originaux