Forum d'entraide PHPFrance

bonjour,

mon titre est peut être pas kler, je suis dsl.

mon site est bien visible pour tout le monde. il est sur le net, et pour le moment, ça marche impec. (avec explorer du moins)

mais j'ai un cousin qui a Ubuntu 8.10 et Firefox 3. et il m'a envoyé une copie d'écran, et rien que la page index est affreuse !!!

en fait:
- les images ne s'affichent pas
- j'ai utilisé un tableau comme cadre pour faire la partie, haute et gauche qui sont fixe, et celle de en-bas à droite qui change. lui ce tableau n'est pas dimensionné pareil.
- il se retrouve avec des losanges à la place des caractères accentués

que faire pour rectifier ça ? car faudrait qu'il soit visible par tout le monde.

si vous avez pas explorer, vous pvez jeter un coup d'oeil voir si ça marche ou pas la mise en page sur
http://avimag.free.fr

merci de votre aide

[Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur]

Bonjour,

Un bon départ pour trouver ce genre de souci est de valider ton code HTML.

http://validator.w3.org/check?uri=http% ... ne&group=0

Le validateur t'affiche une série d'erreurs détectées que tu devrais corriger. Il n'est pas surprenant que ces erreurs soient plus "gênantes" sous Firefox, qui est plus respectueux des standards du web. Ce sont donc des pistes à explorer.

PS : winxp, firefox3 => ça marche pas non plus.

merci calimero.

c bien le lien que tu m'as donné, ça me trouve tout ce qui ne leur plait pas, aux autres configuration.

j'ai d'abord compris qu'il me faut un ligne doctype.
cette ligne s'écrit en haut de chaque page d'après ce que j'ai compris. en tte première ligne de code.

mais comment savoir quoi écrire ? il me faut la version de l'html utilisé, mais comment je peux savoir ça moi? et :
un site dit : l'URL de la «document type declaration» (DTD), à savoir un document spécifiant les propriétés de chaque élément, balises et attributs, de ce type de HTML.
mais heu.... là je comprend plus trop

il me faut la version de l'html utilisé, mais comment je peux savoir ça moi?

Tout simplement parce que c'est toi qui le choisis.

Pour plus de facilité, commence par utiliser le Doctype le plus tolérant : HTML 4.01 transitional

Voici sa déclaration :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

Bonjour,

Sans vouloir paraitre désobligeant, regarde le code source HTML de ta page!!!
3 balises <html>, 3 balises <body>, un morceau de tableau qui se balade en bas de page... il va falloir sérieusement revoir les bases du HTML, désolé de devoir te dire cela.

Un autre souci (celui concernant les images) :

dans ton code tu appelles tes images comme ceci :

Code : Tout sélectionner

<img src="img\im-logo.jpg">

Hors sur le web, le séparateur de dossiers est le caractère slash ( / ) et non l'antislash ( \ ). Je ne peux donc que t'inviter à les corriger partout si tu veux que ça passe en dehors d'internet explorer...

En fait plus je regarde ton code et plus ça me rappelle les sites tels qu'on les faisait il y a dix ans, qui ne marchent (et n'ont été testés) que sur internet explorer et nulle part ailleurs, et qui sont basés sur des tableaux pour la mise en page. Je ne sais pas quel logiciel ou quel tutorial tu utilises pour écrire l'html mais ça pourrait être bien pour toi que tu te renseignes sur les nouvelles méthodes qui ont pas mal évolué

Et puis installes Firefox sur ton ordinateur pour tester en local ça te permettra déjà de constater beaucoup d'incompatibilités d'affichage avec ton code.

Pour avoir un code qui passe partout, il est conseillé de développer un code conforme aux standards du web*. Et pour connaître les standards il y a par exemple http://www.alsacreations.com/ ou http://fr.selfhtml.org/

*ça c'est dans l'idéal mais le pb est qu'IE notamment dans les anciennes versions ne respecte pas tous les standards. Donc dans ces cas là il faut savoir choisir les standards communs et correctement implantés chez le maximum de navigateurs pour arriver à faire un code "universel".

Slt,

merci albat. j'ai mis le code doctype que tu m'as donné.

je sais que je suis censer choisir... mais bon, les sites ça a jms été mon fort. pour info, j'ai rien utilisé comme générateur de site, j'ai tout fait à la main. pour ça k'il est pas très "design" d'ailleurs et pas conventionnel non plus. on m'a appris le code "béta" pour faire un site. ainsi que le php. après c'était du débrouille-toi. c le premier site que je met en ligne, donc j'ai jms eu ces pbs.

vous m'avez un peu démoraliser, mais bon, on va trouver à le faire marcher

pour @rthur, tu dis que par page, je dois avoir 3 balises html, body... mais c pas 2 ?
<html></html>
<body> et </body> ... ?

Calimero tu m'inquiète. tu as pu lire mon code ? si c le cas, ça ve dire ke c pas au point non plus niveau risque d'intrusion, non?

j'ai changé les "\" en "/" .
et le mieux pr la mise en page est les CSS non ? mais bon ça avait l'air trop compliqué pour juste cette petite mise en page. pour ça que j'ai fait un tableau.

merci AB pour tes conseils. décidément tu auras bien participé à me débloqué !!!
j'vais buché les 2 sites ce soir et voir avec firefox ce qui va pas.

je sais que je suis censer choisir... mais bon, les sites ça a jms été mon fort. pour info, j'ai rien utilisé comme générateur de site, j'ai tout fait à la main. pour ça k'il est pas très "design" d'ailleurs et pas conventionnel non plus. on m'a appris le code "béta" pour faire un site. ainsi que le php. après c'était du débrouille-toi. c le premier site que je met en ligne, donc j'ai jms eu ces pbs.

Pas de souci, j'ai moi-même commencé comme ça. On te le signale pour t'orienter dans ton apprentissage (si tu continues, bien entendu)

Calimero tu m'inquiète. tu as pu lire mon code ? si c le cas, ça ve dire ke c pas au point non plus niveau risque d'intrusion, non?

Je parlais simplement du code HTML. Celui-là est visible et consultable en clair par tout le monde pour 100% des pages web de l'univers

Tu n'as rien à craindre de ma remarque.

j'ai changé les "" en "/" .

Effectivement les images sont arrivées. Tu as installé firefox 3 pour le vérifier ?

et le mieux pr la mise en page est les CSS non ? mais bon ça avait l'air trop compliqué pour juste cette petite mise en page. pour ça que j'ai fait un tableau.

Oui c'est le mieux pour pas mal de raisons que d'autres te listeront mieux que moi. Ce n'est pas super évident mais ça s'apprend, il y a des sites spécialisés sur le sujet (AB t'a notamment donné le lien vers alsacreations). Si tu as l'occasion de faire un nouveau site, ou de faire évoluer celui-là, tu auras certainement l'utilité de te lancer dans cet apprentissage, c'est pourquoi on te le recommande.

merci Calimero.

me sentais un peu découragée.

enfin, firefox est installé.
alors.... tout est là.
ya- juste 2 petits détails qui sont "pas très beaux" mais c juste du "style".

la police d'écriture sous firefox est pas la même que sous itnernet explorer. pourtant j'ai utilisé une feuille de style.

Code : Tout sélectionner

H6 { font-family:Verdana, sans-serif; font-size:70% ; font-weight:normal ; margin-top:0 ; margin-bottom:0 ;}
a  { font-family:Verdana, sans-serif; font-size :70%; font-weight : normal ; }

alors peut être que ça vient que firefox connait pas le "verdana", j'v me renseigner.

et sinon c les tableaux que peut contenir le site. les séparateurs ligne/colonnes sont pas pareils.

Code : Tout sélectionner

<table width="100%" height="100%" bgcolor="#DF2D3A" border="3" bordercolor="#A8222B" cellspacing="0">

ça doit être au niveau du border...

j'v lire les docs de AB pour voir, c surement écris..

merci en tout cas

la police d'écriture sous firefox est pas la même que sous itnernet explorer. pourtant j'ai utilisé une feuille de style.
(...)
alors peut être que ça vient que firefox connait pas le "verdana", j'v me renseigner.

Voici l'info.

La présence ou non d'une police est liée à l'ordinateur, pas au navigateur.

Soit le fichier correspondant (généralement un .TTF) est installé sur l'ordinateur
et dans ce cas, tous les navigateurs (Firefox, IE, etc.) l'utilisent.
Soit ce fichier est absent et dans ce cas, aucun navigateur ne l'affiche.

En attendant d'élucider ce mystère, je t'invite à remplacer la balise H6 par h6.

et le mieux pr la mise en page est les CSS non ? mais bon ça avait l'air trop compliqué pour juste cette petite mise en page. pour ça que j'ai fait un tableau.

L'utilisation des css est indépendante du fait d'utiliser ou non les tableaux.
Et puis ne surtout pas croire qu'utiliser les tableaux est plus facile, bien au contraire. Pour une mise en page un peu complexe il est bien plus facile d'utiliser <div> <p> etc. Par exemple copies le code ci-dessous dans une page vierge et testes ce que cela donne. Ensuite essaies de refaire la même chose avec une mise en page utilsant uniquement des tableaux, tu comprendras vite la différence. En fait l'utilisation des tableaux est utile et justifiée uniquement pour présenter des données tabulaires.

Pour cet exemple, j'ai utilisé ce qu'on appelle des styles css incorporés mais il est préférable de les reporter en haut de page dans une feuille de style ou encore de les externaliser.

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;  charset=ISO-8859-1" />
<title>Document sans titre</title>
</head>

<body>

<div style="width:500px; margin:auto; border:4px solid #000099; padding:1em; font-family:Arial, Helvetica, sans-serif; font-size:0.8em;text-align:justify; color:#003399; 
            line-height:1.5em ">

  <img style="float:right;background-color:#000099;margin: 0 0 0.5em 1em" src="http://www.phpfrance.com/forums/images/logo_phpfrance.gif" alt="logo PHP France" />
 
  L'utilisation des css est ind&eacute;pendante du fait d'utiliser ou non les tableaux. <br />
Et puis ne surtout pas croire qu'utiliser les tableaux est plus facile, bien au contraire. Pour une mise en page un peu complexe il est bien plus facile d'utiliser 
<div> <p> etc. Par exemple copies le code ci-dessous dans une page vierge et testes ce que cela donne. Ensuite essaies de refaire la m&ecirc;me chose 
avec une mise en page utilsant uniquement des tableaux, tu comprendras vite la diff&eacute;rence. En fait l'utilisation des tableaux est utile et justifi&eacute;e 
uniquement pour pr&eacute;senter des donn&eacute;es tabulaires.<br />
Pour cet exemple, j'ai utilis&eacute; ce qu'on appelle des styles css incorpor&eacute;s mais il est pr&eacute;f&eacute;rable de les reporter en haut de page dans 
une feuille de style ou encore de les externaliser.

</div>

</body>
</html>

Edit(naholyr) : merci de ne pas inclure des lignes longues (convention : plus de 80 caractères) dans la balise code, cela peut totalement déglinguer la mise en page et rendre la lecture très pénible. De plus l'exemple n'est pas forcément criant étant donné qu'un simple <img align="right"> fait la même chose à l'ancienne

slt,

AB, j'ai regardé tout ça. ton code et le site Alsacréation.
en fait, si à la place de mon tableau principal, je voulais utilsier les feuilles de style, il faudrai que pour chaque "cadres" (ou "cellule") de mon tableau, je fasse un
div
{
code de la mise en page de ma cellule
}

??

et sinon j'ai modifié tous mes H6 en h6, ça m'a pris un peu de temps, j'aime bien les majuscules

mais bon sous firefox, y-a tjrs une police exécrable et un border de tableau affreux. ça pe venir de quoi ?

merci

Modération :
Afin d'obtenir plus de réponses, le sujet est déplacé dans le forum "HTML, XHTML, CSS".

slt,

et sinon j'ai modifié tous mes H6 en h6,

selon l'éditeur de code que tu utilises tu peux trouver la fonction "remplacer" dans le menu de ton logiciel, il te suffit de lui indiquer la chaine de caractères à changer, et la chaine de remplacement... ça va beaucoup plus vite!

tu as cette fonction par exemple dans notepad++ qui est mon éditeur préféré...

http://notepad-plus.sourceforge.net/fr/site.htm

Forum d'entraide PHPFrance

perte de la mise en page avec certains ordinateurs, que faire ?

perte de la mise en page avec certains ordinateurs, que fair