Retour

Initiation au dévelopemment Web

🎲 Quiz GRATUIT

📝 Mini-cours GRATUIT

Structure d'une page HTML

Structure d'une page HTML

Une page HTML est un document texte (composé de caractères latins), comme un programme écrit en C, et contrairement aux documents Word ou aux fichiers exécutables par ex.

Elle comporte plusieurs parties :

  • La déclaration de la page HTML5 : <!DOCTYPE html>
  • La balise HEAD : pouvant contenir diverses informations sur la page (titre, encodage des caractères, l’auteur, la date, …)
  • La balise BODY : regroupant le contenu de la page qui sera affiché par le navigateur.

Certains éléments peuvent contenir des attributs :

  • Les attributs se mettent toujours dans la balise initiale (ouvrante)
  • Sous format nom= « valeur »

Les formulaires servent à envoyer des données au serveur, en lui faisant une requête avec les données. Ils permettent de faire saisir à l’utilisateur texte (visible ou avec étoiles), cases à cocher, boutons radio,
bouton d'envoi...

Il est possible d’incorporer des éléments multimédias dans une page HTML comme par exemple :

  • La balise <img> permet d’insérer une image
  • La balise <audio> permet de jouer un fichier audio
  • La balise <video> permet d’afficher une vidéo en streaming

Attributs évènementiels

Attributs évènementiels

Les attributs événements (JavaScript par ex.) permettre d'exécuter du code lors d'événements. Ils rendent la page HTML dynamique et interactive. Par exemple :

  • onchange -> Modifie la valeur d'un élément
  • onsubmit -> Permet l’envoi de formulaire
  • onclick -> Déclenche l'évènement click lorsque l'utilisateur clique sur un élément
  • onload -> Déclenche l’événement load à la fin du processus de chargement du document

Feuilles de styles (CSS)

CSS a pour but de séparer totalement la présentation d'une page Web de son contenu (c'est à dire du langage HTML), et de faciliter ainsi la maintenance et l'accessibilité d'un site.

Pour chaque déclaration, la structure est toujours la même :

sélecteur {propriété: valeur;}

  • Le sélecteur : la balise (X)HTML (ex : body ; h1 ; p, ...), l'identifiant (id) ou la classe (class) 
  • La propriété : l'attribut que l'on veut appliquer (ex : font ; background ; margin ; etc.) 
  • La valeur : les caractéristiques de la propriété

Nomad+, Le pass illimité vers la réussite 🔥

NOMAD EDUCATION

L’app unique pour réussir !