Hébergement Gratuit :
www.abc-du-gratuit.com : liste
d'hébergeurs et d'aides à la création
HTML :
Le HTML est un langage
qui permet de
composer des pages web. Sa syntaxe est claire et intuitive. Les
commandes
qui sont appelées balises, markups ou
tags sont
insérées à l'intérieur
de chevrons
: <commande>. Les
valeurs à préciser sont placées entre
guillemets. En général, il y
a toujours une balise de départ <commande> et
une balise
de fin </commande>.
Un site web s'ouvre toujours par une première page/fichier
nommé index.html ou .htm. Il faut donc créer
d'abord un
fichier.html grâce à un simple éditeur
de texte ou
avec des outils
spécialisés et l'envoyer sur
le
site via
un protocole internet d'envoi de fichiers (ftp://adresse-ftp-du-site).
Notes :
- Il existe plusieurs versions
du langage html, attention donc de bien entrer les balises reconnues !
- On peut afficher toute page
web dans sa version html en cliquant source dans les
options d'affichage de votre navigateur.
- On précise les dimensions de façon absolu en
pixel (n
px) ou de façon relative en pourcentage d'écran
(n %).
Une page
web html est toujours structurée de la
même façon :
<html>
<head>
<title>"...titre
de la page web..."</title>
</head>
<body>
"...corps du texte..."
</html>
Quelques exemples de
balises :
Texte
| Couleur
de texte |
<font
color="magenta">.....texte en
magenta...</font> |
| Ou définir la
couleur en rgb |
<font
color=#rrggbb> |
| Grandeur de titre |
<h1> ou moins
<h2> ou moins <h3> |
| Gras (texte) |
<b>...texte mis
en gras...</b> |
| Type
de police |
<font
face="arial">....texte
en arial......</font> |
Paragraphe
| Alignements |
<align=top, right,
bottom,
left>...texte aligné...</align> |
| Centrer |
<center>...texte
centré....</center> |
| Marge
(gauche par défaut) |
< margin= n
px>...marge du texte à
n pixels...</margin> |
| Marges précises |
<margin_top= n
px>...marge du sommet...</margin> |
| ......................... |
<margin_left, bottom,
right> |
| ......................... |
<margin= n px n px n px
n px>...marges
haut, droite, bas, gauche...</margin> |
| Paragraphe |
<p>...paragraphe...</p> |
| Saut de ligne |
<br> (pas de
balise
de fin) |
| Trait tiré |
<hr> |
Liens (ancres)
| Lien hypertexte (url) |
<a
href="http://urldusite">...texte
apparent (appelé ici ancre)...</a> |
| --------------- (email) |
<a
href="mailto:adresse-email@.com">...texte
apparent...</a> |
|
|
| Lien interne |
<a
href="#label1" name="retour1">...voyez la
note1...</a> |
| Et pour le retour |
<a href="#retour1"
name="label1">...note1(retour)....</a> |
(name précise le nom
du label et #label est l'adresse du lien interne)
Image
| Insérer
précisément une image |
<img
src="http://url-de-l'image" width="n px"
height="n px" border="n px" style="margin-left : 50;"> |
(marge de gauche à
50 pixels)
Balises meta
Les balises meta donnent des indications sur la page web et servent
nottamment aux robots référenceurs. Elles sont
à
placer dans la partie head.
| Description du contenu |
<meta name=
"description" content="...votre description..."> |
| Mots clefs |
<meta name="keywords"
content="...vos, mots, clefs..."> |
| Ce que le robot doit lire |
<meta
name="robots" content="index, followall"> |
(en
général on donne l'indication de tout lire. Sinon
noindex, nofollow, etc...)
| Fréquence
de mise à jour |
<meta
name="revisit-after"
content="7 days"> |
(par exemple ici tous les 7
jours)
Autres
| Ne pas insérer |
<noembed>...ce
qu'il ne faut pas insérer...</noembed> |
| Adresse en bas de page |
<address>...je
remercie tout le monde...</address> |
HTML =>
Editeur
: (retour présentation
html)
Il existe diverses
solutions pour éditer un fichier html. Soit on tape tout
directement en langage html et alors un simple éditeur de
texte (blocnote, notepad, wordpad, etc...) est requis (mais pas un
traitement de
texte type word), soit on utilise des outils
spécialisés comme des éditeurs visuels
WYSIWYG (what you see is what you get). On peut citer Netscape
Composer, Front Page Express (exclusif microsoft), Dreamweaver ou Nvu
(niew view), logiciel
libre
dérivé de l'ancien
Mozilla Composer.
www.nvu.com/
: le site du logiciel Nvu en anglais
frenchmozilla.sourceforge.net/nvu/
: pour ceux qui préfèrent la version
française
