Class notes
Class notes inf1001 (inf1001)
- Course
- Inf1001 (INF1001)
- Institution
- Université Du Québec à Trois-Rivières (UQTR )
notes de cours programmation web
[Show more]
Seller
Follow
Content preview
Introduction au HTMLLes balises
Au coeur de chaque application Web, il y a le HTML. Le HTML est un langage de
balisage. Contrairement à un langage de programmation comme Java, les langages de
balisage ne contiennent pas de logique. Ils ne servent qu'à définir et structurer de
l'information. Le HTML sert donc à définir et à structurer nos pages Web. Comme vous
pourrez le constater, le HTML sera beaucoup plus simple à apprendre qu'un langage de
programmation.
Puisque le HTML est un langage de balise, il est essentiel de savoir ce qu'est une balise
en HTML pour pouvoir l'utiliser. En effet, en HTML, tout est une balise. On les retrouve
généralement sous le format suivant:
HTML
<nom-de-balise> contenu </nom-de-balise>
Chaque balise possède un nom. Elles vont aussi, en général, contenir du texte ou d'autres
balises. Finalement, une balise doit se fermer à l'aide d'une balise de fermeture contenant
une barre oblique /. Il arrive, dans certains cas, qu'une balise ne contienne rien. Dans ce
cas particulier, nous omettrons généralement la balise de fermeture.
Il existe plus de 100 balises différentes en HTML et elles utilisent tous une syntaxe
similaire à celle montré ci-dessus. Vous n'aurez pas à apprendre toutes les balises par
coeur, mais il est important de connaître les balises de base. Pour les balises plus
complexe ou plus rarement utilisé, vous pourrez utiliser les ressources disponibles sur ce
site ou ailleurs sur Internet. Nous commencerons à voir plus en détail chaque balise un
peu plus tard. Pour le moment, voyons comment construire une page Web.
Gabarit d'un fichier HTML
Chaque page Web que nous ferons utilisera le gabarit HTML de base ci-dessous. Pour
créer un fichier HTML, vous pouvez simplement créer un fichier texte vide dans votre
explorateur de fichier. Vous n'aurez par la suite qu'à changer l'extension du fichier pour
".html" au lieu de ".txt". Assurez-vous de faire cette modification pour que les
navigateurs Web soient en mesure d'afficher votre page Web.
HTML
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
, <meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title> Un titre </title>
</head>
<body>
</body>
</html>
Chaque balise ici est importante. Voici donc une courte explication pour chaque balise:
<!doctype html>
Commande indiquant au navigateur Web que le fichier contient du HTML.
Contrairement à ce que l'on peut penser, cette commande n'est théoriquement pas
une balise. Assurez-vous de toujours ajouter le Doctype au sommet de votre
fichier HTML.
<html>
La balise englobant la page Web. Toute la page Web au complet est inséré à
l'intérieur de cette balise. Nous indiquons aussi la langue de base de la page Web
dans cette balise.
<head>
La balise indiquant au navigateur quoi faire avant d'afficher la page. Toutes les
balises à l'intérieur du <head> servent à configurer la page Web avant son
affichage.
<meta>
La balise permettant de donner de l'information sur la page. Nous l'utilisons
généralement pour indiquer certaines informations importante au navigateur. Elle
se retrouve uniquement à l'intérieur de la balise <head>. Dans notre gabarit,
nous l'utilisons pour indiquer l'encodage de la page Web (utf-8) et la fenêtre
d'affichage (pour les versions mobiles).
<title>
La balise permettant d'indiquer le titre de la page. Le titre de la page sera affiché
dans l'onglet de la page Web dans le navigateur. Comme pour la balise <meta>,
la balise <title> se retrouve uniquement à l'intérieur de la balise <head>. De
plus, une page Web doit contenir un seul titre.
<body>
La balise contenant le corps de la page Web. Essentiellement, toutes les balises
contrôlant l'affichage du site Web se retrouve à l'intérieur de cette balise. Nous
mettrons donc la majorité de nos balises dans la balise <body>.
Si vous ouvrez le fichier HTML ci-dessus dans votre navigateur, vous aurez simplement
une page blanche avec un titre. Nous verrons dans les prochaines pages comment ajouter
des éléments à notre page Web à l'aides de différentes balises.
The benefits of buying summaries with Stuvia:
Guaranteed quality through customer reviews
Stuvia customers have reviewed more than 700,000 summaries. This how you know that you are buying the best documents.
Quick and easy check-out
You can quickly pay through credit card or Stuvia-credit for the summaries. There is no membership needed.
Focus on what matters
Your fellow students write the study notes themselves, which is why the documents are always reliable and up-to-date. This ensures you quickly get to the core!
Frequently asked questions
What do I get when I buy this document?
You get a PDF, available immediately after your purchase. The purchased document is accessible anytime, anywhere and indefinitely through your profile.
Satisfaction guarantee: how does it work?
Our satisfaction guarantee ensures that you always find a study document that suits you well. You fill out a form, and our customer service team takes care of the rest.
Who am I buying these notes from?
Stuvia is a marketplace, so you are not buying this document from us, but from seller aminetalbi. Stuvia facilitates payment to the seller.
Will I be stuck with a subscription?
No, you only buy these notes for CA$15.48. You're not tied to anything after your purchase.
Can Stuvia be trusted?
4.6 stars on Google & Trustpilot (+1000 reviews)
56326 documents were sold in the last 30 days
Founded in 2010, the go-to place to buy study notes for 14 years now