Suivez les fils RSS
 

Des livres incontournables pour tout maîtriser

  • CSS avancées - vers HTML5 et CSS3
  • HTML5
  • CSS2
  • PHP5 avanc�
  • Memento MySQL
  • Memento CSS 3
  • Memento XHTML
  • WordPress 3 100% pratique
  • jQuery et jQuery UI
Rechercher dans le sujet :
Forum
» Critiques de vos sites: code et design
» [Amateur]-http://mounir-bennacer.franceserv.com
Auteur
xorcist
#
Citer
11 Posts
 Bonjour tout le monde,

J'ai crée un site web que je devrais mettre en avant pour trouver un contrat pro, il est terminé à 70% on va dire, le formulaire ne fonctionne pas pour le moment et j'ai pas trop d'idée de mise en forme.

Donc je vous demande de critiquer mon site, code, design etc et soyez sévère s'il vous plait, toute les critiques seront constructives pour ma part smile

Mon site web
Modifié par xorcist (20 Jan 2012 - 15:39)
^
pchlj
#
Citer
Just do it !
327 Posts
 salut..

pas trop le temps pour le moment... mais au moins j'ai rapidement jeter un coup d'oeil...

La première chose.... il te faut des cours d'orthographe !!!!!

Pour le reste je reviendrai plus tard... cligne

http://www.phil-good-media.com 
^
xorcist
#
Citer
11 Posts
 t'abuse, je commence déjà à transpirer ... sweatdrop

^^
^
fufu
#
Citer
@ycostes
161 Posts
 Bonjour Mounir,

Rapidement aussi,
l'ensemble manque de peps, mais vraiment pas grand chose.
Tu es parti sur un système grille, je ne peux qu'approuver, pour une première réalisation en tout cas, tu abordes la chose avec les bons réflexes.

Coté Css, tu perds du temps, exemple ton menu : 
<header id="nav_head" >
          <nav id="menu_top" class="grid_12">
            <ul class="nav">
              <li><a href="index.php">Accueil</a></li>
              <li><a href="index.php?p=formation">Formation</a></li>
              <li><a href="index.php?p=realisations">Réalisations</a></li>
              <li><a href="index.php?p=experience">Experience</a></li>
              <li><a href="index.php?p=contact">Contact</a></li>
              <li><a href="index.php?p=apropos">A propos</a></li>
            </ul>
          </nav>
          <hr>
        </header>


Pourrait aisément devenir 
<header id="nav_head" >
          <nav class="grid_12">
            <ul>
              <li><a href="index.php">Accueil</a></li>
              <li><a href="index.php?p=formation">Formation</a></li>
           ...
            </ul>
          </nav>
          <hr>
        </header>


et tu attaques l'ensemble via ton id #nav_head
exemple : 
#nav_head nav ul li a { pouetpouet: prout;}


Mais ce n'est que de l'optimisation.

je repasse plus tard pour le reste.
L'expérience, ce n'est pas ce qui arrive à quelqu'un, c'est ce que quelqu'un fait avec ce qui lui arrive. (Aldous Huxley)
http://ycostes.net 
^
Gili
#
Citer
432 Posts
 Salut,

Benh franchement ... pour un premier essai c'est plutôt réussi (je parle au niveau du code et du respect de la sémantique).

Au niveau design personnellement je n'accroche pas trop mais c'est une remarque tout à fait subjective. Ce qui l'est moins par contre c'est le rythme de ton texte. Ou plutôt l'absence de rythme.

Je m'explique; dans la page d'accueil par exemple, dans la partie « Parcours » il n'y a pas de partie qui ressort du lot. Je veux dire par là que le titre « Formation » aurait du se trouver plus près de son contenu. Là il est à égal distance de son contenu et du contenu du haut, résultat tout se mélange un peu. Tu m'as compris ? (Si oui félicitation !^^). Si tu veux une approche plus théorique de ce que je te raconte je te conseil d'aller te renseigner sur la loi de Gestalt et plus particulièrement la loi de la proximité. C'est fort pratique d'avoir ça en tête quand on conçoit des design et qu'on tend vers une approche un minimum ergonomique. De plus ça facilite la lecture. Ce problème revient ponctuellement sur le site.

Un autre problème visuel (et ergonomique) est que tes liens (par exemple « Lire la suite ») sont sur le même plan visuel que ton texte de labeur. Résultat quand on regarde la page on ne sait pas ce qui est cliquable et ce qui ne l'est pas. De plus il n'y a pas non plus de hover sur ceux-ci ce qui renforce ce manque d'affordance.

Pour continué sur la visibilité je vais faire une critique qui est totalement subjective mais qui me semble pertinente et qui n'est malheureusement pas pris en compte par les webdesigner (c'est tout à fait le contraire même).

Le corps de ta police est en 13px, je sais pas pourquoi mais les webdesigner trouvent que plus c'est petit, plus c'est classe. C'est à discuter. Mais ce que je me dis c'est que les résolutions sont de plus en plus grandes et la contrainte de mettre du texte en petite taille n'a plus lieu d'être aujourd'hui. Nous pouvons enfin faire des sites aérés et lisibles en profitant d'une police avec un corps un peu plus grand. D'une part ceux qui ont une petite résolutions pourront profiter d'une police pas trop dégueu, et les grandes résolutions ne devront plus plisser les yeux afin de déchiffrer ce qui est écris. Les périphériques évoluent et je pense que le design doit suivre la tendance. Enfin voilà pour la remarque totalement subjective.

Sinon au niveau du code, tu peux enlever :
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">

Plus besoin de ça en HTML5 de plus tu défini déjà ton charset la ligne plus haut. Google ne prend plus en compte les meta keywords mais je sais pas pour les autres moteur de recherche. Tu pourrais largement rassembler tout tes fichiers CSS en un seul ça t'éviterai des requêtes inutiles.

Si tu veux un référencement optimal tu dois mettre un title et une description différente à chaque page.

En espérant t'avoir fourni quelques pistes smile
Modifié par Gili (20 Jan 2012 - 12:55)
N'importe quoi, n'importe quand, n'importe où, et sans la moindre raison.
http://www.nicolasgilis.be 
^
Gothor
#
Citer
325 Posts
 Sur FF, c'est pas mal =)
J'ai un petit souci sur IE8

previews/42565-Apercu.png

Dans Expérience > 2001-2004
Il y a trois puces pour une seule avec du contenu :o
Gothor
^
Laurie-Anne
#
Citer
Modérateur
6001 Posts
 Bonjour,

Merci d'éditer ton sujet et de modifier son titre en ajoutant le nom du site ou son URL, comme cela est demandé dans les règles spécifiques de ce salon.
Non !
http://laurie-anne.bourdain.name 
^
xorcist
#
Citer
11 Posts
 @Laurie-Anne : désolé, je viens de corriger merci pour le rappel.

@Gothor merci bcp je vais regarder ce que je peu changer pour qu'IE veuille bien coopérer ^^

@Gili merci infiniment pour tes remarques et tes conseils, je vais justement aller me documenter sur la loi de Gestalt, la police est par défaut je ne trouve pas ça jolie non plus, il faudrait que je change de police.
J'ai flashé sur des polices style "mac" mais bon je trouve pas pour le moment l’équivalent pur windows.

@fufu big up à toi, merci pour ton conseil je vais l'utiliser et aérer tout ça.

gros gros merci à vous tous pour vos conseils et critiques grandement appréciés.

biggrin biggrin

^
Anymah
#
Citer
18 Posts
 Hello,

Je suis pas sûr que ce soit vraiment intéressant d'exposer tout le programme des cours que tu souhaite suivre. Ça fait beaucoup d'information, mais est-elle vraiment nécessaire?
"Un sac vide tient difficilement debout." Benjamin Franklin
^
xorcist
#
Citer
11 Posts
 Bonjour Anymah,
tu marque un point, d'autant plus que je me posais la question pas plus tard qu'hier, je trouve que la page est trop chargé d'informations pas nécessaires du tout.

Je vais faire, je penses, un lien vers cette page si l’intéressé désire les connaitre.

Merci de ton point de vue smile

^
Prévenir un modérateur
Répondre au sujet
Aller à