Salut,
Deux solutions pour ton footer :
1. Soit tu mets à body une couleur de background de #333; et sur #main-content tu mets #f0f0f0;
2. Soit tu "fixes" ton footer en bas : http://www.emmanuelbeziat.com/blog/un-site-qui-prend-toute-la-hauteur-disponible/
Sinon, j'ai pas grand chose à redire, c'est bien fait. J'aime bien ton choix d'utiliser foundation plutôt que bootstrap.
J'ai checké sur mon portable, voici quelques problèmes relevés :
1. Footer qui dépasse : http://img106.xooimage.com/files/c/c/0/footer-456de19.jpg
2. Colonnes à revoir (à mettre en ligne, en fait) : http://img109.xooimage.com/files/a/2/2/colonnes-456de0b.jpg
3. Page trop large, scrollbar horizontale apparaît : http://img100.xooimage.com/files/1/d/4/scrollbar-456de26.jpg
Regarde également le logo, il sort assez mal sur mobile ; Essaie de gérer ça, même si c'est pas bien grave (c'est toujours un plus). Pour t'aider : http://lab.goetter.fr/post/72081036577/tests-charger-les-bonnes-images-en-responsive
Rien à dire sur le code, il est propre, valide... Éventuellement, .container-top-bar devrait sémantiquement être une balise header. Essaie peut-être de rajouter les attributs role le cas échéant (j'ai pas trouvé de lien intéressant, pour le coup). Même si c'est accessoire, c'est un plus si tu connais le principe (et donc que tu l'appliques).
Bug: Ton logo ne pivote pas sous Chrome (j'ai pas cherché pourquoi)
Un travail doit être fait sur les performances : http://gtmetrix.com/reports/maximebertonnier.fr/QXWXn6yr
Voilà de quoi t'aider un peu : http://sevenpixels.com/tips
Le mieux sera de fusionner au maximum quelques fichiers CSS (compressés), par exemple foundation.css et fontawesome.css. Plutôt que d'utiliser Google fonts, héberge la typo toi-même, et mets le CSS correspondant dans style.css : ça fait déjà 2 requêtes http au lieu de 3 + 1 externe. Idem pour le JS, tu peux facilement fusionner les trois fichiers du bas de page.
Voilà d'autres points à compléter au mieux : https://www.dareboost.com/fr/report/5365134be4b071633cbc6378
http://www.woorank.com/fr/www/maximebertonnier.fr
Fais gaffe que tu mets lang="en" sur ton html alors que ton site est en fr.
Petits ajouts à faire selon moi :
- Page 404 personnalisée
- url rewriting pour avoir .html au lieu de .php :
RewriteCond %{THE_REQUEST} (.*)\.html
RewriteRule ([^.]+)\.html$ /$1.php [L]
Tout ce que tu as à faire, c'est indiquer .html dans tes liens de navigation, et ça fonctionne.
- Ça manque un peu "d'animation" tout ça. Une transition légère, de l'ordre de 0.1s ou 0.2s, sur des liens ou des éléments animés, ça donne une illusion de fluidité appréciable. Par exemple la rotation du logo, ou le surlignage du menu. Checke sur le mien si ça peut te donner une idée http://www.emmanuelbeziat.com/
Voilà. En résumé : Bon site, bien foutu ; ça vaut le coup que tu fignoles à fond. ;)
