Glossaire - Termes importants
-
API: Application Programming Interface ou interface de programmation d'application - Voir https://fr.wikipedia.org/wiki/Interface_de_programmation
-
Bootstrap: collection d'outils (CSS et Javascript) pour la création de sites web, développé par Twitter.
-
CLI: Command Line Interface - terme utilisé pour désigner un outil proposant une interface en ligne de commande, c'est à dire utilisable depuis une console du système par exemple.
-
CSS: Cascasding StyleSheet - c'est un langage permettant de décrire la présentation de documents HTML. Sa version actuelle est CSS3.
-
DOM: Document Object Model ou modèle d'objets de document - c'est une API pour les documents HTML qui définit la structure logique de ces documents ainsi que des méthodes pour les manipuler.
-
HTML: HyperText Markup Language - c'est un langage de balisage permettant de représenter les pages Web (il permet de les structurer sémantiquement et logiquement, d'inclure des formulaires et différents autres types de ressources : images, vidéos, liens vers d'autres pages ou ressources, etc.). Sa version actuelle est HTML5. C'est un des concepts central du World Wide Web.
-
HTTP: HyperText Transfert Protocol - un protocole de communication client-serveur permettant notamment d'échanger des documents hypertexte. C'est un des concepts central du World Wide Web.
-
Javascript: un langage de scripts notamment utilisé pour créer des pages web interactives: du code JavaScript peut être intégré dans les pages web pour être exécuté dans le navigateur du client.
-
JSON: JavaScript Object Notation - un format de données textuelles (human readable) dérivé de la syntaxe des objets en JavaScript.
-
Moteur de template : un système qui permet (coté serveur dans notre cas) de personnaliser des documents web envoyées au client en combinant la réutilisation d'éléments statiques (le modèle) l'utilisation d'éléments dynamiques (servant à définir le contenu) basés sur les paramètres d'une requête.
-
SQLite: c'est un moteur de base de données relationnelle open-source (son code est dans le domaine public) dont la spécificité est de stocker l'intégralité de la BD dans un fichier indépendant de la plateforme. C'est probablement le moteur de base de données le plus utilisé au monde (https://www.sqlite.org/famous.html).
-
URI: Uniform Resource Identifier - c'est une chaîne de caractères qui désigne une ressource sur un réseau.
-
URL: Uniform Resource Locator - c'est une chaîne de caractères qui désigne une ressource du WWW. Les URL sont parfois appelées adresses Web et composent un sous-ensemble des URI.
-
WWW: World Wide Web - décrit le système d'information, utilisant le réseau Internet, dans lequel les ressources (documents, etc.) sont identifiées par une URL et reliées entre elles par des liens hypertextes. Les ressources du WWW sont consultables par des clients Web (généralement des navigateurs Web), publiées par des serveurs Web et transférées en utilisant le protocole HTTP.
Mémo Balises HTML
Remarque: ce mémo présente les principales balises HTML, notamment celles rencontrées lors de cette session de TP, mais n'est pas exhaustif - une liste plus complète accompagnée de sa description est consultable à l'adresse developer.mozilla.org/fr/docs/Web/HTML/Element.
Balises d'en-tête
| Balise | Description |
|---|---|
<html> | Balise principale du document |
| - | - |
<head> | En-tête de la page |
<body> | Corps de la page |
Balises de conteneur générique
pas de rôle sémantique
| Balise | Description |
|---|---|
<span> | Conteneur générique en ligne (inline) |
<div> | Conteneur générique qui permet d'organiser le contenu (block) |
Balises sectionnantes
elles ont le même effet qu'un élément <div> mais ont une sémantique associée
| Balise | Description |
|---|---|
<header> | Elément d'en-tête (de page, d'article, ..) |
<nav> | Élément (barre, menu, ..) avec principaux liens de navigation |
<footer> | Elément de pied (de page, d'article, ..) avec infos sur auteurs, copyright, etc. |
<section> | Section de page |
<article> | Article de blog, post de forum, etc. (contenu autonome) |
<aside> | Infos complémentaires (pas indispensables au contenu autonome qu'elles accompagnent) |
Autres balises avec sémantique associée
cette liste présente aussi bien des balises relatives au sectionnement du contenu que des balises relatives au contenu textuel par exemple
| Balise | Description |
|---|---|
<abbr> | Abréviation |
<blockquote> | Citation (longue) |
<cite> | Citation du titre d'une oeuvre |
<q> | Citation (courte) |
<sup> | Exposant |
<sub> | Indice |
<strong> | Mise en valeur forte |
<em> | Mise en valeur |
<mark> | Mise en valeur pour sa pertinence |
<h1> | Titre de niveau 1 |
<h2> | Titre de niveau 2 |
<h3> | Titre de niveau 3 |
<h4> | Titre de niveau 4 |
<h5> | Titre de niveau 5 |
<h6> | Titre de niveau 6 |
<img /> | Image |
<figure> | Figure (image, code, ...) |
<figcaption> | Description de la figure |
<audio> | Son |
<video> | Vidéo |
<source> | Source pour <audio> et <vidéo> |
<a> | Lien hypertexte |
<br /> | Retour à la ligne |
<p> | Paragraphe |
<hr /> | Ligne horizontale |
<del> | Texte supprimé |
<ins> | Texte inséré |
<dfn> | Définition |
<pre> | Texte pré-formatté (code source, etc.) |
<progress> | Barre de progression |
Balises de liste
| Balise | Description |
|---|---|
<ul> | Liste à puce, non numérotée |
<ol> | Liste numérotée |
<li> | Élément de la liste |
Balises de tableau
| Balise | Description |
|---|---|
<table> | Tableau dans son ensemble |
<caption> | Titre du tableau |
<tr> | Ligne de cellules (dans l'en-tête ou le corps) |
<th> | Cellule dans l'en-tête du tableau |
<td> | Cellule dans le corps du tableau |
<thead> | En-tête du tableau |
<tbody> | Corps du tableau |
Balises de formulaire
| Balise | Description |
|---|---|
<form> | Formulaire |
<fieldset> | Groupe de champs |
<legend> | |
<label> | |
<input /> | |
<textarea> | |
<select> | |
<option> | |
<optgroup> |