Votre avis sur la largeur d'un site

Bonjour,


J'aurais besoin de votre avis sur la largeur d'un site...

Pour vous, quelle est la largeur idéale d'un site internet ?

On voit beaucoup de site ayant une largeur aux alentours de 980px, je trouve que c'est une taille passe partout.

Après je rencontre des problèmes pour les sites ayant une colonne à gauche...
La colonne ayant par exemple 200px de largeur, il ne reste plus que 780px pour le contenu...

Donc est-ce qu'un site ayant un contenu présenté sur une largeur de 780px vous gène ? vous choque ?

Que me conseillez vous comme dimensions pour un site ayant plusieurs colonnes ? Sachant que l'utilisation des medias queries ne rend pas très bien dans certain cas.


Merci
Modifié par Crousti2 (24 Apr 2012 - 18:05)

Hello.

Difficile de donner une réponse toute faite à ce genre de questions, tout dépend du design initial.

Parfois, ça passera mieux en fixe à 980, d'autres fois une approche fluide donnera de meilleurs résultat.

Oui mais pour un design fixe par exemple ?

Perso j'ai un site en 980px avec, selon les pages, un menu à gauche ou rien.

Par exemple, l'accueil n'a généralement pas besoin d'un menu latéral (plusieurs blocs), donc j'utilise toute la largeur, dans les catégories par contre, j'ai un menu latéral pour les sous catégories et options de la catégorie en cours.

En dehors de ça, il est plutôt plus intéressant d'avoir un menu à gauche (ou droite) pour du contenu textuel. En effet, quand tu lis, et que tu as une largeur trop importante, il n'est pas toujours évident de savoir où se trouve la ligne suivante de façon naturelle.

Je parle plus facilement de menu de gauche car, si celui-ci est important dans la navigation, il sera bien plus cliqué.
J'avais mis mes menus à droite à la base, le jour où je l'ai placé à gauche, le taux de clic a très fortement augmenté.

Pour le menu à gauche je pense qu'il peut très bien se situer sur la page d'accueil également... car un site avec beaucoup de page peut avoir un menu en haut de la page, un menu à gauche et peut-être un sous menu.

Sinon je suis d'accord avec toi sur le fait qu'une largeur trop importante n'est pas confortable à la lecture. Cependant on peut se dire que nos écrans ont une résolution de plus en plus grande et qu'utiliser 780px pour afficher du contenu est trop faible... Qu'en pensez vous ?
Modifié par Crousti2 (24 Apr 2012 - 20:41)

J'ai un écran qui affiche un peu plus que les 980px, donc souvent des bandes à droite et à gauche. Personnelement, je préfère les sites qui laissent cette bande là, c'est plus aéré (comme alsa).

Je sais que j'avais fais un design à 100% (il était à 980px avant). J'ai du le remettre à 980px maxi car les membres râlaient trop, et étrangement, surtout ceux qui avait un très grand écran.

Je préfère personnellement du fixe (malgré que ce ne soit pas à la mode) pour une question de placement des éléments. J'ai un site avec beaucoup de stats (plusieurs dizaines de milliers de visiteurs par jour) et je peux dire une chose, l'emplacement des éléments à quelques pixels près peut beaucoup changer le taux de transformation (que ce soit la pub, l'inscription, la participation des membres etc). C'est des réglages qui me prennent énormément de temps, mais quand je trouve le réglage idéal c'est le top. Par contre, avec un design responsive, ce même travail me semble extrêmement difficile sans une grosse équipe derrière.

J'ai récemment changé de design, ça fait 2 semaines que je ne fais que regarder les stats pour retrouver un taux de transfo idéal à tous les points de vue.

Après, les gens sont habitués à cette taille, pour moi c'est un plus. Ils ont leur marque, mieux vaut ne pas les perturber (ne sur-estimé pas vos visiteurs, si vous ne mettez pas les éléments devant les yeux, ils ne le trouveront jamais pour la majorité d'entre eux, je peux vous le garantir !). Maintenant, je parle de site grand public (la majorité de mes sites), si c'est pour un site vitrine, on peut être plus créatif.

il me semble qu'un standard couramment admis est de 960px?

il y a même un système de grille qui s'appelle le grid960 ou un nom dans le genre..

kenor a écrit :
Personnelement, je préfère les sites qui laissent cette bande là, c'est plus aéré (comme alsa).

La page d'accueil d'alsa ne te dérange pas ? http://www.alsacreations.com/ il y a bien une colonne à droite ! L'espace contenu est quand même très limité. Pour le forum je veux bien te croire...

Sinon je pense que la taille idéale est bien 980px et je suis aussi pour le design fixe. Et enfin si je comprends bien pour la plupart des gens, un site de 980px de large qui comprend une colonne à gauche ou à droite n'est pas un problème !

Je n'ai pas dis que c'était gênant une colonne à droite, j'ai dis que dans certains cas, c'est mieux d'avoir toute la largeur de dispo, et donc prévoir un design qui permet de n'avoir aucun menu. Et que la colonne de droite ne devrait servir que pour des éléments secondaires car moins cliqué que lorsqu'elle est à gauche (d'après mon expérience).

Etant sur une résolution 1920x1080, je peux te garantir que si le design n'est pas confortablement conçu pour être fluide, c'est très désagréable.

Rien ne vaut le bon vieux standard 960px centré. Les bandes sur les cotés ne sont pas gênantes... Ca apporte même une légère structure à un site. Voir l'image pour te donner un aperçu.

http://web-mez.fr/alsa.png
Modifié par Apoooo (25 Apr 2012 - 21:33)

Bonjour,


D'accord ça me rassure, nous voyons les choses de la même manière...


Merci à vous pour avoir répondu à mes questions !
Modifié par Crousti2 (26 Apr 2012 - 08:46)

kenor a écrit :
Je n'ai pas dis que c'était gênant une colonne à droite, j'ai dis que dans certains cas, c'est mieux d'avoir toute la largeur de dispo, et donc prévoir un design qui permet de n'avoir aucun menu. Et que la colonne de droite ne devrait servir que pour des éléments secondaires car moins cliqué que lorsqu'elle est à gauche (d'après mon expérience).

Attention tout de même, un texte à une taille proche de celle par défaut, sur
900px de large aura beaucoup trop de caractères à la ligne pour être bien lisible. Tant que le module multi-colonnes, ou les box-models flexibles ne sont pas suffisamment aboutis, on doit se contenter d'une seule colonne de texte pour le contenu. Des colonnes à droite ou à gauche existent car l'espace est libre lors de mise-en-page soignées.

@kustolovic : je ne veux pas te vexer, mais je n'ai pas vraiment compris ce que tu as voulu dire ?

Non ça ne me vexe pas. Voici une petite page démontrant le fond du problème:

http://www.kusto.ch/text.html

Ok, précisément j'en parle au dessus :

a écrit :

En dehors de ça, il est plutôt plus intéressant d'avoir un menu à gauche (ou droite) pour du contenu textuel. En effet, quand tu lis, et que tu as une largeur trop importante, il n'est pas toujours évident de savoir où se trouve la ligne suivante de façon naturelle.

Quand je parle de l'accueil sans menu c'est pour pouvoir présenter les choses par bloc pour reprendre les divers catégorie du site qui ne peuvent pas forcement être mise l'un à la suite des autres quand on est pas dans un site type "article / blog". L'exemple d'un site de foot, on pourrait trouvé sur l'accueil "la une", les résultats de tel ou tel divisions, une partie people, une partie sur les dessous du foot etc. Dans ce cas, difficile d'ajouter en plus un menu sans surcharger l'accueil.

Mais je parlais bien d'un exemple, certains sites peuvent parfaitement mettre un menu sur l'accueil si c'est nécessaire . J'aurai pu prendre l'exemple d'un forum qui ont rarement des menus, pour autant le reste du site peu avoir un menu latéral.

Crousti,

au-delà d'une largeur de page (!), la question du menu est évidemment importante. J'opterais volontiers pour un menu en position:fixed et escamotable par onmouseover/onmouseout Celui-ci par exemple qui déborde légèrement à gauche de la page.

- le menu "out" :


- le menu "over" :


dont le code en javascript est :
<script type="text/javascript">

function MenuOver(id)
{
this.modiff1 = '7';
this.modiff2 = '#3c7786';
this.modiff3 = '8px 8px 12px #222';
this.id=id;
{
document.getElementById(id).style.zIndex = this.modiff1;
document.getElementById(id).style.backgroundColor = this.modiff2;
document.getElementById(id).style.boxShadow = this.modiff3;
}
}


function MenuOut(id)
{
this.modiff1 = '1';
this.modiff2 = '#91b196';
this.id=id;
{
document.getElementById(id).style.zIndex = this.modiff1;
document.getElementById(id).style.backgroundColor = this.modiff2;
document.getElementById(id).style.boxShadow = '0 0 0 #000';
}
}

</script>

et s'exprime dans la page par le .html
<div id="menu" onmouseover="MenuOver('menu');">_</div>
<div id="page" onmouseover="MenuOut('menu');">_</div>

ce qui permet de libérer autant de la place que de disposer toujours d'un accès au menu.
Modifié par zebulin (29 Apr 2012 - 18:38)

Effectivement ce n'est pas bête du tout mais pour ceux chez qui le javascript n'est pas activé ?


Donc vous pensez qu'il faut privilégier l'organisation du contenu en petites colonnes ? Après je pense que tous les contenus ne sont pas adaptés à être organisé en colonne...
Modifié par Crousti2 (27 Apr 2012 - 08:35)

@kenor: Au temps pour moi, je devais être fatigué l'autre jour ^^. En relisant bien, j'ai constaté ma méprise et ma bêtise. On est donc bien d'accord.

@zebulin: Le menu escamotable(ou plutôt escamoté en l’occurrence) pour du desktop, bof bof. Sauf si tu fais une appli web complexes et tu caches la navigation globale du site. En dehors de cela, il n'est pas forcément nécessaire de nous faire une démonstration en image et en code du concept.

Pour le menu escamotable, encore une fois, vous sur-estimez largement le grand public.

Essayez de faire naviguer votre tante ou votre mère ou votre voisine ... Vous verrez ce qu'est un internaute lambda. Et je peux vous assurer que ce genre de menu, au pire ils le verront pas, au mieux ils le verront et ne seront pas faire glisser leur souris sans cliquer à côté.

Faites simple, très simple, ce n'est pas pour rien que GG fait très basique, car le visiteur lambda ne sait pas en faire plus.

kenor a écrit :
Pour le menu escamotable, encore une fois, vous sur-estimez largement le grand public.

Essayez de faire naviguer votre tante ou votre mère ou votre voisine ... Vous verrez ce qu'est un internaute lambda. Et je peux vous assurer que ce genre de menu, au pire ils le verront pas, au mieux ils le verront et ne seront pas faire glisser leur souris sans cliquer à côté.

Faites simple, très simple, ce n'est pas pour rien que GG fait très basique, car le visiteur lambda ne sait pas en faire plus.

C'est difficile de contr'argumenter. Ha ! si l'Histoire de l'Humanité s'était confinée à l'exception de l'incompétence ou de la bêtise ou de la paresse des visiteurs du Web ... Ca laisse rêveur tout de même.
Modifié par zebulin (29 Apr 2012 - 18:51)