   
|
C'est quoi le HTML ?
Tout d'abord sachez que le HTML (Hyper Text Markup Language)
n'est pas un langage de programmation rassurez vous !
Il s'agit en fait de balisage de texte... Une chose simple
que n'importe quel humain non mathématicien pourra comprendre
!
Imaginez simplement que vous préparez un texte pour une
autre personne qui devra le mettre en page sur une machine spéciale
sans avoir à réfléchir. Pour rendre lui la
tâche plus facile, vous devrez lui fournir un texte qu'elle
lira de haut en bas (simple pour le moment non ?) en suivant avec
précision les indications que vous aurez inscrit (sur le
type de police à utiliser, sa taille, les images à
intégrer etc...).
Ces indications, pour plus de simplicité encore, seront réduites
au minimum en utilisant uniquement des abréviations de quelques
lettres et en les plaçant entre les signes < et > pour
bien les dintinguer du reste du texte. On appellera ces indications
de mise en page : des balises !
Ce texte codé, dont nous venons de parler, sera en réalité
lu par une machine (donc pas intelligente) et retranscrit tel
quel. Vous n'aurez alors que peu de droit à l'erreur et
vous devrez être très précis dans vos indications.
Exemple : Pour le moment rien à retenir !!! Je veux juste
vous montrer la simplicité du HTML !
Pour dire à l'ordinateur de mettre un texte en gras (qui
se dit BOLD en anglais) vous n'aurez qu'à inscrire <B>
dans votre code juste avant le mot ou la phrase à mettre
en gras. Par contre, il faudra aussi dire à l'ordinateur
quand arrêter d'écrire en gras en indiquant </B>
(notez l'ajout du signe / qui veut dire "fin du") à
la fin de votre texte.
|
Voici ci-dessous un exemple de code d'une page
HTML, ne vous occupez pas des différentes balises que vous
ne connaissez pas, n'essayez pas de refaire cette page...
Je vous demande uniquement de chercher à partir de quel moment
j'ai indiqué à l'ordinateur de passer le texte en
gras et quand je lui ai dis d'arrêter de mettre du gras. |
<HTML>
<HEAD>
<TITLE>Ma première page web</TITLE>
</HEAD>
<BODY>
Le petit prince rencontra alors <B>le serpent</B>
et lui dit "bonjour, qui es tu ?"...
</BODY>
</HTML>
|
Solution de l'exercice :
Vous avez trouvé ? C'était simple n'est ce pas
? Le texte en gras est "le serpent" !
Cette ligne de texte aurait donc pour résultat :
Le petit prince rencontra alors le serpent et lui dit "bonjour,
qui es tu ?"...
En clair l'ajout de <B> permet de mettre en gras !
 
Pigeon sans <B> Pigeon avec <B> :)))
Eh bien vous connaissez maintenant le principe de base du HTML
: l'utilisation de balise pour donner des ordres au navigateur
!
En ayant bien compris cela vous allez voir que maintenant tout
va aller bien plus vite.
|
| Pour le moment je vous demande de ne retenir
aucun code HTML. Je vous les indique uniquement à titre
d'exemples et pour mettre une première image sur ce que vous
allez faire plus tard... Ne paniquez donc pas si vous ne comprenez
que 1% des balises utilisées. |
" Je ne comprends toujours pas comment le navigateur
peut reconnaître ça ? "
Rassurez-vous, nous vous expliquerons en détail chaque
balise que vous pouvez voir ci-dessus et vous les comprendrez
aussi. Mais pour vous montrer dès maintenant que c'est
très simple, sachez que votre navigateur (Internet Explorer,
Netscape...) retranscrit la page HTML en prenant en compte les
balises (les mots ou ensemble de lettre entre les signes <
et >) comme des ordres à executer... Le reste du texte
est affiché en fonction de ces ordres...
Ainsi, dans notre exemple ci-dessus, le navigateur n'affichera
pas les signes <B> et </B> mais affichera "le
serpent" en y appliquant l'ordre que vous lui avez donné...
Et cet ordre est ...... ??? Ouiiii de mettre le texte en gras
(B=BOLD=Gras en anglais) !!! Quand je vous le disais que c'était
simple !
" Mais où dois je mettre ces codes pour les voir
sur Internet ? "
En fait, c'est une fois de plus très simple mais vous
devez procéder étape par étape.
Ces codes se trouvent dans un simple fichier texte dont on a remplacé
l'extension .txt par .html
Ce fichier a été ensuite placé sur Internet
chez un hébergeur de site (comme multimania par exemple)
mais tout cela est une autre histoire dont nous vous parlerons
plus tard.
" Dois-je être connecté à Internet
pendant la création de mon site ? "
Pas du tout. Pour faire votre page web vous n'aurez pas à
être connecté (sauf pour lire ces cours si vous ne
les imprimez pas).
Vous pouvez très bien, sans connexion, créer entièrement
un site, puis, quand vous serez content du résultat, le
mettre en ligne. C'est d'ailleurs ce que nous allons faire et
ce que tout les créateurs de sites font. Evidemment, tant
que vous ne l'aurez pas mis en ligne votre site vous serez le
seul à pouvoir y accèder.
" Mais il existe des logiciels pour créer des sites
Web ? Pourquoi ne pas les utiliser ça irait plus vite ?
"
Vous connaissez et pensez peut être en ce moment à
"Dreamweaver" de Macromédia ou d'autres logiciels
qui aident à la création de page web.
Eh bien, voici les quelques raisons qui me font penser et affirmer
qu'il vaut mieux passer par le HTML pour débuter :
1. Le HTML c'est simple et gratuit !
Simple : je vous le prouverais.
Gratuit : puisque vous n'avez pas de logiciels payants à
avoir sur votre machine (vous pouvez faire un site uniquement
avec l'éditeur de texte de Windows).
2. Connaitre le HTML c'est utile pour utiliser les logiciels
de création de site !
Les logiciels comme Dreamweaver et ses camarades ne sont pas
parfaits, ils génèrent parfois des erreurs, ou des
choses étranges et incompréhensibles si on ne connait
pas le HTML ! Mais en connaissant le HTML vous serez sauvé
! En fait, pas un seul intégrateur (à ma connaissance)
ne fait de site HTML sans connaitre un minimum le code !
3. Vous trouverez pleins d'aides, d'astuces, et de conseils pour
le HTML et beaucoup moins pour des logiciels spécifiques
!
En effet, en apprenant le HTML, vous vous ouvrez la porte à
des centaines de sites de passionnés qui vous aideront
pour tout vos problèmes et vous apprendront à faire
de votre site une chose exceptionnelle !
Quand on utilise uniquement un logiciel sans connaitre le HTML
c'est bien plus compliqué de profiter de ces astuces et
d'intégrer un javascript ou un applet Java (je suis conscient
de vous parler peut être chinois pour le moment mais croyez
moi vous serez tenté par cela plus tard)...
4. La chasse aux sources vous sera ouverte !
En connaissant le HTML, vous pourrez en vous déplaçant
sur le Net trouvez des choses intéressantes sur certains
sites que vous pourrez voler honteusement en affichant le code
source de la page (d'un clic droit sur la page HTML) ! Sans connaitre
le HTML, ça vous sera vraiment plus compliqué !
|
Les balises sont composées d'une à
plusieurs lettres encadrées par des signes <> (exemple
: <B>). Dans la majorité des cas, vous devrez utiliser
une balise d'ouverture et une balise de fermeture définie
par le signe / (exemple : </B>), cela afin de préciser
le début de l'ordre et sa fin (exemple : <B>ce texte
sera en gras</B>)
- Le code HTML, ce n'est qu'une série de balises que le
navigateur va interpréter dans le même ordre que
celui de la lecture (de haut en haut et de droite à gauche).
- Une page HTML est en fait un simple texte avec l'extension .html
ou .htm (de la même façon qu'un document Word a pour
extension .doc par exemple...)
- Pour faire votre site pas besoin d'être connecté.
Vous devrez vous connecter uniquement pour le mettre en ligne...
|
|