La minima pagina HTML5
This post is part of the series Realizzare Giochi in HTML5
Other posts in this series:
- Realizzare giochi con i Canvas di HTML5 e JavaScript Ep. I (Current)
- Realizzare un Gioco in HTML5 Ep. II: Disegnare sui Canvas
- Realizzare un Gioco in HTML5 Ep. III: Animare gli elementi
Non ci soffermeremo sullo studio del linguaggio HTML se non per lo stretto necessario a comprendere l’oggetto del corso, ma una struttura minima è necessaria. Ecco il minimo codice indispensabile per definire una pagina HTML:
<!doctype html>
<html lang="it">
<head>
<meta charset="UTF-8">
<title>Una pagina HTML</title>
</head>
<body>
Ciao Mondo!
</body>
</html>Ed ecco una descrizione di ogni riga:
<!doctype html>Questo tag indica il tipo di documento e istruisce il browser su cosa mostrare. In passato si sono avvicendate decine di descrizioni e definizioni per i vari tipi di documenti HTML nelle varie versioni e in base ai vari browser. Con HTML5 la codifica è diventata semplice e breve, e ci auguriamo che rimanga tale. Questa dovrebbe essere la prima riga in ogni pagina HTML.
<html lang="it"> ... </html>Il tag <html> indica l’inizio della pagina vera e propria. All’interno delle parentesi angolari, oltre al nome del tag troviamo un attributo lang, facoltativo, con un valore dichiarato che dice al browser che la pagina in questione è scritta in lingua italiana. Tutto ciò che viene dopo è contenuto all’interno del tag <html> fino alla sua chiusura </html> nell’ultima riga.
<head> ... </head>Ogni pagina HTML contiene una sezione di intestazione <head> che ospita stili, script, meta-informazioni e altro. Tutto ciò che si trova all’interno di <head> … </head> viene letto e interpretato dal browser ma non viene visualizzato direttamente.
<meta charset="UTF-8">Il set di caratteri che il browser utilizzerà per visualizzare questa pagina è chiamato UTF-8 ed è il formato consigliato per la maggior parte delle pagine HTML, soprattutto per noi che scriviamo in italiano è importante utilizzare un set di caratteri in grado di visualizzare correttamente tutti i glifi, comprese le lettere accentate.
<title>Una pagina HTML</title>Il tag <title> rappresenta il titolo del documento, anche se questo non viene visualizzato se non nel tab in alto.
Il tag <title> rappresenta il titolo del documento, anche se questo non viene visualizzato se non nel tab in alto.
<body> ... </body>Il corpo della pagina, tutto quello che si trova al suo interno, salvo errori, viene stampato all’interno della finestra del browser.
Continue reading this series:
Realizzare un Gioco in HTML5 Ep. II: Disegnare sui Canvas
4 replies on “Realizzare giochi con i Canvas di HTML5 e JavaScript Ep. I”
tutorial carino ed efficace. E’ logico che hai appena buttato giù il prologo di un vero e proprio “romanzo” noto come developing di un videogame. Stima per il risultato.
Grazie Dario, l’idea è proprio quella di realizzare una guida completa a partire praticamente da zero. Se questa serie di articoli avrà successo pensavo di inserire successivamente strumenti sempre più completi: da CreateJS a Unity3D. Vedremo come si evolverà, tu torna spesso a trovarmi ;)
inoltre ho notato con mio grande poiacere che hai una Repository molto interessante su GitHub, sarebbe molto interessante un post su come creare un componente per github e le linee guida per pubblicare correttamente (tipo plugin js o wordpress)
Ottimo suggerimento, già dal prossimo articolo creerò un Repository per chi volesse seguirmi e così gli utenti più intraprendenti potranno partecipare direttamente alla stesure del codice ;)