Det första som de flesta designers överväger när de bygger sin webbsida är vad upplösning att designa för. Vad detta verkligen uppgår till är att bestämma hur bred din design ska vara. Det finns inget sådant längre som en vanlig webbplatsbredd.
Varför överväga upplösning
1995 var de vanliga 640 pixlar-för-480-pixlarna de största och bästa bildskärmarna. Detta innebar att webbdesigners fokuserade på att göra sidor som såg bra ut i webbläsare maximerade på en 12- till 14-tumsskärm med den upplösningen.
Dessa dagar utgör upplösningen 640 x 480 mindre än 1 procent av de flesta webbplatstrafik. Människor använder datorer med mycket högre upplösningar inklusive 1366-by-768, 1600-by-900 och 5120-by-2880. I många fall fungerar design för en skärm med upplösning 1366 x 768.
Todya, de flesta har stora bredbildsskärmar och de maximerar inte webbläsarfönstret. Så om du bestämmer dig för att utforma en sida som inte är mer än 1366 pixlar bred, kommer din sida förmodligen att se bra ut i de flesta webbläsarfönster även på stora bildskärmar med högre upplösningar.
Webbläsarens bredd
Ett problem som ofta förbises när man bestämmer bredden på en webbsida är hur stort dina kunder håller sina webbläsare. Specifikt maximerar de sina webbläsare i helskärmsstorlek eller håller de dem mindre än helskärmen?
När du har redogjort för kunder som maximerar eller inte, tänk på webbläsarens gränser. Varje webbläsare använder ett rullningsfält och gränsar till sidorna som krymper det tillgängliga utrymmet från 800 till runt 740 pixlar eller mindre på 800 gånger 600 upplösningar och cirka 980 pixlar på maximerade fönster vid 1024 gånger 768 resolutioner. Detta kallas webbläsare krom och det kan ta bort det användbara utrymmet för din siddesign.
Sidor med fast eller flytande bredd
Den faktiska numeriska bredden är inte det enda du behöver tänka på när du utformar webbplatsens bredd. Du måste också bestämma om du har en fast bredd eller vätskebredd. Med andra ord, ska du ställa in bredden till ett visst antal (fast) eller till en procentsats (flytande)?
Fast bredd
Sidor med fast bredd är precis som de låter. Bredden är fixerad till ett visst nummer och ändras inte oavsett hur stor eller liten webbläsaren är. Det här tillvägagångssättet kan vara bra om du behöver att din design ska se exakt ut oavsett hur bred eller smal dina läsares webbläsare är, men den här metoden tar inte hänsyn till dina läsare. Personer med webbläsare som är smalare än din design måste rulla horisontellt och personer med breda webbläsare har stora mängder tomt utrymme på skärmen.
Om du vill skapa sidor med fast bredd använder du specifika pixelnummer för siddivisionernas bredder.
Vätskebredd
Sidor med flytande bredd (kallas ibland sidor med flexibel bredd) varierar i bredd beroende på hur brett webbläsarfönstret är. Denna strategi ger design som fokuserar mer på kunder. Problemet med sidor med flytande bredd är att de kan vara svåra att läsa. Om skanningslängd för en textrad är längre än 10 till 12 ord eller kortare än 4 till 5 ord kan det vara svårt att läsa. Detta innebär att läsare med stora eller små webbläsarfönster har problem.
Använd procentsatser eller för att skapa sidor med flexibel bredd ems för bredden på dina sidavdelningar. Bekanta dig med CSS maximal bredd fast egendom. Med den här egenskapen kan du ställa in en bredd i procent, men sedan begränsa den så att den inte blir så stor att människor inte kan läsa den.
CSS-mediefrågor
Den bästa lösningen idag är att använda CSS-mediefrågor och responsiv design för att skapa en sida som anpassar sig till bredden på webbläsaren som visar den. En responsiv webbdesign använder samma innehåll för att skapa en webbsida som fungerar oavsett om du ser den med 5120 pixlar bred eller 320 pixlar bred. Sidorna med olika storlek ser olika ut, men de innehåller samma innehåll. Med mediefrågan i CSS3 svarar varje mottagande enhet frågan med sin storlek och formatmallen anpassas till den specifika storleken.