514.400.6395 / 877.841.5386
Accueil Portfolio Services À propos Blogue Nous joindre
Contact Us




Send
Accueil > Conception de sites web à Montréal > Conception Web > Tutoriel de conception web > Tutoriel HTML

Tutoriel HTML

Il existe un grand nombre de «balises» qui peuvent être utilisées pour créer une page Web. Chaque balise suit cette structure de base:
<tag attribute="value">value</tag>

Quoique parfois l'attribut ou les attributs sont toujours facultatifs et la balise fermante est parfois facultative. Par exemple: <tag />

Regardons un exemple d’une page HTML de base et les balises incluent dans cette page. Cette page ne fait rien de plus que d’afficher le mot « bonjour » dans la barre de titre de la fenêtre du navigateur Windows; ensuite le page affiche « Bonjour tout le monde » suivie par « ce texte est en gras », un lien vers ce site Web et une image dans le corps de la page.

 

Ligne #
Collez le contenu de cette colonne dans le fichier index.html et sauvegardez
1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Hello world</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
Hello world. <span class="spanExample">This text is bold</span>.
<br />
<a href="http://www.adeointernetmarketing.com" id="lnkAdeo">Web design</a>
<img src="picture.jpg" />
</body>
</html>

 

Examinons ce fichier ligne par ligne:

  1. La première ligne définit le « doctype » pour la page. En d'autres termes, il indique au navigateur le standard qui devra être utilisé lors de la décomposition syntaxique et le rendu de la page. Dans ce cas, il indique « HTML 4 ». Omettre de préciser le « doctype » rendra la compatibilité multi-navigateurs difficile.
  2. La balise d'ouverture HTML qui enveloppe tous les documents Web.
  3. La balise <head> d'ouverture d'entête de page contient des métadonnées (des informations générales) sur la page web
  4. La balise de titre définit le texte qui sera affiché dans la barre de titre bleue de la fenêtre du navigateur et sur les pages de résultats de recherche sur Google, etc
  5. Une référence à un fichier CSS (plus d’information à suivre).
  6. La balise <head> de fermeture de page.
  7. La balise <body> d'ouverture. Les balises dans ce bloc font partie de la conception de la page qui est visible.
  8. Une balise <SPAN> agit comme une enveloppe autour du texte, semblable à une étiquette. Par défaut, cette balise n’a aucun rôle, mais la feuille de style la rendra distinct du reste du texte.
  9. Saut de ligne.
  10. Lien vers http://www.adeointernetmarketing.com avec le texte d'appel « conception de sites Web ». L'attribut « ID » est défini comme un exemple pour le tutoriel CSS.
  11. Une image qui pointe vers un fichier nommé « picture.jpg »
  12. La balise de fermeture <body>
  13. La balise de fermeture <html>

Pour une liste complète des balises, visitez le site W3C référence d'élément.

Follow us

Request a free quote

Contact us today to get a quote for your project

Contact us 877.841.5386

2710 Sherbrooke Street
Magog, Quebec J1X 4G1
5524 Saint-Patrick Suite 202
Montreal, Quebec H4E 1A8
Mobile version