 Probleme de page Web, calque fixe |
 |
Bienvenue invité ( Connexion | Inscription )
  |
 4 Jul 2004, 14:31
Message
#1
|
|
 Nouveau Membre Groupe : Membres Messages : 25 Inscrit : 4 Jul 2004 Membre no 20 704  |
Hello,
J'ai récemment rencontré un probleme dans la création d'un site. Je fais appel ici aux pros qui auront sans doutee vite fait de me dire si il existe une solution. Voilà, je veux créer un calque qui reste fixe en dépit du scrolling. J'ai donc créé une balise div classique pour mon calque et je comptais utiliser Onscroll pour compenser le positionnement absolu d'autant que l'utilisateur fait défiler. Mais premier probleme : Onscroll n'existe que sur IE, c'est dc déliberement abandonner les utilisateurs de safari, chose ignoble que je ne peux me résoudre à faire. Deuxieme probleme, la seule variable que je connaisse capable de comptabiliser le déroulement effectué, c'est bien sur pageXoffset et pageYoffset mais celles ci ne sont pas disponibles sur IE mais seulement sur Netscape. Troisieme probleme : la réactivité d'un évenement comme Onscroll pour faire bouger dynamiquement des calques n'est elle pas discutable. Existerait il donc un autre moyen de réaliser ce calque fixe ? Merci d'avance. @+ -------------------- "Celui qui ne rivalise avec personne, personne au monde ne peut rivaliser avec lui" Lao-Tseu in Lao-Tö-King
|
 |
 
|
 4 Jul 2004, 14:57
Message
#2
|
|
 Macbidouilleur de vermeil !  Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
CSS powaa
va sur : openweb.eu.org/ -------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
4 Jul 2004, 16:24
Message
#3
|
|
 Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
Salut
 Si j'ai bien compris ton problème, je pense qu'une solution en CSS existe, voici une piste : CODE <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <TITLE>Exemple de bloc fixe</TITLE> <STYLE type="text/css"> <!-- .blocfond { position:absolute; left:10px; top:10px; width:600px; height:1600px; background-color:#B0B0B0; border-width:2px; border-style:solid;} .blocfix { position:fixed; left:20px; top:20px; width:200px; height:200px; background-color:#E0E0E0; border-width:1px; border-style:solid;} --> </STYLE> </HEAD> <BODY bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#FF00FF" alink="#FF0000"> <div class="blocfond"><CENTER><p> Bloc principal</p></CENTER></div> <div class="blocfix"><CENTER><p>Bloc fixe</p></CENTER></div> </BODY> </HTML> Voilô 
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
5 Jul 2004, 13:10
Message
#4
|
|
|
Nouveau Membre Groupe : Membres Messages : 25 Inscrit : 4 Jul 2004 Membre no 20 704 |
Hello,
Merci beaucoup pour cette info. Je commencais à devenir fou à essayer des trucs abracadabrants. J'ignorais l'existence de ce simple paramètre "fixed". C'est vrai que c'est moins tordu que de passer par du Onscroll. Merci encore. @+ -------------------- "Celui qui ne rivalise avec personne, personne au monde ne peut rivaliser avec lui" Lao-Tseu in Lao-Tö-King
|
|
|
|
 5 Jul 2004, 13:22
Message
#5
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
QUOTE (Fredo d;o) @ 4 Jul 2004, 16:24) Salut Si j'ai bien compris ton problème, je pense qu'une solution en CSS existe, voici une piste : CODE <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <TITLE>Exemple de bloc fixe</TITLE> <STYLE type="text/css"> <!-- .blocfond { position:absolute; left:10px; top:10px; width:600px; height:1600px; background-color:#B0B0B0; border-width:2px; border-style:solid;} .blocfix { position:fixed; left:20px; top:20px; width:200px; height:200px; background-color:#E0E0E0; border-width:1px; border-style:solid;} --> </STYLE> </HEAD> <BODY bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#FF00FF" alink="#FF0000"> <div class="blocfond"><CENTER><p> Bloc principal</p></CENTER></div> <div class="blocfix"><CENTER><p>Bloc fixe</p></CENTER></div> </BODY> </HTML> Voilô D'accord pour faire du CSS mais là c'est n'importe koi comme code Voilà du vrai code : CODE <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> <head> <title>Exemple de bloc fixe</title> <style type="text/css"> body {height: 900px;} #blocfix { position:fixed; left:20px; top:20px; width:200px; height:200px; background:#E0E0E0; border:1px solid black} </style> </head> <body> <div id="blocfix"><h1>Ton bloc fixe</h1></div> </body> </html> Au passage cette propriété n'est pas supportée correctement par tout le monde (merci IE comme d'hab) Bon maintenant un petit coup de gueule : d'accord pour faire du "CSS" mais alors faites du code propres arrêtez de coder avec les pieds ... 
-------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
5 Jul 2004, 13:33
Message
#6
|
|
 Champollion 2k5 Groupe : Modérateurs Messages : 7 009 Inscrit : 15 Jun 2003 Lieu : ...partout et nulle part... Membre no 8 070 |
Et oui, IE 5 & 6 ne supportent pas la propriété "fixed". GRRRR
 Mais il y a des manières de contourner la chose. Voir par ici : http://openweb.eu.org/articles/initiation_absolue/ PS : voilà un lien qui devrait plaire à Belisarius - ils codent avec leurs mains là-bas PS2 : oui, je sais, Belisarius, t'as déjà donné le lien vers le site, mais là, j'ai rajouté la page 
--------------------   MacBook Pro 16" M1 Max 64Go/2To Sonoma Don't believe anything you read on the net. Except this. Well, including this, I suppose (Douglas Adams) Perhaps the answer to the question lies in the question (Police Me - Tori Amos) |
|
|
|
|
5 Jul 2004, 13:46
Message
#7
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
QUOTE (Belisarius @ 5 Jul 2004, 13:22) D'accord pour faire du CSS mais là c'est n'importe koi comme code Bon maintenant un petit coup de gueule : d'accord pour faire du "CSS" mais alors faites du code propres arrêtez de coder avec les pieds ... Bon d'accord... peut-être que la "piste" que j'ai proposé n'est pas bien "codée", mais je ne vois pas pourquoi. Tu vois Belisarius, je débute à peine, dépuis quelques jours, en html et css, et j'avoue que mes connaîssances sont bien limitées pour l'instant. Mon but était juste de donner une simple "piste" visuelle, et je n'ai jamais prétendu que c'était "la" solution. En revanche, je trouve ta réaction et ton coup de gueule bien éxagérés, on est là juste pour s'entre-aider et ainsi apprendre, et personne ne détient tout le savoir (toi non plus, ne t'en deplaise). Enfin, j'aurais plus aprécié (je crois ne pas être le seul) que tu sois un peu plus pédagogique et que tu joues le jeux du partage de connaîssances qu'on applique dans ces lieux en expliquant en quoi ma proposition est moins bien codée que la tienne (ça doit être important, vu le ton de ta critique !?), au lieu de nous gratiffier d'un laconique et bien désagreable coup de gueule bien stérile. Merci de faire preuve d'un peu plus de tolérence pour ceux qui, comme moi, ne cherchent qu'à participer et apprendre.
Ce message a été modifié par Fredo d;o) - 5 Jul 2004, 14:02. -------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
5 Jul 2004, 14:19
Message
#8
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
Désolé Fredo d;o), j'ai juste eut un petit moment de fatigue et surtout eut marre de voir du code pourrie partout (comme le code de ce forum : d'ailleurs on nous rabat les oreilles vis à vis des 56k et des images alors que la page est tout sauf optimisée (cf la CSS)) et de voir qu'on en met en exemple n'a pas améliorer la situation
je ne savais pas que tu étais débutant et donc je m'excuse, je vois trop de gens qui prennent la grosse tête en HTML et qui code comme en 1996 toutes mes excuses Beli -------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
5 Jul 2004, 16:51
Message
#9
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
QUOTE (Belisarius @ 5 Jul 2004, 14:19) Désolé Fredo d;o), j'ai juste eut un petit moment de fatigue... Je ne t'en tiens nullement rigueur Belisarius, un peu de fatigue et une pointe d'agassement, ça m'arrive aussi... et puis, je sais que par ailleurs tu n'est pas avare de conseils et explications. De plus, en me relisant, je m'apperçois que ma réaction aussi était un peu excessive... désolé à mon tour Allez, disons égailté et balle au centre Enfin, histoire de faire avancer un peu le shimilblic, quand tu auras deux minutes, si tu pouvais en quelques lignes nous en dire en peu plus à propos de la différence entre ces deux codes, ça serait très instructif pour les débutans comme moi... a+
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
5 Jul 2004, 18:49
Message
#10
|
|
 Adepte de Macbidouille Groupe : Membres Messages : 92 Inscrit : 15 Apr 2004 Lieu : Paris Membre no 17 678 |
Fredo d;o) : En fait, ce qui n'est surtout pas correct dans le code que tu as donné, c'est que tu as donné des informations de présentation à la fois dans la css et dans le html.
HTML --> contenu CSS --> présentation Les codes html servent juste à indiquer la hiérarchie (h1, h2, p, ul...) et la structure de ta page (div, class, etc.)... C'est ce qui permet de pouvoir changer l'aspect d'une page sans jamais avoir à toucher au contenu, ni à répéter une centaine de fois la couleur d'un lien par exemple. Il existe des tas de sites qui expliquent ça très bien. Openweb est l'un des meilleurs. Une bible ;-) Par ailleurs, Elen@her on pourrait mieux t'aider si tu disais où tu veux fixer cette image ? Si c'est dans le fond de page, tu as juste à l'indiquer dans les spécifications du body : body { margin : 0; padding : 0; background-image: url(l'adresse de ton image); background-position:x y; background-repeat: no-repeat; background-attachment: fixed; } x et y sont les distances horizontales et verticales du coin supérieur gauche de ton image par rapport au coin supérieur gauche du body. Beli me tape pas si j'ai dit des bêtises
-------------------- iMac Snow 500/640 - OS X.3.3
Trois blogs sinon rien : Mon blog perso, un autre pour apprivoiser Dotclear et un autre paske j'arrête de fumer et que c'est duuuuuuur ! |
|
|
|
|
6 Jul 2004, 12:18
Message
#11
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
QUOTE (Kozlika @ 5 Jul 2004, 18:49) Fredo d;o) : En fait, ce qui n'est surtout pas correct dans le code que tu as donné, c'est que tu as donné des informations de présentation à la fois dans la css et dans le html. HTML --> contenu CSS --> présentation Les codes html servent juste à indiquer la hiérarchie (h1, h2, p, ul...) et la structure de ta page (div, class, etc.)... C'est ce qui permet de pouvoir changer l'aspect d'une page sans jamais avoir à toucher au contenu, ni à répéter une centaine de fois la couleur d'un lien par exemple. Merci Kozlika pour ce début d'explication Je crois que je comprends (thériquement pour l'instant) le but et l'intérêt de la méthode que tu évoques, mais j'ai du mal à visualiser les erreurs commises dans le code que j'ai proposé... Pourrais-tu, si tu as 2 minutes, m'indiquer dans le code en question les choses à éviter et éventuellement la bonne manière de le faire ? (juste histoire que je puisse visualiser concrètement l'approche théorique que vous préconisez)... Merci pour ton aide
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
6 Jul 2004, 13:20
Message
#12
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 92 Inscrit : 15 Apr 2004 Lieu : Paris Membre no 17 678 |
Je suis loin d'être une pro des CSS que je n'ai découvert qu'il y a un peu plus de deux mois.
En fonction de ce que je sais (à affiner donc par les gourous du forum). Ta version : CODE <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> Dans le doctype, ajouter la langue : CODE "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> Plus d'informations ici : http://edu.ca.edu/article209.html Ta version : CODE .blocfond { position:absolute; left:10px; top:10px; width:600px; height:1600px; background-color:#B0B0B0; border-width:2px; border-style:solid;} .blocfix { position:fixed; left:20px; top:20px; width:200px; height:200px; background-color:#E0E0E0; border-width:1px; border-style:solid;} --> </STYLE> </HEAD> <BODY bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#FF00FF" alink="#FF0000"> <div class="blocfond"><CENTER><p> Bloc principal</p></CENTER></div> <div class="blocfix"><CENTER><p>Bloc fixe</p></CENTER></div> </BODY> </HTML> 1/ Utilisation de class et id : On utilise l'attribut id pour des éléments uniques et l'attibut class pour des éléments répétitifs. Tu peux ainsi avoir deux <div class="trucmuche"> mais pas deux <div id="machin"> Dans le cas présent, une seule image fixe --> div id Plus d'infos : http://www.alsacreations.com/articles/id_class/ 2/ En tout état de cause, je n'ai pas compris pourquoi tu prévoyais .blocfond et .blocfix ? Un seul bloc suffit (sauf si on est dans le fond de page auquel cas pas de bloc du tout mais le code que j'ai mentionné dans le post précédent. 3/ Séparer le fond et la forme. Dans le html tu aurais mis ta div : exemple : CODE <html> <body> <div id="blocfond"></div> </body> </html> et dans la css la forme (je reprends les paramètres que tu voulais pour le blocfond mais en id et non en class) : CODE body { background-color:#ffffff; color:##000000; } a:link { color:#FF0000; } a:visited { color:#FF00FF; } a:active { color:##0000FF; } #blocfond { position:absolute; left:10px; top:10px; width:600px; height:1600px; margin:auto; (pour le centrage) background-color:#B0B0B0; border-width:2px; border-style:solid; border-color:# ???? (tu n'avais pas précisé) } J'ajouterais quant à moi : - dans le body : --margin:0; et padding:0; parce que certains navigateurs mettent des margin et des padding par défaut. Là tu es sûr que le coin supérieur gauche est le même pour tout le monde ; -- la famille, la taille et la couleur des caractères par défaut ; - dans les comportement des liens : un état a:hover (par exemple color:#999999;) à placer entre a:visisted et a:active. L'ordre est important car certains navigateurs s'emmêlent les pinceaux quand on ne déclare pas dans cet ordre ; - et dans le #blocfond : background-image:url(l'adresse de ton image) et son placement si ce n'est pas dans le coin supérieur gauche du bloc. Voilà, j'espère que tu vois mieux de quoi il s'agit. En tout cas, là où c'est vraiment bien expliqué pour l'image de fond fixe avec overflow, c'est ici : http://www.openweb.eu.org/articles/overflow_fond_fixe/ Openweb, c'est bon, mangez-en ! ;-) edit : orthographe Ce message a été modifié par Kozlika - 6 Jul 2004, 13:24. -------------------- iMac Snow 500/640 - OS X.3.3
Trois blogs sinon rien : Mon blog perso, un autre pour apprivoiser Dotclear et un autre paske j'arrête de fumer et que c'est duuuuuuur ! |
|
|
|
|
6 Jul 2004, 13:35
Message
#13
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
rien à dire Kozlika, c'est parfait
-------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
6 Jul 2004, 13:37
Message
#14
|
|
|
Champollion 2k5 Groupe : Modérateurs Messages : 7 009 Inscrit : 15 Jun 2003 Lieu : ...partout et nulle part... Membre no 8 070 |
Je rajoute que la balise <CENTER> = pas bien
-------------------- MacBook Pro 16" M1 Max 64Go/2To Sonoma Don't believe anything you read on the net. Except this. Well, including this, I suppose (Douglas Adams) Perhaps the answer to the question lies in the question (Police Me - Tori Amos) |
|
|
|
|
6 Jul 2004, 19:31
Message
#15
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
Et hop chaud devant, si vous lisez l'anglais : un article sur la position FIXED
-------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
7 Jul 2004, 12:36
Message
#16
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
Bonjour à tous et un grand
 tout particulier pour Kozlika QUOTE (Kozlika @ 6 Jul 2004, 13:20) Ta version : CODE <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> Dans le doctype, ajouter la langue : CODE "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> Plus d'informations ici : http://edu.ca.edu/article209.html Ok, j'ai bien compris l'utilité des "DOCTYPE", mais un truc me chiffonne, pourquoi "xhtml" ? Quelle différence avec un simple "html" ?  QUOTE (Kozlika @ 6 Jul 2004, 13:20) Ta version : CODE .blocfond { position:absolute; left:10px; top:10px; width:600px; height:1600px; background-color:#B0B0B0; border-width:2px; border-style:solid;} .blocfix { position:fixed; left:20px; top:20px; width:200px; height:200px; background-color:#E0E0E0; border-width:1px; border-style:solid;} --> </STYLE> </HEAD> <BODY bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#FF00FF" alink="#FF0000"> <div class="blocfond"><CENTER><p> Bloc principal</p></CENTER></div> <div class="blocfix"><CENTER><p>Bloc fixe</p></CENTER></div> </BODY> </HTML> 1/ Utilisation de class et id : On utilise l'attribut id pour des éléments uniques et l'attibut class pour des éléments répétitifs. Tu peux ainsi avoir deux <div class="trucmuche"> mais pas deux <div id="machin"> Dans le cas présent, une seule image fixe --> div id Plus d'infos : http://www.alsacreations.com/articles/id_class/ Impécable, j'ai bien pigé l'utilisation des "id" et "class" (super bien ce lien, merci). QUOTE (Kozlika @ 6 Jul 2004, 13:20) 2/ En tout état de cause, je n'ai pas compris pourquoi tu prévoyais .blocfond et .blocfix ? Un seul bloc suffit (sauf si on est dans le fond de page auquel cas pas de bloc du tout mais le code que j'ai mentionné dans le post précédent. Au fait, j'ai mis un grand bloc en "position:absolute" et un autre plus petit en "postion:fixed" afin de bien visualiser l'effet produit lors du scrolling, mais je ne savais pas qu'on pouvais regler tout ça en paramètrant le propriétés du "body" directement, je viens de l'apprendre, et ça ouvre d'autres horizons intéressants, merci pour cette découverte ! QUOTE (Kozlika @ 6 Jul 2004, 13:20) 3/ Séparer le fond et la forme. Dans le html tu aurais mis ta div : exemple : CODE <html> <body> <div id="blocfond"></div> </body> </html> et dans la css la forme (je reprends les paramètres que tu voulais pour le blocfond mais en id et non en class) : CODE body { background-color:#ffffff; color:##000000; } a:link { color:#FF0000; } a:visited { color:#FF00FF; } a:active { color:##0000FF; } #blocfond { position:absolute; left:10px; top:10px; width:600px; height:1600px; margin:auto; (pour le centrage) background-color:#B0B0B0; border-width:2px; border-style:solid; border-color:# ???? (tu n'avais pas précisé) } D'accord, tout ça dévient très clair, et je comprends mieux les erreurs que ma proposition comportait. Enfin, je devrais dire, à ma décharge, que comme je ne suis pas encore habitué aux spécifications du css (y'a du boulot  ), j'ai tendence à me fier au code que les outils que j'utilise insèrent par défaut, ce qui n'est pas, je m'en apperçois, la garantie d'un code correct. A ce propos, je serais curieux de savoir quels sont les outils que vous utilisez pour coder du "html" et du "css" sous Mac ? QUOTE (Kozlika @ 6 Jul 2004, 13:20) J'ajouterais quant à moi : - dans le body : --margin:0; et padding:0; parce que certains navigateurs mettent des margin et des padding par défaut. Là tu es sûr que le coin supérieur gauche est le même pour tout le monde ; -- la famille, la taille et la couleur des caractères par défaut ; - dans les comportement des liens : un état a:hover (par exemple color:#999999;) à placer entre a:visisted et a:active. L'ordre est important car certains navigateurs s'emmêlent les pinceaux quand on ne déclare pas dans cet ordre ; - et dans le #blocfond : background-image:url(l'adresse de ton image) et son placement si ce n'est pas dans le coin supérieur gauche du bloc. Merci pour ces remarques supplémentaires fort instructives, j'en tiendrais compte à l'avenir ! QUOTE (Kozlika @ 6 Jul 2004, 13:20) Voilà, j'espère que tu vois mieux de quoi il s'agit. Ho que oui, et je te remercie mille fois Kozlika pour ta disponibilité et pour avoir pris la peine de rédiger une réponse aussi claire et si bien documentée... Châpô bas !!! QUOTE (Kozlika @ 6 Jul 2004, 13:20) En tout cas, là où c'est vraiment bien expliqué pour l'image de fond fixe avec overflow, c'est ici : http://www.openweb.eu.org/articles/overflow_fond_fixe/ La cérise sur le gâteau !!! 
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
7 Jul 2004, 12:57
Message
#17
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
Le XHTML oblige a fermé tous les TAGS (comme par exemple <IMG />)
ça permet donc d'éviter pleins d'erreurs de plus c'est le language du futur à venir, car comme il est construit sur un base XML on va pouvoir faire pleins de belle chose (le XML étant un language omniprésent sur ton ordi, qui permet de stocker des données comme les préférences .plists) -------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
7 Jul 2004, 13:10
Message
#18
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 92 Inscrit : 15 Apr 2004 Lieu : Paris Membre no 17 678 |
Pour changer d'Openweb, voici un lien vers une page du site Selfhtml qui est très bien aussi ;-)
http://fr.selfhtml.org/html/xhtml/differences.htm C'est un peu long mais très complet. Et une autre page (plus courte) me permet de faire un coup de pub pour wikipedia : http://fr.wikipedia.org/wiki/XHTML -------------------- iMac Snow 500/640 - OS X.3.3
Trois blogs sinon rien : Mon blog perso, un autre pour apprivoiser Dotclear et un autre paske j'arrête de fumer et que c'est duuuuuuur ! |
|
|
|
|
7 Jul 2004, 20:13
Message
#19
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
QUOTE (Kozlika @ 7 Jul 2004, 13:10) Pour changer d'Openweb, voici un lien vers une page du site Selfhtml qui est très bien aussi ;-) http://fr.selfhtml.org/html/xhtml/differences.htm C'est un peu long mais très complet. Et une autre page (plus courte) me permet de faire un coup de pub pour wikipedia : http://fr.wikipedia.org/wiki/XHTML Et bein  , ça donne vraiment le vertige de voir tout ce qui me reste à apprendre (comment faites-vous pour arriver à suivre ??? ), rien qu'en cliquant sur les liens hypertexte chez Wikipedia (excellent site), il y a au moins pour 1 mois de lécture non stop... c'est abyssal !!!  Bon, malgré tout je me suis accroché, et je suis arrivé (non sans mal) à lire ces deux pages (et un petit-peu plus ), et je dois dire que certaines choses sont plus claires désormais, mais c'est encore infime en comparaison des toutes les notions qui restent désespérement obscures... mais bon, je me dis que Rome ne s'est pas faite en un jour (on se console comme on peux )...Enfin, je vais tenter un mini (micro) résumé pour voir avec vous si j'ai un peu pigé quelque chose à la chose...  Donc :1. Au départ vint le "HTML" pour mettre en forme du contenu sur le Web... 2. Puis, celui-ci a évolué jusqu'à la version 4.x afin de proposer un peu plus de possibilités de mise en forme et d'interaction avec d'autres langages et technologies 3. Parallélement, l'idée de séparer la forme du contenu a donné naissance aux feuilles de style "CSS", facilitant la mise en forme des pages, et au langage "XML" pour structurer le contenu selon un marquage sémantique 4. Mais, comme le langage "HTML" standard était trop souple pour pouvoir intéragir avec le "XML", les petits gars de la 3WC ont défini le "XHTML", qui n'est autre chose que du "HTML" mais qui respecte une structure et syntaxe précises et cohérentes du code afin de pouvoir travailler correctement avec les données "XML". Bon, alors, si ce petit résumé vous paraît assez juste (j'ai volontairement omis de mentionner le "SGML" et autres réjouissances du genre "RSS", "WAP" et j'en passe, qui restent on ne peu plus hérmetiques à mon pauvre neurone, déjà bien trop solicité avec tout ça ), et bien, je me pose une ou deux petites questions :1. Peut-on concevoir et réaliser des pages web (avec du code propre bien sûr ) en utilisant simplement du "HTML" et du "CSS", sans passer forcément par du "XML" ??? ... si oui, quel serait alors le bon "DOCTYPE" à utiliser ???2. Lors de la mise en forme des pages d'un site, peut-on réserver les styles "CSS" uniquement aux éléments récurrents et/ou semblables, et faire le reste de la mise en forme directement dans le code "HTML" ??? ... si oui, comment faire pour bien faire alors ??? ... si non, pourquoi ??? 3. Dans une page "HTML" banale, peut-on y insérer du "JS" avec du "XML", le tout encapsulé dans un "DHTML" interagissant avec le contenu d'un "SWG" interfacé "RSS" et transitant sous un protocole "HTTPS" sur un résaux "PPPoX" à partir d'un téléphone "GSM" ??? ... ... mais noooon, je rigoooole Voilô, merci à tous pour votre précieuse aide
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
7 Jul 2004, 20:22
Message
#20
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
QUOTE (Fredo d;o) @ 7 Jul 2004, 20:13) 1. Peut-on concevoir et réaliser des pages web (avec du code propre bien sûr ) en utilisant simplement du "HTML" et du "CSS", sans passer forcément par du "XML" ??? ... si oui, quel serait alors le bon "DOCTYPE" à utiliser ???2. Lors de la mise en forme des pages d'un site, peut-on réserver les styles "CSS" uniquement aux éléments récurrents et/ou semblables, et faire le reste de la mise en forme directement dans le code "HTML" ??? ... si oui, comment faire pour bien faire alors ??? ... si non, pourquoi ??? 3. Dans une page "HTML" banale, peut-on y insérer du "JS" avec du "XML", le tout encapsulé dans un "DHTML" interagissant avec le contenu d'un "SWG" interfacé "RSS" et transitant sous un protocole "HTTPS" sur un résaux "PPPoX" à partir d'un téléphone "GSM" ??? ... ... mais noooon, je rigoooole 1. Quand tu créer une page en XHTML tu n'utilise pas de XML, c'est juste mieux car ça t'oblige à faire du code propre Personnellement je te conseil vivement de ne pas faire de HTML 4 car il a atteint ses limites et pour une meilleur évoluabilité le mieux c'est le XHTML Choisit donc le XHTMl Transitionnel, ce sera le plus adapté car il permet encore certains écarts 2.Généralement dans un site la mise en page est récurrente et donc tout est faisable en CSS Donne moi un exemple de "reste", de plus tu peux attaché à une page une CSS supplémentaire spécifique à celle ci CSS pour la mise en page HTML pour le contenu JS pour l'interactivité (bien que CSS en fasse déjà une grande part) 3.Seulement à condition d'avoir passer tous tes fichiers situés le dossier publique en CH-mod 755 et les dossier en 77, avoir activé le partage SSH et l'accés FTP à ton serveur Apache et avoir tout prévu pour installation SPIP ou si c'est un Weblog TextPattern -------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
9 Jul 2004, 20:09
Message
#21
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
QUOTE (Belisarius @ 7 Jul 2004, 20:22) 1. Quand tu créer une page en XHTML tu n'utilise pas de XML, c'est juste mieux car ça t'oblige à faire du code propre Personnellement je te conseil vivement de ne pas faire de HTML 4 car il a atteint ses limites et pour une meilleur évoluabilité le mieux c'est le XHTML Choisit donc le XHTMl Transitionnel, ce sera le plus adapté car il permet encore certains écarts 2.Généralement dans un site la mise en page est récurrente et donc tout est faisable en CSS Donne moi un exemple de "reste", de plus tu peux attaché à une page une CSS supplémentaire spécifique à celle ci CSS pour la mise en page HTML pour le contenu JS pour l'interactivité (bien que CSS en fasse déjà une grande part) 3.Seulement à condition d'avoir passer tous tes fichiers situés le dossier publique en CH-mod 755 et les dossier en 77, avoir activé le partage SSH et l'accés FTP à ton serveur Apache et avoir tout prévu pour installation SPIP ou si c'est un Weblog TextPattern Salut à tous, et pardon Belisarius pour cette réponse tardive 1. Ok, merci du conseil. Donc, dans ce cas, quel serait le "DOCTYPE" approprié à utiliser ? 2. D'accord, mais je me disais qu'on pouvais faire la structure générale de la page directement dans le code HTML et le reste, c-à-d, les liens, les titres, les textes, etc. avec les feuilles de style CSS, mais bon, c'est vrai aussi que c'est bien plus souple de tout faire dans les CSS (plus facile à corriger, optimiser, adapter...)... Je vais donc m'atteler à explorer la piste du tout CSS, et il ne serait pas étonant que je revienne vous questionner à ce sujet... 3. Bein... là le Fredo est complétement largué C'est une vrai réponse ou c'est pour du faux ??? hein Merci
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
9 Jul 2004, 20:15
Message
#22
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 92 Inscrit : 15 Apr 2004 Lieu : Paris Membre no 17 678 |
Coucou Fredo
Mon petit conseil du jour http://www.neokraft.net/articles/les-standards-en-six-mois/ Sincèrement je pense que c'est un super point de départ. Et n'hésite pas à revenir poser des questions, ça nous oblige à "réviser" (enfin moi surtout - et aussi à apprendre !) -------------------- iMac Snow 500/640 - OS X.3.3
Trois blogs sinon rien : Mon blog perso, un autre pour apprivoiser Dotclear et un autre paske j'arrête de fumer et que c'est duuuuuuur ! |
|
|
|
|
9 Jul 2004, 21:17
Message
#23
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
Re coucou Kozlika
QUOTE (Kozlika @ 9 Jul 2004, 20:15) Coucou Fredo Mon petit conseil du jour http://www.neokraft.net/articles/les-standards-en-six-mois/ Sincèrement je pense que c'est un super point de départ. Merci pour le conseil, je sens que je vais avoir un week-end studieux QUOTE (Kozlika @ 9 Jul 2004, 20:15) Et n'hésite pas à revenir poser des questions, ça nous oblige à "réviser" (enfin moi surtout - et aussi à apprendre !) Je n'hésiterez pas une seconde, votre science (individuelle et collective) est impréssionnante, et comme je débute à peine, je suis sûr que j'ai encore des tas des choses à apprendre avec vous Au fait, j'avais l'intention, ce week-end, de m'offrir un ouvrage sur le dev HTML (en général, et le CSS en particulier), car les tuto sur le Web c'est bien mais pas vraiment pour les longues lectures (les longs textes sont assez difficile à lire à l'ecran, sans parler de la fatigue que celà occasionne)... alors, l'écran Non, mais l'eau ferrugineu... oups heuu... les bouquins Oui... Et, à vrais dire, je suis un peu pommé, et j'aurais apprécié votre avis, à première vue (à moins que vous les ayez), sur ces trois ouvrages que j'ai trouvé chez Eyroles (ou éventuellement si vous aviez un bon livre à me conseiller...) : - HTML 4 et CSS - HTML et XHTML - HTML & developpement Web Le dernier est un sacré pavé de 1500 pages, et je pense qu'il peut être pas mal pour avoir une vision globale du sujet, et avec des châpitres détaillant chaque procédé... qu'en pensez-vous ? Merci encore à tous
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
10 Jul 2004, 00:21
Message
#24
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
Salut Fredo,
Actuellement il n'y a pas de bon bouquin bouquin CSS XHTML en français que je connaise, néanmoins en passant à fnac hier j'ai vu XHTML et CSS de OReilly qui sont les meilleurs dans ce domaine mais comme il était sous célophanes ben j'ai pas pu y jeter un ooeil désolé si tu comprend l'anglais là par contre je pourrais t'en conseiller toute une floppée, perso j'en 3 nouveaux qui arrivent lundi ou mardi et j'en suis déjà tout exité -------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
10 Jul 2004, 14:54
Message
#25
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
QUOTE (Belisarius @ 10 Jul 2004, 00:21) si tu comprend l'anglais là par contre je pourrais t'en conseiller toute une floppée, perso j'en 3 nouveaux qui arrivent lundi ou mardi et j'en suis déjà tout exité Salut Belisarius Et non, malheureusement mon anglais est quasi nul, même si parfois j'arrive à piger le sens d'une phrase, ce n'est pas suffisant pour ce type de lecture. Bon, comme j'habite près de Paris, j'y vais de ce pas chez Eyrolles, qui est, à ma connaîssance, la seule librairie aussi bien fournie en ouvrages techniques et informatiques... T'inquiètes, si je trouve quelque chose, je vous tiens au courant... Merci encore à tous pour vos conseils avisés
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
11 Jul 2004, 05:34
Message
#26
|
|
|
Adepte de Macbidouille Groupe : Membres Messages : 236 Inscrit : 12 May 2003 Membre no 7 543 |
Bon, comme promis, je vous informe que j'ai fini par craquer sur le gros pavé de 1500 pages
: HTML & Développement Web...J'ai déjà appris des petites choses en lisant les premières pages (bon, c'est pas bien dure vous me dirait, puisque je suis débutant, mais bon, c'est plutôt rassurant )...Enfin, dans le CD fourni (uniquement PC qu'ils disent ) j'ai trouvé la totalité des pages en français du site SelfHtml (dont le livre est, selon ce que j'ai cru comprendre, la version papier), des cliparts (heu... je ne vois pas bien l'utilité, mais bon, disons que c'est du bonus), certains navigateurs (surtout pour PC) et l'ensemble des spécifications de la W3C... pas mal je trouve Voilô, vous savez tout...
-------------------- Fredo d;o)
"Un pas à la fois me suffit..." (Gandhi) |
|
|
|
|
11 Jul 2004, 06:39
Message
#27
|
|
 ssschhuuuutttttt Groupe : Membres Messages : 3 745 Inscrit : 28 Aug 2003 Lieu : Paris Quartier Latin Membre no 9 257 |
QUOTE (Fredo d;o) @ 11 Jul 2004, 06:34) site SelfHtml Signalons en passant que c'est un excellent site. Quiconque s'intéresse à la programmation web sans l'avoir dans ses favoris sera sévèrement châtié Plus sérieusement, c'est un excellent site de référence [edit]Arf, j'étais passé à côté ce çà ->QUOTE (Belisarius @ 5 Jul 2004, 15:19) le code de ce forum : d'ailleurs on nous rabat les oreilles vis à vis des 56k et des images alors que la page est tout sauf optimisée (cf la CSS)) 1) choose your enemy Ce sont (si je ne m'abuse) les administrateurs de Macbidouille qui parlent souvent de design léger et d'accessibilité aux 56k, mais ce n'est pas eux qui ont scripté le forum. Donc ce genre est à reprocher est à Matt Mecham chez IPS 2) çà arrive La version 2 d'Invision fait/fera appel à une CSS externe, donc ce problème a été entendu par qui de droit  Bien qu'étant très à cheval aussi sur les questions de standards, je n'ose toutefois pas gueuler contre Invision. Un des rares forums qui soit totalement inhackable, pas la moindre faille de sécurité, et surtout vaut voir la tête des scripts php Y'a eu du boulot, soyons clément sur les petits défauts. Surtout qu'il est léger en requêtes par rapport à phpBB
Ce message a été modifié par Angrave - 11 Jul 2004, 06:49. -------------------- -Config maison: (Mac) iBook PowerPC G3 256MB 700Mhz 10.3.4 (Panther) Classic 9.2.2 15" 2048k chez 9online / iPod 10GB 3èG
-Config boulot: (Pc) IBM 8319PGG 512MB 1.80Ghz XP Pro 19" 2048K via réseau d'entreprise Ardent défenseur de la fonction recherche  |
|
|
|
|
11 Jul 2004, 09:38
Message
#28
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
Je n'ai rien contre ce forum Angrave, je donne un coup de main à un pote et je recode tout un template (6000 lignes de code) et leurs 26000 tableaus imbriques m'a énervé un peu
-------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
11 Jul 2004, 18:08
Message
#29
|
|
|
ssschhuuuutttttt Groupe : Membres Messages : 3 745 Inscrit : 28 Aug 2003 Lieu : Paris Quartier Latin Membre no 9 257 |
C'était juste pour bien différencier
Invision est un bon produit mais ne se veut effectivement pas forcément le plus conforme aux standards.La V2 sera conforme. 26 000 tableaux ? c'est beaucoup 
-------------------- -Config maison: (Mac) iBook PowerPC G3 256MB 700Mhz 10.3.4 (Panther) Classic 9.2.2 15" 2048k chez 9online / iPod 10GB 3èG
-Config boulot: (Pc) IBM 8319PGG 512MB 1.80Ghz XP Pro 19" 2048K via réseau d'entreprise Ardent défenseur de la fonction recherche |
|
|
|
|
11 Jul 2004, 18:10
Message
#30
|
|
|
Macbidouilleur de vermeil ! Groupe : Membres Messages : 1 311 Inscrit : 5 Mar 2003 Lieu : Grenoble Membre no 6 522 |
QUOTE (Angrave @ 11 Jul 2004, 18:08) C'était juste pour bien différencier Invision est un bon produit mais ne se veut effectivement pas forcément le plus conforme aux standards.La V2 sera conforme. 26 000 tableaux ? c'est beaucoup à Marseille du moins ...
-------------------- MacBook Pro 2.2 - 2Go - 120Go
|
|
|
|
|
1 utilisateur(s) sur ce sujet (1 invité(s) et 0 utilisateur(s) anonyme(s))
0 membre(s) :
| Nous sommes le : 16th May 2024 - 21:22 |