Conseils

Conseils - HTML/CSS - Programmation

Marsh Posté le 09-02-2007 à 20:44:05    

Salut!  :)  
 
J'ai récement fini de créer mon site, et je voudrais vos avis au niveau du:
-Design
-Et surtout au niveau du CODAGE
 
Pour les critiques, tous est bon à prendre.  :p  
Merci
http://tibasicunivers.free.fr
 
Ps: Ce n'est pas de la Pub

Message cité 1 fois
Reply

Marsh Posté le 09-02-2007 à 20:44:05   

Reply

Marsh Posté le 09-02-2007 à 22:18:32    

Salut !
 
Une remarque rapide : On écrit "Accueil" (et non "Acceuil" ) ;) C'est la première chose qui attire l'oeil je crois bien...
Oh puis allez ! Maintenant que j'y suis, je te laisse corriger ces fautes sur la page d'accueil :


Concernant le code, je suis pas un spécialiste, mais j'ai remarqué un problème au niveau de certaines balises <br /> :

<strong><span class="bonjour">Bonjour!</span></strong><br \><br \>Bienvenue sur "TI-Basic Univers".<br />


 
Et plus haut dans le code, tu mets toute une div dans une <center>. Je sais pas si c'est juste. Et si ça l'est, ce serait pas mieux de l'insérer dans ta CSS ? :)
 
Voilà pour ce que j'ai vu dans la page d'accueil  ;)
 
edit :
J'ai fini par jeter un oeil au contenu du site. En fait, il est bourré de fautes d'ortho et de grammaire. Je te conseille fortement de revoir tout ça d'autant plus que ton site est destiné à donner des cours. Donc il faut pouvoir montrer un minimum de rigueur pour qu'il soit pris au sérieux.
Liste pas du tout exhaustive :


Mon avis : tu devrais privilégier une bonne ponctuation (point d'exclamation, points de suspension, etc.) aux smileys quelque peu envahissants.
Concernant la mise en forme du site (en-têtes, polices, encadrés, etc.) : j'aime bien. C'est sobre mais clair et efficace.
Pour le contenu : le sujet est une bonne idée et les idées sont bien développées. Toutefois je crois comprendre que tu t'adresses aux utilisateurs de TI-82 (si mes souvenirs sont bons  :sweat: ) alors que c'est indiqué nulle part.
J'espère que ces quelques remarques t'ont été utiles :)
 
PS : le titre du topic est... vague.
 
edit2 : correction des liens

Message cité 1 fois
Message édité par juju2k le 12-02-2007 à 00:59:19
Reply

Marsh Posté le 09-02-2007 à 22:22:26    

Bonjour
 
Tu utilises des éléments de mise en forme dans le xhtml, c'est à éviter (center, etc)
Il y a un abus de retours à la ligne. L'utilisation des autres éléments devrait permettre d'éviter ça.
Il y a aussi des soucis de sémantique (tous les éléments ne peuvent pas contenir n'importe quelle balise)
 
Pour les feuilles de style:
- ça n'est pas parce qu'un style s'applique au bas de la page qu'il faut l'inclure en bas de page. Les appels aux feuilles de styles doivent être faits dans l'en-tête de la page ... pourquoi 2 css, d'ailleurs?
- au niveau des polices, tu n'es pas obligé de lister toutes les polices MS fournies par défaut. Definis juste la police MS que tu veux, puis une classe de police, et enfin un style.
 
Je n'ai jeté un très rapide coup d'oeil ... visiblement les css gagneraient à être mieux structurées (regrouper les éléments redondants?).
 
Encore du travail, mais tu es sur la bonne voie :)

Reply

Marsh Posté le 09-02-2007 à 23:43:47    

univscien1 a écrit :



 
pourquoi je t'ai dans mes contacts MSN [:pingouino]

Reply

Marsh Posté le 10-02-2007 à 13:19:52    

Merci pour les conseils. :-)
Oui pour les fautes d'orthographe, je corrigerais.
 
Kadreg> Aucunes idées. ^^

Message cité 1 fois
Reply

Marsh Posté le 10-02-2007 à 13:44:44    

juju2k a écrit :

En fait, il est bourré de fautes d'ortho et de grammaire


 
D'un autre côté, il assume le fait de ne pas suivre pendant les cours de français, sur la page d'accueil.  [:anathema]

Reply

Marsh Posté le 11-02-2007 à 15:29:20    

:)  
 
Bon, voilà, j'en profite pour demander un peu d'aide pour mon menu:
 
http://tibasicunivers.free.fr
 
Le seul truk qui me gène, c'est le petit pixel qui se trouve sur les bord supérieur et inférieur du menu, du coté gauche.
A gauche d'accueil.
 
Je voudrait qu'ils n'apparaissent pas. Comme à coté de Fonction.  
 

HTML:

Code :
  1. <div id="menu_horizontal">
  2. <ul>
  3. <li><a href="index.php">Accueil</a></li>
  4. <li><a href="http://universtibasic.forumactif.com">Forum</a></li>
  5. <li><a href="tutoriaux.php">Tutoriaux</a></li>
  6. <li><a href="livre_or.php">Livre d'or</a></li>
  7. <li><a href="prgm.php">Programmes</a></li>
  8. <li><a href="fonction.php">Fonctions</a></li>
  9. </ul>
  10. </div>


 
CSS:

Code :
  1. div#menu_horizontal
  2. {
  3. margin-top: 210px;
  4. margin-bottom: 50px;
  5. border: 1px solid #8d8f8e;
  6. text-align: center;
  7. margin-left: 105px;
  8. margin-right: 105px;
  9.    border-right : 0px;
  10.    border-left : 0px;
  11. }
  13. div#menu_horizontal ul
  14. {
  15. list-style-type : none;
  16. margin : 0;
  17. padding : 0;
  18. }
  20. div#menu_horizontal li
  21. {
  22. font-weight: bold;
  23. display : inline;
  24. padding : 0 0.7em;
  25. border-right : 1px solid #8d8f8e;
  26. border-left : 1px solid #8d8f8e;
  27. }
  28. div#menu_horizontal a
  29. {
  30. color: #41403e;
  31. }
  32. div#menu_horizontal li:hover
  33. {
  34. color: white;
  35. background-image: url("fondtableaufonction.jpg" );
  36. }
  38. div#menu_horizontal a:hover
  39. {
  40. color: white;
  41. }


 
 
Une idée?  :ange:

Message cité 1 fois
Message édité par univscien1 le 11-02-2007 à 15:29:56
Reply

Marsh Posté le 11-02-2007 à 16:00:54    

univscien1 a écrit :

Merci pour les conseils. :-)
Oui pour les fautes d'orthographe, je corrigerais.
 
Kadreg> Aucunes idées. ^^


... et de grammaire :o  
 
OK, j'arrête là, je pense que t'as compris le message.  ;)

Reply

Marsh Posté le 11-02-2007 à 18:06:35    

Alors?
Pas d'idées???

Reply

Marsh Posté le 12-02-2007 à 16:07:41    

Euhh... UP! :)  
 
Vous pouvez m'aider?
J'ai toujours le méme probléme.  
 
 
 

univscien1 a écrit :

:)  
 
Bon, voilà, j'en profite pour demander un peu d'aide pour mon menu:
 
http://tibasicunivers.free.fr
 
Le seul truk qui me gène, c'est le petit pixel qui se trouve sur les bord supérieur et inférieur du menu, du coté gauche.
A gauche d'accueil.
 
Je voudrait qu'ils n'apparaissent pas. Comme à coté de Fonction.  
 

HTML:

Code :
  1. <div id="menu_horizontal">
  2. <ul>
  3. <li><a href="index.php">Accueil</a></li>
  4. <li><a href="http://universtibasic.forumactif.com">Forum</a></li>
  5. <li><a href="tutoriaux.php">Tutoriaux</a></li>
  6. <li><a href="livre_or.php">Livre d'or</a></li>
  7. <li><a href="prgm.php">Programmes</a></li>
  8. <li><a href="fonction.php">Fonctions</a></li>
  9. </ul>
  10. </div>


 
CSS:

Code :
  1. div#menu_horizontal
  2. {
  3. margin-top: 210px;
  4. margin-bottom: 50px;
  5. border: 1px solid #8d8f8e;
  6. text-align: center;
  7. margin-left: 105px;
  8. margin-right: 105px;
  9.    border-right : 0px;
  10.    border-left : 0px;
  11. }
  13. div#menu_horizontal ul
  14. {
  15. list-style-type : none;
  16. margin : 0;
  17. padding : 0;
  18. }
  20. div#menu_horizontal li
  21. {
  22. font-weight: bold;
  23. display : inline;
  24. padding : 0 0.7em;
  25. border-right : 1px solid #8d8f8e;
  26. border-left : 1px solid #8d8f8e;
  27. }
  28. div#menu_horizontal a
  29. {
  30. color: #41403e;
  31. }
  32. div#menu_horizontal li:hover
  33. {
  34. color: white;
  35. background-image: url("fondtableaufonction.jpg" );
  36. }
  38. div#menu_horizontal a:hover
  39. {
  40. color: white;
  41. }


 
 
Une idée?  :ange:


Message édité par univscien1 le 12-02-2007 à 16:08:29
Reply

Marsh Posté le 12-02-2007 à 16:07:41   

Reply

Marsh Posté le 15-02-2007 à 17:59:18    

Le problème vient du fait que ton ul fait toute la longueur de la page, alors que les listes inlines ne font que la largeur des éléments qu'elles contiennent.
 
C'est déjà un sacré hasard qu'il n'y ait qu'un décalage de plus d'1px. Il doit d'ailleurs dépendre de la police utilisée, donc le rendu doit être mauvais sur certains systèmes.

Reply

Marsh Posté le 15-02-2007 à 18:31:50    

salut, je viens rajouter ma pomme à l'édifice, ta barre de menue apparait sur 2 lignes sous IE en 1024*768, tu l'as surement déjà remarqué !
 
bonne continuation.

Reply

Marsh Posté le 19-02-2007 à 15:36:39    

UUPPP!!!
 
Vous pouvez m'aider svp?
 
J'aimerais que le menu soit un cadre parfait aussi bien sur FF que sur IE.
 
Help me plz....  :(

Reply

Marsh Posté le 19-02-2007 à 23:38:07    

Pas essayé sous IE:
 

body { font-family: Verdana,Arial,Helvetica,sans-serif }
 
* { padding: 0; margin: 0 }
 
div { text-align: center; padding: 5px }
 
ul {
  position: absolute;
  top: 20px;
  left: 60px;
  border-width: 1px 0;
  border-style: solid;
  border-color: #858585;
}
 
 
li {
  display: inline;
  padding: 0 10px;
  font-size: 1.1em;
  font-weight: bold;
  border-width: 0 1px;
  border-style: solid;
  border-color: #858585;
  background-color: #F5F5F5;
}
 
li:hover { background-color: red }


 
Pour une page toute simple:
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
  <head >
    <title >Page de test</title >
    <meta http-equiv="Content-Type" content="text/html; charset=utf8">
    <link rel="stylesheet" media="screen" type="text/css" title="css" href="style.css">
  </head >
  <body >
 
  <div >
    <ul >
      <li >Ceci</li >
      <li >est</li >
      <li >un</li >
      <li >menu</li >
      <li >inline</li >
    </ul >
  </div >
 
  </body >
</html >


 

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed