[HTML] Gli Elementi atipici o innominati

Gli Elementi HTML custom o personalizzabili sono quei tag ed attributi HTML che lo sviluppatore letteralmente inventa da sè, in quanto – mutuando una definizione dal dirittoatipici o innominati per la sintassi ufficiale, la quale infatti li disciplina solo in parte (come nel caso dell’attributo data-*), o non li disciplina affatto.

Cionondimeno, analogamente a quanto avviene in ambito giuridico (art. 1322 c.c.), tali Elementi atipici possono essere (efficacemente) utilizzati in autonomia, non solo a fini HTML (cioè per la struttura e la semantica della pagina web), ma anche per altri scopi (meritevoli di tutela, ça va sans dire), come ad esempio in ambito CSS o JavaScript/jQuery, ove si comportano come se fossero tag ed attributi tipici o nominati, cioè normali: i web browser, infatti, sono compatibili con nuovi Elementi HTML, quindi potenzialmente sconosciuti, che trattano come se fossero generici tag HTML di tipo inline, assimilabili pertanto agli <span>.

<fake>Questo è un tag finto: è comunque evidenziato in giallo (CSS) e puoi comunque cliccarci sopra (jQuery).</fake>
<p fake="true">Questo paragrafo contiene un attributo finto: è comunque evidenziato in giallo (CSS) e puoi comunque cliccarci sopra (jQuery).</p>
<style>
fake { background-color:yellow; }
[fake] { background-color:yellow; }
</style>
<script>
$("fake").click(function(){
  alert("Hai appena cliccato su un Elemento HTML finto! (tag 'fake')");
});
$("[fake]").click(function(){
  alert("Hai appena cliccato su un Elemento HTML con un attributo finto! (tag 'p' con attributo 'fake')");
});
</script>
<fake>Questo e' un tag finto: e' comunque evidenziato in giallo (CSS) e puoi comunque cliccarci sopra (jQuery).</fake>
<p fake="true">Questo paragrafo contiene un attributo finto: e' comunque evidenziato in giallo (CSS) e puoi comunque cliccarci sopra (jQuery).</p>

Risultato:

Oltre agli immaginabili vantaggi di una tale libertà di personalizzazione (si pensi, ad esempio, alla possibilità di utilizzare un fantasioso tag HTML <ninja>, al posto di un più prolisso e meno significativo tag HTML <div class="mimetico">), devono altresì considerarsi le possibili controindicazioni che la personalizzazione stessa potrebbe comportare, ad esempio: eventuali problemi di rendering da parte dei web browser più datati; possibili conflitti con gli standard futuri (si pensi alla successiva tipizzazione di un tag HTML con caratteristiche affatto diverse da quelle già attribuite dallo sviluppatore al proprio tag custom); eventuali difficoltà in termini di usabilità da parte di utenti con handicap; possibili equivoci da parte di sviluppatori successivi, diversi da chi ha scritto il codice personalizzato (specie in mancanza di idonei commenti al codice stesso); possibili conseguenze negative in termini di SEO.

blog, html

Related Articles

0 Comment

Rispondi