Bonjour à la communauté,

Etant donné qu'un informaticien doit tout connaitre ! Smiley cligne

Habitué à l'autoformation depuis plus de 20 ans, il y a 14 mois je me suis lancé dans l'aventure de construire un site Web. L'année fût très enrichissante techniquement mais également humainement.

En effet, régulièrement, je profite des conseils avisés de divers forum SEO et du site alsacreations pour le côté technique, mais aux termes d'une année de création et de référencement dans une démarche d'amélioration du site (Roue de Deming) je soumets mon site à la communauté pour avis et conseils.


Présentation :
Prénom : Marcel
Localisation : Pornichet Loire-Atlantique

Détails du site Parfum de fleurs :
Thème : vitrine artisan fleuriste
Url du site : http://www.parfumdefleurs.eu
Logiciels utilisés : Notepad ++, FileZilla
Hébergement : OVH, formule mutualisée
Wordpress : Non - Mise en oeuvre abandonnée
Description du site : Fleuriste Parfum de fleurs Côte d'amour (Pornichet, La Baule, St-Nazaire, Le Pouliguen, ...)

Améliorations recherchées :
W3C : Corriger ou contourner les erreurs W3C autours des données structurées : (Breadcrumb : fil ariane, Micro Data & Schema.org : données entreprise)
HTML5 : serait-il préférable que mes pages soient en HTML5
Poids : Recherche un outil de nettoyage des fichiers CSS
Réseaux sociaux : d'après mes lectures, ceux-ci semblent incontournables pour GG, mais leurs intégrations dans les pages sont relativement lourdes en termes de performances. Votre avis pour améliorer ce point.

Message à la communauté :
Une promenade sur mon site : http://www.parfumdefleurs.eu pour découvrir un univers de fleurs.

Je vous remercie par avance pour vos conseils Smiley smile

Bonne journée
Marcel
Modifié par mbouchaud (01 Sep 2013 - 06:55)
Bonjour marcel,

Il semble qu'un problème assez récurent dans la création de site est le manque d'espace et d'alignement. Pour ton cas il s'agit plus d'un problème d'espace que d'alignement. (Seul problème d'alignement au niveau du menu, dû à l'intégration du bouton facebook j'imagine)

J'ai un peu l'impression de me répéter au fil des sujets de cette section du forum mais bon c'est un aspect à ne surtout pas négliger sur un site.

Pour l'intégration wordpress il peut être intéréssant de persévéré. Si tu es déjà familier avec PHP il y aura aucuns problème. Surtout qu'il existe de très bon tutoriels pour créer son thème wordpress sur la toile.

J'aime ton menu, il est bien conçu !

Le fil d'ariane n'a pas l'air d'être synchro avec le conteneur général.
Tu devrais l'intégrer dans ton #wrapper

Tes inputs nom et email sur la page contact ont un petit problème d'affichage Smiley ravi

Le HTML5 est toujours mieux sémantiquement parlant. Après faut malgrès tout prévoir un fallback pour les vieux navigateurs comme IE. Ça se trouve facilement.

Pour les réseaux sociaux, tout dépend de ta page, de tes objectifs.
Certains voient les boutons pour réseaux sociaux comme quelquechose qui brouille la navigation car au final il s'agit de plusieurs Call to action. Si le but de la page est d'être partager c'est bon si le but c'est de faire remplir une formulaire, vendre un bouquet ou autre il peut être préférable de l'éviter.

De toutes façon si une personne veut partager ta page elle sait comment copier le lien et le mettre directement sur facebook, twitter ou autre...
Bonjour Mathieu,

Je prends note de tes recommandations.
Pour le point sur le partage de pages des réseaux sociaux, je pense que c'est plus ou moins vrai en fonction de l'âge de la population.

En ce qui concerne Wordpress, je persévère hier j'ai créé quelques pages pour une association et c'est vrai que l'outil est vraiment super pour la gestion d'un site sans connaissance.

Merci beaucoup pour ton analyse et tes recommandations.
Marcel
Bonjour Marcel,

Pour moi, le site que vous présentez présente des bons points et d'autres qu'il faut absolument améliorer ou corriger. De ces défauts résulte une navigation confuse, dans une interface chargée, et trop amateur. Ne gardez que l'essentiel.

Bons points :
• Maquette propre et soignée, même si elle doit être simplifiée.
• Cohérence typographique entre les typos serif pour les titres et chapos et les typos non serif pour le texte et le reste.
• Rose/noir assez frais. Une petite touche de vert ?
(Pour le texte, avez-vous testé en gris foncé à la place du noir ? Ça peut-être élégant.)
• Fond blanc.

Points à améliorer ou corriger :
• Pas de logo. Le truc noir avec le filet autour du nom, ça enferme le nom, surtout qu'il est déjà dans un bloc rectangulaire noir. Ce fond noir n'est pas très funky, de plus le nom est en typo sans serif alors que vos titres sont avec serif, ça rabaisse le "logo" au niveau du texte courant. Il faut être cohérent jusqu'au bout dans la typo. La baseline "Fleuriste Pornichet", c'est pas français.

• Tous les textes sont trop gros. Même les sous titres sont nettement plus gros que le logo (Des fleurs sur La Baule, St-Nazaire, Guérande, ...). Regardez par exemple la taille du texte sur le site alsacréations ou les sites de fleuristes en lien ci-dessous.

• La flèche "up" rose apparaît trop tôt dans un style qui dénote du reste du site. Vous pouvez la virer, ça complique. Ou la placer tout en bas comme sur le premier site en lien ci-dessous.

• Des rubriques, des animations et des effets à n'en plus finir : tweets, diaporamas, présentations de fleurs, nuages de mots, baratins autour du mariage et autres événements qui n'ont rien à faire là… C'est trop ! On est déjà noyé par les infos dès la première page. Sans logique ni cohérence dans la mise en page.

• Le carousel n'est franchement pas vendeur. Avec une composition en mosaïque bordélique et lourde. Une image avec des tags, des photos déformées, jaunâtres, sursaturées, mal cadrées, floues, amateur, ratées, perdues dans la composition, trop nombreuses ou envoyant un message à contre emploi.
Ce diaporama est une catastrophe. Il n'y a pratiquement aucune photo à sauver dans ce truc. Par exemple la Renault bordeaux avec son pauvre ruban et la date en orange, la photo d'enterrement (mariage pardon) avec le corbillard noir et un bouquet de fleur qui posent devant un espèce de chateau, le papillon, la composition florale sur la table toute déformée, avec les cactus en arrière plan, les espèces de tombes devant des tableaux tout flous, le pot de fleur avec les genre "d'orchidées" tout applaties et floues, la photo de la boutique lugubre, grise et floue… Ne mettez qu'une photo, mais une jolie photo qui fasse vendre.

Trop c'est trop ! C'est le festival de la photo pourrie !! Pour couronner le tout ces photos se noircissent au survol avec des légendes sans intérêt et un lien "en savoir plus". Moi quand je vois ça, je n'ai pas envie d'en savoir plus. Je me barre et je ne reviens plus jamais.

Le problème c'est que même sur les pages intérieures, les photos sont une catastrophe. Ça sent le pipi de chat et le bouquet à mémère, photographié à la va vite sur du carrelage qui fait crade. Désolé si j'ai l'air tranché, mais je ne pense pas l'être tant que ça. Il faut tout revoir au niveau de la photo. En plus on s'en mange des tonnes, on est assommé de photos ratées et moches sur pratiquement toutes les pages.
1/ Virez le photographe !
2/ S'il n'y a pas de photographe, trouvez en un bon, de préférence un spécialiste qui vous fasse de jolies photos. Une par rubrique suffit. Éventuellement développer un peut pour les thèmes majeurs (mariage…).

Et encore un diaporama, ce coup-ci avec des vignettes qui remuent par en dessous et même un point "i" en haut à gauche, dès fois qu'on en voudrait d'avantage…
Deux carrés verts vifs sur le côté apparaissent avec un téléphone et un crayon. C'est quoi ces horreurs ? Virez ça immédiatement ! Surtout que le téléphone est déjà inscrit en haut.

• Les pictos twitter, facebbok et google+ ne sont pas soignés avec un contour blanc sur noir. En plus "3 personnes aiment ça" juste en dessous, il y a un doublon avec le logo Facebook qui ne doit pas être positionné juste au dessus. Le logo "flux RSS" pour quoi faire ?
Cette bande noire en haut n'est pas très jolie et plombe un peu la mise en page.

• L'adresse est mal formulée. Loire Atlantique France ne sert à rien. Fleuriste est marqué 2 fois à quelques pixels de distance.

• Le fil d'ariane est faux. J'arrive sur la page d'accueil et je clic sur mariage dans le menu. Total, j'arrive sur une page qui m'indique ça :
"Vous êtes ici : Fleuriste Pornichet » Bouquet » Composition » Deuil » Mariage"
C'est faux. En plus classer la rubrique "Mariage" en tant que sous rubrique de "Deuil", bonjour l'angouasse !! Smiley lol
Et des photos moches qui défilent, en veux tu en voilà… C'est encore pire que sur la page d'accueil. Certains bouquets sont probablement très jolis, mais photographiés en contre plongée, flous, par dessus, à même le sol, sur du carrelage, des cadrages ratés, avec des couleurs dégueulasses, ça flingue tout. Pas une seule photo pour relever l'autre.

• Attention aux titres de rubriques ! Des titres comme "Mariage ou PACS", ça fait pas rêver… Rester simple. On s'attend à voir arriver la rubrique "Mariage ou PACS ou Mariage gay"… Vous êtes fleuriste, pas juriste. Si vous tenez tant que ça à préciser, que pensez-vous de "Mariage et unions", ou "Mariage" ? Les gens sauront où chercher.

Vous vendez du rêve, ne l'oubliez pas.
Les photos telles que vous les présentez, c'est très bien comme souvenir dans un album de famille, mais ça n'a rien à faire sur un site commercial qui se doit d'être une jolie vitrine de votre talent.

Même les sites de fleurs discounts son clean avec des photos propres et soignées. Que ça soit pour des jolies photos artistiques bien cadrées ou des bouquets "descriptifs" détourés sur fond blanc.

Ce vers quoi vous devez vous approcher :
http://www.monceaufleurs.com/
Photo de boutique propre. Photos de compositions et bouquets propres, soignées et artistiques.
Un joli logo élégant. Des typos de taille équilibrée. Un classement simple par rubriques, sans surcharger d'infos inutiles. On trouve en 10 secondes l'info qu'on cherche. Le site n'est pas pollué par des trucs twitter ou des nuages de mots inutiles. Une boutique de fleurs avant tout. Pas de diaporamas a n'en plus finir sur toutes les pages…

Même les sites de ventes de bouquets à bas prix sont plus attrayants que le vôtre :
http://www.telefleurs.fr/
Certes ils ont fait appel à une agence, mais les bouquets sont jolis, modernes, propres… Là encore, la simplicité et l'efficacité prime.


Pour résumer, vous avez construit certaines bases, mais il faut simplifier, moderniser, et illustrer de façon plus propre et professionnelle votre site. Qu'il sente la fleur et non pas le renfermé. Toutes les photos ratées doivent disparaître. Ce n'est pas un catalogue, encore aurait-il fallu qu'il soit vendeur. Vous avez manqué des conseils d'un pro de l'image (graphiste, designer, photographe floral…). Passer par la case photographe professionnel, s'avère indispensable pour un site tel que vous le concevez.
Sortez de l'approche trop technique que vous nous présentez, simplifiez la navigation et l'ergonomie, et n'illustrez chaque rubrique que d'une ou quelques jolies photo. Inutile de noyer le client sous des tonnes de photos ratées. Absolument pas vendeuses, bien au contraire.

Voilà pour mon approche. Celle d'un graphiste, donc plus orientée concept et présentation, que code.

Bonne continuation ! Smiley smile
Philippe
Modifié par spongebrain (06 Sep 2013 - 19:55)
Bonsoir Philippe,

Merci beaucoup pour l'analyse très détaillée du site et les nombreuses recommandations graphiques.
Ce n'est effectivement pas mon point fort Smiley cligne

Pour le plaisir des lecteurs, je vais faire le max pour améliorer ce point.

J'ai du boulot Smiley smile
Marcel.
Bonjour,

J'ai commencé à alléger ma page d'accueil et sous GG et SEO Soft le principal concurrent est maintenant mieux positionné que mon site sur les mots clé fleuriste Pornichet.

Hors, j'obtiens de meilleurs résultats lors de l'analyses comparatives des 2 sites avec les outils suivants :
Outil d'analyse de site : grader.rezoactif, woorank et gtmetrix
Outil de suivi de référencement : ahrefs et opensiteexplorer
Outil d'évaluation des performances : developers.google.com/speed.

Je suis convaincu que l'ergonomie est primordiale pour l'utilisateur, mais la position dans les résultats de recherche est également très important.

Que dois-je faire ?

Merci beaucoup pour vos conseils très constructifs.
Marcel