Bonjour,

je suis en pleine refonte de mon site perso.

Celui-ci a pour but de présenter mes " créations " et mes compétences à de futurs employeurs.
Bien sûr il n'est pas finalisé du tout, seul la page d'accueil et la page " ReadStation" son faite, mais celle-ci serait la base de toutes les pages ( je souhaite construire les autres pages sur le même modèle )

Je viens ici afin d'avoir des retours constructifs sur le choix du design, de l'ergonomie, de la qualité du code. Suis-je dans la bonne voie ?

Je ne vise pas une carrière développeur, mais de chef de projet ( web ) Smiley smile

http://www.alexandreblin.com

page "type"
http://www.alexandreblin.com/readstation.html

Merci d'avance Smiley biggrin
Modifié par zeeberde (10 Jun 2013 - 17:04)
Bonsoir,

Très rapidement je manque de temps Smiley cligne

Vous utilisez des balises HTML5 avec un dotcype XHTML 1.0 Transitional.

Quelques erreurs au niveau du code.

Le target_blank est insupportable...

Vous chargez deux fois jQuery (version 1.5 et 1.6.4 (en milieu de doc...)) nous en sommes à la 1.9 de mémoire.
(js à placer avant la balise de fermeture du corps de document peut-être ?)
À ce propos, plus d'image lorsque JavaScript est désactivé ? Plus d'informations ?
Cela doit continuer à fonctionner, quelques soit la technique utilisée (même s'il y a une légère dégradation de l'information proposée, cette information doit rester accessible).

Cela manque d'ailleurs un peu d'informations/Explications, si pour X raisons, je ne peux pas charger les images (et elles peuvent être nombreuses ces raisons) votre site semble cruellement vide.

Mosaic.js, c'est pour l'effet slide sur les images ? Ça se fait très bien en CSS Smiley cligne

L'image du logo doit se trouver dans le code HTML, avec une alternative textuelle cohérente, en aucun cas dans votre feuille de styles, et d'une manière générale, toutes les images doivent avoir une alternative textuelle (même vide).
J'aurai bien vu un peu de couleur sur ce logo (au survol peut-être ?), mais c'est un avis subjectif Smiley cligne
La navigation clavier manque cruellement de repérage dans la page, je ne sais pas où je me trouve.

Pas de version "mobile" ?
Je n'ai testé que sur iPad, et ça ne "fonctionne" pas bien, c'est étrange au regard des travaux que vous exposez Smiley ohwell

J'aime bien l'ambiance minimaliste, mais les images prennent (selon moi) vraiment beaucoup de place, et dénature un peu cet esprit, ça fait "masse" et manque un peu "d'aération".
Ce n'est réellement pas la chose la plus facile à faire et cela demande sans doute plus de travail Smiley cligne

J'ai bien conscience que la critique est difficile à recevoir, surtout lorsque l'on présente un projet personnel, mais cela ne reste qu'un avis "balancé" (trop) rapidement, et je suis loin d'être un expert en la matière.

Il reste un peu de travail, d'autres avis à recevoir, ne vous découragez pas !
Bon courage Smiley cligne
Pour un site qui doit etre un portfolio, cela ne serait pas mal d'inserer des microformats schema.org, et de lier le tout avec un compte G+.

Il y a des lacunes, mais au niveau code, je trouve cela globalement propre, cela va être facile d'obtenir un bon rapport text/code (important pour le réferencement). Par contre, tout les textes sont hidden et ça google deteste.

C'est tres a la mode d'avoir des sites super pure, avec presque que de photos, mais il faut se mefier du referencement. Le plus beau site du monde, sans visiteurs, reste un site sans visiteurs.

Pas de pierre, pas de palais.
Pas de palais ... pas de palais

On me cite souvent l'exemple d'Apple. C'est vrai qu'avec le même budget pub, je m'empresserais de virer les textes.

Sur la page readstation, les photos ne sont pas toutes de la meme taille. Soit on aligne, soit on desaligne franchement, entre les deux, ca fait bancal.

Tant qu'a aller dans ce style tres epuré, il y a un beau challenge. S'inspirer des pages du nouveau MacPro (Une tuerie)

Je note l'absence d'un feuille de style print

sinon, bien, c'est encourageant
Merci kolok et 6l20 pour vos retours.


kolok quand vous dites " tous les textes sont hidden " vous voulez parler du logo qui par exemple est en text-indent : -9999px; ?

Merci pour cette analyse bien complète et les astuces ( adieu mosaic JS ^^ )malgré le manque de temps 6l20 ^^

Merci bcp Smiley smile