Le développement Web est l'une des compétences les plus demandées aujourd'hui. Il s’agit de créer des sites Web conviviaux et attrayants accessibles via un navigateur. La première étape pour devenir développeur Web consiste à comprendre le HTML.
HTML (Hyper Text Markup Language) est l'épine dorsale de toute page Web. C'est le langage standard utilisé pour structurer une page Web, déterminant la manière dont le contenu est affiché dans le navigateur. Alors que l'apparence d'une page est décidée par le CSS (Feuilles de style en cascade) et ses fonctionnalités par JS (Javascript), HTML est responsable du squelette ou de la structure fondamentale.
Avant de plonger dans cette partie du cours, il est important de comprendre les jargons célèbres et récurrents qui seront utilisés dans votre parcours. Ceux-ci vous aideront à comprendre les concepts au fur et à mesure de notre progression (et permettront également à l'auteur d'expliquer facilement les choses ;-) ).
(paragraphe) à l'intérieur, le navigateur crée un nœud de corps avec un nœud de paragraphe comme enfant.
) dans une balise div (
HTML signifie Hyper Text Markup Language
Hyper Texte : Désigne la capacité du HTML à relier différents documents entre eux.
Langage de balisage : utilise des balises pour annoter le texte, définissant ainsi la manière dont il doit être affiché dans un navigateur.
Voici la structure de base d'un document HTML :
<!DOCTYPE html>
<html>
<head>
<title>HTML Tutorial</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>
Balises : En HTML, les balises sont utilisées pour définir des éléments. Les balises sont placées entre crochets, comme ou
.
Éléments : constitués d'une balise d'ouverture et d'une balise de fermeture, qui peuvent contenir du contenu. Par exemple,
Bonjour tout le monde !
est un élément de paragraphe.Chaque document HTML suit une structure de base :
Here are some basic HTML elements you’ll use frequently:
To create an HTML file, you can use any text editor, such as Notepad or VS Code. Here’s a simple example:
<!DOCTYPE html> <html> <head> <title>HTML Tutorial</title> </head> <body> <h1>Example Number 1</h1> <p>Hello, world!</p> </body> </html>
You can find that there is a request in the name that you have saved as in this picture.
In the response tab, you will find the code that you have written as in the following picture
Now, what happened is that, once you opened the file you have saved as html, the computer began running the file in browser. The browser wanted something to show, so it made a request call to the file from which it was launched. The file gave the browser your code and that was found in the response section. Since it was a html file, the browser begins reading the HTML code from the top to the bottom. This process is known as parsing. During parsing, the browser encounters different HTML tags (like ,
, , etc.) and starts to build a structure called DOM based on these tags. As the browser builds the DOM, it simultaneously renders the content on your screen.Let’s take a step further by creating a simple table in HTML:
<p>Table Example</p>
<table>
<tr>
<th>Name</th>
<th>Power</th>
<th>Is Kurama Present</th>
</tr>
<tr>
<td>Naruto</td>
<td>Rasengan</td>
<td>Yes</td>
</tr>
<tr>
<td>Sasuke</td>
<td>Sharingan</td>
<td>No</td>
</tr>
</table>
Notice the heading is being rendered by paragraph tag. Alternatively, you can also use
Note that
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
