-
Optimera dina tabeller
Om man inte använder CSS fullt ut på sin webbplats utan använder tabeller finns ett bra knep för att optimera och låta sidans viktiga innehåll hamna före det mindre viktiga.
Många använder en meny i vänsterspalten och med en tabell hamnar menyn följdaktligen före sidans innehåll i koden. En liten extra tabell utanpå allt kan lösa detta.
Kod:
<table>
<tr>
<td><!-- LÅT DENNA VARA TOM --></td>
<td rowspan="2">
INFOGA SIDANS INNEHÅLL HÄR
</td>
</tr>
<tr>
<td>
INFOGA VÄNSTERSPALTENS MENY HÄR
</td>
</tr>
</table>
-
Mycket bra!
Det gamla tabelltricket som många inte vet om. Nuförtiden brukar man göra det med CSS och exakt positionering för de som känner till det men detta går även lika bra och jag tror det har en betydelse.
Ryktepoäng given!
-
Finns det några trick om man har en 'liggande' meny också istället för vänsterspalt-meny?
-
Med CSS och position:absolute; är det inte några problem. Säg till om du vill ha kod.
-
Fick ett PM om att förklara hur man gör med css samt hur viktigt det är att texten ligger före menyn. Väljer att skriva ut svaret här ifall någon annan också undrar.
En generell regel är att ju längre upp i koden någonting är, desto viktigare är det, så man ska alltid sträva efter att ha med sin text med nyckelord högst uppe i koden.
Här är ett exempel på hur man kan använda CSS för att skriva ut menyn ovanför visuellt, men inte i koden. I detta exempel använder jag en meny som är 50 pixlar hög.
Kod:
<html>
<head>
<style>
body { margin:0; }
#menu {
position:absolute;
height:50px;
}
#site {
position:absolute;
top: 50px;
}
</style>
</head>
<body>
<div id="site">
Din text här
</div>
<div id="menu">
Din meny här
</div>
</body>
</html>
-
Bygger vidare lite på Rasmus kod, ofta är det så att man har någon logo eller dyligt över menyn och då är det smidigare och köra "margin-top" istället för "top", för att "top" förutsätter att menyn ligger i överkanten på sidan, exempel:
Kod:
<head>
<style>
#menu {
position: absolute;
height: 20px;
}
#site {
position: absolute;
margin-top: 20px;
}
</style>
</head>
<body>
Något innan menyn.<br />
<div id="site">
Din text här
</div>
<div id="menu">
Din meny här
</div>
</body>
-
Så att köra med tabeller i koden är inte att rekommendera?
-
Nej tabeller är ju egentligen till endast för att göra listor eller riktiga tabeller över värden. Däremot har det ju tidigare varit ett väldigt enkelt och smidigt sätt att bygga webbplatser på.
I dagsläget skulle jag rekommendera CSS och bygga webbplatserna med det istället. Det är otroligt kraftfullt och kräver inte alls så mycket kod som tabeller. Därmed inte sagt att det alla gånger är lätt att bygga med CSS, jag ramlar ofta ner i tabell-träsket pga tidsbrist och gammal vana. :)