Bonjour,
Pour le design... On voit que tu n'es pas designer ; ce n'est pas moche, mais ce n'est pas vraiment joli non plus - ça passe.
Pour les répétitions:
a écrit :
Adopter une démarche de conception centrée sur l'utilisateur garantira la satisfaction des utilisateurs.
En remplaçant "des utilisateurs" par "ceux-ci", ce serait moins lourd.
Attention que la notion de "copyright" n'est pas applicable au droit français. Il vaut mieux indiquer "Tout droits réservés".
Sinon, pour le code :
* La meta keyword ne sert plus vraiment aujourd'hui (à part pour aider google à placer ses pub contextuelles, que tu n'utilises pas) et peux donc être oubliée.
* Il faut te limiter à une seule feuille CSS ! 11 c'est tout simplement aberrant. Que tu ai plusieurs feuilles en "dev" chez toi, pour t'organiser est ton choix ; mais en "prod" il faut les combiner, comme l'a déjà signalé SuperMerguez.
* Même chose pour les scripts JS, qu'il est d'ailleurs préférable de placer en bas de page (sauf chargement asynchrone).
* Attention à bien indiquer la langue du document et les changement de langue (lang="fr" sur html et sur lang="en" tout élément contenant du texte en anglais).
* Title n'est pas un attribut obligatoire des liens. Au contraire, il est rarement nécessaire et peut être gênant. Title ne doit être utilisé sur les liens que s'il apporte une information suplémentaire à l'intitulé du lien
ET nécessaire à la navigation du visiteur. Sur tes liens de changement de langue, le alt de l'image est l'intitulé ; le title est donc de trop.
* Il serait bien de détailler l'acronyme IHM ailleurs que dans ta meta description. Ce n'est pas parlant pour tout le monde (surtout pour ceux habitués à la terminologie anglaise).
* Les br dans ton slideshow n'ont pas lien d'être (donner une largeur à ton <p> serait aussi efficace) et peuvent être gênant pour une navigation "sans écran".
* Les alt sur les image du slideshow n'apporte rien, au contraire. Alt est un attribut obligatoire, mais il peut rester vide.
* Ce code sert à quelquechose ?
<div class="slidetabs">
<a href="#" class=""> </a>
<a href="#" class=""> </a>
<a href="#" class=""> </a>
</div>
* Pour ton menu contextuel, dans "compétences", si tu places les "side-title" dans des li, alors, il est inutile de créer deux listes, une seule suffit.
* Ta hiérarchie des titres n'est pas correcte, tu passe de h1 à h3 (page "Maquettage") ou de h2 à h6 (page "Portfolio"). La hiérarchie des titres ne doit pas comporter de "sauts" descendants.
* Tes <p><span class="green-arrow">...</span><br /> sont des titres de sections.
* Un <a> vide est un lien inopérant (pour certains) : <a target="_blank" title="Profil LinkedIn" id="linkedin" href="http://www.linkedin.com/pub/david-chapon/2b/743/3b8"><div></div></a> Une image porteuse de lien doit TOUJOURS se trouver dans le code HTML et non en image de fond !
* Le target blank, c'est une bonne technique pour perdre des visiteurs (et ce n'est pas ergonomique)
* Protège ton formulaire de contact. Ce n'est pas normal qu'on puisse envoyer un message vide
Pour l'ergonomie :
* Tiens, la navigation au clavier est impossible (la faute à outline: none)... C'est je pense une des pires erreurs d'ergonomie possible !
* Attention, même si la plupart de tes visiteurs comprendront, les drapeaux de la France et du Royaume-Uni pour représenter le français et l'anglais ne sont pas forcément un bon choix.
* Ton menu "Compétence" pointe sur une section "l'ergonomie, c'est quoi", personnellement, je m'attendais à un aperçu de tes compétences, de leur niveau de maitrise (un bout de CV, en gros).
* Dans ton portfolio, les légendes des maquettes présentées sont illisibles. Il serait plus judicieux de les placer sous les images.
En gros, une base en HTML correcte, mais à améliorer. Pour l'ergonomie, ton site ne prend pas beaucoup de risques, mais tu arrives quand même à tomber dans des pièges, fais-y attention !
Bonne continuation.