Corsi on-line

Un template base in HTML5

Jacob Gube ha recentemente pubblicato su Six Revisions un interessante articolo attraverso il quale viene proposto un semplice template base in HTML5, una sorta di Boilerplate markup tanto personalizzabile (e totalmente privo di contenuti) quanto essenziale dal quale partire per la realizzazione di un layout riutilizzabile per la realizzazione di pagine Internet e Web applications.

HTML5

Il template suggerisce alcune buone pratiche come per esempio il corretto posizionamento degli scripts, l’utilizzo dei CDN, la modalità d’indentazione preferibile dal punto di vista della leggibilità, le soluzioni per eventuali problemi di compatibilità cross browser (in particolare tenendo conto del rendering engine di Internet Explorer) nonché la gestione del meta name viewport per gli schermi dotati di diagonali meno ampie.

Questo il risultato proposto, nell’articolo sarà possibile reperire anche la versione commentata e gli approfondimenti sulle diverse componenti del template:

<!DOCTYPE html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="">
<!--[if lt IE 9]>
<script src="//cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<link rel="shortcut icon" href="">
</head>
<body>

<!-- Spazio riservato al contenuto -->

<!-- SCRIPTS -->
<!-- Example: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> -->
</body>
</html>

Dal punto di vista della struttura non sembrerebbero esserci particolari osservazioni da sottolineare, comprensibile per esempio l’idea di prevedere un semplice hack (tramite inclusione di librerie esterne) per garantire il supporto ad IE9, così come è corretto il posizionamento delle librerie JavaScript prima della chiusura del tag body in modo da privilegiare il caricamento dei contenuti in fase iniziale di loading.

Forse, se proprio si volesse ricercare un punto debole nell’impianto proposto, si potrebbe osservare che il ricorso a ben 3 CDN potrebbe in alcuni casi pesare eccessivamente sul livello delle prestazioni; parliamo però di un problema facilmente risolvibile.

Via Six Revisions

Post correlati
I più letti del mese
Tematiche