70 sites au graphisme que j’aime

Depuis 2005, je me suis créé une banque de liens hypertextes parce que je trouvais beaucoup de sites intéressants en cherchant sur le Web par hasard ou pour des travaux scolaires. J’ai donc accumulé plus de 70 sites Web au graphisme intéressant, tape-à-l’oeil, étrange, drôle, séduisant, sympathique ou tout simplement weird! Vous trouverez aussi des sites sur la couleur, la sémiotique et d’autres qui traitent de l’effet immersif du Web. Ça vous évitera de nombreuses heures de recherche, je l’espère! Je vous suggère de passer au moins 10 secondes sur chaque page, parce que certaines pages ont des animations Flash (à ce sujet, lire la critique de Michelle Blanc)… Je vous informe qu’il ne s’agit peut-être pas des sites les mieux référencés sur le Web ou ceux présentant la mise en page la plus évidente! Je présente ici plutôt des sites qui m’ont accrochés dès le premier visionnement et qui me fascinent encore pour une raison ou une autre. Je sais qu’on sera en accord et en désaccord sur certains sites, alors j’aimerais bien recevoir vos commentaires!

1) SÉDUISANT – SIMPLE

http://www.theserved.com/contact (fond de page coloré)

http://www.patrickjouin.com/site/ (attendre le téléchargement + musique)

http://www.establishedandsons.com/ (cliquer sur les hyperliens: déplacement fluide)

http://www.cad-cc.com/ (flash et musique)

http://www.team-lab.net/about

http://www.avrioventures.com/

http://aird.ca/form_fr.php (formulaire)

2) SÉMIOTIQUE

http://www.semiopolis.fr/

3) COULEUR

http://www.colorconnections.com/colorconnections_2007/best_colors.html

4) COUVERTURES DE LIVRE

http://www.smashingmagazine.com/2008/04/14/excellent-book-covers-and-paperbacks/

http://covers.fwis.com/

5) TROUVER UN PRODUIT – ENTREPRISES

Dans le cadre de mes études, mon travail était de magasiner en ligne des outils, des pièces de quincaillerie, des matériaux, des procédés de fabrication et des guides d’utilisation. Je pense donc avoir développé une expertise pour la recherche de ce type de produits sur Internet. Ma tâche principale était donc de trouver les produits et de choisir s’ils correspondaient à mes critères d’achat. On ne peut pas être plus près du rapport client-entreprise! Alors, si vous êtes en marketing Web, prenez des notes, s.v.p.

Comme je faisais beaucoup de recherche, j’ai fini par observer que la majorité des sites ne mettent pas assez d’emphase sur les points importants, du moins de mon point de vue d’acheteur de produits. En principe, j’allais acheter de grosses quantités rapidement. J’étais donc un client réel avec des besoins réels qui n’obtenait pratiquement jamais ce qu’il cherchait. Voici mes humbles recommandations:

  • Un bouton très visible « Contact » incluant, s.v.p., une adresse courriel écrite en caractères et liée à un système de messagerie. Je déteste profondément qu’une entreprise manufacturière me propose un formulaire de courriel, surtout quand je dois lui envoyer une liste de produits que je dois acheter. La plupart des formulaires de courriel ne permettent pas l’ajout de pièces jointes (fichier Excel ou PDF). Je vous suggère par exemple, ce modèle tellement simple: info@votreentreprise.com   
  • Un bouton très visible « Catalogue » ou « Produits »
  • Sur chaque fiche de produit : le prix taxes incluses en indiquant bien $CAN si c’est au Canada, le matériau de fabrication, l’utilisation et les dimensions hors tout. À ce sujet, il faut être en mesure de classer les produits par groupes. Voici qui est bien : http://www.faucher.ca/
  • Une description du système de distribution pour savoir où, quand et comment se fera le transport des produits
  • De grâce, une assistance téléphonique fiable en tout temps, dont le numéro de téléphone (un seul numéro qui renvoie à la réception de l’entreprise) est visible sur la page d’accueil.
  • Au fait, le site qui présente le mieux ces produits à mon humble avis, c’est : http://www.toysrus.ca/home/index.jsp

Voici qui pourrait vous inspirer:

http://www.aquapuredepot.com/ (carrousel de produits)

http://www.cintrageabf.com/index.php

http://www.fibrethik.org/index-text.htm

http://www.gadshaanandesign.com/work-samples.html (voir bas de la page)

http://www.kingston.ac.uk/~kx19789/rematerialise/html_and_flash/index-characteristic-squashy.htm (liens vers petits vidéos)

http://www.desharnais.ca/index.php (vidéo de présentation efficace)

http://www.conceptmat.com/conceptmat.html

http://www.bpr.ca/

6) POLICE – TYPOGRAPHIE

http://www.freelang.com/polices/index.html

http://apocopa.free.fr/police.htm (Une police ergonomique)

http://www.youworkforthem.com/ (font)

http://ffffound.com/ (font)

http://typeish.com/ (font)

7) REVUE

http://www.jalougallery.com/jalou-corporate.php

8 ) TENDANCES

http://www.au-secours-jai-un-blog.com/ (mis à jour régulièrement)

http://vandelaydesign.com/blog/design/offline-inspiration/

9 ) LOGICIEL

http://nodebox.net/code/index.php/Evolution (logiciel pour MAC, fluide)

10) SYMPATHIQUE

http://www.ideafixa.com/ (rococo)

http://www.brindi.fr/ (naturel)

http://blog.creativethink.com/creativity/index.html (look absurde, contenu stimulant)

http://www.unmondelibre.org/node/560 (mise en page)

http://www.google.com (si vous n’aviez pas encore remarqué!)

http://www.tomford.com/ (page d’accueil)

http://www.cabanaseguin.com/francais/flash_avec.html (passer l’intro, voir notre firme, animation de croix)

http://notepad-plus.sourceforge.net/fr/site.htm  (voir le lien à gauche : Langue)

http://www.millerstudio.us/ (authenticité + inspiration)

http://natandmarty.blogspot.com/2009/12/finally.html (fond de page avec fleurs)

11) ERGONOMIQUE

http://www.leoburnett.ca/FLASH/ (animation avec crayon)

http://www.downtownbystarck.com/future_home.html (défilement fluide)

http://configure.dell.com/dellstore/config.aspx?oc=ni10vu_r_1e&c=ca&l=en&s=dhs&cs=cadhs1&kc=laptop-inspiron-10 (logos, bas de la fenêtre

http://www.larelance.ca/content.php?id=56 (diagramme de liens hypertexte)

http://www.bank-banque-canada.ca/fr/discours/2007/sp07-13f.html (barre de liens à gauche)

http://www.grandpalais.fr/en/Homepage/p-617-Homepage.htm (meilleure vue en 3D d’un bâtiment)

http://www.thewaytohappiness.org/#/home  (défilement en caroussel)

http://actijob.beljob.ca/job_emploi/resultquery.aspx?kwd=design&cit=quebec (barre défilement des distances en kilomètres)

http://www.annoncesdepot.com/sortir/rg/region-de-quebec/ (beaucoup de liens)

 12) POUR APPRENDRE

http://pages.videotron.com/courshar/index.html (Vivianne St-Yves)

13) RECOMMANDÉ

http://www.thefuturelaboratory.com/ (recommandé par Frédéric Metz en 2008)

http://www.worldbest.com/gold.htm

http://wonder-wall.com/#project/en  (recommandé par Provokat)

 14) IMPACT

http://www.triomphe.ca/experience.php?lang=fr (Logos : Acceuil, Nous contacter, English)

http://www.lxb.ca/ (voir lien profil communication + inventivité)

http://sketchblog.ecal.ch/variable_environment/archives/2005/12/ (photos destabilisantes)

http://www.amd.com/us/Pages/AMDHomePage.aspx (boutons qui flash)

http://www.3kcompute%20rs.com/products.html (boutons flash, attendre 1 minute)

http://www.gadshaanandesign.com/mission-accomplished.html (donner ses références)

http://www.sylviedenault.com/ (présentation flash et rétroactions sonores)

http://www.freelance.com/__C125675B0014F649.nsf/pages/2002accueilentreprises?OpenDocument&openSection=9 (petite planète qui tourne)

http://forum.forumactif.com/gerer-l-apparence-de-son-forum-f7/comment-mettre-bar-de-texte-qui-defile-t238451.htm (défilement de texte, voir « Derniers sujets »)

http://www.quebecweb.com/rca/ (vidéo de présentation et musique, voir bas de page)

http://www.brad-marketing.com/ (entrée avec sons)

http://www.point1.ca/ (animation)

 15) ART – PORTFOLIO

http://www.dusso.com/index.html (peinture virtuelle)

http://www.takdi.com/ (meilleure présentation – design industriel)

http://www.zzee.net/html/images_still.html (les photos sont intenses)

 16) IMMERSIF

http://www.electroluxdesignlab.com/ (meilleure intro)

http://ge.ecomagination.com/smartgrid/#/landing_page (meilleure animation)

http://www.nomadindustries.tv/ (vidéo, qualité exceptionnelle)

http://www.youtube.com/watch?v=IewpICpAbC0&feature=fvsr (son d’une foule)

http://www.millehistoires.com/ (bouton avec rétroaction)

http://www.kaliastyle.com/fr/  (page d’accueil avec vidéo)

http://www.marcjacobs.com/ (page d’accueil vidéo)

http://www.firstpersontetris.com/ (TETRIS jeu-vidéo)

  17) WEIRD – BIZARRE

http://graphism.fr/post/279970839/les-legos-se-cachent-dans-la-neige (du noir)

http://www.accellab.com/ (un cœur qui bat)