Permite seccionar / dividir partes del contenido
Permite agrupar contenido / artículos del mismo contexto
Composición auto-contenida
independiente y reutilizable
Contenido principal de la pagina web
Contexto: body o section
Grupo de ayudas introductorias o de navegación
Elementos de encabezado, logo,
un formulario de búsqueda, un nombre de autor, etc.
Pie de página para el contenido de la sección
Proporciona enlaces de navegación
Puede haber varias en cada documento
Contenido que está indirectamente relacionado
con el contenido principal de la sección
Aporta información de contacto
Agrupa contenidos que no encajen en los otros elementos de sección
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>App Shell</title>
<!-- otros metatags -->
</head>
<body>
<header class="header">
<h1 class="header__title">
Shell de app
</h1>
</header>
<nav class="nav">
...
</nav>
<main class="main">
...
</main>
<div class="dialog-container">
...
</div>
<div class="loader">
<!-- Show a spinner or
placeholders for content -->
</div>
</body>
</html>