fr.comp.infosystemes.www.auteurs
Objet: [FAQ] Html, Css, Dom
Date: Fri, 16 Apr 1999 20:42:49 GMT
De: Raphael.Maree@student.Ulg.ac.be (Raphael Maree)
Forums: fr.comp.infosystemes.www.auteurs,fr.usenet.reponses
Suivi-A: poster
Archive-Name: fr/faq-HtmlCssDom
________________________________________
| |
| [FAQ] HTML, CSS, DOM |
| |
|____fr.comp.infosystemes.www.auteurs____|
Théoriquement, ce document regroupe les questions relatives à l'HTML,
aux CSS et au DOM fréquemment posées dans ce groupe.
En pratique, ce document contient une foultitude de liens www
brièvement commentés.
Il est donc préférable de consulter ce document avant de poser une
question relative à ces thèmes dans ce groupe.
Ce document se voulant être utile et pratique, vos remarques,
critiques et propositions de modifications et d'ajouts sont attendues
à cette adresse: Raphael.Maree@student.ULg.ac.be
Remerciements:
Vincent Lefèvre, Christian Perrier, Éric Demeester, Marc Mongenet,
Karl Dubost.
___________________________________________________________________
0. Mises à jour
- 1.2 (16 février 1999): version française du HTML 4.0
- 4.4 (2 février 1999): css-mode pour Emacs.
- 4.1 (3 janvier 1999): Amaya 1.4
- 4.2 & 4.3 (8 décembre 1998): Macromedia Dreamweaver 2
___________________________________________________________________
1. HTML
1.0 Introduction
1.1 Versions, spécifications
1.2 Guides
1.3 Pour vérifier votre HTML
2. CSS
2.0 Introduction
2.1 Versions, spécifications
2.2 Guides
2.3 Pour vérifier vos CSS
3. DOM, DHTML
3.0 Introduction
3.1 Guides
4. Logiciels de création
4.0 Introduction
4.1 Amaya
4.2 Pour Windows
4.3 Pour MacOS
4.4 Pour Unix
5. Sites www fédérateurs
___________________________________________________________________
=-=-=-=-=-=-= 1. HTML =-=-=-=-=-=-=
1.0 Introduction
----------------
Écrire des pages en HTML ne nécessite pas de notions de programmation
ou d'informatique. Par contre, un minimum de rigueur est requis lors
de l'écriture de la structure d'une page.
Le but de l'HTML n'est pas de faire de la mise en page (il faut
utiliser les CSS, voir section suivante) mais bien de structurer un
document: titre, sous-titres, paragraphes, ...
Puisqu'il vous est impossible d'évaluer le résultat de vos pages avec
tous les browsers existants sur les multiples plate-formes du marché,
respectez les recommendations du W3C: http://www.w3c.org/MarkUp/ qui
sont en principe respectées par tous les browsers.
Le W3C n'est pas une organisation occulte, c'est un groupement (un
consortium) des "grands" du monde de l'information, de la
communication et de l'informatique en général. Voir
http://www.w3c.org/Consortium/Member/List.html
1.1 Versions, spécifications
----------------------------
La dernière version de l'HTML est la version 4.0
Les recommendations du W3C sont disponibles, en anglais sur
http://www.w3.org/TR/REC-html40/
En cours, une traduction en français:
http://www.normandieweb.org/karl/HTML4/
1.2 Guides
----------
L'HTML 4.0 en français et agréablement présenté:
http://noirblan.citeweb.net/toc.html
http://www.htmlhelp.com/reference/html40/
En anglais, une approche plus didactique de l'HTML 4.0 que le site du
W3C: les nouveautés de cette version, la structure de l'HTML, une
liste alphabétique ou organisée des balises, une table des caractères
spéciaux (Latin-1, Symbol, Grecs).
On peut télécharger ce guide (format .zip) ici:
http://www.htmlhelp.com/distribution/
Un chapitre d'UNGI est consacré aux nouveautés apportées par
l'HTML 4.0 par rapport à l'HTML 3.2 (en français) :
http://ungi.nirvanet.net/chap29.htm
1.3 Pour vérifier votre HTML
----------------------------
Le W3C propose gratuitement la validation de l'HTML de tout URL
directement sur le site http://validator.w3.org/
_____________________________________________________________________
=-=-=-=-=-=-= 2. CSS =-=-=-=-=-=-=
2.0 Introduction
----------------
Les balises et attributs de présentation de l'HTML (<FONT> , ...) sont
désapprouvés (et tendent donc à disparaître) par le W3C au profit des
Cascading Style Sheets (feuilles de style) qui permettent de mettre en
page un document de manière beaucoup plus souple.
Par mise en page on entend polices de caractères, couleurs,
positionnement (marge, "indentation", etc.) et divers effets visuels.
Les CSS se superposent à l'HTML. Leur utilisation ne rend donc pas
impossible l'accès au contenu pour les visiteurs utilisant un
butineur ne reconnaissant pas les CSS (ou les personnes ayant
désactivés les CSS), le contenu sera simplement présenté selon les
préférences du browser du visiteur.
On trouve plusieurs documents expliquant l'intérêt de la séparation de
la structure (HTML) et de la présentation (CSS) d'un document à partir
d'ici http://www.w3.org/Style/ et d'ici http://www.w3.org/WAI/
Notamment, le caractère nuisible des <FONT> de l'HTML:
http://www.mcsr.olemiss.edu/~mudws/font.html (anglais) et
http://www.isoc.org:8080/web_ml/html/fontface.html (en français).
2.1 Versions, spécifications
----------------------------
La dernière version des CSS est la version 2 dont les recommendations
du W3C sont disponibles en anglais ici: http://www.w3.org/TR/REC-CSS2/
2.2 Guides
----------
http://www.htmlhelp.com/reference/css/
Le Web Design Group propose cette référence en anglais des CSS 1.
UNGI propose une introduction en français aux CSS (niveau 1):
http://ungi.nirvanet.net/style.htm
D'autres liens: http://www.w3.org/Style/css/#learn et
http://css.nu/pointers/
2.3 Pour vérifier vos CSS
-------------------------
À l'instar du "validateur HTML", le W3C vous propose de vérifier
on-line ou off-line (classes java à télécharger) vos déclarations de
style sur le site: http://jigsaw.w3.org/css-validator/
_____________________________________________________________________
=-=-=-=-=-=-= 3. DOM, DHTML =-=-=-=-=-=-=
3.0 Introduction
----------------
Le "Document Object Model" (modèle objet du document) est le squelette
d'un document. Il définit la structure d'un document (sous forme
d'arbre) et permet l'accès à ses éléments constitutifs. Ainsi, ce
"langage" permet de modifier dynamiquement le contenu, la structure et
la présentation d'un document.
Les recommendations du W3C en anglais:
http://www.w3.org/TR/REC-DOM-Level-1/
L'ancêtre non-standardisé du DOM est le Dynamic HTML (DHTML), il
regroupe les feuilles de style (CSS), l'HTML et le JavaScript. À ma
connaissance, il n'existe qu'à partir des versions 4 de Netscape
Navigator et Microsoft Internet Explorer et dans des versions
différentes (N-Navigator utilise la balise <LAYER>, les instructions
JavaScript layerWrite, etc.). Donc à utiliser avec modération et
attention.
3.1 Guides, didacticiels
------------------------
Une introduction au DOM en français:
http://www.webdeveloppeur.com/DHTML/DOM.html
Concernant le DHTML, on trouve une foultitude de guides, Resauce
http://www.digitalthread.com/resauce/ en répertorie, parmi ceux-ci:
http://www.dansteinman.com/dynduo/
Dynamic Duo, en anglais, une trentaine de "leçons" sous forme
d'exemples pour réaliser des effets visuels ou sonores sous
N-Navigator et MS-Internet Explorer. À consulter en ligne ou à
télécharger.
_____________________________________________________________________
=-=-=-=-=-=-= 4. Logiciels de création =-=-=-=-=-=-=
4.0 Introduction
----------------
Concevoir des pages HTML ne nécessite pas un logiciel particulier, de
par la nature de ces pages: un fichier texte.
Ainsi, le "bloc-notes" de Windows, "SimpleText" du MacOs ou "vi" sous
Unix sont suffisants.
Cependant, il existe de nombreux logiciels d'édition de pages HTML,
ils sont de deux sortes.
- La famille des éditeurs en mode texte où l'on tape soit-même le
"code" de la page. Ces éditeurs sont agrémentés d'une multitude
d'icônes et boîtes de dialogues qui permettent d'accélerer
l'insertion d'élements comme les images, tables, frames, style
sheets, etc.
- La seconde famille est celle des éditeurs wysiwyg, contraction de
"What you see is what you get". En d'autres termes, on y édite sa
page HTML comme on édite un document avec un traitement texte
(Ms-Word ou autres), ce qui est bcp plus facile pour débuter.
L'insertion d'éléments se fait en les déplaçant, les
redimensionnant,... le tout (ou presque) à la souris.
L'inconvénient majeur de certains de ces éditeurs est qu'ils
produisent parfois (souvent) du code illisible et mal organisé, par
exemple: <I></I><I>italique</I><I></I> et d'autres absurdités.
On peut trouver une liste et un tableau comparatif d' éditeurs
wysiwyg ici: http://ungi.nirvanet.net/chap27.htm
4.1 Amaya
---------
Amaya est à la fois un éditeur wysiwyg et un browser. Il est développé
par le W3C et permet par conséquent de tester les dernières nouveautés
en matière d'HTML. Il supporte le format d'image PNG, partiellement
les CSS et inclut un éditeur d'équations mathématiques en MathML.
La version 1.4 est disponible (sources et binaires) ici
http://www.w3.org/Amaya/ pour Unix (solaris, aix, sgi, ...),
Windows'95/NT, Linux.
4.2 Pour Windows
----------------
- Éditeur HTML en mode texte:
* Homesite d'Allaire.
Une version de 1996, la 1.2, est freeware (c-à-d gratuite).
La dernière version en date est la 4.0 et est disponible sur
http://www.allaire.com/ en version d'évaluation non bridée.
Cette version intègre un mini-éditeur wysiwyg, un parser (pour
valider le code HTML de vos pages), un éditeur de feuilles de
style, une documentation complète sur l'HTML et toutes les options
des précédentes versions: coloration syntaxique (que l'on peut
configurer), "templates", recherche avancée, etc.
Il supporte l'HTML 4.0.
Son interface est souple et bien pensée.
Une critique plus complète: http://altern.org/bugraph/info/hs4.htm
- Éditeur wysiwyg:
* Dreamweaver 2.0 de Macromedia.
http://www.macromedia.com/dreamweaver/
Il supporte l'HTML 4.0, permet l'édition d'un grand nombre d'attributs
de présentation CSS, nettoie le code HTML (en retirant les balises
redondantes et en le formattant), importe du XML, permet
d'effectuer des effets visuels rapidement (déplacement d'objets,
OnMouseOver, ...).
Une version d'évaluation non bridée est disponible sur le site.
* HotMetaL 5.0 de SoftQuad, http://www.sq.com/
Selon Christian Perrier:
« HotMetaL 4.0 ne sort QUE du HTML valide... (...) HoTMetaL
possède également, comme tout bon outil SGML, des mécanismes
pour s'adapter à l'évolution de la DTD HTML. (...) »
Une version d'évaluation limitée d'HoTMetaL Pro 4.0 est
disponible en téléchargement ici:
http://www.softquad.com/products/hotmetal/hm-ftp.htm
(taille du fichier: 20mo)
- Sur http://www.davecentral.com/webauth.html on trouve des critiques
d'éditeurs de pages www, mais aussi de nombreux utilitaires:
statistiques, vérification des liens, convertisseurs, création d'image
map, serveurs www, etc.
4.3 Pour MacOs
--------------
- Éditeur en mode texte:
* BBEdit de BarBones software,
http://www.barebones.com/
- Éditeur wysiwyg:
* FreeWay 2.0 de SoftPress, http://www.softpress.com/
Il supporte les CSS, l'HTML 4.0, le DHTML.
Démo de 30 jours.
* CyberStudio 3.1 de GoLive, http://www.golive.com/
Support des Css, layers, Javascript.
* Dreamweaver 2.0 de Macromedia.
http://www.macromedia.com/dreamweaver/
Voir section 4.2
- Autres utilitaires en tous genres: http://arpp.carleton.ca/mac/tool/
4.4 Pour Unix
-------------
- Éditeur en mode texte:
* AsWedit 4.0 d'Advasoft, http://www.advasoft.com/asWedit.html
Il a un bon nombre de ressemblances avec Homesite sous Windows, il
propose entre autres:
-coloration syntaxique
-l'insertion +/- "paramétrable" d'images, tables, frames et
formulaires, listes, etc.
-insertion de caractères spéciaux (des sigles droits d'auteurs aux
majuscules accentuées en passant par l'alphabet grec)
Il offre également quelques outils et filtres (il est possible
d'en créer soi-même) pour vous faciliter l'édition.
Toutes ces options ne sont accessibles qu'en activant le mode HTML
qui vérifie que l'HTML de la page est correct.
Support de l'HTML 4.0.
* GNU Emacs agrémenté du 'html-mode' et du 'css-mode'.
http://www.stud.ifi.uio.no/~larsga/download/css-mode.html
____________________________________________________________________
=-=-=-=-=-=-= 5. Sites www fédérateurs =-=-=-=-=-=-=
http://www.devsearch.com/ (en)
DevSearch vous permet de faire des recherches (mot ou phrase)
parmi de nombreux sites de références (html, css, dom, perl, etc.)
dont W3.org, Builder.com, Apache.org, DHTMLZone, InsideDHTML,
Linux.org, MS Sitebuilder, Perl.com, WebMonkey.
http://www.useit.com/ (en)
L'utilisation du www, les erreurs à ne pas commettre, l'actualité,
etc.
http://www.infohiway.com/faster/index.html (en)
The « Bandwidth Conservation Society », conseils pour la création de
pages www, astuces pour alléger les images, etc.
http://www.worldnet.fr/~hertgen/anybrowser.html (fr)
La campagne « best viewed with any browser », pourquoi écrire de
l'HTML conforme, comment réaliser un site accessible, etc.
http://www.stud.ifi.uio.no/~larsga/linker/XMLtools.html (en)
Une liste d'outils (editeurs, parsers, browsers, convertisseurs)
XML, XSL, DSSL, DOM.
http://www.eyrolles.com/livres/michard/ (fr)
Logiciels (éditeurs, boîtes à outils, etc.) et exemples XML.
http://ungi.nirvanet.net/ (fr)
Les chapitres 26 à 52 sont consacrés à la conception
www dont l'HTML, les CSS, le DHTML et les outils de création.
___________________________________________________________________
___________________________________________________________________
| Christophe Merlet redfox@redfoxcenter.org | ©Tous droits réservés
26 avril 1999 |