Les FrameSet

Définition

Le frameset est une ancienne technique du HTML permettant de diviser une page web en plusieurs zones indépendantes. Chaque zone affiche un document HTML différent.

Ainsi, au lieu d’avoir une seule page contenant à la fois une barre de navigation et un bloc de contenu, on crée :

une page dédiée à la navigation,
une ou plusieurs pages dédiées aux contenus,
et une page principale utilisant la balise <frameset> pour organiser l’affichage.

Chaque partie fonctionne comme un document autonome, chargé dans une "frame".

Aujourd'hui les structures en FrameSet ne sont plus recommandées pour des questions de référencement.

Créer une page FrameSet

Pour créer un FrameSet, il fait créer une page index.html qui sera réservée à la structure de la page.

Pour créer une page en frameSet, on utilise deux jeux de balises :

les balises <frameset> afin de déterminer la répartition des zones d'affichage
les balises <frame> afin de déterminer les zones en elles mêmes(leur nom sur le système, leur page par défaut)

<html>
- <head>
  - <title>Exemple en frameSet</title>
- <head>
- <frameset cols="20%,*">
  - <frame name="navBar" src="nav.html">
  - <frame name="content" src="main.html">
- </frameset>
</html>

Explication du code

cols → découpe la page en colonnes
20% → la première colonne occupe 20% de la largeur
* → la seconde colonne occupe le reste de l'espace

name="navBar" ? donne un nom à la frame (utile pour les liens ciblés)
src="nav.html" ? page affichée dans cette zone

Charge la page main.html dans la zone principale

Le FrameSet Aujourd'hui

Aujourd’hui, avec l’arrivée de HTML5, les balises <frameset> et <frame> sont devenues obsolètes et ne doivent plus être utilisées pour développer des sites web modernes destinés au public (front-office). Elles ont été remplacées par :

les balises structurantes (<header>, <nav>, <section>, etc.)
le CSS (Flexbox et Grid)
et éventuellement la balise <iframe> pour intégrer un contenu spécifique

Cependant, il est encore possible de rencontrer des FrameSet dans :

d’anciens projets développés en HTML4
certains outils internes (back-office)
des applications métiers anciennes non migrées

Dans des environnements très spécifiques ou des projets legacy complexes, ils peuvent encore fonctionner, mais leur utilisation est fortement déconseillée dans tout nouveau développement.