Elemento HTML: differenze tra le versioni

Contenuto cancellato Contenuto aggiunto
m Formattazione: <tt> non produce anche il box
m Vari: + punto fermo in didascalia, +parm lingua
 
(11 versioni intermedie di 8 utenti non mostrate)
Riga 1:
{{Organizzare|Bisogna riorganizzare la struttura della pagina|informatica|febbraio 2025}}
Un '''elemento HTML''', in [[informatica]], spesso chiamato anche '''tag HTML''', indica una struttura in un documento [[HTML]] e un metodo per ordinare gerarchicamente i contenuti. Più specificamente è un elemento [[SGML]] che soddisfa i requisiti di uno o più [[Document Type Definition|DTD]] HTML<ref name=":1">{{Cita web|url=https://www.ocean-team.com/upload/immagini/certificazioni/e77dd6f7bc9604ae793a68a9ce4d0f64.pdf|titolo=pdf}}</ref>.
[[File:HTML element content categories.svg|miniatura|Categorie in cui sono divisi gli elementi HTML]]
Un '''elemento HTML''', in [[informatica]], spesso chiamato anche '''tag HTML''', indica una struttura in un documento [[HTML]] e un metodo per ordinare gerarchicamente i contenuti. Più specificamente è un elemento [[SGML]] che soddisfa i requisiti di uno o più [[Document Type Definition|DTD]] HTML.<ref name=":1">{{Cita web|url=https://www.ocean-team.com/upload/immagini/certificazioni/e77dd6f7bc9604ae793a68a9ce4d0f64.pdf|titolo=pdf|accesso=23 novembre 2021|dataarchivio=20 gennaio 2021|urlarchivio=https://web.archive.org/web/20210120044935/http://www.ocean-team.com/upload/immagini/certificazioni/e77dd6f7bc9604ae793a68a9ce4d0f64.pdf|urlmorto=sì}}</ref>.
 
== Descrizione ==
Riga 17 ⟶ 19:
 
=== Annidamento ===
Molti elementi HTML possono essere "[[Annidamento (informatica)|nidificati]]". La nidificazione è più facilmente comprensibile attraverso esempi<ref>{{Cita web|url=https://www.andreaminini.com/html/annidamento-tag-html|titolo=L'annidamento dei tag in Html|sito=www.andreaminini.com|accesso=2021-11-23}}</ref>:
 
:<code><nowiki><p>You<em>rock</em></p></nowiki></code>
Riga 42 ⟶ 44:
 
== Elementi block-level ed elementi inline ==
[[File:Boxmodel-html.png|alt=Boxmodel|miniatura|Il ''box-model'' è una scatola che avvolge ogni elemento HTML<ref>{{Cita web|url=https://www.w3schools.com/css/css_boxmodel.asp|titolo=CSS Box Model|sito=www.w3schools.com|accesso=31 gennaio 2021}}</ref>.]]
Un '''elemento ''block-level''''' inizia di solito su una nuova riga mentre un '''elemento ''inline''''' di solito no. Un elemento ''block-level'' può contenere altri elementi sia di tipo ''block-level'' sia di tipo ''inline'' mentre un elemento ''inline'' può contenere solo altri elementi di tipo ''inline''. Esempi di elementi block-level sono paragrafi, elenchi, tabelle, intestazioni e il contenitore generale <code><nowiki><div></nowiki></code>. Gli elementi di blocco sono elementi con un contenitore rettangolare composto del contenuto, padding, border e padding esterno (margin). Si possono specificare le sue dimensioni con i [[CSS]]. Gli elementi in linea (ad esempio STRONG, ITALIC e UNDERLINE") non creano blocchi, vengono visualizzati sulla stessa linea con i contenuti del tag adiacenti. La larghezza e l'altezza dell'elemento "in linea" dipende solo dal suo contenuto, non si possono specificare le sue dimensioni con i CSS<ref>{{Cita web|url=https://www.w3schools.com/html/html_blocks.asp|titolo=HTML Block and Inline Elements|sito=www.w3schools.com|lingua=en-US|accesso=2021-11-23}}</ref>.
 
== Elementi d'intestazione in HTML 4.01 ==
Riga 296 ⟶ 298:
 
=== Moduli ===
L'HTML può solo definire il formato del [[form|modulo]], gli input degli utenti vengono processati da un [[linguaggio di scripting]] [[lato client]] oppure [[lato server]]<ref>{{Cita web|url=https://www.w3schools.com/html/html_forms.asp|titolo=HTML Forms|sito=www.w3schools.com|lingua=en-US|accesso=2021-11-23}}</ref>.
 
;<code>&lt;form>...&lt;/form></code>
Riga 371 ⟶ 373:
=== Colori ===
{{vedi anche|Colori Web}}
'''I colori Web''' sono [[Colore|colori]] usati nella [[Web design|visualizzazione di pagine Web]] sul [[World Wide Web]] e nei metodi per descrivere e specificare tali colori. I colori possono essere specificati come una tripletta [[RGB]] o in formato [[Sistema numerico esadecimale|esadecimale]] (una ''tripletta esadecimale'') o in alcuni casi in base ai loro nomi comuni inglesi. Uno strumento di prelievo colore o un altro [[Software grafico|software di grafica]] viene spesso utilizzato per generare valori di colore. Un esempio: <code>#0099CC</code> (un tipo di azzurro che si può anche scrivere <code>Pacific Blue</code>)<ref>{{Cita web|url=http://www.dannydesign.it/tabella-colori-web.html|titolo=Danny Design: tabella colori web|sito=www.dannydesign.it|accesso=2021-11-23}}</ref>.
 
=== Collegamenti e ancore ===
Riga 395 ⟶ 397:
;<code>&lt;br></code>
;<code>&lt;br/></code> (in XHTML)
:Specifica un'interruzione di linea.[[File:Area-shape-html.png|alt=Esempio di area shape su una immagine. In alto sono indicate le aree cliccabili dall'utente, in basso cosa vede l'utente.|miniatura|Esempio di tag <map> su una immagine. In alto sono indicate le aree cliccabili dall'utente, in basso cosa vede l'utente. Quest'ultimo le noterà solo quando passerà sopra di esse con il mouse.]]
;<code>&lt;map>...&lt;/map></code>
:Specifica una mappa lato client, ossia aree cliccabili dall'utente.
Riga 404 ⟶ 406:
:Testo lampeggiante. Può essere reso in alternativa con la direttiva di stile <code>{text-decoration: blink}</code>
;<code>&lt;marquee>...&lt;/marquee></code> (fortemente sconsigliato)
:Tag deprecato<ref>{{Cita web|lingua=en|url=https://stackoverflow.com/questions/31951282/why-is-marquee-deprecated-and-what-is-the-best-alternative|titolo=javascript - Why is deprecated and what is the best alternative?|sito=Stack Overflow|accesso=5 febbraio 2021}}</ref>, crea l'effetto di testo scorrevole. Non ha nessun equivalente nelle direttive di stile. Gli attributi sono:
::<code>behaviour</code>: indica il tipo di movimento del testo, può assumere i valori:
:::<code>scroll</code>: il testo arrivato alla fine viene ripresentato dall'inizio in modo continuo;
Riga 446 ⟶ 448:
{{Vedi anche|Iframe|Frameset}}
 
I frame, in italiano "cornici", permettono di strutturare il documento HTML in sotto-documenti che il browser gestisce come finestre separate. Ad esempio è possibile tenere sempre fisso e visibile un menu di navigazione in una prima cornice posizionata nel bordo sinistro della pagina, affiancata ad una seconda cornice che racchiude il contenuto principale scorrevole. Gli elementi <code>frame</code> devono essere inclusi dentro un elemento <code>frameset</code> che sostituisce il <code>body</code> e lo stesso documento HTML deve essere dichiarato come Frameset. In altre parole, un elemento <code>html</code> può contenere un <code>head</code> ed un <code>body</code> (nel caso di documenti Strict o Transitional) o, in alternativa, un <code>head</code> e un <code>frameset</code>.<ref>{{cita web |url=https://www.w3.org/TR/html4/present/frames.html#h-16.1 |titolo=HTML 4.01 Specification, Frames |data=24 dicembre 1999 |editore=W3C |sito=www.w3.org |lingua=en |accesso=14 giugno 2014}}
</ref>
Le cornici sono parte dello standard HTML 4.0 Frameset, mentre in HTML5 sono state dichiarate obsolete<ref>{{Cita web|url=https://developer.mozilla.org/en-US/docs/Web/HTML/Element/frameset|titolo=- HTML: HyperText Markup Language {{!}} MDN|sito=developer.mozilla.org|accesso=5 febbraio 2021}}</ref><ref>{{Cita web|url=https://www.ostraining.com/blog/webdesign/against-using-iframes/|titolo=3 Reasons You Might Not Want To Use Iframes|sito=www.ostraining.com|accesso=5 febbraio 2021}}</ref>.
 
;<code>&lt;frameset>...&lt;/frameset></code>
Riga 465 ⟶ 467:
RDFa (Resource Description Framework in Attributes ) è una raccomandazione del [[W3C]] che aggiunge una serie di estensioni a livello di attributo a HTML, XHTML e vari tipi di documenti basati su XML per incorporare metadati ricchi nei documenti Web. La mappatura del modello dati RDF consente il suo utilizzo per incorporare espressioni RDF soggetto-predicato-oggetto all'interno di documenti XHTML. Consente inoltre l'estrazione di triple del modello RDF da parte di programmi utente conformi .
 
La comunità RDFa gestisce un sito web wiki per ospitare strumenti, esempi e tutorial<ref name="rdfa wiki">{{Cita web|url=http://rdfa.info/|titolo=RDFa / Tools}}</ref>.
 
=== Essenza ===
Riga 488 ⟶ 490:
 
=== Vantaggi ===
Ci sono cinque "principi di metadati interoperabili" soddisfatti da RDFa<ref>[http://assets.adida.net/presentations/w3c-2006-04-06/w3c-2006-04-06.pdf Building Interoperable Web Metadata]</ref>.
 
* Indipendenza dal publisher: ogni sito può utilizzare i propri standard
Riga 495 ⟶ 497:
* Modularità dello schema: gli attributi sono riutilizzabili
 
Inoltre RDFa può trarre vantaggio dall'accessibilità web poiché maggiori informazioni sono disponibili per la tecnologia assistiva<ref>{{Cita web|url=http://www.standards-schmandards.com/2007/rdfa-and-accessibility/|titolo=RDFa – Implications for Accessibility – Standards Schmandards}}</ref>.
 
=== Esempio ===
Riga 622 ⟶ 624:
|Applicazioni web offline (file ".manifest")
|Dopo la prima sessione di navigazione online,
resteranno accessibili alcuni oggetti anche
 
in assenza di una connessione di rete.
Riga 631 ⟶ 633:
|WebStorage API
|Si possono ad esempio tenere aperti contemporaneamente
due account social o mail sullo stesso browser e ogni navigazione
 
sul primo comporterà il logout del secondo e viceversa
Riga 641 ⟶ 643:
|WebSocket API
|Stabiliscono e mantengono una connessione dati tra browser
e server remoto sulla quale far transitare messaggi
 
in entrambe le direzioni
Riga 670 ⟶ 672:
 
== Haml ==
'''Haml''' ( HTML Abstraction Markup Language) è un sistema di modelli progettato per evitare di scrivere codice inline in un documento web e rendere l'HTML più pulito. Haml offre la flessibilità di avere alcuni contenuti dinamici in HTML. Simile ad altri linguaggi web come [[PHP]], ASP, JSP e sistemi di modelli come eRuby , Haml incorpora anche del codice che viene eseguito durante il runtime e genera codice HTML per fornire alcuni contenuti dinamici. Per eseguire il codice Haml, i file devono avere un'estensione .haml. Questi file sono simili ai file .erb o eRuby che aiutano anche a incorporare il codice Ruby durante lo sviluppo di un'applicazione web<ref>{{Cita web|url=https://haml.info/|titolo=Haml|sito=haml.info|accesso=4 febbraio 2021}}</ref>.
 
=== Esempio ===
Riga 724 ⟶ 726:
 
[[Categoria:HTML]]
[[Categoria:Terminologia informaticadel web]]
[[Categoria:Formattazione del testo]]