lun.

10

août

2015

LE guide ultime pour choisir le design Jimdo qu'il vous faut !


Vous démarrez votre site, ou vous avez en tête de le refaire ? L’une des premières étapes est de bien choisir votre design Jimdo afin qu'il soit adapté à votre projet.

Facile à dire mais dans les faits ça se complique ! Si c'est génial d’avoir autant de designs à sa disposition, comment y voir clair et choisir LE design parfait du premier coup ? Un peu d'aide n'est pas de refus et ça tombe bien, c'est justement l'objectif de cet article !

Effectivement, identifier les points forts et faibles d’un design demande un peu d’expérience et souvent de visualiser le rendu avec son propre contenu.

 

Mais vous allez voir, une fois que vous avez compris la structure d’un design et les différentes parties qui le composent, il vous sera déjà bien plus facile de trouver votre bonheur.

Note
Vous utilisez encore un ancien design Jimdo ? En août dernier, nous avons totalement renouvelé notre gamme de mises en page et mis à votre disposition toute une série de nouvelles options pour votre site. Rien ne vous force à changer bien entendu mais nous vous conseillons d'essayer : ces nouveaux designs offrent des options de personnalisation beaucoup plus flexibles ! Voir des exemples

La structure des designs Jimdo

Commençons par le commencement en précisant que tous les designs Jimdo sont construits à partir de la même structure. Même si vous choisissez le modèle de départ "restaurant" ou "CV" que nous vous proposons, cela ne signifie pas pour autant que vous devez obligatoirement être un restaurateur ou vouloir réaliser un site pour votre CV en ligne.

Nous avons rempli ces modèles avec du contenu pour les rendre plus visuels et vous aider à trouver l'inspiration mais TOUS les exemples présentés sont ensuite entièrement personnalisables tant dans leur style que dans leur contenu.

Ne vous laissez pas distraire par les éléments insérés par défaut, essayez de voir au delà et d'analyser simplement la structure des modèles mis à votre disposition.

 

Chaque design présenté contient toujours :

  • une zone d'en-tête (header) : cette partie sera visible en haut de chacune des mises en page. C'est dans cet encart que sera inséré votre logo et le titre de votre site.
  • une navigation : la navigation est le menu qui permettra à vos visiteurs de se repérer sur votre site et de naviguer d'une page à une autre. Ce menu de navigation se décline sous différentes formes avec Jimdo : menu déroulant, avec un fil d'ariane, rétractable, vertical ou horizontal.
  • un corps de site : le corps de site est votre zone principale pour insérer votre contenu - différents sur chacune des pages.
  • une sidebar : la sidebar est votre zone de contenu secondaire. Souvent placée à côté ou en dessous (se mêlant alors avec le footer) elle reste visible sur toutes les pages du site. Peu importe la page sur laquelle se trouve le visiteur, il verra toujours cette sidebar et les informations qui s'y trouvent.

 

Note
Le plus important à retenir est que votre header et votre sidebar/footer seront toujours visibles, peu importe la page sur laquelle votre visiteur se trouve.
En savoir plus sur l'utilisation de la sidebar.

Maintenant que vous connaissez les différentes parties qui composent un design, vous pouvez facilement les repérer dans chacune des mises en page Jimdo. Vous remarquerez par exemple que certaines mises en page ont un header plus large que d'autres, ou une zone de contenu qui peut être centrée, à droite ou à gauche ou encore une navigation horizontale ou verticale.


Lorsque vous savez où vous souhaitez avoir ces différents éléments, alors il deviendra beaucoup plus simple de faire le tri et de reconnaître les modèles qui auront la bonne structure pour le projet que vous souhaitez mettre en place.

Voici ci-dessous quelques comparaisons de nos designs. Les headers sont encadrés en jaune, les menus de navigation en bleu et les sidebars en rouge.

Design St.Petesburg
Design St.Petesburg
Design Riga
Design Riga

Design Dublin
Design Dublin
Design San Francisco
Design San Francisco

Vous pouvez constater que sur la mise en page Riga par exemple, la sidebar est en bas et se confond avec le footer. Et sur Dublin, le menu de navigation est vertical alors que sur les autres, la navigation est horizontale.

Les questions à se poser avant de choisir

Une fois que vous avez bien en tête la place des zones fixes à prendre en compte (menu, header, navigation etc.) la deuxième étape avant de choisir votre design est de se poser les questions suivantes :

 

  • Quelle place souhaitez-vous donner à votre zone d'en-tête (header) ?

Si vous avez un logo très graphique, que vous souhaitez mettre en avant, alors il vous faudra opter pour une mise en page avec une zone d'en-tête très large, qui prendra bien toute la largeur de votre site et qui pourra également accueillir une image d'arrière plan. Ces designs sont d'ailleurs très en vogue ces derniers temps, comme nous vous l'expliquions dans cet article de blog.

 

Les mises en page Jimdo qui proposent actuellement cette structure sont : Barcelona, Amsterdam, Cairo, Shanghai, Rome ou encore Zurich.

 

À l'inverse, si vous souhaitez un design avec une petite zone d'en tête ou qui n'en a aucune, les designs que nous vous conseillons sont : Dublin, Lima, Milano ou Singapore.

 

  • Où voulez-vous votre sidebar ?

Si vous souhaitez une sidebar la plus discrète possible ou si vous souhaitez que le corps de votre site prenne toute la largeur de la page, alors il vous faut choisir une mise en page avec la sidebar tout en bas - avec le footer.

Par contre, si vous souhaitez que vos visiteurs aient toujours bien en vue cette zone pour y mettre à l'intérieur toutes vos informations utiles alors préférez un design avec la sidebar située à droite ou à gauche. Et si encore vous ne souhaitez aucune sidebar, c'est également possible : choisissez un design avec la sidebar en bas et laissez cet espace vide.

 

Quelques exemples de mises en page avec la sidebar sur le côté : Hong Kong, Lima, Madrid, St. Petersburg, Verona

Designs avec une sidebar en bas de page : Barcelona, New York, Havana, Zurich, Berlin.

 

  • Quelle navigation offrir à vos visiteurs ?

La navigation que vous allez choisir dépend en grande partie du nombre de pages que vous souhaitez avoir sur votre site et du nombre de sous-pages. Si vous ne l'avez toujours pas fait, il est encore temps de mettre à plat la navigation de votre site sur une feuille de papier afin de bien visualiser les pages et sous-pages et éventuellement les ré-organiser pour obtenir un menu intuitif et efficace pour vos visiteurs.

Si vous n'avez que quelques pages (7 maximum), alors une navigation horizontale sera parfaitement adaptée - le but étant que cette navigation tienne sur une ligne pour encore plus d'efficacité et d'esthétisme. Si vous en avez plus au contraire, alors envisagez une navigation verticale (avec ou sans menu déroulant) où vous pourrez ranger vos sous-menus et offrir ainsi une meilleure visibilité à vos visiteurs.

 

Parmi les designs qui proposent une navigation horizontale, vous trouverez : Barcelona, Zurich, Riga, Prague.

Vous préférez une navigation verticale ? Essayez : Havana, Milano, Lima, Dublin.

 

Jimdo vous propose également des navigations séparées en deux selon le niveau des pages. Le premier niveau de navigation apparaît tout en haut de la page, horizontal, au dessus de la zone de header, tandis que les autres niveaux apparaîtront verticalement, sous l'en-tête et à gauche ou à droite de votre page. Voici deux exemples ci-dessous avec les design Hamburg et Chicago et leur deux niveaux de navigations encadrés en orange.

 

Design Chicago
Design Chicago
Design Hamburg
Design Hamburg

En revanche vous trouverez ci-dessous un autre exemple de navigation avec le design Sydney, qui lui, dispose d'un menu rétractable : cliquer sur les 3 barres de menu à gauche fera apparaître la navigation complète.

 


Le design que vous choisirez dépendra aussi du type de site internet dont vous avez besoin. Tour d'horizon de sites types, et des mises en page adaptées :

1 - Je souhaite un design adapté pour un blog

Les blogs nécessitent généralement une sidebar - dans laquelle vous pourrez laisser en vue vos archives, les articles les plus récents, une barre de recherche ou encore vos liens vers les réseaux sociaux. Dans ce cas, optez pour un design qui a une sidebar à droite ou à gauche.

Et si vous avez besoin de beaucoup d'espace pour mettre en avant des photos, alors optez plutôt pour une mise en page avec une large zone d'en-tête.

 

Pour la sidebar sur le côté essayez Reykjavik, Helsinki, Milano, ou St. Petersburg. Et Singapore, Berlin, ou Zurich pour une zone de header large.

2 - Je souhaite une mise en page adaptée pour un portfolio

Si vous êtes à la recherche d'une mise en page pour mettre en avant vos travaux artistiques (peintures, maquettes, photos), optez pour un design avec une sidebar en bas. La vue bien dégagée de votre corps de site pourra révéler tout le potentiel de vos galeries d'images  et capter l'attention de vos visiteurs en un clin d'oeil.

 

Si vous avez de belles photographies en haute qualité, vous souhaitez sûrement les mettre en lumière grâce à un design qui utilise une large zone d'en-tête avec image de fond. Vous pouvez même, avec Jimdo, paramétrer plusieurs images de fond et les faire défiler en panorama. 

 

Étant donné qu'un site portfolio ne nécessite généralement pas autant de pages qu'une e-boutique, vous pouvez choisir une navigation horizontale ou une navigation rétractable qui vous permettra d'utiliser le plus d'espace possible.

 

Vous souhaitez une zone d'en-tête large ? Nous vous conseillons les designs Rio de Janeiro, Cairo, Zurich. Et Copenhagen, Sydney et Cape Town pour les menus rétractables.

Le design Zurich est parfait pour les sites portfolio. Avec un large corps de site et une sidebar en bas de page, il peremt de mettre bien en avant votre contenu. Exemple avec ce site Jimdo : felicevagabonde.com
Le design Zurich est parfait pour les sites portfolio. Avec un large corps de site et une sidebar en bas de page, il peremt de mettre bien en avant votre contenu. Exemple avec ce site Jimdo : felicevagabonde.com

3 - Je souhaite un design adapté pour une E-boutique

Les sites e-boutique ont besoin de beaucoup de catégories et d'une structure très claire pour pouvoir bien organiser toutes leurs pages produits. Pour ce faire, il existe quelques astuces.

 

Utilisez une mise en page avec une navigation séparée en deux ou choisissez une navigation qui consacre un espace claire aux sous-pages. Les navigations qui disposent d'un fil d'ariane par exemple aideront efficacement les visiteurs à se repérer sur votre site.

 

Vous pouvez aussi opter pour une mise en page avec une large zone de header avec fond personnalisable pour bien mettre en avant les derniers produits.

 

Nous vous recommandons Bordeaux, Rome, Malaga, Melbourne, Miami ou encore Chicago.

Cet exemple d'E-boutique Jimdo Noria Design fait une bonne utilisation du design Rome avec son menu déroulant et sa large zone de contenu.
Cet exemple d'E-boutique Jimdo Noria Design fait une bonne utilisation du design Rome avec son menu déroulant et sa large zone de contenu.

4 - Je souhaite un design adapté à beaucoup de contenus

Un site internet contenant énormément de pages et sous-pages peut être compliqué à organiser de façon claire et intuitive pour les visiteurs.

 

Si vous utilisez une navigation horizontale et que celle-ci est sur deux lignes, ou si encore vous avez une navigation verticale très longue qui dépasse de beaucoup le contenu de votre site, alors il serait bon de revoir votre navigation et réorganiser vos pages.

 

Pour faire de l'espace sur votre site et accueillir tout votre contenu, choisissez une navigation propice aux sous-menus. Portez votre choix sur les designs qui ont des menus déroulants par exemple, des menus séparés en deux ou encore des menus avec des fils d'ariane.

 

Évitez les menus rétractables par contre : ils compliqueront la navigation de vos visiteurs si vous avez beaucoup de pages.

 

Designs conseillés : Bordeaux, Osaka, Malaga, Dublin, Lille

Le site Jimdo www.claletnantailly.fr utilise le design Rome, qui a, à la fois un menu déroulant et un fil d'ariane (encadrés en rouge).
Le site Jimdo www.claletnantailly.fr utilise le design Rome, qui a, à la fois un menu déroulant et un fil d'ariane (encadrés en rouge).

5 -  Je souhaite un site Internet multilingue

Les sites multilingues ont le même problème que les sites riches en contenu car ils impliquent de répéter les mêmes pages en autant de langues que nécessaires. 

 

Une des solutions pour garder une structure claire est de choisir un design avec la navigation séparée en deux.  Ainsi, vos différents choix de langues apparaitront dans la première partie de la navigation, et le menu propre à chacune des langues sera dans la seconde partie de la navigation.

 

Vous pouvez aussi opter pour une navigation horizontale avec des menus déroulants - comme sur l'exemple ci-dessous de Noria Design qui utilise les menus déroulants pour son e-boutique multilingue.

 

Les autres designs conseillés sont Lille, Bordeaux, Hambourg, Chicago, Madrid et Hong Kong. Ils disposent tous d'une navigation séparée.

 

Ce site multilingue www.freedomandspirit.be utilise le design Hamburg avec un premier niveau de navigation tout en haut à droite de la page pour ses langues et les sous-pages de chacune des langues apparaissent dans un second niveau à gauche du contenu.
Ce site multilingue www.freedomandspirit.be utilise le design Hamburg avec un premier niveau de navigation tout en haut à droite de la page pour ses langues et les sous-pages de chacune des langues apparaissent dans un second niveau à gauche du contenu.

6 - Je souhaite un site vitrine dans lequel mes visiteurs peuvent trouver en un coup d'oeil l'information la plus importante

En voilà un bon objectif ! La plupart des sites commerciaux font effectivement en sorte que les informations les plus importantes soient visibles directement par leurs visiteurs. Que vous soyez un restaurateur qui met en accès libre son menu ou ses horaires, un magasin qui montre ses dernières nouveautés ou une agence avec un bouton d'action pour les demandes de devis, il y a un tas de designs qui peuvent vous correspondre parfaitement.

 

Dans votre cas, vous n'avez pas forcément besoin de proposer énormément de contenu mais vous voulez être sûr que le contenu que vous mettez en avant est facile à trouver sans passer par de nombreux clics. 

Dans ce cas, commencez par regarder les mises en page qui ont une sidebar à droite ou à gauche. Ainsi, vous pourrez mettre les informations phares dans cet encart et celles-ci resteront bien visibles sur toutes les pages.

Une sidebar en bas de page peut aussi fonctionner mais cela prendra quelques secondes de plus à vos visiteurs pour scroller jusqu'en bas et arriver à ces informations ...

Privilégiez un menu de navigation court, horizontal ou vertical comme vous le souhaitez. Évitez les navigations rétractables qui sont une barrière de plus entre vos visiteurs et les informations que vous souhaitez partager.

 

Les mises en page à regarder de plus près pour ce projet sont donc Amsterdam, Havana, Lima, Prague, Reykjavik et Madrid.

 

Madrid
Madrid
Havana
Havana

Appliquer un nouveau design sur votre site

Une fois que vous avez une idée précise de la structure de votre site (et que vous avez plusieurs choix de mises en page Jimdo en tête), c'est le moment de tester !

Rendez-vous dans l'onglet "Design" de votre site Jimdo, choisissez votre mise en page dans le catalogue et cliquez sur "Aperçu". Votre contenu sera automatiquement transposé dans cette nouvelle mise en page et tant que vous n'enregistrez pas votre choix, les changements ne seront pas conservés, ni visibles pour vos visiteurs.


Démonstration en images dans la vidéo tuto ci-dessous :

 

Justine Perussel

Blogueuse pour la communauté

Ces articles peuvent aussi vous intéresser :


Écrire commentaire

Commentaires : 5
  • #1

    alainngeve (lundi, 30 novembre 2015 09:18)

    Un cadre ou les perdues retrouvent leurs destinées et les hommes ordinaires deviennent des vases utiles au service du roi

  • #2

    bonnin (lundi, 11 janvier 2016 11:19)

    j'ai créé un domaine jpbonnin.jimdo.com
    Impossible de se connecter à partir du navigateur en tapant cette adresse? Que faire?

  • #3

    JimdoFrance (jeudi, 28 janvier 2016 14:26)

    @bonnin : Je trouve bien votre site en tapant son adresse dans la barre d'adresse de mon navigateur. Par contre il est possible qu'il ne soit pas encore référencé sur les moteurs de recherche comme Google & Co.

  • #4

    Goty (dimanche, 15 mai 2016 23:23)

    Je ne comprends pas ce qu'est un fil d'Ariane, pouvez vous m'aidée s'il vous plaît ?

  • #5

    JimdoFrance (mardi, 17 mai 2016)

    @Goty : Un menu en fil d'Ariane permet à vos visiteurs de toujours savoir où ils se trouvent sur votre site. Il montre le chemin parcouru par l'internaute à partir de la page d'accueil. Comme sur ce site par exemple : http://www.jean-nickell.be/