INTRODUZIONE

Queste pagine sono state scritte per :

  1. dare le nozioni elementari utili per capire come è fatta una pagina web ed
  2. eventualmente costruire pagine semplici
  3. fare piccoli siti web standard e senza funzioni speciali.

Non mi dilungo ulteriormente. Chi volesse spiegazioni più approfondite può cercare su wikipedia (clicca)

Per fare un proprio sito, qualcosa che non rientri nei soliti schemi, ci vuole una certa inventiva. Nel mio caso uso solo qualche script di terzi per le immagini e poco altro. Non mi soddisfa l'uso di modelli forniti da altri perché avrei intenzione di dare al mio sito un tocco artistico e originale. D'altronde lavoro solo per hobby e gratuitamente, quindi ...

Ecco lo schema fondamentale di una pagina web e dei suoi 4 componenti principali che sono: doctype, <html>..... </html>, <head>....</head>, <body>.......</body> che - nella pagina dell'editore html - vengono posti nell'ordine sotto indicato:

<!doctype html>
<html>

<head>
   <meta charset="utf-8">
   <title>Doc. dimostrativo</title>
</head>

<body>
  "Tra <Body> e </body> mettiamo i componenti contenti nella pagina"
</body>

</html>

Versione html = HTML5: componenti di struttura in maggior dettaglio

Codice   Descrizione
  <!doctype html>
   <html>		 In questa sezione abbiamo la versione di linguaggio usato - qui HTML5. In un editor dedicato, quando facciamo una nuova pagina, possiamo trovare altre codifiche con le loro istruzioni.

  <head>

<meta charset="utf-8">
<title>
Doc. dimostrativo</title>

  .........

  .........

  ..........

</head>

 Questa è la sezione HEAD (testata del documento) Oltre al titolo - in questo caso chiamato 'Doc. dimostrativo' la testata contiene il set di caratteri usati (qui "utf-8") o altri elementi. I principali di questi elementi sono
  1. META TAG Description (Descrizione: non più di 100 Caratteri
  2. META TAG Keywords (Parole chiave): che servono ai motori di ricerca
  3. META TAG con indicazioni di estendere la ricerca ai files collegati o fermarsi alla pagina
  4. Riferimenti ai fogli di stile CSS e/o le istruzioni dirette di stile incorporate.
  5. Riferimenti agli scripts (eventuali js)
   

<body>

............

...........

...........
</body>

Questo è il BODY (corpo del documento) che ospita i contenuti della pagina. I principali elementi da inserire sono:

  1. <DIV>    </DIV>      permette di inserire e incastrare elementi nella pagina nelle posizioni volute, suddividere la pagina in zone comunque disposte. Permette di inserire immagini o pagine, o un proprio sfondo.
  2. <IFRAME> </IFRAME>    permette di inserire nella pagina una pagina web riciamata da menu mediante il nome dell'iframe usato come target.
  3. <TABLE>  </TABLE>     permette di inserire Tabelle di n righe, m colonne

 
</html> Questa è l'istruzione che indica la fine della pagina HTML

Si tratta di semplici elementi base per la conoscenza delle pagine web

NOTA: i riferimenti a script e fogli di stile sono relativi alla localizzazione della pagina che si sta costruendo. Per esempio il riferimento al foglio di stile di questa pagina

<link href="../../../css/socialmediabut.css" rel="stylesheet" type="text/css" >

è riferito al css (socialmediabut.css) dei bottoni che consentono di trasmettere la pagina mediante i social più diffusi; il foglio di stile si trova tre livelli indietro nella struttura rispetto a questa pagina e dentro la cartella denominata css


Lino Bertuzzi