Make it a real page · Faites-en une vraie page
This page needs a recent browser (with SharedArrayBuffer support). Please update Chrome, Edge, Firefox or Safari to the latest version. · Cette page nécessite un navigateur récent (avec support SharedArrayBuffer). Veuillez mettre à jour Chrome, Edge, Firefox ou Safari vers la dernière version.
English
A real web page
- So far you wrote pieces of HTML. A full page wraps them in a frame.
- That frame is almost the same on every web page in the world.
- Let's meet it once — then it becomes a habit.
Français
Une vraie page web
- Jusqu'à présent, vous avez écrit des morceaux d'HTML. Une page complète les enveloppe dans un cadre.
- Ce cadre est presque identique sur chaque page web dans le monde.
- Rencontrons-le une fois — ensuite, cela deviendra une habitude.
English
The four parts
<!DOCTYPE html>— the first line. It says: this is modern HTML.<html>— wraps the whole page.<head>— hidden information about the page (like its<title>).<body>— everything you see on the page.
Français
Les quatre parties
<!DOCTYPE html>— la première ligne. Elle dit : cette page est en HTML moderne.<html>— enveloppe la totalité de la page.<head>— des informations cachées sur la page (comme son<title>).<body>— tout ce que vous voyez sur la page.
Explore · Explorer
The page skeleton as a tree · Le squelette de la page comme un arbre
Every page is a tree: <html> holds · contient <head> (setup) and <body> (what you see). · Chaque page est un arbre : <html> contient <head> (configuration) et <body> (ce que vous voyez).
<!DOCTYPE html>
<html>
<head>
<title>My first page</title>
</head>
<body>
<h1>Hello!</h1>
<p>This is a real web page.</p>
</body>
</html>
English
The title shows in the tab
- The
<title>does not appear on the page itself. - It is the name shown on the browser tab and in search results.
- Every page should have one.
Français
Le titre s'affiche dans l'onglet
- La balise
<title>n'apparaît pas sur la page elle-même. - C'est le nom affiché dans l'onglet du navigateur et dans les résultats de recherche.
- Chaque page devrait en avoir une.
English
Common mistakes
- A page needs
<html>, a<head>and a<body>. - The tab title comes from
<title>inside<head>.
Français
Erreurs courantes
- Une page a besoin de
<html>, d'un<head>et d'un<body>. - Le titre de l'onglet provient de
<title>situé à l'intérieur de<head>.
English
Now you try
- Notice how
<head>and<body>sit inside<html>. - Add a title, then give a page its doctype line.
Français
À vous maintenant
- Remarquez comment
<head>et<body>sont situés à l'intérieur de<html>. - Ajoutez un titre, puis donnez à une page sa ligne de type de document.
Give the page a title. Add <title>My Page</title> inside the <head>. · Donnez un titre à la page. Ajoutez <title>My Page</title> à l'intérieur du <head>.
Start this page properly. Add <!DOCTYPE html> as the very first line. · Commencez cette page correctement. Ajoutez <!DOCTYPE html> comme toute première ligne.