Un article de la semaine au hasard • Un Super article au hasard
Que pensez-vous de Vikidia ? Venez mettre un message sur le livre d'or !
Hypertext Markup Language
| Hypertext Markup Language | |
|---|---|
| Voici un exemple de l'icone d'un fichier HTML | |
| Auteur(s) | WHATWG |
| Développeur(s) | WHATWG et W3C |
| Première version | 2014 |
| Dernière version | 5.2 (2017) |
| Type | Langage de balisage |
| Extension de fichier | .htlm |
| Dérivé de | S6ML |
| État | Actif, toujours utilisé |
| Modifier | voir modèle • modifier |
Le HTML, ou HyperText Markup Language en anglais, est un langage informatique de balisage qui sert à écrire une page Web. Il s'ajoute généralement au CSS, un langage de style, bien que ça ne soit pas obligatoire.
On peut retrouver le code HTML d'une page en faisant un clic droit sur la page, puis "Code source de la page".
Il y a plusieurs versions de HTML : HTML 1, HTML 2, HTML 3.2, HTML 4, HTML 5. Il existe aussi des déclinaisons du HTML, comme le XHTML 1.0.
La base d'une page en HTML[modifier | modifier le wikicode]
Voici le code de base d'une page écrite en HTML5 :
<!DOCTYPE html>
<html>
<head>
<title>Le titre de la page</title>
<meta charset="utf-8" >
<!-- cela sert à préciser l'encodage, c'est-à-dire comment les lettres sont codées pour que l'ordinateur sache comment les lire. La balise <meta> est très spéciale : elle n'a pas besoin de /> pour terminer. -->
</head>
<body>
<p>Ici se trouve le texte de votre page !</p>
</body>
</html>
Quelques balises[modifier | modifier le wikicode]
Toutes ces balises se mettent entre les balises <body> et </body>. En effet, il n'existe que très peu de balises qui se mettent dans le header.
Un lien hypertexte[modifier | modifier le wikicode]
Vous pouvez mettre un lien hypertexte dans votre page, il suffira alors de cliquer dessus pour accéder à la page demandée.
Voici la balise à utiliser pour ajouter un lien :
<a href="url_de_la_page_cible">Le texte à cliquer pour le lien</a>
Exemple[modifier | modifier le wikicode]
Par exemple, si nous voulons insérer un lien vers Wikipédia, nous utiliserions la balise ainsi :
<a href="https://fr.wikipedia.org/">Wikipédia</a>
Ce qui donne : Wikipédia.
Une Section[modifier | modifier le wikicode]
On peut ajouter une section à notre page, pour séparer un zone de etxte, ou pour autre chose . Voici la balise utilisée pour créer une section :
<main>
<section>
<h2>titre de la section</h2>
Intérieur de ta section, par exemple, un paragraphe<p></p>
</main>
</section>
Exemple[modifier | modifier le wikicode]
Imaginons que vous voulez faire deux sections différentes pour décrire un artiste mentionné dans votre page.
<main>
<section>
<h2>Rik Riordan</h2>
<p>Il a écrit Percy Jackson ainsi que Les chroniques de Kane.</p>
</section>
<section>
<h2>Tui T. Sutherland</h2>
<p>Sous cette femme se cache trois auteure à succès.</p>
</section>
</main>
Une image[modifier | modifier le wikicode]
Vous pouvez également ajouter une image dans une page HTML.
La balise d'image, img, s'utilise ainsi :
<img src="URL_de_l'image" alt="Texte alternatif" title="Infobulle informative sur l'image" />
Parmi les attributs, seul src est obligatoire, mais les autres peuvent servir. Voici la liste des attributs que peut prendre img :
- src (obligatoire) : L'URL de l'image.
- alt : Le texte alternatif de l'image (alternative textuelle). Celui-ci sera affiché en cas d'erreur, si l'image ne peut pas s'afficher.
- title : Si vous le renseignez, un texte informatif sur l'image s'affichera au survol.
- Il y en a aussi d'autres, mais les trois ci-dessus sont les plus utilisés.
Exemple[modifier | modifier le wikicode]
Voici un exemple, imaginons que vous souhaitez afficher une image qui s'appelle « arbre. png » et qui se trouve dans le dossier « images » ; Vous ferez donc ainsi pour l'afficher :
<img src="images/arbre.png" alt="Un arbre" title="Photo du noisetier dans mon jardin."/>
Et vous avez votre image qui s'affiche !
Et quelques autres en vrac[modifier | modifier le wikicode]
<head> : élément de métadonnées (en-tête du document).
<html> : Indique que le "script" est du Html.
<link> : élément de lien vers des resources externes.
<p> : élément paragraphe.
<a> + <href> : élé ment de lien hypertexte.
<strong> : généralement, il mets en gras.
<ul>: représente une liste d'éléments.
Et bien d'autres ![modifier | modifier le wikicode]
Il existe un nombre considérable de balises, c'est pourquoi nous ne pourrons pas toutes les citer dans cet article. Cependant, vous pouvez les trouver en faisant une simple recherche sur Internet.
D'autres langages[modifier | modifier le wikicode]
Un site Web c'est bien, même statique (qui reste toujours le même), mais un site Web dynamique et interactif, c'est mieux. Certains langages ont été conçus pour cela:
- Il y a par exemple le DHTML, Dynamic HTML qui sert à faire des animations, par exemple, intégrées dans un code HTML.
- Il existe aussi le Javascript, qui est assez similaire au DHTML.
- Il existe aussi le langage PHP (PHP Hypertext Preprocessor) qui a la particularité d'être un langage serveur, c'est-à-dire que c'est le serveur qui gère la page avant de l’envoyer à l'utilisateur.
Et il y en a bien sûr beaucoup d'autres!
Liens externes[modifier | modifier le wikicode]
Les langages de l’informatique
|
|
|