3246 sujets
Critiques de vos sites: code et design
Bonjour,
2-3 premiers points en m'intéressant plus au code qu'à l'organisation de l'information :
Il n'y a pas de titre sur la page d'accueil et le h1 qu'il y a c'est du n'importe quoi "Informations associées à cette page". Pas visible à l'écran apparemment. Il faudrait une hiérarchie composée de ce que tu considères être comme des titres. Dans la page Assainissement, ce mot est un h1, très bien, ensuite voir s'il y en a d'autres (d'autres titres de même niveau ou des sous-titres dans le contenu et dans ce cas pas directement des h3 mais après un h1 vient un h2 puis s'il y a un sous-sous-titre alors un h3
).
Mieux vaut commencer par les pages de second niveau et de contenu que la page d'accueil, c'est plus dur parce qu'elle regroupe plein de contenus souvent de manière lapidaire ...
Il y a 2 tonnes d'attributs style, de CSS en ligne dans le code HTML : là il y a un gros travail de séparation du contenu et de sa présentation. Idéalement, tous les styles devraient être dans une feuille de style, quitte à rajouter des id/class pour cibler les éléments y compris dans IE6/7 s'il le faut (joie des administrations
).
Ce qui est acceptable, c'est de trouver dans le DOM (pas dans le code source, donc) des @style :
- générés en JS (display: none et block;) et encore ça peut se faire en rajoutant/enlevant une classe sur un élément, cette classe étant stylée par un display: none / block; ,
- on peut en avoir besoin sur des messages d'erreur de formulaire,
bref des cas particuliers mais sinon à virer. C'est un cauchemar pour maintenir un site ...
Après ça va dépendre du CMS ; s'il n'a pas de système de gabarit / template à la WordPress / SPIP / Joomla! / Drupal tu es mal
Envisager un changement de CMS s'il est monolithique.
Tu peux auditer toi-même la qualité du site (maintenant, pendant et après ton intervention, enfin tout au long de la vie du site) grâce à la über checklist Qualité web d'Opquast : https://checklists.opquast.com/opquastv2
Et ton site est un bon candidat à la pré-liste Accessibility First Step (et second Step ? Juste une séparation entre les "erreurs manifestes" et les "warnings, avertissements, erreurs probables mais pas certaines" si j'ai bien compris) https://checklists.opquast.com/workshops/
Modifié par Felipe (25 May 2012 - 12:00)
2-3 premiers points en m'intéressant plus au code qu'à l'organisation de l'information :
Il n'y a pas de titre sur la page d'accueil et le h1 qu'il y a c'est du n'importe quoi "Informations associées à cette page". Pas visible à l'écran apparemment. Il faudrait une hiérarchie composée de ce que tu considères être comme des titres. Dans la page Assainissement, ce mot est un h1, très bien, ensuite voir s'il y en a d'autres (d'autres titres de même niveau ou des sous-titres dans le contenu et dans ce cas pas directement des h3 mais après un h1 vient un h2 puis s'il y a un sous-sous-titre alors un h3
).Mieux vaut commencer par les pages de second niveau et de contenu que la page d'accueil, c'est plus dur parce qu'elle regroupe plein de contenus souvent de manière lapidaire ...
Il y a 2 tonnes d'attributs style, de CSS en ligne dans le code HTML : là il y a un gros travail de séparation du contenu et de sa présentation. Idéalement, tous les styles devraient être dans une feuille de style, quitte à rajouter des id/class pour cibler les éléments y compris dans IE6/7 s'il le faut (joie des administrations
).Ce qui est acceptable, c'est de trouver dans le DOM (pas dans le code source, donc) des @style :
- générés en JS (display: none et block;) et encore ça peut se faire en rajoutant/enlevant une classe sur un élément, cette classe étant stylée par un display: none / block; ,
- on peut en avoir besoin sur des messages d'erreur de formulaire,
bref des cas particuliers mais sinon à virer. C'est un cauchemar pour maintenir un site ...
Après ça va dépendre du CMS ; s'il n'a pas de système de gabarit / template à la WordPress / SPIP / Joomla! / Drupal tu es mal
Envisager un changement de CMS s'il est monolithique.Tu peux auditer toi-même la qualité du site (maintenant, pendant et après ton intervention, enfin tout au long de la vie du site) grâce à la über checklist Qualité web d'Opquast : https://checklists.opquast.com/opquastv2
Et ton site est un bon candidat à la pré-liste Accessibility First Step (et second Step ? Juste une séparation entre les "erreurs manifestes" et les "warnings, avertissements, erreurs probables mais pas certaines" si j'ai bien compris) https://checklists.opquast.com/workshops/
Modifié par Felipe (25 May 2012 - 12:00)
Salut et merci pour ta réponse,
Le h1 de la page d'accueil que tu a évoqué sert pour l'impression, qui a son propre style de mise en page. Concernant le titre de la page d'accueil, il est bien présent, ou alors je n'ai pas bien compris. Peut-être suggères-tu que le titre de la page d'accueil soit dans un <h1> ? Ce qui n'est pas le cas actuellement.
Pour le CSS dans le HTML effectivement les 2 ne sont pas toujours bien séparés, mais comme tu dis ça représente un sacré travail
Sinon le site n'est pas construit avec un CMS, c'est du fait main avec une BDD MySQL, je suis mal donc
. Il y a quand même une petite interface admin qui a été développée et qui est relativement utile.
Je ne connaissais pas opquast, merci pour le lien. Cela m'a l'air relativement intéressant: j'ai lancé un audit, il y a certaines choses à améliorer . Je jetterai aussi un œil à la liste des bonnes pratiques.
Modifié par Antonio (05 Jun 2012 - 08:45)
Le h1 de la page d'accueil que tu a évoqué sert pour l'impression, qui a son propre style de mise en page. Concernant le titre de la page d'accueil, il est bien présent, ou alors je n'ai pas bien compris. Peut-être suggères-tu que le titre de la page d'accueil soit dans un <h1> ? Ce qui n'est pas le cas actuellement.
Pour le CSS dans le HTML effectivement les 2 ne sont pas toujours bien séparés, mais comme tu dis ça représente un sacré travail
Sinon le site n'est pas construit avec un CMS, c'est du fait main avec une BDD MySQL, je suis mal donc
. Il y a quand même une petite interface admin qui a été développée et qui est relativement utile.Je ne connaissais pas opquast, merci pour le lien. Cela m'a l'air relativement intéressant: j'ai lancé un audit, il y a certaines choses à améliorer
. Je jetterai aussi un œil à la liste des bonnes pratiques. Modifié par Antonio (05 Jun 2012 - 08:45)