Layouts
layout-base.twig
Scampi-Twig est livré avec un fichier de layout de base layout-base.twig réunissant la structure et le balisage minimum nécessaires à tous les projets et répondant à nos bonnes pratiques.
Entête
<html>
- la déclaration de la langue principale du document.
- la class no-js qui sera enlevée par modernizr si javascript est activé dans le navigateur.
- le sens de lecture.
<head>
- la meta charset avec la valeur UTF-8.
- le modèle conforme pour la balise title : "Titre de la page - Titre du site".
- la désactivation du mode de compatibilité d'Internet Explorer.
- l'inclusion des différentes variations de favicon.
- l'inclusion du script modernizr (le seul nécessitant d'être dans l'entête).
Corps de page
<body>
- Une alerte en cas de désactivation de javascript.
- Une alerte pour informer de l'obsolescence de la version d'Internet Explorer si besoin.
- L'inclusion des liens d'accès rapide.
- Les zones (landmarks) obligatoires au regard du RGAA assorties de leur attribut ARIA spécifique.
- L'inclusion de jquery et du script concaténant tous les autres scripts javascript juste avant la fermeture du body.
layout-base-projet.twig
Plutôt qu'intervenir directement dans layout-base.twig pour l'adapter à un projet particulier on utilisera la notion d'héritage de Twig pour créer la base commune à tout le projet.
{# templates/common/layout-base-projet.twig #} {% extends "common/layout-base.twig" %} {# spécificités layout du projet#}
layout-index.twig
Toujours pour éviter d'ajouter des spécificités dans un layout générique, layout-index.twig permet de définir, au besoin, les caractéristiques propres du layout de la page d'index du projet.