Domanda

Ho appena iniziato a lavorare per un'azienda piuttosto grande e il mio gruppo gestisce tutti i loro siti Web pubblici. Ho aperto il foglio di stile per la prima volta oggi e ho visto oltre 20 istanze di designer che utilizzano l'hack della famiglia di voci per correggere un bug di IE. (Non so perché consentano ai grafici di scrivere qualsiasi tipo di markup)

Qual è l'opinione pubblica generale dell'hack della famiglia vocale. Vale la pena consigliare di utilizzare i commenti condizionali di IE per includere fogli di stile personalizzati?

È stato utile?

Soluzione

Gli hack di qualsiasi tipo sono pericolosi in quanto sono inclini ad avere effetti indesiderati nei browser futuri (molti si sono rotti con IE7). I modi sicuri per filtrare i CSS sono:

  • (Solo per IE) Utilizzo dei commenti condizionali. Funzioneranno sempre sui browser Microsoft e saranno sempre ignorati da tutti gli altri browser in quanto si trovano nei commenti
  • Targeting per funzionalità: utilizzo di selettori CSS supportati solo dai browser moderni per impedire ai browser meno recenti di tentare di interpretare le regole. Tuttavia, il fatto che un browser riconosca la sintassi non significa che la gestisca correttamente. Tutto ciò che garantisci qui è che i browser più vecchi non proveranno a rendere queste regole e non quelle moderne le faranno correttamente

Quando possibile, utilizzare il sottoinsieme di CSS supportato correttamente da tutti i principali browser. Questo sta migliorando nel tempo poiché i browser più vecchi scendono a percentuali ignorabili dei tuoi utenti.

Altri suggerimenti

La famiglia di voci " l'hack, meglio noto come Tantek Celik Box Model Hack, viene utilizzato per nascondere specifiche regole CSS da IE4 / 5 su Windows a causa di implementazioni errate dello standard CSS in quei browser. È un tentativo di fornire il singolo foglio di stile più corretto a tutti i browser, senza ricorrere allo sniffing del browser e a più fogli di stile.

Ironicamente questo hack è il risultato di molte ore-uomo (mesi?) di sperimentazione e test per sviluppare un foglio di stile conforme agli standard che funziona su browser più vecchi, più recenti e futuri. È una delle numerose soluzioni alternative create per compensare l'orribile stato di conformità del browser allo standard CSS.

Vedi Progettare con gli standard Web di Jeffrey Zeldman per uno sguardo approfondito sul perché aderire agli standard (per quanto possibile) è un obiettivo meritevole e perché usare lo sniffing del browser e più fogli di stile provoca solo mal di testa per lo sviluppatore:

http://www.amazon.com/Designing-Web-Standards-Jeffrey -Zeldman / dp / 0321385551 /

Un esempio è la corsa agli armamenti per tenere il passo con le combinazioni browser / sistema operativo, per non parlare dei telefoni cellulari e di altri dispositivi futuri con funzionalità di navigazione. Il codice di rilevamento deve essere modificato con ogni nuova combinazione e, a causa del modo in cui molti browser si mascherano da Netscape Navigator, il rilevamento può diventare un lavoro a tempo pieno.

Un altro buon riferimento è il Web Standards Project, che contiene molte buone informazioni e tutorial sull'argomento:

http://www.webstandards.org/

Se sposti il ??tuo stile di codifica verso la conformità agli standard, in genere non dovrai preoccuparti del rilascio di futuri browser. Sì, devi ancora provare contro di loro, ma non devi scrivere e quindi testare fogli di stile personalizzati per ognuno.

La mia sensazione su hack come questo è che dovresti evitarli se puoi. Se è possibile ottenere il rendering corretto su tutti i browser senza ricorrere a tali shenanigans, allora dovresti farlo nel modo giusto. Tuttavia, a volte i browser hanno implementazioni CSS errate ed è necessario utilizzare hack come questo.

Non utilizzare inclusioni condizionali. Utilizza un selettore CSS invece , è molto più elegante. Puoi scegliere come target le classi su singoli browser (e / o versioni):

.myClass {...}

.ie6 .myClass {...}

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top