Vad du borde veta om kapslade tabeller

Webbsidor måste laddas ner snabbt, men kapslade tabeller kan sakta ner processen. Låt inte någon berätta att fler använder bredband eller höghastighetsinternet, så du behöver inte oroa dig för hur snabbt dina sidor laddas. Med mängden innehåll på webben kommer en sida eller webbplats som laddas långsamt att ha färre besökare än en som laddas snabbt. Hastighet är viktig, särskilt på mobilanslutningar som kan vara begränsade till 2G- eller 3G-datahastigheter.

Vad är en kapslad tabell?

En kapslad tabell är en HTML-tabell som har en annan tabell inuti. Till exempel:

Webbläsare som visar exempelkoden i föregående exempel på en kapslad tabell.

Kapslade tabeller gör att sidor laddas ner långsammare

En enda tabell på en webbsida kommer inte att ladda ner sidan långsammare. Men när du placerar en tabell i en annan tabell blir det mer komplicerat för webbläsaren att rendera, så sidan laddas långsammare. Och ju fler bord du häckar, desto långsammare laddas sidan.

Normalt, när en sida läses in, startar webbläsaren högst upp i HTML-filen och laddar den sekventiellt ner på sidan. Men med kapslade tabeller måste den hitta slutet på tabellen innan den kan visa hela saken. Anledningen till att renderingen saktar är att webbläsaren måste upprepa HTML-dokumentet ytterligare gånger.

instagram viewer

Tabeller för layout

När du skriver giltigt XHTML bör tabeller inte användas för layout. Tabeller är för tabelldata som kalkylark, inte för siddesign. Istället bör du använda CSS för layout—CSS-design renderas snabbare och hjälper dig att behålla giltig XHTML.

Designa bord med snabbare laddning

Om du utformar en tabell med flera rader kan den ofta laddas snabbare om du skriver varje rad som en separat tabell.

Men om du skrev samma tabell som två tabeller, verkar det ladda snabbare, eftersom webbläsaren skulle göra det första och sedan göra det andra, snarare än att göra hela tabellen allt genast. Tricket är att se till att varje tabell har identiska bredder och andra stilar (som vaddering, marginaler och ramar).

Konvertera kapslade tabeller till en tabell

Konvertera kapslade tabeller till lite mer komplexa enstaka tabeller genom att vara smart med attribut som colspan, som om de används omsorgsfullt kommer att simulera utseendet på en kapslad tabell utan att fungera som en.