Guida Pagine Web - News

Benvenuto nel Portale del Network Arquen.net dedicato ai Web Designer.
In questo portale sono pubblicati articoli, guide, segnalazioni, video e risorse in riferimento a html, css, javascript, php, grafica, cms, web 2.0: tutto ciò che occorre per imparare a realizzare siti internet.

Puoi seguire il network anche su:

Tutorial Xhtml: Ancoraggio link

Autore: Arquen | Pubblicato il: 13/05/10 | Categoria: XHtml

Per creare un sistema di ancoraggio all'interno di una pagina HTML sono necessari i seguenti codici inseriti entrambi nel corpo della pagina:

< body>
nomedellink


< /body>

La prima riga è il classico link, la seconda riga, invece, funziona come "segnalino". Da notare che sia in href che in name viene inserita la stessa parola. Poi si clicca sul link e si viene reindirizzati al punto esatto in cui è stato inserito il "segnalino".

In questo modo funziona il classico link: torna a inizio pagina.

Ma possiamo utilizzare le ancore anche per altri scopi:

  • per chi non utilizza il mouse (disabilità motoria);
  • per chi utilizza dispositivi come palmari o portatili senza mouse;
  • per chi utilizza dispositivi di sintesi vocale (disabilità visive).

In quest'ultimo caso le ancore vengono inserite ad inizio pagina e all'interno di un div contenitore che poi verrà reso invisibile, tramite CSS, agli esseri umani, ma non ai lettori vocali.

Ritornando al codice, in XHTML, sopratutto se usiamo un doctype strict, l'attributo name è deprecato per quanto riguarda l'utilizzo nelle ancore, e dovrebbe essere sostituito con ID. Però siccome non tutti i browsers (versioni precedenti) supportano ID, bisogna utilizzarli entrambi. Quindi il codice diventerà:

< body>
nomedellink


< /body>

L'ancora può essere inserita non solo in "A", ma anche in un paragrafo "P", in un intestazione "H", in un contenitore "DIV", ecc.. Però, come detto in precedenza, alcuni browsers non supportano l'elemento ID, e siccome name inserito in P, in H e in DIV, non crea nessun ancoraggio, è bene utilizzare solo A.

Per finire, se vogliamo avere il codice validato, bisogna inserire sia il link, sia l'ancora in un div contenitore.

Quindi il codice diventerà:

< body>


< /body>

Ovviamente nel DIV inseriremo una CLASS o un ID.

Commenta tu per primo!

  • Compila i campi obbligatori.
  • I commenti ritenuti offensivi verranno eliminati.