Problèmes de liens

saladin · le 2 mai 2007

Salut,

Excuse-moi pour le retard de ma réponse.

Pour les balises titres j'ai rectifié la taille des lettres avec les balises <font>, Pour les ancres j'en ai mis sur toutes les pages, ça fais moche puisque c'est juste un lien donc quand j'aurais le temps je ferais un bouton avec un log' pour faire le lien, par contre y aurait-il une solution pour que le lien se place à un endroit bien précis dans le bloc "pied"?

Sinon, j'ai un petit problème: sur la page http://www.saladin5.fr/serveurphoto.html le bloc "pieds" n'a pas d'attribut "width" et pourtant il ne prend pas toute la largeur de la page, je trouve ça bizarre.

Pour ma feuille de style j'ai fait un bloc "pied" pour chaque page, est ce qu'il y a plus facile?

Enfin, dans l'ensemble il commence à prendre forme, je vais peut-être changer de police et tout le graphisme car je trouve que ça fait enfantin.

Merci d'avance

a+

Modifié le 2 mai 2007 par saladin

Dylav · le 2 mai 2007

Balises titres

Ta solution déroge au principe de la séparation du contenu et de sa présentation : le contenu dans la page HTML, la présentation dans la feuille de style CSS. Dans ce cadre, la balise <font> ou les attributs align (text-align dans la feuille de style) ou style dans une balise <div> par exemple, sont vivement déconseillés, voire déjà "dépréciés" (même s'ils fonctionnent encore, je peux t'assurer qu'avec la DTD XHTML 1.0 Strict, le validateur du W3C te les mettra en erreur).

Dans l'exemple précis de la <div> "en-tete", elle ne contient qu'un titre et d'autres blocs <div>, de sorte que tu peux définir les attributs de ton titre dans la feuille de style, id #en-tete, ou à l'aide d'une balise <h1> aux attributs définis dans la feuille de style (comme je te l'indiquais dans mon post précédent). Réellement, il faut prendre l'habitude de reporter systématiquement dans la feuille de style toutes les spécifications de présentation... Ton contenu devient tellement plus clair :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtmll/DTD/xhtmll-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">	
<head> 
<title> Le Dico de l'Info </title>
<meta http-equiv="content-type" content="text/html: charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="style" href="tour.css" />
</head>
<body>
<div id="en-tete">
 <a name="haut_de_page"></a>
 Le Dico de l'Info
 <div id="top">
   <a href="http://www.saladin5.fr/index.html">
     <img src="/image/abidbol2.jpg" height= 107px>
   </a>
 </div>
</div>
<div id="chmenu">
 <ul id="menu">
   <li><a href="http://www.saladin5.fr/index.html" class="menuprincipal">Accueil</a></li>			
   <li><a href="http://www.saladin5.fr/definition.html" class="menuprincipal">Définitions</a>
     <ul>
       <li><a href="http://www.saladin5.fr/definition.html" class="ssmenu">Défintions</a></li>
       <li><a href="http://www.saladin5.fr/ir.html" class="ssmenu">Internet et Réseaux</a></li>
     </ul>
   </li>
   <li><a href="http://www.saladin5.fr/serveurphoto.html" class="menuprincipal">Serveur Photo</a></li>
 </ul>
</div>
<div id="pages">	
 Salut, ça y est, le site est ouvert au public, il n'y a pas beaucoup (voire pas du tout) de définitions mais ça ne devrait pas trop tarder. En voilà quelques-unes ci-dessous :
 <div id="liens">Et voici aussi un petit lien pour les Fofos de Zeb.fr 
   <a href="http://starjojotrek2.free.fr/DLpourPC/" class="lien2">Starjojotrek</a>
 </div>
</div>
<div id="pied">
 <div class="left"><a href="#haut_de_page">Retour haut de page</a></div>
 <div class="center">
   <img alt="" src="http://perso.club-internet.fr/cgi-bin/Count.cgi?df=philippe.durupt.1&dd=A&ft=8" />
 </div>
 <div class="center">
   <img alt="" src="http://perso.club-internet.fr/cgi-bin/Count.cgi?display=date&dformat=DDMMYY">
 </div>
 <div class="center">
   <img alt="" src="http://perso.club-internet.fr/cgi-bin/Count.cgi?display=clock&timezone=GMT+0100&tformat=24">
 </div>
 <div class="right"><a href="#haut_de_page">Retour haut de page</a></div>
</div>
</body>
</html>
</XMP></PRE></SAMP>
<!-- DEBUT / Cybermonitor / START -->
<script language="javascript"><!--
CM_RUBRIQUE = "edit_PagesPersos_abonnes";
CM_CLIENT = "clubv3";
CM_SECTION1 = "PagesPersos";
// --></script>
<script language="javascript" src="http://js.cybermonitor.com/clubv3.js">
</script>
<noscript>
<img src="http://stat3.cybermonitor.com/clubv3_v?R=edit_PagesPersos_abonnes&S=total;PagesPersos">
</noscript>
<!-- FIN / Cybermonitor / END -->
<script language="JavaScript" src="http://perso-static.club-internet.fr/popUnder3.js"></script>
<script language="JavaScript"> setTimeout("dailyPopUnder('myPopUnder', popUnderData[Math.floor(Math.random()*(popUnderData.length))], 620, 512);", 3000); </script>

Il te reste bien entendu à enrichir ta feuille de style, en particulier avec les id #top et #liens, et les classes .left, .center et .right (plus des suppléments dans les autres spécifications, en provenance des ex-clauses style des <div>).

La balise de fin </html> devrait être la dernière ligne de ta page HTML, et tout ce que tu as placé derrière devrait être devant. Ceci dit, </XMP></PRE></SAMP> est forcément de trop, puisqu'il s'agit de fermetures de balises qui n'ont pas été ouvertes...

Nota : en XHTML, les balises et leurs attributs doivent être écrits en minuscules (contrairement à HTML).

Pieds de page

Pourquoi en définir autant que tu as de pages, puisque,

tu leur donnes à tous la même présentation,
il est tellement plus simple de les laisser flotter sous le corps de la page (<div> "pages"), plutôt que de leur donner un margin-top (seule différence entre tous ces blocs pieds)... quitte à fixer une hauteur à l'id #pages (height), mais est-ce nécessaire ?

Pour ta page Serveur Photo, le bloc pied me semble fonctionner correctement, tant sous FF que sous IE...?

Graphisme

Il est vrai que la police "Comic sans MS" est un peu galvaudée, mais elle est très lisible. Pour moi, la solution, c'est une police sans serif (serif = petits traits au bouts des branches des lettres), et les plus courantes et lisibles sont "sans serif", "Arial", "Comic sans MS" et "Verdana" (laide en gras)...

mushylex · le 2 mai 2007

Vide

Modifié le 21 mai 2022 par mushylex
Vide

saladin · le 2 mai 2007

Il me reste encore du boulot Aller Saladin au boulot!!!

Je vais essayer de voir tous ça ce soir mais sans promesse...

Edit: mushylex mes liens vers mes ancres sont placées avec la balise <div> et l'attribut style manuellement

2^nd Edit:

Nota : en XHTML, les balises et leurs attributs doivent être écrits en minuscules (contrairement à HTML).

Ne serait ce pas plutôt le contraire?

Modifié le 11 mai 2007 par saladin

KewlCat · le 2 mai 2007

1. utilise plutot des div avec une class=titre par exemple, le <h1> c'est pas térrible...

Pardon ?

Les balises <h1> <h2> ... <h6> servent à définir les titres et donc structurer le document. Si tu utilises des <div> anonymes, tu retires tous les éléments qui permettraient à des navigateurs destinés aux malvoyants, à des navigateurs sémantiques ou à des robots (moteurs d'indexation, etc.) de déterminer de quoi parle ton document.

Alors, oui, si tu veux t'amuser cinq minutes, tu peux refaire tout un site uniquement avec des balises <div> et des classes / id, mais qu'est-ce que ça va apporter exactement ? A part alourdir inutilement la feuille de style et te retirer toutes tes chances de te faire référencer correctement...

Pourquoi, alors que dans le langage HTML il existe largement assez de balises correspondant exactement à tous les types de contenus que l'on peut rencontrer, se restreindre à une poignée de balises ?

Dylav · le 2 mai 2007

Nota : en XHTML, les balises et leurs attributs doivent être écrits en minuscules (contrairement à HTML).
Ne serait ce pas plutôt le contraire?

Regarde ici

saladin · le 2 mai 2007

autant pour moi...

mushylex · le 2 mai 2007

Vide

Modifié le 21 mai 2022 par mushylex
Vide

Dylav · le 2 mai 2007

Dis-moi, Mushylex, qu'est-ce que je fais lorsque j'écris dans la feuille de style

h1 {font-size:28px;color:black;}
h2 {font-size:24px;color:green;}
h3 {font-size:20px;color:red;}
... etc...

Quant aux mal-voyants et autres aveugles, il ne s'agit pas de régler une taille de police, mais de mettre à leur disposition un logiciel qui interprète la structure et le contenu de l'écran pour le leur expliquer vocalement. C'est aussi à cela que faisait allusion KewlCat...

Va jeter un oeil sur L'accessibilité en marche... c'est une obligation depuis plus de deux ans déjà pour les sites officiels

KewlCat · le 3 mai 2007

Comment veux-tu faire si tu veux que tout tes titres aient la même taille? avec un <h...> ?

Tu souhaites modifier l'apprence du contenu d'une balise ? Ca se fait dans la feuille de style, comme pour tous les autres éléments du document. Ce n'est pas parce que la balise dispose d'un style par défaut qu'il est interdit d'y toucher. Au contraire !

Je serais curieux de connaître ta source de "es-tu au courant que l'on ne peut pas régler leur taille ?" parce qu'effectivement, j'ignorais tellement que l'on ne pouvait pas changer leur taille que c'est ce que je faisais depuis des années !

Au passage, quel est l'interêt d'avoir des titres et sous-titres visuellement identiques ?

(Et comme l'a si bien dit Dylav, je doute qu'un caractère de taille 50 (px ? pt ? em ?) change quoi que ce soit lors d'une lecture par synthèse vocale ou sur un afficheur braille...)

Connexion

Pas encore inscrit ?

Problèmes de liens

Messages recommandés

saladin

Lien vers le commentaire

Partager sur d’autres sites

Dylav

Lien vers le commentaire

Partager sur d’autres sites

mushylex

Lien vers le commentaire

Partager sur d’autres sites

saladin

Lien vers le commentaire

Partager sur d’autres sites

KewlCat

Lien vers le commentaire

Partager sur d’autres sites

Dylav

Lien vers le commentaire

Partager sur d’autres sites

saladin

Lien vers le commentaire

Partager sur d’autres sites

mushylex

Lien vers le commentaire

Partager sur d’autres sites

Dylav

Lien vers le commentaire

Partager sur d’autres sites

KewlCat

Lien vers le commentaire

Partager sur d’autres sites

Rejoindre la conversation

En ligne récemment 0 membre est en ligne

Zebulon

Outils en ligne

Naviguer