Les mots utiles, en clair
- CSS : présentation
- Les règles qui définissent les couleurs, les tailles et la disposition de votre page.
- JavaScript : interactions
- Le code qui fait fonctionner des éléments comme les menus, les formulaires et certaines animations.
Définir la frontière du composant
Le confinement indique au navigateur qu’une partie du document peut être traitée avec certaines limites. Cela peut aider lorsqu’un composant change souvent sans devoir influencer tout le reste de la page. Il faut toutefois savoir quelles dimensions et quels débordements dépendent de l’extérieur.
Tester ce qui dépasse
Menus déroulants, ombres, éléments collants et fenêtres peuvent dépasser les limites de leur conteneur. Un confinement choisi sans recette peut les rogner ou changer leur positionnement. Vérifiez également les composants dont la taille dépend de leur contenu ou d’une mesure effectuée en JavaScript.
Relier le réglage à une mesure
N’ajoutez pas contain partout dans une feuille globale. Identifiez un calcul coûteux dans une trace, isolez le composant concerné et comparez le résultat. Si le gain est faible ou si la mise en page devient difficile à maintenir, une simplification du composant peut être plus pertinente.