[Amateur] Concerts en Boîte - Des chroniques live et des photos

Bonjour,

en premier message dans ce beau forum, je soumet des avis sur mon modeste site.

Le thème : des chroniques de concerts avec un maximum de détails et des photos. J'y suis le photographe et ma compagne la chroniqueuse.

Sous le capot : wordpress avec un thème acheté mais depuis ultra personnalisé et optimisé.

Historique : le site qui a grosso modo 5 ans a connu diverses évolutions. On va dire que l'on arrive tout doucement à une version hyper optimisée et visuellement pour moi pas désagréable.
J'ai tenté aussi d'être le plus rigoureux possible au niveau du code et surtout d'avoir un maximum de metadata pour bien décrire le contenu de mes pages.
Très récemment, gros travail sur les pages d'archive pour que ce soit de vraies pages avec des informations complémentaires.
La version mobile approche également tout doucement de sa version finale, tant sur le contenu que l'optimisation.

Voilà, je vous laisse maintenant la main et j'attends avec impatience vos commentaires et avis sur la version bureau et/ou mobile, que ce soit sur le design ou le codage.
Attention, même si je suis webmaster depuis 1997, je m'estime plutôt novice et avant tout pragmatique.

Le site : http://www.concertsenboite.fr

je vous remercie par avance

Bonjour !

Super photos !

On se doute que c'est un site sur la musique mais pour trouver la 'raison d'être de ce site', il faut scroller tout en bas... Et elle est un peu perdue parmi tous les éléments du site...

D'ailleurs, des éléments, il y en a beaucoup et pour tout dire, moi aussi je me sens un peu perdue...

Des petits choses m'embêtent :
- des onglets sont en bas et chaque fois que je clique sur un, je reviens en haut et je dois rescroller en bas pour voir le résultat de l'action,
- la barre d'outils des réseaux sociaux qui se met sur le texte,
- dans le bloc 'détails du concert', le texte ne se voit pas assez...
- les titres de paragraphes qui devraient être plus proches de ce qui suit que ce qui précède.

C'est sympa, les sites avec du contenu, on sent que vous avez beaucoup de choses à dire, à faire partager. Mais globalement, j'ai une sensation de trop-plein, sans doute dû à un manque de hiérarchisation entre ce qui est important et ce qui l'est moins.

Faites attention avec les lignes de texte trop longues...

Je ne sais pas ce que ça donne sur mobile mais si je réduis la fenêtre, l'affichage est moins bon...

Voilà !

J'aurais bien élargi le diapo de l'accueil sur toute la largeur sans modifier la hauteur moua, afin de profiter de l'écran. Bon ça masquerait les visages mais je pense qu'ils peuvent être repensés.

12px pour la taille de base ça claque un peu les yeux... au minimum du 14 serait pas mal et du 16px sympa. Ne pas oublier ce que dit Romy :
http://romy.tetue.net/type-size-comparison
Je ne comprends pas ce qui est en haut en gris : je m'attends à un menu avec des pictos + textes mais non ce n'est pas cliquable.
Pour combler les maniaques comme moi cursor:pointer sur .sf-menu a serait mieux.
Manquerait presque une police fun pour un site sur la musique.
L'image de fond, je pense que vous pouvez garder le concept et faire mieux.
Voilà désolé de ne pas avoir plus de temps pour analyser l'ensemble qui est riche en contenu et ça fait du bien.

Zelena a écrit :
Bonjour !

Super photos !

Merci
Ce sont des photos avec accréditations donc je peux rentrer du très bon matos et potentiellement avoir des angles plus libres !

Zelena a écrit :

On se doute que c'est un site sur la musique mais pour trouver la 'raison d'être de ce site', il faut scroller tout en bas... Et elle est un peu perdue parmi tous les éléments du site...

Je pensais la page d'accueil assez clair Ensuite oui dans chaque page de chronique on ne revient pas sur la présentation

Zelena a écrit :

- des onglets sont en bas et chaque fois que je clique sur un, je reviens en haut et je dois rescroller en bas pour voir le résultat de l'action,

je n'ai que deux onglets en bas. Un à droite qui justement sert à remonter en haut de la page et un à gauche qui précise le sommaire. Mon footer est anecdotique en lui même. Je ne comprends pas le comportement que tu constates ! peux tu m'en dire plus ?

Zelena a écrit :

- la barre d'outils des réseaux sociaux qui se met sur le texte

là c'est un choix assumé. j'ai toujours peur de perdre un peu de partage si ça reste uniquement en haut de page. Je peux comprendre que ça dérange. Je peux regarder pour encore plus le coller vers le haut voire tester quelques chroniques sans le suivi de la barre pour voir si ça change quelque chose.

Zelena a écrit :

- dans le bloc 'détails du concert', le texte ne se voit pas assez...

Bonne remarque ! je vais voir ce que je peux faire

Zelena a écrit :

- les titres de paragraphes qui devraient être plus proches de ce qui suit que ce qui précède.

Je n'ai pas vérifié mais il me semble que c'est égal des deux côtés

Zelena a écrit :

C'est sympa, les sites avec du contenu, on sent que vous avez beaucoup de choses à dire, à faire partager. Mais globalement, j'ai une sensation de trop-plein, sans doute dû à un manque de hiérarchisation entre ce qui est important et ce qui l'est moins.

Explique moi cette impression car là c'est important voire crucial. Pour moi tout le contenu est en central et la sidebar, en partie supérieur apporte des informations complémentaires puis plus bas ouvre à d'autres billets. Le contenu central est dense mais chacun avec son titre, et le sommaire au besoin est là. Et, toutes les chroniques sont sur la même base.

Zelena a écrit :

Faites attention avec les lignes de texte trop longues...

Je ne comprends pas ta remarque

Zelena a écrit :

Je ne sais pas ce que ça donne sur mobile mais si je réduis la fenêtre, l'affichage est moins bon...

Le site n'est pas responsive et il faut une largeur minimal pour avoir la page, ce qui est un choix assumé. C'est sur un mobile que l'on a une version mobile. Je suis contre les versions responsive qui sont rapidement des usines à gaz.

Zelena a écrit :

Voilà !

Grand merci pour ce message qui j'espère donnera lieu à une belle discussion !

a écrit :
Le site n'est pas responsive et il faut une largeur minimal pour avoir la page, ce qui est un choix assumé.

Je visualise justement le site depuis un portable et ce n'est pas top en matière de mise en page.
Tu as parfaitement le droit d'exclure toute adaptation dudit site en "responsive", mais ceci me paraît a priori contradictoire avec le soin et l'attention que tu dis vouloir apporter au référencement et à sa visibilité.
L'adaptabilité aux différents périphériques a dépassé le stade du simple effet de mode et les moteurs de recherche, notamment Google, promeuvent lourdement le "responsive"...
Ceci dit, cela reste effectivement ton choix mais, perso, je n'ai pas navigué longtemps sur le site depuis le portable.
Je rejoins par ailleurs Zelena sur la présence envahissante et vite énervante de la barre dédiée aux réseaux sociaux sur la version desktop du site. Toute partie d'une page restant fixe sur l'écran se doit d'être discrète sous peine de perturber l'attention de l'utilisateur.
Perso, c'est le genre de truc qui a tendance à me faire fuir très rapidement, même si le contenu est par ailleurs intéressant. Ne pas oublier qu'à moins d'offrir un contenu totalement exclusif sur le site, les internautes passent rapidement à une autre source d'information à la moindre contrainte...

CAMEO172 a écrit :

je n'ai que deux onglets en bas. Un à droite qui justement sert à remonter en haut de la page et un à gauche qui précise le sommaire. Mon footer est anecdotique en lui même. Je ne comprends pas le comportement que tu constates ! peux tu m'en dire plus ?

Par onglets, j'entends "Chroniques de Concerts", "Chroniques de Concerts" et "Newsletters" qui sont sur la page d'accueil...

CAMEO172 a écrit :

Je n'ai pas vérifié mais il me semble que c'est égal des deux côtés

Le titre se rapporte à ce qui suit, il doit donc être plus proche de ce qui suit...

CAMEO172 a écrit :

Explique moi cette impression car là c'est important voire crucial. Pour moi tout le contenu est en central et la sidebar, en partie supérieur apporte des informations complémentaires puis plus bas ouvre à d'autres billets. Le contenu central est dense mais chacun avec son titre, et le sommaire au besoin est là. Et, toutes les chroniques sont sur la même base.

Difficile d'expliquer sans avoir avoir l'air de parler comme un prof de maquettisme (en moins bien sans doute).

Je vais tenter une image : dans une nuée, tous les oiseaux se ressemblent et le faucon a bien du mal à faire son choix. Qu'un oiseau se détache du lot et le faucon n'a plus de problème. Devant une page (ou un écran), l'oeil est comme un faucon qui a besoin d'une cible. Devant vos pages, j'avais bien du mal à poser mon regard sur un article ou un autre. Les images attiraient mon regard mais pas le texte.

Une autre façon de dire les choses est que ça manque de contraste... (c'est vrai aussi que le texte est un peu petit comme dit Manhattan)

C'est difficile à faire parce que cela suppose faire des choix et dans une équipe, on n'est pas toujours d'accord sur quoi mettre en premier, en second...

CAMEO172 a écrit :

Je ne comprends pas ta remarque

C'est dans 'présentation de l'équipe'.

CAMEO172 a écrit :

Le site n'est pas responsive et il faut une largeur minimal pour avoir la page, ce qui est un choix assumé.

Comment pouvez-vous savoir la taille de mon écran ?

Manhattan a écrit :
J'aurais bien élargi le diapo de l'accueil sur toute la largeur sans modifier la hauteur moua, afin de profiter de l'écran. Bon ça masquerait les visages mais je pense qu'ils peuvent être repensés.

12px pour la taille de base ça claque un peu les yeux... au minimum du 14 serait pas mal et du 16px sympa. Ne pas oublier ce que dit Romy :
http://romy.tetue.net/type-size-comparison
Je ne comprends pas ce qui est en haut en gris : je m'attends à un menu avec des pictos + textes mais non ce n'est pas cliquable.
Pour combler les maniaques comme moi cursor:pointer sur .sf-menu a serait mieux.
Manquerait presque une police fun pour un site sur la musique.
L'image de fond, je pense que vous pouvez garder le concept et faire mieux.
Voilà désolé de ne pas avoir plus de temps pour analyser l'ensemble qui est riche en contenu et ça fait du bien.

je pense avoir agis sur chacun de vos points, sauf le fond et la police car je ne suis pas pour trop de fun

je ne sais pas si Google impose un site responsive mais en tout cas j'estime qu'une version mobile n'est pas uniquement une version bureau réorganisé. C'est pourquoi j'ai préféré avoir une autre solution, un autre thème et un contenu approprié. Ainsi, j'estime prendre en compte les besoins des mobiles.

Que l'agencement sur mobile ne soit pas parfait, c'est possible. Mais je ne veux pas de thème responsive et de toute façon je n'ai pas les compétences pour ça.
Quand je teste sur google speed, google me semble tout à fait content de ma version mobile. J'avoue m'arrêter à cet avis.

Pour la version bureau, de mémoire il faut une largeur d'écran de 950 px minimum. De nos jour ce n'est pas abérant ça doit faire du 13 pouces voire moins avec des écrans fins. C'est un choix que j'assume et sur lequel j'ai basé toute la disposition du site.


J'ai revu la taille de mes boutons partages pour un compromis probable et acceptable. C'est vrai que perso j'en ai l'habitude et ça ne me choque pas mais ce site n'est pas pour moi donc je comprends que trop grand ça soit envahissant



Je suis étonné que les onglets de la page d'accueil renvoie vers le haut de page. Ce n'est pas le comportement que j'ai sur mon navigateur !

J'ai rajouté le titre de la suite à laquelle il se rapporte. C'est en effet visuellement plus probant !

J'ai donc changé la taille de la police de chaque page. Me dire si l'impression de bordel est moins visible.


En tout cas merci pour vos remarques très constructives, je pense y répondre du mieux possible
Modifié par CAMEO172 (18 May 2016 - 15:30)

CAMEO172 a écrit :
je ne sais pas si Google impose un site responsive mais en tout cas j'estime qu'une version mobile n'est pas uniquement une version bureau réorganisé. C'est pourquoi j'ai préféré avoir une autre solution, un autre thème et un contenu approprié. Ainsi, j'estime prendre en compte les besoins des mobiles.

Que l'agencement sur mobile ne soit pas parfait, c'est possible. Mais je ne veux pas de thème responsive et de toute façon je n'ai pas les compétences pour ça.
Quand je teste sur google speed, google me semble tout à fait content de ma version mobile. J'avoue m'arrêter à cet avis.

Pour la version bureau, de mémoire il faut une largeur d'écran de 950 px minimum. De nos jour ce n'est pas abérant ça doit faire du 13 pouces voire moins avec des écrans fins. C'est un choix que j'assume et sur lequel j'ai basé toute la disposition du site.

Pour avoir une idée de l'impact de adaptabilité d'un site sur Google, une simple recherche sur ledit Google avec les mots clés "Google responsive algorithm" devrait suffire à t'éclairer.
Faire un site responsive ne signifie pas pour autant un truc monolithique avec une feuille CSS à rallonge.
Tu peux toujours créer deux versions distinctes, si la maintenance parallèle ne te fait pas peur... Mais dans ce cas il faudra tout de même bien gérer le contenu dupliqué, en apportant un soin particulier aux URL canoniques (cf. règles Google sur le sujet).
Bref, quel que soit le choix que tu fais, le responsive ou, dans le cas présent, l'absence de version responsive, aura un impact sur ta visibilité web.
Après, chacun définit ses priorités et ses besoins.

J'ai testé rapidement la proposition de recherche et plus que des sujets sur "responsive algorithm", les premières réponses (dont 3 des 5 premières chez google même) parle de "mobile- friendliness as a ranking signal".

Sur ce point précis, la solution WP Touch (c'est le plugin que j'utilise) répond parfaitement au besoin avec un affichage sur mobile parfaitement adapté à l'écran Ensuite, oui, les choix esthétiques peuvent être discutable, c'est un autre sujet !
Je ne sais pas si ce choix est atypique mais il est souvent justement mis en opposition d'un système responsive qui de mon point de vue alourdirait le système et se résumerait, en gros, à masquer beaucoup de chose.

Si le squelette est différent, le contenu se résume au juste nécessaire, avec la même adresse URL et donc sans duplicate content !
l'URL canonique est parfaitement défini, au moins sur la version bureau, je ne sais pas si j'ai repiqué ça pour la version mobile.

Bonjour,

Meme chose que Zelena. Quand je clique sur 1 des 3 onglets, je reviens sur le haut de l'ecran.

Par ailleurs, lorsque je clique sur l onglet du milieu, et que j utilise l ascenseur pour aller plus bas, je m apercois un chevauchement en bas de page.

Faut que je creuse cette histoire d'onglet qui remonte. Si vous arrivez à comprendre le phénomène je suis intéressé.

Sous mac et Safari je n'ai pas de soucis. C'est du pur CSS.

Quant au chevauchement, je suis au courant de ce détail. le CSS m'oblige à définir la hauteur de l'onglet et mes deux onglets n'ont pas le même contenu. Je n'ai pour le moment pas réussi à surmonter ce soucis.

L'histoire des onglets qui remonte est de l'histoire ancienne ! J'ai trouvé et réglé le problème.

J'ai également résolu définitivement le soucis de chevauchement en bas de page d'accueil selon l'onglet choisi !

css framework : bootstrap tab
extension : nivoslider
font : font awesone icon ( facilement reconnaissable)

la vrai taille du site est 990 , agrandir le width du navigateur ( ou dezoomer ) montre le décor , la photo en noir et blanc .





dew pour son site blup utilise en mode responsive cette technique d un image autour du site qui s enlève en le réduisant.
#bg { background-image: url(img/bgtop.jpg); }
#wrap { background: url(img/bgfooter.jpg) center bottom no-repeat;}
puis Mediaqueries
@media screen and (max-width: 960px){
#bg { background-image: none; }
#wrap, #zone { background: none;}
}






beaucoups de 950 px alors que le slider est responsive et bootsrap l est aussi
sauf pour la partie présentation ou le texte ne fait pas 950 px de long .en effet ; Il y a un bord a gauche mais pas a droite !!!. Donc en gros on a 970px ( pas vérifié)

dans le tab un grid a span 23 (900px 39.1px/span ) !!
.span-15 { width: 590px;}
.span-8 { width: 310px;}

un footer a 22 span !! 950px ( 43px / span ) je n ' aurrais pas vue la zone news dans un tab puisqu il est le seul qui ne contient pas une liste d'article mais bon pourquoi pas !!

donc plusieurs grid bootstrap dans le site !!
Il doit y avoir une logique que je ne comprend pas actuellement au niveau de la valeur du span et du fait d 'avoir au final un site statique qui utilise un grid dynamique ( bootstrap mobile) !!

Le tabs pose problème au niveau responsive il me semble .
Si on a pour épicerie 2 colonnes , la première contient 1 colonne des 3 derniers articles et la deuxième colonne contient 3 articles précédent .Pourquoi ne pas présenter les 6 ( 3+3) derniers articles et un controleur < > pour naviguer entre la liste des articles 6 par 6 ? . wordpress ou tous les CMS doivent avoir cette fonctionnalités . Quitte a supprimer le tab pourquoi pas un moyen d 'afficher les articles mixant épicerie / chronique de concert avec un filtre et un style différent !!

NB le site alsa au niveau de l upload des images se mélangent les pinceaux lorsque le fichier à un nom très long . J utilise toujours le nom du site puis du post puis mon sujet . La conséquence est que la deuxième image ne s affichera pas , seulement Deux fois la première. si on change le nom de la deuxième image ( on change le début du nom) tout est OK ... en jpg et pas png biensur !!!
Pour être plus précis ; la logique serveur alsa en php est de transformer le nom du fichier en previews/48731-alsaRENDER.jpg donc alsa ne prend en compte que les 9 premiers caractères du nom du fichier image envoyé . Donc si mes fichiers commence tous par les 9 caractères identiques BINGO rien ne marche !!! .. je savais bien qu il y avait un problème . Merci de confirmer ....
Modifié par 75lionel (19 May 2016 - 10:06)

Je me permets de vous soumettre une nouvelle visualisation d'une page de chronique :
http://www.concertsenboite.fr/2016/03/31/chronique-photos-live-louise-attaque


Sur le principe, et cela grâce à vos commentaires dont je vous suis éternellement reconnaissant, voici la liste des changements depuis la semaine dernière :

1) Police plus grande
2) Fonts un peu plus "fun"
3) meilleur séparation du contenu post, pour plus de clarté (c'était vrai que ça faisait gros pavé)
4) réflexion sur la page et ses moyens de navigations : le fil d'ariane est plus mis en avant, le lien vers les billets précédents et suivants ne sont plus dans le corps mais en sidebar.
5) meilleure intégration du "menu" réseau sociaux, bien plus petit quand on descend dans le site et donc moins envahissant : on perd une grosse vingtaine de pixel en haut, ce n'est pas fou fou.
6) J'ai revu en profondeur mes margins et padding ici et là et c'est logiquement plus cohérent et plus harmonieux

Cependant je n'ai toujours pas travaillé (et ce n'est pas au programme) :
1) version responsive : non fondamentale, la version mobile étant tout autre chose et c'est un choix ; testez avec un portable et vous verrez. Je reste donc en version centrale de 615 px + une sidebar pour le bureau, c'est ainsi que je souhaite ce site.
2) pas de grosse modification dans ma charte graphique. Je ne la sens pas désagréable
3) pas eu de remarque sur mes metadata que je pense bien implantés.

voilà..mais j'ai peut-être tout faux

Bonjour,

Rapidement, le site manque de style, on peut même dire qu'il n'y en a pas. Peut-être faut-il envisager de vous faire aider par un spécialiste. Là ça fait vraiment trop bricolé et rafistolé, sauf que dans les grandes lignes, il n'y a pas de grandes lignes justement…

C'est pas sexy !! Template impersonnel et fouillis, polices pas fun et pas modernes (fouillis également), pas structurées (ça manque de contraste dans les tailles), texte confus, manque de simplicité et de structure de la typo (le web design c'est à 90% de la typo et là il n'y a pas de travail de typo, du coup pas de design), manque de respiration, styles qui ne vont pas ensembles. trop de blaba qu'on a pas envie de lire présenté ainsi.

Pas de logo ?? Ça manque pour ce type de blog. Le style du logo indique à lui seul l'identité du site et même la ligne éditoriale…

La Times travaillée ainsi, c'est rédhibitoire. Sans parler de la police de «Une nuit Marseillaise» aussi rock que la dépouille de Jeanne Calment… Ça plus la Times, vous vous mettez vous-mêmes des bâtons dans les roues…
Plus sérieusement, il faut explorer et étudier ce qui se fait et vous documenter, vous former sur ce qu'est le travail de la typographie (ce sont les fondations de votre design). Pour cela, il existe de nombreux livres et références.

Le texte justifié, ça le fait pas. À éviter d'une façon générale et en particulier pour un site rock. C'est pas moderne.

Pour partir sur de bonnes bases, changez de template. Là il y a plus de boulot à tout changer que de tout refaire sur une base propre.
Et pour vous aider, inspirez vous des tendances web actuelles (votre site fait trop daté), et surtout inspirez vous du Style Typographique International (style suisse) qui donnerait un coup de moderne à tout ça :
https://fr.wikipedia.org/wiki/Style_typographique_international
« Il met l'accent sur le dépouillement, la lisibilité et l'objectivité. Les éléments distinctifs du style international sont une mise en page asymétrique, l'utilisation de grilles, de polices de caractères sans-serif comme Akzidenz Grotesk1, et l'alignement à gauche du texte, dont le bord droit est laissé irrégulier. La photographie, souvent en noir et blanc, est préférée aux illustrations dessinées. Bon nombre des premières créations du style international utilisent la typographie, en plus de son utilisation pour le texte, comme élément principal et structurant du design. »
(Wikipédia)

Rien qu'avec ça, vous avez de quoi faire !

Faites quelque chose de plus graphique, de plus aéré, de plus contrasté et déstructuré…

L'image du background de mauvaise qualité et trop envahissante. La forme de cette grosse ombre bouffe le contenu.

Un site pas rock pour le moment, ce qui venir d'un mauvais choix de template à la base ou bien d'un template qui a été trop trafiqué/dénaturé.

Des exemples de sites/blogs musicaux et rock avec p^lus ou moins de style :
(rapidement glanés sur le web)
http://earmilk.com/
http://www.stillinrock.com/
http://www.kitsune.fr/journal/
http://www.clumsybaby.fr/
https://rocknfool.net/
http://www.gorillavsbear.net/
http://www.rockenseine.com/
http://cruelrhythm.tumblr.com/
…

Pas de règles pré-établies, mais il vous faut trouver un style, adopter un ton, une identité. Ce qui demande temps, travail et maturation. Sans cela vous tournerez en rond et finirez par vous lasser.

Voilà pour moi.

CAMEO172 a écrit :
1) version responsive : non fondamentale, la version mobile étant tout autre chose et c'est un choix ; testez avec un portable et vous verrez. Je reste donc en version centrale de 615 px + une sidebar pour le bureau, c'est ainsi que je souhaite ce site.

Vous ne pouvez pas imposer vos choix à vos lecteurs s'ils vont à l'encontre de l'expérience utilisateur. Une version mobile est indispensable pour ce type de site qui cible un public branché et connecté.

CAMEO172 a écrit :
2) pas de grosse modification dans ma charte graphique. Je ne la sens pas désagréable

Quelle charte graphique ?
http://www.definitions-marketing.com/definition/charte-graphique/
https://fr.wikipedia.org/wiki/Charte_graphique

CAMEO172 a écrit :
je ne sais pas si Google impose un site responsive mais en tout cas j'estime qu'une version mobile n'est pas uniquement une version bureau réorganisé. C'est pourquoi j'ai préféré avoir une autre solution, un autre thème et un contenu approprié. Ainsi, j'estime prendre en compte les besoins des mobiles.

La version ordi et la version mobile doivent rester cohérentes en terme de charte et d'identité graphique. Encore faut-il qu'il y ait une identité graphique. C'est l'identité même du site dont il est question, sans cela… difficile de construire quoi que ce soit.

Le mieux serait peut être de choisir un bon template responsive adapté au sujet, et de juste y adjoindre un logo.
Modifié par spongebrain (24 May 2016 - 19:02)

spongebrain a écrit :

Vous ne pouvez pas imposer vos choix à vos lecteurs s'ils vont à l'encontre de l'expérience utilisateur. Une version mobile est indispensable pour ce type de site qui cible un public branché et connecté.
Quelle charte graphique ?
http://www.definitions-marketing.com/definition/charte-graphique/
https://fr.wikipedia.org/wiki/Charte_graphique
La version ordi et la version mobile doivent rester cohérentes en terme de charte et d'identité graphique. Encore faut-il qu'il y ait une identité graphique. C'est l'identité même du site dont il est question, sans cela… difficile de construire quoi que ce soit.
Le mieux serait peut être de choisir un bon template responsive adapté au sujet, et de juste y adjoindre un logo.

Dans la lignée de mes précédents commentaires sur l'aspect (non) responsive du site, je plussoie l'avis de Spongebrain à ce sujet.
Après avoir fait un petit tour pour voir ce qu'était l'extension WP Touch utilisée, j'avoue n'avoir pas été et ne toujours pas être convaincu par ce type de conversion plus ou moins automatique. A ce titre, les avis laissés sur cette extension sont grosso modo, de mémoire, de l'ordre de 50 % pour / 50% contre.
J'avais signalé que le site était particulièrement malaisé à consulter sur mon Nokia (830) et que, du coup, je l'avais quitté très rapidement sans approfondir la pertinence de son contenu.
Il est probable que ce ressenti soit partagé par plusieurs visiteurs et qu'il détourne ceux-ci, bien que les articles mis en ligne soient intéressants sur le fond.
Choix assumé de votre part, c'est noté.
Le choix assumé du visiteur sur portable risque d'être, quant à lui, de se barrer dès la première page.
Si la finalité reste d'accroître le nombre d'internautes accédant au site, c'est a priori dommageable.

sur les 8 sites 2 ne sont pas responsives et pour un 3ème le contenu responsive n'est pas centré ( float vers la gauche) . Donc 25% des sites ne souhaitent pas avoir plus de visibilité . Il me semble qu'actuellement ont est de plus en plus sur des outils en ligne appelé designer .....utilisant boostrap avec sélectionner / glisser . siteground propose avec un partenaire un choix très nombreux de thème. Pour siteground certains themes sont parfois que des déclinaisons au niveau couleurs car basé sur la même structure ( grid , même nombre de colonnes ) et parfois pas responsive. J'etais plutôt contre ces thèmes au début mais après étude ( et une maitrise du frontEnd ) si vous choisissez bien le thème ( livré avec psd + extensions CMS payante , documentation ) ; celui ci peut être intéressant surtout si vous savez le customiser ( avoir au moins déja créer une fois un thème par vous même : design - >découpage -> intégration html -> intégration CMS ) . il faut que j étudie les sites wix mais il est sur que quelques images bien choisies ou retravaillées semblent jouer un rôle important !!

Pour la partie responsive . Le site n'est pas responsive dans le sens ou si on réduit la largeur du navigateur le theme s 'adapte . Ici il semble qu il faut ouvrir la page dans une taille du navigateur fixe et charger le site pour que la structure responsive pour mobile soit active. Ou bien il faut reloader la page après modification de la largeur du navigateur. Pour ce point je trouve le site intéressant du point de vue technique ( je découvre des choses !! ) . A étudier .....mais quelle est la logique /technique utilisée pour se comportement ? Il est vrai que la version mobile n'a rien a voir avec la version desktop au niveau graphique !!! donc pas de charte graphique c'est sur !! ( pas besoin d'être graphiste pour affirmer ça ... je ne suis pas graphiste )

sinon Les points très positif
0- l'organisation du contenu, la qualité des informations ( images et texte) est géniale !!!
1--le site est vraiment optimiser à voir gtmetrix !!
2- le site est mobile ( pas responsive ?! j 'ai un doute ....)





Modifié par 75lionel (24 May 2016 - 23:50)

Bonjour,

je dois avouer que la réponse de spongebrain est un choc ! Mais en étant dans un repère de designer, je n'en attendais pas moins.

Quelques éléments de réponses.

Je suis avant tout un ingénieur et avec mon cursus l'habitude du carré, du droit, du net. Absolument pas designer et encore moins typographe, c'est donc normal que je sois largué. Inversement, mon score à Gtmetrix est tout à fait logique pour moi : il y a un règle compréhensible (par moi) et binaire et je sais alors l'appliquer. Donc oui, ce site est hyper optimisé en requêtes et en optimisation conseillée : la technique je maîtrise !


Pour revenir sur les remarques de spongebrain, si aujourd'hui le changement de thème n'est pas à l'ordre du jour, je tente malgré tout de m'approcher d'un maximum de bonnes manières. Pour tout dire, je veux un site carré où chaque chronique est sur la même base et le même squelette. J'ai peur qu'un style plus moderne fasse fouilli et les exemples communiqués vont dans ce sens de mon point de vue de neophyte designer (ou alors ont clairement si peu de contenu texte que ce n'est pas grave). J'ai clairement beaucoup de texte et c'est voulu. C'est justement ce qui marque la différence avec 99% des sites de photos de concerts plus proche de portfolio ou des simple chroniques de concert sans hierarchie et assez bordélique.

Ainsi quelques changement pour essayer de monter dans l'estime de tous :
- j'ai un peu lu sur la typographie, et j'ai opté pour du sans empattement. Encore hier je ne savais pas que cela existait -> c'est clair que c'est plus lisible mais c'est probablement encore perfectible !
- J'ai revu mon fond d'image qui est passé en petit logo -> C'est en effet plus clair et globalement plus lisible pour l'oeil. Ce petit logo avec d'un côté un photographe et de l'autre une chroniqueuse me semble assez explicite, alors qu'en effet il ne l'était pas en fond d'image.
- J'ai changé mon texte justifié : encore ici une rigueur d'ingénieur alors qu'il ne faut pas voir le mal partout avec un texte à gauche.

Que l'ensemble manque de style, je l'imagine sans mal : ce n'est ni mon métier ni ma grande sensibilité ! mais j'aimerai perdre cette image de fouilli car au contraire tout est clairement dans des petites cases à sa place et on passe d'une chronique à une autre avec la même rigueur et logique (d'ingénieur).


Concernant le côté mobile ou responsive ! Sur desktop, c'est 950 px et basta.

La version mobile est, comme son nom l'indique, uniquement sur mobile (test sur le user agent pour choisir un affichage ou un autre). C'est le contenu photos et chronique avant tout sans trop de fantaisie.
Je n'ai jamais vu le site sur Nokia. Sous Iphone, c'est correcte, facile d'accès et c'est confirmé par google qui estime à 100% l'expérience utilisateur. Il y a évidemment un travail de cohérence avec le site desktop, je l'envisagerai plus tard.