Download in corso

Softwareone.it

Ogni programma html inizia con un foglio chiamato index.html questa è la base fondamentale per l’inizio di ogni programma scritto in html.

Il server riconosce la pagina index come la pagina iniziale del sito, e la richiama tutte le volte che un utente visualizza un sito web.

Solitamente la pagina index è la pagina di presentazione del sito, la home-page. 

Immagina ogni sito come una piramide, dalla prima pagina possiamo scendere e richiamare tutte le pagine che vogliamo mediante i collegamenti o link, <a href="link o url "></a>.

I link sono fondamentali in internet, sia perché uniscono le pagine del sito, sia perché possono richiamare pagine, programmi o siti esterni, in pratica i link creano la rete internet o web.

La struttura base di una pagina HTML è molto semplice:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento senza titolo</title>
</head>

<body>
</body>
</html>

Quasi tutte le righe di comando hanno un inizio ed una fine, tag di apertura e chiusura, <tag> </tag>.

I comandi devono essere sempre inseriti fra i segni < e >

Per far capire che il comando è concluso dobbiamo inserire il segno / .

La prima cosa da fare è dichiarare il tipo di documento in questo caso <!Doctype html>

La seconda riga indica che ha inizio un foglio in linguaggio html, la ritroviamo in fondo con il segno di chiusura </html> per indicare la fine.

Non tutti i tag HTML hanno il corrispettivo tag di chiusura.

Il tag <br> (a capo), il tag <hr> (linea), i metacomandi (tag ad inizio pagina) ed altri tag particolari come ad esempio il richiamo a plugin esterni non hanno un tag che li chiude.

HEAD

Fra i tag <head> </head> la testata, possiamo inserire il titolo della pagina, fogli CSS o javascript, interi programmi in linguaggio SCRIPT ed i METACOMANDI, ossia tutti i comandi necessari per il riconoscimento della pagina da parte dei motori esterni.

Title

Il tag <title> </title> non ha nessuna importanza ai fini della programmazione, ma ne ha molta per i motori di ricerca che ne descrive il titolo della pagina che devono indicizzare.

Possiamo leggerlo nella barra colorata in alto sopra il browser.

Metacomandi

I metacomandi possono essere letti solo dalla rete internet (motori di ricerca od altri script), è fondamentale sapere che all’interno vengono inserite le parole chiave (keyword) e la descrizione del sito, caratteristiche che possono essere riprese per catalogare il sito dai motori di ricerca, alcune directory o altro. 

Due parole per i motori di ricerca.

Inizialmente si basavano quasi tutti sui metacomandi, le cose sono cambiate (e non poco), per essere posizionati correttamente su un motore di ricerca il sito deve essere compilato correttamente in ogni sua parte.

  • Titolo: <title>
  • Formattazione titoli: <h1>, <h2>, <h3>, <h4>, <h5>, <h6>
  • Testo <p>Formattazione <b>, <u>, <i> ecc..
  • ALT Immagini (titolo immagine) alt="testo"

Da non sottovalutare sono i link:
– Quelli che riceviamo da altri siti.
– Quelli che sono in uscita verso altri siti.
– Quelli che uniscono le pagine del nostro sito.

Ultimo ma non per importanza sono i contenuti delle pagine.

Un sito che si proclama con determinati contenuti ed in realtà ne ha altri non riuscirà mai ad avere un buon posizionamento.

Le parole contenute nel titolo, nella descrizione e le keyword devono essere ripetute almeno una volta nel testo della pagina.

 I buoni motori di ricerca trovano le keyword all’interno della pagina, non prendono quelle suggerite dal programmatore!!!

BODY

Fra le righe del body sono inserite le vere righe di comando, ossia il corpo del foglio, lo stesso tag <body> contiene degli attributi per l’intero foglio.

Le variabili consistono nello sfondo, i margini, i link ed il colore del testo.

  • bgcolor=" " inserire il nome del colore di sfondo a tinta unita (in inglese o esadecimale).
  • background=" " inserire il nome dell’immagine gif o jpg di sfondo.
  • bgproperties="fixed" si utilizza quando l’immagine di sfondo deve restare ferma.
  • topmargin =" " inserire la distanza dal margine superiore (unità di misura es. px).
  • bottommargin =" " inserire è la distanza dal margine inferiore (unità di misura es. px).
  • leftmargin =" " inserire la distanza dal margine sinistro (unità di misura es. px).
  • rightmargin =" " inserire la distanza dal margine destro (unità di misura es. px).
  • link =" " inserire il colore dei links.
  • vlink =" " inserire il colore dei links visitati (in inglese o esadecimale).
  • text =" " inserire il colore del testo (in inglese o esadecimale).

Per inserire gli attributi basta scrivere

<body bgcolor="white" topmargin="20px">

Importante da sapere è il fatto che possiamo inserire anche un richiamo per funzioni script.

Infatti tutto quello che inseriremo nel tag body verrà caricato prima di tutto il restante foglio.

Il tag necessario è il seguente:

<body onload="abc()">

Dove abc() sarà inserita una funzione script prima di body (in head) o in un foglio esterno richiamato fra le righe head.

Html Primi passi

Html – Wikipedia

07-01-2019
Pubblicità