Få HTML5 att fungera i gamla versioner av Internet Explorer

legacy-and-html5

Få HTML5 att fungera i gamla versioner av Internet Explorer

En av huvudorsakerna till att utvecklare kanske inte går över till HTML5 ännu är den upplevda bristen på stöd för äldre webbläsare. Detta är faktiskt osant, och även om det kan krävas en del tjafs för korrekt bakåtkompatibilitet, är det fortfarande möjligt.

Naturligtvis menar jag med äldre webbläsare Internet Explorer, eftersom alla andra stora aktörer uppdaterar regelbundet och deras användare tenderar att följa efter: webbläsare som Firefox, Safari och Opera har stött HTML5 ett tag. Vissa utvecklare kan besluta att sluta stödja IE6, men för vissa är det inte ett alternativ och i alla fall stöder varken IE7 eller IE8 HTML5 heller. IE9 kommer, men det körs bara på Windows Vista och Windows 7, så de andra versionerna kommer fortfarande att finnas kvar under en lång tid framöver, som vi har sett med IE6.

Så vad behöver göras för att HTML5 ska fungera i Internet Explorer?

Okända element

Jo först och främst kommer IE inte att rendera några element som den inte känner igen, så den kommer helt att ignorera HTML5-strukturelement som t.ex. header, footer, article, section, och nav, alla större delar av en HTML5-webbplats. Detta kan åtgärdas genom att berätta för IE om dessa element med hjälp av JavaScript. Det bästa sättet att göra detta är att inkludera HTML5 shiv manus, skapat av Remy Sharp. Detta praktiska skript skapar alla relevanta HTML5-element som IE nu känner till när sidan renderas.

Ett problem med detta är att det inte fungerar för användare som har JavaScript avstängt. Tyvärr finns det ingen väg runt detta, så ett beslut måste tas av utvecklaren att antingen använda HTML5 eller stanna kvar med HTML 4.01.

Styling

De flesta webbläsare har interna stilmallar som bland annat gäller display:block för att blockera nivåelement. Medan vissa av de nyare webbläsarna nu gör detta för de relevanta HTML5-elementen, gör vissa det inte, och detta måste läggas till för alla webbläsare. Att bara lägga till följande styling kommer att göra susen:

article, aside, figure, footer, header, hgroup,
menu, nav, section { display:block; }

Formelement

Och vad sägs om några av de nya elementen i sig, till exempel nya inmatningstyper – hur renderas dessa i äldre webbläsare?

Bra faktiskt. Eftersom HTML5-specifikationen utökades i en bakåtkompatibelt sätt, alla indatatyper som inte känns igen, behandlas helt enkelt som text och kommer enkelt att återges som så.

Multimedia

Som jag har diskuterat tidigare är video- och ljudelementen designade för att tillåta ett fall tillbaka till Flash, vilket kommer att fungera bra i Internet Explorer.

Övergången till HTML5 kommer fortfarande att ske gradvis, och vissa kommer inte att se eller ha behov av att använda någon av de nya funktionerna som den tillhandahåller, men när de gör det kan de vara (relativt) säkra i vetskapen om att äldre webbläsare kommer att göra sina webbplatser bra.

Lämna en kommentar

Din e-postadress kommer inte publiceras.