[Pro, mais perso] profession-integrateur-xhtml-css.fr

Salut à tous,

En ce 2000ème message, selon le compteur, je me permets de présenter un autre de mes sites personnels (un projet qui me hantait l'esprit depuis un bon bout de temps), pour lequel j'ai décidé de m'amuser non seulement avec les CSS 3, mais surtout avec le HTML 5, tout en tâchant d'illustrer le principe de dégradation élégante.

L'ensemble est, en principe, valide HTML 5, avec un zeste d'ARIA pour les aides techniques et beaucoup de responsive Web design (testé, notamment, avec un iPhone, un iPad, un mobile Symbian et une tablette Android).

Le tout est consultable sur http://profession-integrateur-xhtml-css.fr pour nourrir vos critiques.

Je ne dirais que ce qui me saute au yeux instantanément :

La police : "EI, EIRL, EURL, SASU" est illisible

Le titre principal "Profession intégrateur (X)HTML / CSS" on dirait à la fin que s'est marqué "HTMU CSS" car le L est collé au slash

Le contenu central n'est pas centré (augmenter la marge gauche) et dans les pages à propos et liens utiles par exemple le contenu est trop collé sur la gauche.

Voilà ce qui m'a choqué directement ^^

Bonjour,

Pour compléter ce qui à été dit, je trouve également la police choisie peu lisible (principalement sous Google Chrome)

Le gros message lorsque l'on utilise IE7 me semble un peu "élitiste". Autant, pour IE6 je comprend tout à fait, mais IE7 est quand même encore pas mal utilisé.

Au niveau du code, j'ai survolé rapidement, et je n'ai rien vu qui m'a choqué, et comme il est valide w3c, ça me semble bon.

Dans les petite "détails", selon le navigateur, le rendu de la taille de police varie (pour les titres) et sous mon IE (8) en plein ecran, on lit "Profession intégrateur (X)" <à la ligne> "HTML / CSS". Un intégrateur X, ça fait un peu tendancieux

C'est tout pour l'instant

Romain.E a écrit :
IE7 est quand même encore pas mal utilisé.

Source ?

Romain.E a écrit :
sous mon IE (8) en plein ecran, on lit "Profession intégrateur (X)" <à la ligne> "HTML / CSS". Un intégrateur X, ça fait un peu tendancieux

Je n'ai pas ce problème, de mon côté.

Salut Victor

Lobster est effectivement difficile à lire pour les titres. Les obres portées sont un peu massives à mon gôut.
Le footer me dérange (gros pavé noir)
J'adoucirais les dégradés, notamment dans le pavé "portage salarial".
J’augmenterais légèrement les paddings de la zone de texte (pour aligner avec le header)
Sur un grand écran, on voit une rupture nette en bas, à cause de la répétition du dégradé.
Initiative sympathique en tout cas.

Romain.E a écrit :
Le gros message lorsque l'on utilise IE7 me semble un peu &quot;élitiste&quot;. Autant, pour IE6 je comprend tout à fait, mais IE7 est quand même encore pas mal utilisé

Je pense que c'est un choix à assumer sur ce genre de site : soit on prend le partie de savoir quel public on cible et on se permet de ne pas prendre en charge certains navigateurs obsolètes ; soit on le rend 100% compatibles pour montrer qu'on est capable de le faire.

Et comme Victor, je préférerais opter pour le 1er choix.

paolo a écrit :
Lobster est effectivement difficile à lire pour les titres. Les obres portées sont un peu massives à mon gôut.

J'ai réduit l'écart des ombres portées.

paolo a écrit :
Initiative sympathique en tout cas.

Merci.

Victor BRITO a écrit :

J'ai réduit l'écart des ombres portées.

Le problème c'est que Lobster est une police de type "script" et que donc les mots en capitales sont illisibles (comme toutes les polices de ce genre).
Modifié par Patidou (15 Nov 2011 - 14:02)

Patidou a écrit :
Le problème c'est que Lobster est une police de type "script" et que donc les mots en capitales sont illisibles (comme toutes les polices de ce genre).

Je viens d'y remédier en faisant joujou avec les transformations textuelles en CSS pour les titres.

Victor et Romain.E

Non rien de rien... non regardez donc ce lien:



@victor: y a un problème avec les rubriques flux atom et plan du site.

EDIT:

a écrit :
En ce 2000ème message

Modifié par jmlapam (15 Nov 2011 - 16:51)

jmlapam a écrit :
y a un problème avec les rubriques flux atom et plan du site.

Quel problème ? Peux-tu développer ?

Moi je suis choqué par tout ! intégrateur HTML et le site ne semble respecter aucune des normes ergonomiques de nos jours.

La couleur de fond bleu / vert, une largeur de 800px, des polices style année 60 illisibles, un contenu vraiment pas attractif. Bizarre comme site en tout cas, je n'adhère absolument pas.

vincentD83 a écrit :
Moi je suis choqué par tout ! intégrateur HTML et le site ne semble respecter aucune des normes ergonomiques de nos jours.

La couleur de fond bleu / vert, une largeur de 800px, des polices style année 60 illisibles, un contenu vraiment pas attractif. Bizarre comme site en tout cas, je n'adhère absolument pas.

Eh bien moi je trouve au contraire l'ergonomie très bonne : simple, et sans fioriture. Inutile de réfléchir, on comprends la navigation et les fonctions du premier coup. La lecture est facile et agréable avec un bon contraste des couleurs et des espaces blancs assez bien utilisés. Bref, je trouve le tout très agréable.
Modifié par jb_gfx (15 Nov 2011 - 21:13)

C'est sûr qu'avec aussi peu de contenu, ça peut être simple !
Comprendre la navigation pareil ...

J'adore l'ergonomie de ce site : http://perdu.com/

Tu connais la différence entre un troll et un troll velu ?
Une séance d'épilation.

Moi non plus j'adhère pas du tout à ce site... Quand je vois ce qui se fait aujourd'hui genre <a href="http://960.gs/>ça</a>...

La police est illisible mais ça je suis pas le seul à le dire.
La couleur fait vraiment vieillotte (genre site des années 90-00).

Si la justification du texte porte encore à discussion, l'indent est lui de rigueur...

Je suppose que c'est une véritable volonté de ne pas mettre d'image?

Le site n'est pas du tout orienté "blog" alors pourquoi mettre "Publié le 15 novembre 2011, par Victor Brito" ? surtout le "Victor Brito" est inutile.

Dans la barre de droite, on apprend que tu cherches un job...ok...pas de CV, pas de lien...?

Bonjour,

Moi ergonomiquement parlant ce qui me choque un peut c'est qu'il n'y a pas d'effet au survol des liens du menu, ils ne sont pas très affordants. Mais c'est clair que pour le reste ça semble très bien.

Par contre ce n'est pas parce que c'est ergonomique que c'est plaisant à lire, on dirait que les textes ont été positionner de façon arbitraire. L'aspect général du contenu des pages donne une impression de travail inachevé.

D'un côté on dirait que tu veux mettre en avant le contenu et que tu as décidé de laissé de côté le design mais de l'autre on dirait que tu veux quand même «faire joli» en mettant du Lobster. C'est le seul élément graphique de la page, ça en fait une incohérence et renforce cet effet brouillon.

Les couleurs c'est subjectif mais je n'accroche pas du tout. Ça fais très vieux OS, je crois même que le fond d'écran de base de win95 c'est ce vert là.

Bonne continuation

Gili a écrit :
Je crois même que le fond d'écran de base de win95 c'est ce vert là.

Je me suis fait la même réflexion.

Je n'ai pas fait un tour complet des sources de la page, mais de ce côté ça a l'air très bon. Par contre c'est vrai que l'aspect de l'ensemble est très spécial... Disons que je ne pense pas que je vais te confier le choix des couleurs pour les peintures de ma maison L'ensemble est assez austère et peu lisible, à cause du choix de police, du positionnement des textes, et les contrastes sont trop importants.

Yvan L. a écrit :

Je me suis fait la même réflexion.

Je n'ai pas fait un tour complet des sources de la page, mais de ce côté ça a l'air très bon. Par contre c'est vrai que l'aspect de l'ensemble est très spécial... Disons que je ne pense pas que je vais te confier le choix des couleurs pour les peintures de ma maison L'ensemble est assez austère et peu lisible, à cause du choix de police, du positionnement des textes, et les contrastes sont trop importants.

Ça tombe bien, Victor n'est ni décorateur ni web designer...

Salut Victor,

Gili a écrit :
Moi ergonomiquement parlant ce qui me choque un peut c'est qu'il n'y a pas d'effet au survol des liens du menu, ils ne sont pas très affordants. Mais c'est clair que pour le reste ça semble très bien.

Oui, c'est sûr. Là, il y a un gros problème ergonomique (qui rejoint d'ailleurs l'accessibilité des contenus)… J'imagine que c'est un oubli de la part de Victor

Gili a écrit :
Par contre ce n'est pas parce que c'est ergonomique que c'est plaisant à lire, on dirait que les textes ont été positionner de façon arbitraire. L'aspect général du contenu des pages donne une impression de travail inachevé.

D'un côté on dirait que tu veux mettre en avant le contenu et que tu as décidé de laissé de côté le design mais de l'autre on dirait que tu veux quand même «faire joli» en mettant du Lobster. C'est le seul élément graphique de la page, ça en fait une incohérence et renforce cet effet brouillon.

Oui, c'est clair, on le voit bien sur le positionnement des éléments de contenu : vu la largeur de la colonne principale, les paragraphes devraient être justifiés, et surtout il ne devraient pas être si collés aux bords de leurs conteneurs. Ça manque de grille, de gouttières franches (elles ne sont d'ailleurs pas égales d'un côté par rapport à l'autre…) !

Je suis par ailleurs d'accord avec les intervenants précédents : quitte à fournir un site simple niveau design, la police utilisée pour les titres est clairement de trop et pas du tout adaptée. Mieux vaudrait utiliser un bon vieil arial qui serait bien plus pertinent. Là, on a un décrochage entre une partie (les titres) et le tout (la forme du site dans son ensemble). Et dans tous les cas, il y a plein de soucis de cohérence graphique de l'ensemble : par exemple, les titres n'ont pas tous le même type d'ombre portée (ceux de la colonne latérale n'en ont pas).

On se pose tout de même enfin la question du choix des couleurs utilisées… Ce n'est pas très trendy, c'est clair, mais surtout il y a un gros manque de cohérence entre les différentes parties du site : fond, blanc des contours, bleu du menu, noir du fil d'ariane, fond du site plus blanc des contenus dans la colonne latérale, et sans parler du noir du pied de page… Ça fait un peu site de vieux dév Je te conseille de te trouver un pantone sur Kuler ou autre pour te faire une base exploitable.

Pour ce qui est du code HTML/CSS, rien à redire pour l'instant, évidemment
Modifié par audrasjb (15 Nov 2011 - 23:02)