[résolu] Merci de vos commentaires sur www.si-figanieres.com

Bonjour,

Tout nouveau sur ce forum je tiens en premier lieu a vous saluer.
Je profite de cet espace pour vous demander votre avis sur ce site que je viens de mettre en ligne car comme tout le monde quand on " a la tête dans le guidon" on perd de son objectivité ... Alors je compte sur la vôtre ...
Un détail, la charte graphique était "imposée" par les supports papiers pré- existant.

Merci d'avance. Cordialement.

Ghost

www.si-figanieres.com[/url]
Modifié par ghost (26 Feb 2007 - 01:01)

Désolé, un raté pour l'URL

www.si-figanieres.com

Sympa ton site Internet!

Cependant, pour les images je te conseille d'utiliser les fonctions suivantes sur Photoshop (pour améliorer le contraste et la luminosité):
Dans Photoshop tu vas dans l'onglet Images > Réglages > Niveaux automatiques.
Tu verras tes images seront meilleures visuellement!

Cordialement.

C'est pas mal.

J'aurai juste 3 choses à dire:

- 1: J'aime pas les boutons, je trouve que ca ne s'integre pas bien au reste.
- 2: Mettre du texte entre la bannière et le menu c'est original mais je ne trouve pas ca tres ergonomique.
- 3: Ta page est assez lourde: Total 135 kb.

Sinon c'est bien.

Hello :
-il ya un petit temps de latence au survol du menu avec IE(ce qui est corrigeable)
-un bon coup d'antialias(adoucissement des contours) ne ferait pas de mal aux boutons.
-choix des couleurs douteux(le vert du menu par exemple) mais c'est discutable. Ce qui l'est moins en revanche,c'est la couleur de fond de la page qui ne tranche pas assez avec celle du fond du texte(beige clair les deux)
-la méthode travail de tes images ne doit pas etre la bonne, car on voit plein de sales pixels beiges au dessus des maisons. On dirait de la neige.
-idem pour la barre rouge en dessous du header : plein de points en dessous et au dessus, on se demande la raison de leur présence.
-quand je clique sur "contacts et liens", le "A" des deux boutons à gauche passe de gras à normal.
-quand je clique sur "page d'accueil", le "A" des deux boutons à gauche redevient gras.
-le lien qui mene au plan d'acces est bizarrement défini : taille du texte réduite, background-color blanche... Alors que pour le lien vers ton mail tu as gardé la configuration bleue des liens par défaut.
-j'aurai plutot choisi une image en png au lieu du jpeg pour ton header. la compression n'est pas bonne , il ya un halo autour de figanieres.
-Je ne suis pas encore myope, mais le texte du logo avec le soleil est franchement illisible, même de près.
-la taille du bouton survolée est plus grand de quelques pixels qu'au repos.
-les logos w3c apprenent au visiteur que tusais passer la validation, mais les touristes s'en désinterressent peut-etre. Ou alors en les plaçant plus discretement peut-etre
-entre l'écureuil de ton header et le "f" de figanieres, une série de points rouge inutiles et agressifs.
Modifié par Ralfman68 (30 Mar 2006 - 09:50)

Et une erreur qui fait sauter la validation CSS !

Erreurs
URI :  http://www.si-figanieres.com/figa.css
 

    * Ligne: 27

      Parse error - Unrecognized : { width: 760px; height: 140px; }

Bonjour,
Tout d'abord merci de ces commentaires, c'est toujours instructif.
En ce qui concerne le temps de latence pour IE je suis preneur si on daigne m'expliquer...
Pour la boulette du CSS effectivement en commentant le code, j'ai fait "sauter" une ligne ... Merci Mucsy est c'est rectifié ouf!
Pour le côté graphique, il m'a fallut copier-coller le support papier déjà existant mais vous avez raison même si le client est roi, je vais tacher de glisser ces modifications... et pour les moches boutons, même si je ne les aime pas je vais au moins leur donner la même taille ... Et je n'ai pas d'artefact ni sous IE, ni sous FF en cliquant sur les boutons ... a suivre donc.
Pour les logos W3C, je voyais pas ou les placer plus discretement qu'en fin de footer. Mais si quelqu'un à une idée

Merci encore. Cordialement.

Ghost

a écrit :
Pour les logos W3C, je voyais pas ou les placer plus discretement qu'en fin de footer. Mais si quelqu'un à une idée

En fait je pense que Ralfman pense à des boutons moins gros. c'est pas pour faire de la pub mais regarde les boutons de ce site : http://www.ndeliens.net ils sont discrets et se fondent bien au site !!

Pour mon avis :
- Change la police
- J'aime pas que le site bouge tout en laissant le background immobile (ça doit avoir un terme précis)
- la bannière pixellise trop et est trop petite à mon avis
- Niveau code : évite le tableau pour la navigation (c'est gérable avec une liste)
- Pour revenir en haut de la page, des icônes devraient être plus discrets (c'est mon avis)!
- sur la page : http://www.si-figanieres.com/lien.html ton tableau n'est pas rempli, tu prévois d'autres partenaires ?!

Voilà

Shikamaru a écrit :
mais regarde les boutons de ce site : http://www.ndeliens.net ils sont discrets et se fondent bien au site !!

Merci pour la pub !

En fait, ces logos sont ceux de proze, vraiment génial pour valider des pages... (re-pub !):
- voir le topic à ce sujet
- voir leur site
Modifié par Mucsy (30 Mar 2006 - 11:48)

Oui j'avais remarqué !! pour la pub
Pour le fond fixe, c'est une économie demandée pour faciliter les mises à jour par le soin du client sûrement pour pouvoir faire des pages à rallonge sans se soucier du background.
Par contre pour le tableau de navigation, si tu as une technique Shikamaru de menu horizontal qui ne soit pas une usine à gaz compatible au moins IE et FF elle est la bien venue ...
Plus je regarde plus mes boutons sont moches...

A la place de ton tableau :

<table >
	<tr>

   <td><a href="index.html"> Page d'accueil</a></td>
   <td><a href="histoire.html">Histoire et patrimoine</a></td>
   <td><a href="nature.html">Nature et terroir</a></td>
   <td><a href="activite.html">Activités et loisirs</a></td>
   <td><a href="utile.html">Adresses utiles</a></td>
   <td><a href="lien.html">Contacts et liens</a></td>
  	</tr>
</table>

Tu peux mettre en place ceci

Ton code HTML
<ul class="menu">
 <li><a href="index.html" [b]title="Accueil"[/b] >Page d'accueil </a></li>
 <li>lien 2</li>
 <li>....</li>
</ul>

Pour ton CSS
UL.menu {LIST-STYLE-TYPE: none}
UL.menu LI {Float:left;}

Bon après tu fais comme tu le sens pour le placement, la taille : margin & co...

pS : N'oublie pas les titres à tes liens !
Modifié par Shikamaru (30 Mar 2006 - 13:17)

Ok, j'avais essayé à l'origine avec ce code sensiblement équivalent me semble t'il:

<div id="menu">
  <ul class="menu">
   <li><a href="index.html"> Page d'accueil</a></li>
   <li><a href="histoire.html">Histoire et patrimoine</a></li>
   <li><a href="nature.html">Nature et terroir</a></li>
   <li><a href="activite.html">Activités et loisirs</a></li>
   <li><a href="utile.html">Adresses utiles</a></li>
   <li><a href="lien.html">Contacts et liens</a></li>
</ul>
</div>	

/*------------------------------------------- Menu -------------------------------------------------*/

#menu 
{
   height: auto;
   width: 760px;

}
ul.menu
{
list-style-type: none
}
ul.menu li {
Float:left;
margin: auto;
text-align: center;
}
#menu li  
{
   width: 106px;
   height: 45px;
   margin-left: 2px;
   font-family:  "Arial Black", "Times New Roman", Times;
   font-variant: small-caps;
   font-style: italic;
   font-size: 14px;
   list-style-type: none;
   background-image: url("images/bouton_vide_off.gif");
   background-repeat: no-repeat;
}
#menu li a
{
   display: block;
   width: 100%;
   height: 100%;
   text-align: center;
   text-decoration: none;
}	  

#menu  a:link 
{
   color: #13400a;
}
#menu  a:visited 
{
   color: #13400a;
}
#menu a:hover 
{
   background-image: url("images/bouton_vide_on.gif");
   background-repeat: no-repeat;
   color: #fbebc7;

Mais j'avais un problème de centrage décallé sur la gauche du menu, j'ai essayé plusieurs combinaisons puis le temps pressant, je suis allé au plus "simple" mais ça m'interesserais de savoir où est ma "boulette..." car je ne suis vraiment pas fan de table. Merci

Re ! Comme shikamaru, je prendrais plutot une police moins fantaisiste que comics(utlra-reconnaissable) du type Arial.
Pour le temps de latence : clique ici pour le tuto
Autre chose que j'ai oublié de dire ce matin : il semble que tu utilises la librairie graphique de php pour écrire le texte "haut de page", (à moins que ce ne soit qu'un div superposé, je n'ai pas vérifié, dans quel cas je m'excuse de mon erreur) ce qui fait que les navigateurs sans images ne verront pas le texte , mais bon on va pas chipoter.
Pour finir, ça se voit un peu trop que certaines images sont des scans, c'est dommage car la présentation du header est plutot propre et bien organisée.
Modifié par Ralfman68 (30 Mar 2006 - 15:16)

Ralfman68, le tuto est au poil mais il est à la fois différent et similaire au code que j'emploie, je ne sais pas si j'abuse au quel cas je ferais les tests moi même mais quel est la raison (le code css qui me manque parmis les différences) pour laquelle j'ai moi ce temps de latence et pas l'exemple du tuto et surtout pourquoi (là j'abuse !), je n'aime pas faire du copier-coller sans comprendre. Pour la police c'est le moins mauvais choix du client !! et pour le div, c'est un superposé et les images Gifs je vais les retravailler.
Dailleurs, je compte les passer en png mais pour l'instant avec CS2 tout neuf, je ne maitrise pas la transparence, j'obtient un fond gris et elle "pèsent un peu" mais je vais m'acharner à comprendre.

Hello Ghost!
Pour les png, je ne sais pas si tu auras besoin d'utiliser la transparence, a mon avis il suffirait de retravailler tes images sous photoshop ou paint shop(si j'ai bien compris le probleme)
Temps de latence :
Il ya plusieurs manières d'éviter ça :
-précharger l'image dès le chargement de ta page et l'afficher loin, très loin hors de la zone de l'écran.
-l'afficher au bon endroit mais les masquer(visibility:hidden)
au survol on rétablira les parametres de telle sorte que l'image s'affiche au bon endroit.
Dautres techniques sont possibles (javascript, pseudo-classes css before et after, flash) mais sont à déconseiller pour diverses raisons(cf: le livre de Raphaël "pratique du design web")

Bonjour à tous

j'ai commencé à revoir ma copie notamment sur la bannière et quelques trucs par ci par là, il me reste les boutons en priorité.

Je vais m'arrêter là car je crois que le Form bugge et j'ai du mal à taper de manière cohèrente !!! Ou alors je fatigue ou j'ai trop forcé sur le Chiwas .

Cordialement

Ghost

Bonjour,
Désolé s'il y a de la redite, mais je n'ai pas lu tous les commentaires.

1. Tu pourrais apporter un plus en accessibilité, outre de remplacer ton menu tableaux par un menu lite, en ajoutant des liens d'évitement et des raccourcis, et en utilisant des titres de manière correcte (il n'y en a pas assez je trouve)

2. La page est assez longue à charger même en étant en ADSL512K

Mais sinon c'est pas mal.

Bonjour,

Bon je suis au bout, j'ai changé mes boutons, mais je ne suis pas sûr que cela plaise au client ...

http://www.si-figanieres.com/index2.html

Pour le tableau de navigation... j'ai toujours mon problème avec mon code d'origine ennoncé plus haut (centrage déficiant ...) Alors tant pis je garde mon tableau.

Merci à tous.

Re. Incontestablement c'est mieux.