HTML per aspiranti programmatori: A – overview

HTML sta per HyperText Markup Language. A differenza di un linguaggio di scripting o di programmazione che utilizza script per eseguire funzioni, un linguaggio di markup utilizza tag per identificare il contenuto. Ecco un esempio di tag HTML:

<code>
<p> I’m a paragraph </p>
</code>

La possibilità di codificare tramite HTML è essenziale per qualsiasi professionista del Web. L’acquisizione di questa abilità dovrebbe essere il punto di partenza per chiunque stia imparando come creare contenuti per il web.

web design moderno
HTML: struttura
CSS: presentazione
JavaScript: comportamento

PHP o simile: backend
CMS: gestione dei contenuti
HTML è facile da imparare!

Sebbene varie versioni siano state rilasciate nel corso degli anni, le basi HTML rimangono le stesse.
La struttura di un documento HTML è stata confrontata con quella di un sandwich. Poiché un sandwich ha due fette di pane, il documento HTML ha l’apertura e la chiusura dei tag HTML.

Questi tag, come il pane in un sandwich, circondano tutto il resto:

<code>
<html>
</ html>
</code>

Tutto in un documento HTML è circondato dal tag <html>. Subito dopo l’apertura del tag HTML, troverai la testata del documento, che viene identificata aprendo e chiudendo i tag head. La testa di un file HTML contiene tutti gli elementi non visivi che aiutano a far funzionare la pagina. Il tag body segue il tag head.
Tutti gli elementi visivi-strutturali sono contenuti nell’etichetta del corpo. Intestazioni, paragrafi, elenchi, citazioni, immagini e collegamenti sono solo alcuni degli elementi che possono essere contenuti all’interno del tag del corpo. Struttura HTML di base:

<code>
<html>
<head>…</head>
</html>
</code>

Il tag <body> definisce il contenuto principale del documento HTML.

<code>
<html>
<head>
</head>
<body>
</body>
</html>
</code>

I file HTML sono file di testo, quindi puoi utilizzare qualsiasi editor di testo per creare la tua prima pagina web. Sono disponibili alcuni editor HTML molto carini; puoi scegliere quello che funziona per te. Per ora scriviamo i nostri esempi in Blocco note. Aggiungi la struttura HTML di base all’editor di testo con “Questa è una riga di testo” nella sezione del corpo.

<code>
<html>
<head>
</head>
<body>
This is a line of text.
</body>
</html>
</code>

Nel nostro esempio, il file viene salvato come first.html ; quando il file viene aperto, il seguente risultato viene visualizzato nel browser Web. Non dimenticare di salvare il file. I nomi dei file HTML devono terminare in .html o .htm

Per inserire un titolo nella scheda che descrive la pagina Web, aggiungi un elemento <title> alla tua sezione principale:

<code>
<html>
<head>
<title>first page</title>
</head>
<body>
This is a line of text.
</body>
</html>
</code>

L’elemento title è importante perché descrive la pagina e viene utilizzato dai motori di ricerca. Adesso progettiamo con degli esempi concreti un blog!

<code>
<html>
<head>
<title>My Blog</title>
</head>
<body>
</code>

COMPITO a casa per costruire il tuo blog performante:

1. Apri il codice.
2. Sull’intestazione superiore, cambia il nome con il tuo nome.
3. Cambia il titolo della pagina. Ricorda, il titolo della pagina si trova all’interno del tag <title> nel <head> della pagina.

In questo primo post sull’ html abbiamo familiarizzato con la struttura base della pagina riconoscendo quelli che sono i tag più salienti e significativi.

Annunci

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione /  Modifica )

Google photo

Stai commentando usando il tuo account Google. Chiudi sessione /  Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione /  Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione /  Modifica )

Connessione a %s...