Devo usare tag non standard in una pagina HTML per evidenziare le parole?

No, questa non è una buona pratica. Dovresti usare già tag semantici e significativi - forse <em> in questo caso - e applicare gli stili CSS per raggiungere i tuoi requisiti di progettazione.

La tua domanda ha chiesto se è " buone pratiche o legali ".

In primo luogo: è di tipo legale - almeno, è tollerato. I browser sono sempre stati programmati per far fronte a tag che non capiscono, anche se questo significa che li ignorano. Questo codice HTML:

Some <b>bold</b> and some <slanted>italic</slanted>.

Apparirà come questo è ogni singolo browser:

Some bold and some italic.

Inoltre, i più browser ti permetteranno di dare uno stile a quell'elemento nei CSS. Quindi, se aggiungi la seguente definizione CSS:

slanted { font-style: italic; }

molti browser ora verranno visualizzati come segue:

Some bold and some italic.

Realmente: provalo tu stesso . Per inciso, questo è un trucco che gli sviluppatori web usano per cercare di garantire che i nuovi tag HTML5 vengano visualizzati correttamente nei browser più vecchi.

Tuttavia, non è proprio il quadro completo. La risposta completa è no, non è una buona pratica . Potresti aver notato il mio uso della frase " più browser". Sfortunatamente, tutte le versioni di Internet Explorer precedenti a IE9 non implementano questo comportamento. In IE8 e versioni precedenti, il codice sopra sarà ancora simile a questo:

Some bold and some italic.

C'è una descrizione estremamente dettagliata del problema all'indirizzo Dive Into HTML5 , dove troverai anche dettagli di una soluzione. Tuttavia, la soluzione alternativa richiede JavaScript, quindi non è una soluzione HTML pura e non funzionerà in tutti gli scenari.

Quindi, risposta breve: rispetta solo elementi HTML standard e personalizzali come preferisci il tuo CSS.

Se hai bisogno di mantenere la semantica di <important/> per motivi specifici, puoi utilizzare XSL per trasformare i tuoi tag personalizzati in HTML valido. Puoi leggere di più su questo argomento qui:

link

link

link

link

link

Ancora non puoi avere <important/> nell'output HTML finale, ma puoi trasformarlo automaticamente in qualcosa come <span class="important"... .

Qui ci sono alcune risposte che spiegano perché non dovresti mai creare i tuoi tag personalizzati. Probabilmente, sono tutti errati.

L'analisi WHATWG dei tag personalizzati conclude che sono accettabili, conformi agli standard (poiché la gestione dei tag non riconosciuti è ben definita ) e più accessibile rispetto, ad esempio, allo styling di un div generico.

<x-accordion></x-accordion> is no worse than <div class="accordion"></div> in every mechanical sense. In the absence of definition for "x-accordion" (or component model support), both mean the same thing, both can be styled in the same way. One is HTMLUnknownElement, the other is HTMLDivElement, and their API surface is identical.

Quello che dovresti fare, che l'OP non ha, è il prefisso di tutti i tag personalizzati con 'x-' per convenzione. Ciò indica chiaramente che intendi che questo tag sia locale al tuo documento ed evita i conflitti con elementi spec. Futuri.

Alcuni sostengono che, poiché alcuni browser popolari non gestiscono i tag personalizzati in un modo conforme agli standard, non è necessario utilizzarli. Tuttavia, il comportamento dei browser non conformi è un problema proprio e preferibilmente non ti costringerà a scrivere markup non semantico. Esistono sia soluzioni Javascript che non Javascript per questo problema, che dovrebbero essere applicate solo per i browser non conformi che desideri supportare in modo specifico.

Tutto ciò detto, se esiste un tag nella specifica (< mark >) che copre chiaramente il significato semantico del tag che hai creato (< highlight >), allora è certamente preferibile utilizzare il tag esistente .

Potresti utilizzare <em /> e <strong /> con CSS personalizzato per modificare la modalità di visualizzazione.

strong, si riferisce a una maggiore importanza.

L'enfasi, si riferisce alla maggiore enfasi.

Dal punto di vista pratico, è non necessario utilizzare i nuovi tag per l'evidenziazione. Puoi utilizzare i tag em o i se preferisci corsivo come predefinito (non CSS) e strong o b se preferisci bolding come predefinito. Se, per qualche motivo, preferisci il rendering predefinito come testo normale, ovvero senza evidenziazione, utilizza span . In ogni caso, puoi utilizzare un attributo class per distinguere questo utilizzo da altri usi che potresti avere per il markup.

Le specifiche HTML e le bozze (HTML5) sono oscure per quanto riguarda la semantica di questi elementi, ma questo non deve causare grossi problemi.

No, anche se è consentito aggiungere nuovi tag da un altro spazio dei nomi in XHTML, l'elaborazione dei tag HTML che non sono specificati è strongmente sconsigliata.

Bene, è legale in quanto non verrà arrestato per averlo fatto. Ma se gli assassini del W3C si presentano alla tua porta, non essere sorpreso.

Prima di tutto, altri sviluppatori non sapranno cosa significano. Nel caso di <important> e <highlight> lo sono, ma se usi qualcosa come, ad esempio, <set> , potresti sapere che ti stai riferendo a un set matematico, ma qualcun altro che sta leggendo il tuo codice potrebbe scambiarlo per qualcosa altro. Senza le specifiche per dare una risposta, ci potrebbe essere una grande confusione.

In secondo luogo, cosa succede se il W3C decide che un elemento <important> è una buona idea, ma pensa che dovrebbe significare un avviso urgente, come

<important>This site is going to be down for maintenance 2/29/2012.</important>

Allora sei fregato. I browser e i tuoi colleghi sviluppatori saranno piuttosto confusi. Probabilmente ti obbligheranno ad analizzare il tuo codice con espressioni regolari finché non impazzisci. E sappiamo tutti come si fa.

Terzo, IE < 9 non ti consente di creare elementi sconosciuti senza un piccolo trucco. Non è una cosa grossa, ma fastidiosa.

Infine, in questo caso, <important> e <highlight> esistono già! <strong> e <mark> sono ciò che stai cercando. In base alla specifica HTML5

The strong element represents strong importance for its contents.

e

The mark element represents a run of text in one document marked or highlighted for reference purposes ...

Se non lo stai utilizzando per "scopi di riferimento", un <span> con una classe andrebbe bene.

Ignorare l'opinione di tutti qui.

Non è una buona pratica per due motivi molto importanti:

In primo luogo, è del tutto possibile che a un certo punto il comitato degli standard decida di includere un tag chiamato <important> che finisce per prendere in considerazione il tuo uso per questo. Certo, potrebbe volerci un po 'di tempo .. Ma è possibile che tu perda tempo a strapparlo via dopo.

In secondo luogo, (questa è la vera ragione) il programmatore che eredita il tuo codice sta dicendo costantemente "wtf" al tuo approccio non standard mentre lo stai tirando fuori tutto, o, allo stesso modo, è completamente confuso da cosa hai fatto e semplicemente lasciato la frustrazione.

Quindi, sii gentile. Non si sa mai, si potrebbe finire per chiedere uno di loro per un lavoro un giorno.

link

Questa è la revisione 1.5612.

Gli autori non devono utilizzare elementi, attributi o valori di attributo non consentiti da questa specifica o da altre specifiche applicabili, in quanto ciò rende molto più difficile l'estensione della lingua in futuro.

No, non puoi creare i tuoi tag HTML, perché dovresti ottenere tutti i principali browser per implementarli, al momento quando i browser trovano un tag non riconosciuto che ignorano tutto in esso, quindi a meno che tu non voglia creare il tuo browser la creazione di un nuovo tag è inutile e anche in quel caso funzionerebbe solo con il browser.

Potresti provare a inviare un caso d'uso per loro al w3c, ma dubito che possa arrivare ovunque.

No, non è una buona pratica per tutte le ragioni fornite da tutte le altre risposte. Invece di ribadire quei punti, mi piacerebbe presentare un'opzione che non ho visto in quelle risposte!

Nel caso in cui non ci siano tag esistenti il cui significato semantico corrisponda ai tuoi obiettivi, potresti utilizzare una combinazione di CSS e il nuovo attributo data-* nelle specifiche HTML 5. Ovviamente questo funzionerà con la maggior parte dei tag che scegli.

Esempio:

Lorem ipsum dolor sit amet, 
<span class="important" data-type="important">consectetur adipiscing elit</span>. 
Nullam consequat, felis sit amet suscipit laoreet, 
<span class="highlighted" data-type="highlighted">nisi arcu accumsan arcu</span>, 
vel pulvinar odio magna suscipit mi.

Anche se questa non è una soluzione perfetta, poiché non esiste un significato semantico ben definito per gli attributi di data-* , questo ti consentirebbe almeno di fornire informazioni aggiuntive a quelli che conoscono il significato dell'attributo data-type .