HTML : ELEMENTI DEL TAG HEAD

<head> è il tag html che che funge da contenitore per i metadata (dati informativi sul documento html) , che non appaiono nella pagina, ma che fungono da informazioni per gli utenti e per i crawlers.

In parole povere , tutto ciò che è contenuto in questo tag non è visibile all’ occhio umano, I contenuto visibili della nostra pagina html si trovano nel tag body che esaminiamo nel prossimo tutorial.


Gli elementi ammessi all’ interno di questo tag sono i seguenti:

  • <title> 
  • <link> 
  • <meta> 
  • <style>
  • <script> 
  • <base>

1. TITLE

Title è l’ elemento che assegna un titolo alla pagina html , vediamo subito un esempio.

Copiate ed incollate il seguente codice nei vostri editor di testo.

(Noi utilizziamo NOTEPAD ++ scaricabile dal : link al sito ufficiale di NOTEPAD ++).

<!doctype html>
 <html lang="it">
 <head>
 <title> titolo della pagina </title>
 </head>
 </html>

2. LINK

<link> è l’elemento che viene utilizzato per collegare alla pagine principalmente i fogli di stile esterni(css), ma anche favicons personalizzate.

Nell’ esempio appena mostrato , abbiamo aggiunto al documento html un link ad un secondo documento denominato style.css , che conterrà tutte le informazioni sullo styling della pagina.

3. META

<meta> è l’elemento che fornisce metadati relativi al documento html. 

I meta elementi vengono usati per specificare informazioni aggiuntive utili ai motori di ricerca.


Alcuni di questi sono:

  • la descrizione della pagina : <meta name=”description” content=”tutorial head html”>
  • le parole chiave : <meta name=”keywords” content=”HTML, CSS, XML, XHTML, JavaScript”>
  • l’autore del documento : <meta name=”author” content=”Ciò Che So”>
  • robots : <meta name=”robots” content=”index, follow” />

4.STYLE

<style> è il  tag che attribuisce uno stile al nostro documento html.

All’interno dell’elemento <style> si specifica come devono essere visualizzati gli elementi HTML in un browser.

VEDIAMO UN ESEMPIO

<!doctype html>
 <html lang="it">
 <head>
 <title> titolo della pagina </title>
 <link rel "stylesheet" type = "text/css" href = "style.css"/>
 <style>
 h1 {
 color: red;
 }
 </style>
 </head>
 <body>
 <h1>questo è il titolo della parte visibile della pagina</h1>
 </body>
 </html>

5. SCRIPT

<script>  è l’elemento che contiene eventuali istruzioni di scripting.

Nella maggior parte dei casi , si tratta di script Java , che servono a dare dinamicità alla pagina , manipolare le immagini, audio video.

Di seguito un esempio di script che mosta l orario attuale

Sono le ore


6. BASE

<base> è l’elemento che consente di definire un target di base per tutti i link della nostra pagina.


Questo target decide se una pagina si dovrà aprire ad esempio nella medesima finestra o in una nuova scheda.

  • _blank : apertura in una nuova finestra
  • _self: apertura nella stessa finestra ( valore di default )

Vediamo un esempio

<!doctype html>
 <html lang="it">
 <head>
  <base href="https://www.ciocheso.com" target="_blank">
 </head>
 <body>
 <a href="https://www.ciocheso.com">CIO' CHE SO</a>
 </body>
 <body>
 <h1>questo è il titolo della parte visibile della pagina</h1>
 </body>
 </html>

Nell esempio appena mostrato , il link CIO’ CHE SO , aprirà la pagina in una nuova scheda.

Lascia un commento