logo
  • Accueil
  • Apprendre
  • Partager
  • Blog
  • Connexion
  • S'inscrire
  • Publier Une Fiche
 
Pseudo           
 
Mot de passe   
 
Passe oublié ? | Inscription
 
  
  • Apprendre
  • Catégories/Fiches
  • Nouveautés
  • Tags
  • Rechercher

    avatar Utilisateur non identifié
    S'inscrire pour publier

Comment faire un site Web 2.0 ?

644

Catégorie : Internet    Création : Jeudi 02 Août 2007

644 consultation(s)   -   1 édition(s)   -   0 commentaire(s) - imprimer cette fiche


Pour plus de facilité nous allons réfléchir sur un site qui aurait vocation de créer de la musique en ligne et de la diffuser par exemple. Nous l’appellerons “Plop” (Wah trop bien !).
1 structure
Le premier des ingrédients est une bonne structure de l’information. Toutes les applications online, fourmillent de services, il va falloir donc bien les classer, les gérer pour que l’utilisateur n’est pas de mal a trouvé le service qu’il souhaite trouver. Il est donc très important de simplifier la structure au maximum (Dans la quête de la simplicité, il faut lire “the laws of simplicity” de John Maeda aux éditions “MIT Press” - Merci Gaël pour l’info -)

Pour Plop nous ségmentariseront donc chaque action de l’utilisateur (Dans ce genre d’application l’ergonomie utilisateur va faire le succès ou non de l’application, il est donc très important de faire une conception orientée utilisateur) :

  • L’utilisateur veut écouter de la musique : C’est la partie le plus importante du site car elle va toucher 99% des utilisateurs. Cette partie va créer le succès ou non du site entier, elle va créer le trafic et la notoriété, il faut que ça soit SEXY � souhait !.
  • L’utilisateur veut créer sa musique : Cette partie est la partie la difficile en terme d’ergonomie. Il faut réussir � simplifier (fonctionnalité et interface) une application lourde (fonctionnant sur un OS) pour la transcrire sur le Web, avec toutes les contraintes techniques et ergonomiques que ça impose.
  • L’utilisateur veut diffuser sa musique : pour diffuser sa musique, l’utilisateur va devoir classer, tagger, illustrer, présenter ses créations afin qu’elle soit référencée dans le site et chez monsieur.Google. aussi.

mise en page c'est cool
Pour attirer des petits utilisateurs il va falloir donner du goût (visuel…), on dit toujours qu’en cuisine 50% se trouve dans la présentation, ici c’est pareil. Même si des interfaces comme del.icio.us ont réussi � symposer, ce n’est réellement grâce � leur ergonomie et leur simplicité, et une petite touche de graphisme n’aurait pas été de trop � mon goût. C’est la petite différence qui a réussit � Blogmarks d’ailleurs…

Analyse des interfaces web communautere

Pour identifier les éléments récurrents le mieux reste toujours d’aller voir ce qui se fait, ça permet d’en déduire les règles issues des habitudes utilisateurs :

  • I - Le logo : en règle générale, comme sur beaucoup de sites, on le retrouve dans le coin supérieur gauche.
  • II - S’identifier, se situe très souvent dans le coin supérieur droit. On retrouve parfois dans cette partie différentes données liées � son profil. Cette partie ne varie jamais de place durant la navigation, elle permet aussi de se désidentifier.
  • III - Le “main”, ils récapitulent un tas de données selectionnées qui pourrait intéresser un maximum de personne (musique la plus écouter, meilleure note, la plus échanger,etc…). Cette partie, situé sur la home permet a un nouvel utilisateur de découvrir en un clic ce qu’il se fait de mieux dans le site. On notera parfois la présence d’une illustration graphique (animée ou non) du concept du site, afin de saisir au premier regard le fonctionnement du site (innoveum, xFruits, etc.)

Si nous retournons a notre formidable application “Plop” nous aurions une interface de ce type (le meilleur moyen de vérifier l’ergonomie et la mise en page étant d’utiliser des écrans fonctionnels, c’est la premiére étape avant de pouvoir poser son graphisme dessus) :

Maquette fonctionnel

Le footer est un point important dans l’ergonomie d’un site. Même s’il faut parti des derniéres choses qu’on voit dans une page, nous pouvons nous en servir pour faire des actions récurrentes importantes.

Pour mieux illustrer l’importance des footer je vous renvoie sur l’article de seomoz.org .
webdisgn c'est fresh !

La tendance actuelle de se genre d’application tend vers le minimalisme (comme del.icio.us ou flickr) ou dans le web-design trendy fashion trop hype…

Alors pourquoi tendre vers le minimalisme ou vers du webdesign trendy ? Parce que tout simplement le graphisme vient se caller après l’ergonomie, et son implication dans se genre de site tient plus � l’aide � la navigation qu’a une recherche de l’immersion de l’utilisateur dans univers. On s’oriente carrément dans de l’applicatif et on utilise peu les possibilités du Web.

Les difficultés auxquelles on aurait été confronté avec plop et la rencontre des styles musicaux, chacun de ces styles est porteur d’une image, d’une ambiance graphique. Choisir un style épuré serai comme ne pas mettre de cadre � un tableau pour être sur de ne pas faire de faute de goût, et le laisser se suffir � lui même…

Bon sinon pour ceux qui veule faire un design épuré la référence est ici je crois.

Pour trouver de l’inspiration pour des logos Web trendy (si vous voulez en voir vraiment beaucoup c’est ici), ou pour ce qui est du freshdesign. Après le mieux c’est de se balader dans des showcases.

(4) - Un monde de référencement
Voila vous avez un beau site, il est bien organisé, les applications de créations sont intelligente et ergonomique et votre contenu… Eh oui, maintenant que faire de son contenu, il va falloir le mettre en avant !

En matière de trouvabilité il existe beaucoup de choses pour faire une sauce � la Web 2.0 . Et l� il suffit tout simplement de regarder ce qui fonctionne bien :

  • Il y’a les Tags, système simple et ouvert de référencement. L’utilisateur doit trouver les mots clés les plus percutants pour illustrer sa création. Ce système permet de faire de multiple recoupement avec toutes les autres créations, ça permet de conseiller par exemple des créa qui serait dans le même style.
  • Les thémes, sytème par thématiques adaptées au sujet traité, ils demandent beaucoup de travail car la recherche doit rester intuitive et logique. Il faut donc choisir avec tact les différentes catégories ou thémes.
  • La notation des utilisateurs (rating star, ou système ouvert � la digg). Permets de prendre en compte l’avis des utilisateurs. On peut après juger de la popularité d’un élément.
  • Le nombre de visionnage, une autre composante de la popularité, permet d’identifier qu’elle est la proportion d’utilisateurs et de juger de son évolution.
  • Les commentaires, ils donnent de la vie � sa création, mais aussi il permet de référencer les discussions, de créer des liens vers d’autres créations.

Tous ces outils sont très importants dans une application communautaire qui gère un large contenu, ils permettent de mieux référencer le contenu et de créer un référencement au One par One (chaque élément est indépendant des autres), et non pas par un système global de recherche interne.

Il est très important d’intégrer le processus de référencement (Tags et descriptions) dans le processus de création ! Car se sont des actions assez rébarbatives et le l’utilisateur-créateur n’ira pas de lui même vers cette étape.
5 au final

Au final on s’aperçoit que la recette n’est pas claire, le but étant toujours d’essayer de rajouter sa touche personnelle, sa touche d’innovation. Il ne faut pas ignorer les ingrédients (règles) de base, après le temps de cuisson dépendra du nombre de convives qui viendront goûter votre délicieuse application.

N’oubliez pas de saupoudrez de sucre “béta” avant de servir !


D'apres ergonomie-utilisateur.com/articles/2007-03-18-recette-dun-gros-site-web20/




J'ai testé cette fiche

Ajouter un commentaire


Fiche testée par , le Mardi 02 Décembre 2008

Neofunk
Auteur de 7 fiches

Ajoutez votre version
Note : 1  5 2  5 3  5 4  5 5  5

Information

  • Navigation : Retour haut de page
  • Themes : web 2.0, design, internet
  • Autorisation de reproduction : Creative Commons

Fiche dans la même catégorie

  • 25

    Comment créer une vidéo creative comments ?

    Une fiche de gregus

  • 29

    Comment faire un stream ?

    Une fiche de snooper

  • 1014

    Comment faire du streaming ?

    Une fiche de polo6


Sponsors


skilltoo
test sponsor
http://www.skilltoo.com

Categories

  • Vie quotidienne
  • Travaux Artistiques
  • Education
  • Informatique
  • Loisirs
  • Sport
  • Business
  • Internet
  • Bon plans




En bref

Skilltoo est une application de partage du savoir-faire communautaire et Web2.0.
Notre but est de rassembler un maximum de savoir sur un seul site.

Skilltoo est une application Web2.0 éditée par Elyweb SARL - Copyright 2007 / 2008