un petit test svp - HTML/CSS - Programmation
Marsh Posté le 07-12-2004 à 09:20:57
OK avec FF 1.0
A part ça, l'animation bimbo sous le parassol qui bouge dans tous les sens, c'est mal.
Marsh Posté le 07-12-2004 à 09:24:27
ben ya une anim qui va de haut gauche à bas droite avec une image, mais le lien est mort
Marsh Posté le 07-12-2004 à 09:26:52
merci de la rapidité , je l'ai testé sous mozilla 1.7.3 et le javascript passe bien , l'image ce balade de maniére aléatoire dans la fenetre . C'est un javascript annoncé comme compatible FF , chez toi la bimbo reste fixe et tremblante alors .
Marsh Posté le 07-12-2004 à 09:27:47
bimbo
ya pas l'image qui s'affiche, et c'est pas aleatoire du tout
Marsh Posté le 07-12-2004 à 09:28:01
au fait , y'a une dif entre FF1.O et le navigateur de Mozilla 1.7.3 ?
Marsh Posté le 07-12-2004 à 09:31:19
il fonctionnerait que sous IE6 alors , ou pire que sur mon PC . Pourtant j'ai un second PC avec IE5 et ça s'ouvre correct , un peu d'aide svp serait la bienvenue .
Marsh Posté le 07-12-2004 à 10:05:14
chacal_one333 a écrit : bimbo |
Ouais, une de ces animations qui se baladent partout sur la page et qui t'oblige à débrancher javascript... ou à fermer la page
Le genre de truc à proscrire.
Marsh Posté le 07-12-2004 à 10:22:17
dites , je comprends pas , je viens de télécha et d'installer Firefox et quand j'ouvre la page , y'a rien qui cloche , le gif de la bimbo est présent et le script marche sans géner la naviguation sur la page .
ça me dérange pas de virer le script , c'était juste un petit clin d'oeil sympa pour mes visiteurs et mon ambition est juste de faire un site simple qui soit lisible pour tout le monde .
Comme en générale on trouve de bon conseil sur ce forum , ça serait sympa de m'aider .
Marsh Posté le 07-12-2004 à 10:33:34
ok alors
1- utilise des feuilles de style au lieu de foutre tes styles comme un gros crade dans les balises (ce qui fait perdre tout intérêt des feuilles de style par rapport au html "old school" de 1994)
2- Dégage toutes les balises <font> bordel, c'est le premier truc à faire sauter dans une page
3- les trucs qui se balladent sur ma page, c'est rhédibitoire, dégage cet espèce de machin lourd qui vole stpmerssi, dégage tout le JS en fait il sert à rien
4- à la fin du code on trouve
<p> </p> |
mais putain ca sert à quoi cette merde?
5- dégage tous tes positionnements absoluts, le position: absolute c'est bien pour des effets de style mais tout un site en absolute c'est stupide (et ca a de fortes chances de provoquer des effets de bord à cause des polices, c'est ce qui arrive ici, si on agrandit la police ou qu'on a une police plus grande que ce que tu proposes les éléments se chevauchent)
6- le menu, pas en divs tout moches
7- et d'ailleurs, un affichage propre pour le menu ca serait pas du luxe, parce que les pâtés c'est pas franchement agréable
8- les propriétés "align" (dans les divs), ca saute aussi stpmerssi
Voila, je pense que c'est à peu près tout pour le moment
Marsh Posté le 07-12-2004 à 11:07:16
voilà, ce que donne ta page chez moi (mozilla 1.7) :
http://mjules.free.fr/captures/capt.png
Marsh Posté le 07-12-2004 à 11:08:47
Mjules a écrit : voilà, ce que donne ta page chez moi (mozilla 1.7) : |
le retour à la ligne qui fait se chevaucher les textes c'est exactement le symptome d'un texte dans un div pas assez grand (en taille fixe)
Marsh Posté le 07-12-2004 à 11:57:48
merci , je comprends Masklinn que le code semble lourd pour un pro , mais j'ai construit ce site à partir de DW et je commence seulement à comprend pas à pas le code , les balises etc...
je trouvais l'utilisation de calques interessante par rapport au tableau , le site que j'avais avant était en tableau aucun de mes visiteurs ne m'avaient fait part de prob de lecture alors si c'est plus compatible je peux refaire en tableau la mise en page .
j'avais laissé de coté l'apprentissage des CSS car ma doc indiquait qu'il y avait des incompatibilité avec les vieux naviguateurs .
je vais essayer de suivre tes conseils Masklinn car je dois faire un site qui fonctionne correctemment , mais essais d'être indulgent , je débute .
Marsh Posté le 07-12-2004 à 12:05:41
[citation=916848,0,13][nom]framu a écrit[/nom]je trouvais l'utilisation de calques interessante par rapport au tableau[/quote]
Elle l'est, l'utilisation de vraies balises est conseillées par rapport à la mise en tableaux, mais il faut les utiliser correctement, le positionnement absolu partout n'est pas une bonne solution car non adaptative
Citation : j'avais laissé de coté l'apprentissage des CSS car ma doc indiquait qu'il y avait des incompatibilité avec les vieux naviguateurs . |
1- ton code est bourré d'informations de type CSS (tout ce qui est dans les attributs style)
2- les vieux navigateurs (NS4.7, IE3, ...) vont simplement ignorer les CSS, donc si la page est conçue proprement elle s'affichera comme du texte et le site restera lisible
3- le plus gros problème étant les différences d'interprétation entre les navigateurs (enfin entre MSIE 5/6 et les autres)
4-
Citation : En français: |
Marsh Posté le 07-12-2004 à 12:16:03
framu a écrit : |
Ce qui indique que ta doc est probablement aussi vieille que les vieux navigateurs en question
Marsh Posté le 07-12-2004 à 12:17:10
oui , je sais j'ai du taffe pour progresser et merci pour toutes tes infos que je copie pour les aborder pas à pas.
Mais pour maintenant , afin que le site tourne correct , tu me conseils donc de virer les javascripts et de repositionner les calques du menu ou de les virer pour faire une ligne de menu en haut de page ou une colonne classique à gauche .
Marsh Posté le 07-12-2004 à 15:23:38
citation: le retour à la ligne qui fait se chevaucher les textes c'est exactement le symptome d'un texte dans un div pas assez grand (en taille fixe)
oui mais là j'ai placé chaque mot (texte) dans un calque différant alors n'est ce pas plutot la position des calques les un par rapport aux autres qui est en cause et là c'est la position absolute qu'il faudrait modifier non , ou créer des calques "enfants" de l'un des calques défini comme parent ?
Marsh Posté le 07-12-2004 à 15:28:31
framu a écrit : oui mais là j'ai placé chaque mot (texte) dans un calque différant |
Je sais, et c'est stupide
Citation : alors n'est ce pas plutot la position des calques les un par rapport aux autres qui est en cause et là c'est la position absolute qu'il faudrait modifier no |
pas uniquement.
Tes "calques" ont une largeur fixe > quand on agrandit la police, le navigateur "wrap" si la ligne est plus longue que le calque > les mots passent à la ligne et ca commence à se chevaucher.
De toute façon, les divs en positionnements absoluts pour faire un menu c'est franchement pas terrible comme idée
Marsh Posté le 08-12-2004 à 19:03:18
masklinn si t'as 2 mn , j'avais un peu de temps et je parcours les tuto de alsacréation , mais pourrait tu me donner un exemple de code sans la position absolute , ça me permettrais de commencer à comprendre le comment du pourquoi ( html pur par rapport au html de DW )
<div id="Layer8" style="position:absolute; width:173px; height:22px; z-index:18; left: 270px; top: 29px; background-color: #F7EEF7; layer-background-color: #F7EEF7; border: 1px none #000000">
<div align="center"><font face="Verdana, Arial, Helvetica, sans-serif" size="4" color="#000066"><a href="tarifetdescriptif.htm"><font color="#FF0033">tarif
et descriptif</font></a></font></div>
</div>
<div id="Layer7" style="position:absolute; width:95px; height:22px; z-index:20; left: 230px; top: 66px; background-color: #F7EEF7; layer-background-color: #F7EEF7; border: 1px none #000000">
<div align="center"><font face="Verdana, Arial, Helvetica, sans-serif" size="4" color="#000066"><a href="http://www.viamichelin.com/viamichelin/fra/dyn/controller/ItiWGHomePage?"><font color="#FF0033">itinéraire</font></a></font></div>
</div>
c'est le code pour les 2 calques menu dans lesquels j'ai mis "tarif et descriptif" et "itinéraire" , et dans le code je sais pas pourquoi DW traduit la lettre "é" par "é"
si ça tu n'as pas le temps , laisse c'est pas grave
Marsh Posté le 08-12-2004 à 19:09:27
un petit exemple (assez simple) de code n'utilisant la position absolue que pour le strict nécessaire (c'est de moi, essayer de pas trop me taper dessus ) :
http://www.airpur-industries.com/
Marsh Posté le 08-12-2004 à 19:36:31
Mjules a écrit : un petit exemple (assez simple) de code n'utilisant la position absolue que pour le strict nécessaire (c'est de moi, essayer de pas trop me taper dessus ) : |
il est franchement pas mal ce site, j'aime beaucoup, le seul reproche que je peux faire est plus question de préférence et limite mauvaise foi (que le menu soit en bas de la page, je le préfère en haut c'est plus accessible )
Citation : masklinn si t'as 2 mn , j'avais un peu de temps et je parcours les tuto de alsacréation , mais pourrait tu me donner un exemple de code sans la position absolute , ça me permettrais de commencer à comprendre le comment du pourquoi ( html pur par rapport au html de DW ) |
mmm là j'ai rien "sur moi", au mieux je te file un exercice de style perso (tentative de traduction d'un site en frames un peu sâle en XHTML+CSS valide joli), mais bon j'ai pas fait le design et comme à la base c'est le site d'une artiste il est pas léger (le but étant de conserver le design originel )
tu peux le trouver ici (mais gaffe, j'utilise des techniques un peu zarbes et pas nécessairement recommandées, entre autres pour remplacer du texte par des images, et le CSS est franchement pas optimisé). Je me souviens pas avoir mis quoi que ce soit en absolute dedans.
Ah oui, seuls les 2 premiers items du menu sont réalisés (et encore, le 2e est pas fini), le reste 404
Normalement, la page fonctionne avec la majorité des navigateurs (je l'ai vu partir en live que sous Amaya)
Citation : je sais pas pourquoi DW traduit la lettre "é" par "é" |
parce que le caractère "é" n'existe pas, il n'est pas accepté par les parseurs HTML/XHTML, à la place on utilise les "character entities", qui sont des expressions remplacées par la suite par les caractères kivonbien (liste des Character Entities ISO 8859-1 du HTML), sinon les parseurs ne comprennent pas et se plantent.
Marsh Posté le 08-12-2004 à 19:42:51
Masklinn a écrit :
|
pour la dernière phrase, il me semble que ce n'est valable que si tu ne déclares pas de charset.
Marsh Posté le 08-12-2004 à 19:45:46
d'ailleur à ce propos voila un article fort interessant http://www.w3.org/International/tu [...] -char-enc/
Marsh Posté le 08-12-2004 à 19:51:36
Citation : c'est marrant, c'est justement pour que le site soit plus accessible que je l'ai mis en bas ( je suivi leur idée http://openweb.eu.org/articles/menu_universel/ ), et j'ai ajouté l'accélérateur pour facilement y accéder parce que j'avais des doutes. |
Ok, je comprend le principe (après, perso je préfère le menu en haut, je sais pas je trouve ca plus pratique en mode texte, mais je vois pourquoi mettre le menu en bas)
Mjules a écrit : pour la dernière phrase, il me semble que ce n'est valable que si tu ne déclares pas de charset. |
Possible
Mais bon avec les entities t'es sur se jamais te planter
(alors qu'en mettant direct les caractères accentués tu l'es pas)
Marsh Posté le 09-12-2004 à 19:45:50
bonsoir , c'est encore moi , j'ai parcourru quelques pages sur le CSS et je commence à comprendre l'interet , mais j'aurais une question qui rejoint le prob apparue sur ma page avec les calques , le fait de créer des pages avec des feuilles de styles ne semble pas résoudre le probléme de chevauchement , même sur des sites comme alsacréa quand on agrandi le texte dans le naviguateur , certaine zone texte se retrouve cachée par les images !
Marsh Posté le 09-12-2004 à 20:08:58
framu a écrit : le fait de créer des pages avec des feuilles de styles ne semble pas résoudre le probléme de chevauchement |
Bien sûr que si, si tu évites les stupidités telles que mettre tous les éléments de menus en absolute indépendament les uns des autres (aka que tu crées de vrais menus)
Marsh Posté le 07-12-2004 à 09:15:54
bonjour, j'avais pourtant testé mon site sur IE5/6 et Mozz , mais une copine vient de me dire qu'elle a un prob à la visite de cette page :
http://fmura.free.fr/Page1.htm
pourtant pour moi tout baigne , vous pourriez regardez et me dire si ça cloche chez vous . Elle me dit que les textes rouges du menu se chevauchent ( ils sont dans des calques ) et que sur cette page le texte mord sur la photo.
Je comprends pas , mais d'un autre coté elle est inccapable de me dire si elle a un PC ou un Mac et elle sait pas ce qu'est un navigateur , voyez .
les adresses principales sont www.lapeyrolier.com ou www.lesjordanes.com
merci de votre concour