3246 sujets

Critiques de vos sites: code et design

On aime ou pas http://www.loire-desir.fr/test/index.php

Bonjours,

IE6 n'aime pas, mais alors pas du tout.

Les erreurs de codes sont assez enormes (du CSS ailleurs que dans le head, éléments (très) dépréciés, alt manquant sur les images, non fermeture des tag auto-fermant (en XHTML il faut les fermer)...)
Merci de ta réponse.

je comprend pas pour le css il est bien dans head

<head>
<title>OpenWeb - Exemple d'utilisation de la position fixe dans un menu</title>

<style type="text/css" media="screen">@import url(annexe3.css);</style>
		<script type="text/javascript" src="swfobject.js"></script>
		<script type="text/javascript">
			var flashvars = {};
			var params = {wmode: "transparent"};
			var attributes = {};
			swfobject.embedSWF("anim.swf", "header", "100%", "100%", "9.0.0", false, flashvars, params, attributes);

		</script>
        <script type="text/javascript" src="gf_scroll_div.js"></script>
</head>


les alt sur les images excuse mon ignorance mais euh je vais chercher sur les tuto.

Pour les tags auto fermant je vois pas trop ce que c'est...

Smiley sweatdrop
ddxtrem a écrit :
je comprend pas pour le css il est bien dans head
Cette portion là, oui, celle à la ligne 55, non...

ddxtrem a écrit :
les alt sur les images excuse mon ignorance mais euh je vais chercher sur les tuto.
C'est surtout dans les spécifications qu'il faudrait regarder et essayer de valider tes pages.

ddxtrem a écrit :
Pour les tags auto fermant je vois pas trop ce que c'est...
C'est le faut qu'une balise unique (qui n'est pas en deux bouts) doive se terminer par " />" en XHTML et non par ">", comme en HTML.
Salut,

Pourquoi faire un cadre tout autour de ton site alors que le navigateur en fait déja un ? A part perdre de la place pour les petites résolutions, je ne vois pas trop. Smiley cligne

Tu as des filets jaune pale autour du contenu, et un filet sombre à moitié coupé autour de l'image en haut... voulu ?

Sinon pas de titre à la page, ni de sous titre avec l'information de ce qu'on va trouver sur le site. Il faut le deviner soit même, en terme de communication c'est loin d'être idéal.
ok, tu veux dire que quand j'appelle un fichier via include() le code css doit se trouver dans la balise head du fichier inclus.

pour la fermeture d'un tag c'est bien :


 <div class="XXX">
 </div>


et pour les images si j'ai bien compris alt sert a avoir un texte qui apparait lorsque la souris reste dessus (description)

et sinon mise à part la programmation que je vais corriger au plus vite. visuellement tu en pense quoi?
si j'ai fait un cadre autour c'est parce que sur les colonnes droite et gauche j'ai un petit décalage en haut tout moche. Le cadre c'est un peu un cache misère Smiley sweatdrop

j'enléve le cadre de suite pour te faire voir
Modifié par ddxtrem (06 Apr 2010 - 11:15)
ddxtrem a écrit :
ok, tu veux dire que quand j'appelle un fichier via include() le code css doit se trouver dans la balise head du fichier inclus.
Euh... pas sûre de ce que tu raconte. que tu utilise PHP ou non, au final tu obtiens un document HTML qui doit avoir 1 et 1 seul <head> dans lequel se trouvent les styles CSS.

ddxtrem a écrit :
pour la fermeture d'un tag c'est bien
Nope, ça c'est une balise classique, je parlais, en particulier des éléments <img>.

ddxtrem a écrit :
et pour les images si j'ai bien compris alt sert a avoir un texte qui apparait lorsque la souris reste dessus (description)
Nope, pas du tout, alt sert à afficher le même contenu que celui porté par l'image quand celle-ci ne peut pas être affichée ou vue. Même si le alt est vide, il doit être présent.

ddxtrem a écrit :
et sinon mise à part la programmation que je vais corriger au plus vite. visuellement tu en pense quoi?
Euh... comme dit plus haut, sous IE6 c'est la cata ; donc si je me base sur ça, c'est moche, très moche (mais ça ne veux rien dire puisque j'ai un rendu qui n'est pas celui attendu).
Dans Firefox 3.6, c'est très moche également. Désolé. Smiley decu

De plus la page d'accueil fait plus de 830Ko, c'est très long à charger.
Smiley sweatdrop
Hmmm… Un peu trop expérimental pour moi également.

Il fallait en tout cas oser ce genre de design vraiment très particulier, juste pour ça je dis "bravo" Smiley cligne Très peu de monde aurait eu les "bollocks" (comme disent nos amis ricains) de faire ça pour un site web.

Que ça ne marche pas sur IE6 n'est pas étonnant : positionnement fixe des 4 coins du cadre. IE6 n'aime pas le positionnement fixe, ainsi que beaucoup d'autres choses utiles, perfectionnées et poussées en terme de design web (il disparaît peu à peu, d'ailleurs. Tape pas Laurie-Anne, tape pas ! C'est juste la vérité, et tu le sais bien Smiley cligne )
Modifié par Ladytron (06 Apr 2010 - 12:28)
Ladytron a écrit :
Que ça ne marche pas sur IE6 n'est pas étonnant : positionnement fixe des 4 coins du cadre. IE6 n'aime pas le positionnement fixe, ainsi que beaucoup d'autres choses utiles, perfectionnées et poussées en terme de design web (il disparaît peu à peu, d'ailleurs. Tape pas Laurie-Anne, tape pas ! C'est juste la vérité, et tu le sais bien Smiley cligne )
Si le problème concernait juste les coins, ça ne serait pas vraiment important ^^;
C'est certain Smiley smile

Je te fais confiance, n'ayant pas regardé sur IE6… La flemme de lancer VirtualBox juste pour vérifier sur IE6 et 7 Smiley confused
mais en fait le cadre s'est juste un cache misère

upload/28427-Sanstitre.JPG

Les deux boites ne se positionne pas jusqu'en haut. Smiley confus

Du coup je pense que je vais juste faire une barre en haut avec un petit text photoshop

pour les images je les ai modifier comme sa:
<img src="loire.jpg" width="200" height="149" border="2" alt="logo" /></img>


J'ai inclu tous le css dans head il y avait des petit bouts qui trainait dans les fichiers *.htm

Pour la page d'accueil au début j'avais mis un tableau avec tout plein de <td> et <tr> c'est sa qui doit faire lourd je m'en vais le modifier tout de suite.
Vérifie également le poids des différentes images que tu utilises : c'est surtout ça qui fait gonfler le poids d'une page, la plupart du temps (si on omet, sur certains sites, l'abus de librairies Javascript) Smiley cligne
sa marche j'ai déja remarqué un script qui n'avait rien à faire la sa tombe bien ...

En fait pour la petite histoire on m'a imposé une animation en haut de page. ok pas de probléme.

J'ai commencé à faire un truc large mais pas très haut. pour que quand on arrive sur la page on ne voit pas que sa.

Mais sa n'allait pas donc j'ai revu ma copie. Le problème venait de l'accessibilité. c'est pourquoi j'ai eu l'idée de mettre une div fixe à droite avec le menu. Par la suite je vais rajouter des ancres pour ne pas avoir a se prendre l'animation flash à chaque fois.

Bon en tout cas c'est un peu le foutoir maintenant je vous remercie tous de vos remarques constructive je vais faire un peu de rangement la dedans.

voila la suite au prochain épisode merci à tous.
Pour ton haut, attention avec les choix de couleur du texte et du fond, car du vert sur du orange, c'est peu contrasté et ça devient vite illisible si on a des problèmes de perception des couleurs (daltonisme) ou si on utilise un écran en noir et blanc.

Il te manque aussi l'encodage des caractères avec la balise méta.

Tu as un id texteloire1 qui est présent trois fois et un id titre qui est présent deux fois. un id ne doit apparaître qu'une seule fois dans une page ! Utilise une class à la place.

Tu as un </h1> qui traîne dans ton menu.

Les attributs align ne sont pas acceptés en xhtml strict, ça se remplace facilement par le CSS.

Pour les alt, tout a été dit.

Et pour l'ordre du contenu, le menu se trouve après le contenu principal, alors que je l'aurais mieux vu avant le contenu. Je ne parle pas du positionnement visuel, mais bien purement du code. Pour mieux voir, sous Firefox : Affichage > Style de la page > Aucun style
En le plaçant avant, le menu sera déjà beaucoup plus à la portée des sans-souris. Pour le positionnement visuel, c'est faisable en CSS avec le float. Quant à l'accès au contenu principal, c'est justement pour ça qu'on parle de liens d'accès rapide comme ceux que tu vois dans le haut de4s pages d'Alsacréations.

Voilà ce que j'ai pu soulever.
Sujet clos
Aller à