Back to the original French page Read this page in Italian by Google Translation Read this page in Portuguese by Google Translation Read this page in English by Google Translation Read this page in German by Google Translation Read this page in Spanish by Google Translation Read this page in Arabic by Google Translation Read this page in Hebrew by Google Translation

Fornire una struttura semantica per le pagine Web

Vai all'inizio del contenuto senza utilizzare l'accesso e la condivisione di bar Istruzioni per bloccare l'accesso e la condivisione Ascoltate il contenuto principale di questa pagina
Stampa Stampa il contenuto principale di questa pagina Inviare E-mail il contenuto principale di questa pagina Quota Condividi questa pagina su Mixx Condividi questa pagina su Facebook Condividi questa pagina su Wikio Condividi questa pagina su Google Condividi questa pagina su LinkedIn Condividi questa pagina su Digg Condividi questa pagina su del.icio.us Condividi questa pagina su Netvibes

Disclaimer: La versione originale di questo documento è Creazione di struttura semantica . La traduzione francese è stato fatto da ideos virtù di un accordo tra WebAIM e ideos .

Nota: vedere a pagina Documenti in materia di accessibilità Web per un elenco di tutti i documenti già tradotti. Altre risorse sul web di accessibilità sono inoltre elencati nel portale di accesso digitale .

La natura del linguaggio HTML

Gli autori di HTML erano scienziati che cercavano un modo per condividere documenti sulla fisica delle particelle. Indossavano scarso interesse per la forma visiva documento mostrate sullo schermo di un computer. In realtà, HTML è stato originariamente progettato per soddisfare una separazione tra struttura dei contenuti e il layout grafico. L'intenzione era di creare un World Wide Web che possono essere visualizzate in ogni sistema esistente e browser - compresi i browser che "leggere" le pagine web di testo agli utenti con disabilità visiva - e che potrebbe essere interpretato da motori di ricerca e di analisi.

Gli inventori del Web non realizzare il proprio potenziale per la visualizzazione grafica. Pertanto, l'HTML non è stato progettato con queste considerazioni. Sono stati così ansiosi di rendere i documenti utilizzabili dalle macchine che hanno prodotto i documenti che le macchine solo (o fisici delle particelle) vorrebbe leggere. Concentrandosi esclusivamente sulla logica strutturale dei documenti hanno ignorato la necessità che la logica visiva del design grafico e tipografia. Questa mancanza iniziale di considerazione in merito al contenuto visivo sta causando lo stress del web designer quando ottengono un layout grafico per le proprie pagine web specifiche. Questa esigenza per la formattazione è la ragione per cui le aziende di software hanno iniziato le consegne di ignorare gli standard di HTML e hanno autorizzato le caratteristiche aggiuntive nei loro browser.

Per esempio, molti progettisti evitare l'utilizzo di tag HTML standard per i titoli dei paragrafi ( <h1> , <h2> , ecc.) a causa della mancanza finezza visiva: nella maggior parte dei browser, questi indicatori mostrano Titoli assolutamente troppo grande ( <h1> , <h2> ) o ridicolmente piccolo ( <h4> , <h5> , <h6> ). Ma queste tag HTML non sono stati creati con la preoccupazione della loro resa visiva. Il loro unico obiettivo è quello di identificare il livello di héarchique un titolo in modo che i lettori e motori di ricerca umano può facilmente leggere un documento e determinare la sua struttura di informazione. Solo involontariamente che gli sviluppatori del browser hanno dato diverse dimensioni e livelli di grasso in ogni tag del titolo del paragrafo, anche se queste dimensioni tendono ad essere stretto nel codice HTML.

Utilizzare i titoli dei paragrafi per strutturare il contenuto

Nonostante la natura del Web e dei grandi cambiamenti di utilizzo (di un modo di strutturare un documento a un medium visivo), è importante che il contenuto Web è stato progettato con una buona struttura. Con una migliore integrazione dei fogli di stile (CSS) nelle versioni più recenti dei browser Web, gli sviluppatori possono modificare l'aspetto degli elementi strutturali per soddisfare la loro scelta di design e visualizzazione.

Esempio

Vista la struttura del contenuto di una delle tue pagine web utilizzando il validatore del W3C . . Inserisci l'URL della pagina Web nella casella di testo, selezionare Mostra Struttura e quindi fare clic su Convalida questa pagina. Per ora, ignorare gli errori HTML che vengono visualizzati e scorrere la pagina per visualizzare la mappa visualizzata sulla pagina web. Vedrete una breve panoramica della struttura del contenuto della pagina web, come definito dal tag ( <h1> - <h6> ). Se il risultato non sembra un vero piano, è probabile che i tag non vengono utilizzati correttamente (o non ci sono titoli faro comma).

Gli utenti di lettori di schermo e di altre tecnologie assistive hanno la possibilità di consultare le pagine Web utilizzando la loro struttura. Ciò significa che l'utente può leggere o andare direttamente a livello di elementi di elevato ( <h1> ), poi quelli di secondo livello ( <h2> ) e quelle del terzo livello ( <h3> ) e così via. La visione o l'ascolto di questo piano dà loro una buona idea del contenuto e della struttura della pagina.

Le pagine dovrebbero essere strutturate gerarchicamente, il primo livello di sicurezza ( <h1> ) è il più grande (di solito la pagina del titolo o documento), poi il secondo livello di sicurezza ( <h2> , in genere, solo i titoli capitoli), poi il terzo livello di sicurezza ( <h3> , punti di sub capitoli) e così via. Tecnicamente, come un livello più basso dovrebbe seguire un livello di sicurezza superiore. Il diagramma seguente mostra la struttura dei titoli in titoli che dovrebbe contenere una pagina web. In realtà, essa rappresenta la gerarchia del contenuto principale di questa pagina con diversi livelli di titoli punto dalla più alta alla più bassa. Fai clic su ciascuno di questi titoli per accedere alla sezione corrispondente in questa pagina.

voci comma uso corretto

Non usare la formattazione del testo come la dimensione dei caratteri in grassetto o di avere l'aspetto visivo a voci paragrafo - utilizzare i tag standard del test ( <h1> - <h6> ) tutti i contenuti. tecnologie assistive e altri browser basati sul codice letteralmente pagina per determinare la sua struttura. Gli elementi che vengono visualizzati in grassetto o in caratteri più grandi non vengono interpretati come elementi strutturali.

Inoltre, non usare marcatura per creare titolazione solo effetti visivi. Per esempio, se si desidera evidenziare o sottolineare un elemento di contenuto che non è un titolo (come fatto con la frase precedente), non utilizzare i tag per fare le didascalie. Invece, utilizzare i tag di stile per la dimensione del carattere, grassetto o in corsivo. Se si vuole sottolineare qualcosa, è necessario utilizzare il tag strong (in grassetto) al posto di b e il tag em (corsivo aggiunto) invece di i . I tag b e i trasmettere tutti i 2 solo le informazioni visive, mentre il strong e em fornire informazioni semantiche. Visivamente, il risultato è lo stesso, ma gli sviluppatori devono utilizzare il codice HTML elementi appropriati. et sélectionnez l'option Utiliser « strong » et « em » à la place de « b » et « i » . In Dreamweaver, è possibile selezionare Modifica> Preferenze> Generale e selezionare Usa "forti" e "em" invece di "b" e "i".

Utilizzare correttamente gli elenchi

elenchi HTML - ul , ol e dl - anche utilizzati per trasmettere una gerarchia di contenuti. Ciascuna di queste liste hanno anche le norme sul loro uso. L'elenco puntato (lista non ordinata) dovrebbe essere usato quando non c'è nessuna sequenza o ordine di importanza tra gli elementi della lista. La lista propone una progressione ordinata o una sequenza di elementi nella lista. L'elenco definizione dovrebbe essere utilizzata esplicitamente per la presentazione di una struttura di definizioni. Come per le liste di titolazione tag tag deve essere utilizzato correttamente secondo la loro natura. Le ordinate e liste non ordinate deve sempre includere elementi della lista. Gli elenchi definizione deve sempre avere la descrizione delle definizioni. liste vuote non sono corretti HTML. Gli elenchi non deve mai essere usato per altri motivi o per il layout. Le liste nidificate devono essere codificati correttamente.

WebAIM è un'iniziativa di:
Centro per le persone con disabilità (CPD) Utah State University

Copyright 1999-2009 WebAIM

Top