Web template
Un web template (in italiano: modello per i siti, o semplicemente modello) è uno strumento usato per separare il contenuto dalla presentazione grafica, e per la produzione in massa di pagine Web[1][2].
Concetti base
modifica- Pagina web[3][4]:
- Pagina web dinamica: generata al volo (dinamicamente nel web) da un template engine
- Pagina web statica: un file HTML, creato a mano o da un editor, anche WYSIWYG.
Tipi di modelli
modificaCi sono molti tipi di web template: dai semplici "template sostituto" (masks), dove le variabili sono sostituite dal contenuto del webdesigner, ai complessi template basati sull'XSLT. I semplici template erano importanti storicamente, nelle prime inclusioni server-side (SSI) per creare header e footer uniformi nelle pagine web. I template complessi giocano un ruolo importante nei Content management system (CMS) e nel Web Publishing in generale. Rendono possibile un layout standard (impostazione delle pagine, dei colori, le posizioni, ecc.) per contenuti diversi pur mantenendo lo stesso layout di base[2].
Linguaggi per template
modificaLa sintassi per esprimere variabili, blocchi, regole di sostituzione, o logica, in un web template, è formalizzata da un linguaggio template.
I linguaggi possono essere definiti in un standard o in un contesto "esclusivo"[5]:
- Linguaggi standard (XSL)
- Linguaggi piattaforma-dipendenti (linguaggio Vignette)
Riutilizzo dei template
modificaSi possono "riciclare" i web template[6].
I modelli per i siti sono solitamente gratuiti e creati per facilitarne l'eventuale modifica. In ogni caso, alcuni i web template più specializzati sono prodotti commerciali acquistabili, solitamente, venduti online. Mentre numerosi siti commerciali offrono web template complessi e molto ben fatti, ne esistono molti altri gratuiti e open source[7][8].
Modello base di un template web
modificaHTML
<!DOCTYPE html>
<html>
<title>HTML Tutorial</title>
<body>
<h1>titolo</h1>
<p>paragrafo</p>
</body>
</html>
CSS
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
PHP
<!DOCTYPE html>
<html>
<head>
<title>PHP Test</title>
</head>
<body>
<?php echo '<p>Hello World</p>'; ?>
</body>
</html>
Pagina base dinamica in ASP:
ASP
<!DOCTYPE html>
<html>
<body>
<h1>Hello Web Pages</h1>
<p>The time is @DateTime.Now</p>
</body>
</html>
Galleria d'immagini
modificaNote
modifica- ^ (EN) What is a Website Template? - Definition from Techopedia, su Techopedia.com. URL consultato il 25 ottobre 2021.
- ^ a b What are Web Templates? About HTML / CSS Website Designs, su allwebcodesign.com. URL consultato il 25 ottobre 2021.
- ^ (EN) Static vs Dynamic Website: What Is the Difference?, su Amelia WordPress Booking Plugin, 25 aprile 2019. URL consultato il 25 ottobre 2021.
- ^ (EN) Static vs Dynamic Websites: What's the Difference?, su adamtheautomator.com, 22 gennaio 2021. URL consultato il 25 ottobre 2021.
- ^ Luigi Dragone, Riccardo Rosati, Fogli di stile per XML (XSL e XSLT), su diag.uniroma1.it, 2016. URL consultato il 25 ottobre 2021.
- ^ (EN) W3.CSS Templates, su w3schools.com. URL consultato il 25 ottobre 2021.
- ^ (EN) 44+ Free HTML5 responsive website templates | Webflow, su webflow.com. URL consultato il 25 ottobre 2021.
- ^ 9000+ modelli HTML gratuiti. Modelli di siti Web HTML, su Nicepage.com. URL consultato il 25 ottobre 2021.