Webbsidlayout kan göras på två olika sätt:
- Fixade breddlayouts - Dessa är layouter där bredden på hela sidan är inställd med ett visst numeriskt värde.
- Flytande layouter - Det här är layouter där bredden på hela sidan är flexibel beroende på hur bred tittarens webbläsare är.
Det finns goda skäl att använda båda layoutmetoderna, men utan att förstå både de relativa fördelarna och bristerna i varje metod, kan du inte göra ett bra beslut om vilka som ska användas för din webbsida.
Fast breddlayout
Fasta layouter är layouter som börjar med en viss storlek, bestämd av webbdesignern. De förblir så breda, oberoende av storleken på webbläsarfönstret som visar sidan. Fasta breddlayout gör det möjligt för en designer att ha mer direkt kontroll över hur sidan kommer att se ut i de flesta situationer. De föredras ofta av formgivare med en utskriftsbakgrund, eftersom de tillåter designern att göra små anpassningar till layouten och få dem att förbli konsekventa över webbläsare och datorer.
Flytande layouter
Flytande layouter är layouter som är baserade på procentsatser av det aktuella webbläsarfönsterets storlek. De böjes med storleken på fönstret, även om den aktuella tittaren ändrar sin webbläsars storlek när de tittar på webbplatsen. Vågformade layouter möjliggör en mycket effektiv användning av utrymmet som tillhandahålls av ett visst webbläsarfönster eller skärmupplösning. De föredras ofta av designers som har mycket information att komma över i så lite utrymme som möjligt, eftersom de förbli konsekventa i storlek och relativa sidvikter oberoende av vem som tittar på sidan.
Vad är det med Stake?
Den metod som valts för din webbdesign kommer att påverka mer än bara din design, men din webbplats är lyhörd och anpassningsbar. Beroende på vilket du väljer kommer du att påverka dina läsares förmåga att skanna din text, hitta vad de letar efter eller ibland även använda din webbplats. Dessutom kommer layoutstilen att påverka dina ansträngningar när du marknadsför din webbplats genom branding, tillgång till fastigheter och din webbplatss estetik.
Fördelar med fast breddlayout
- En layout med fast bredd gör det möjligt för konstruktören att bygga sidor som kommer att se ut identiska oavsett vem som tittar på dem.
- Objekt med fast bredd som bilder kommer inte att överskrida text på mindre bildskärmar eftersom bredden på hela sidan kommer att innehålla dessa element.
- Skanlängden påverkas inte av stora segment av text, oavsett hur stor webbläsaren är.
Fördelar med flytande layouter
- En vätskebreddslayout expanderar och kontrakterar för att fylla tillgängligt utrymme.
- All tillgänglig fastighet används, så att konstruktören kan visa mer innehåll på större bildskärmar, men fortfarande förbli livskraftig på mindre skärmar.
- Flytande layouter ger konsistens i relativa bredder, vilket gör det möjligt för en sida att reagera mer dynamiskt på kundbegränsade begränsningar som större teckenstorlekar.
Nackdelar med fast breddlayout
- Fasta breddlayouter kan orsaka horisontell rullning i mindre webbläsarfönster. Och de flesta gillar inte att rulla horisontellt.
- De kan också resultera i stora ytor av blankutrymme i större bildskärmar, vilket resulterar i mycket oanvänd utrymme och mer rullning vertikalt än vad som annars skulle behövas.
- Fasta breddlayouter hanterar inte kundändringar till teckenstorlekar mycket bra. För små ökar i teckenstorleken kan de vara okej, men för större ökar kan layouten bli äventyrad.
Nackdelar med flytande layouter
- Flytande layouter möjliggör mycket lite exakt kontroll över bredden på de olika elementen på sidan.
- De kan resultera i textkolumner som antingen är för breda för att bekvämt skanna eller på mindre webbläsare för små för att orden ska dyka upp tydligt.
- Flytande layouter kan ha problem när ett fast breddelement, till exempel en bild, placeras inuti en vätskekolonn. Om kolumnen görs utan tillräckligt med utrymme för bilden, ökar vissa webbläsare kolonnbredden, med hänsyn till designarens instruktioner, medan andra webbläsare orsakar överlappningar i text och bilder för att uppnå rätt procentsatser.
Slutsats
Många webbplatser som har mycket information som de behöver förmedla i så lite utrymme som möjligt skulle fungera bra med en flytande layout. Detta gör det möjligt för dem att dra nytta av alla fastigheter som större skärmar ger samtidigt som de inte kortar mindre skärmar.
Webbplatser som kräver exakt kontroll över hur sidorna ser ut i varje situation skulle göra det bra att använda en fast breddlayout. Detta ger mer försäkran om att varumärkningen av din webbplats är konsekvent och klar, oavsett vilken storlekskärm den ses på.
Layoutpreferens
Många föredrar en blandad strategi. De gillar inte att använda flytande layouter för stora textblock, eftersom det kan göra texten antingen oläslig på en liten bildskärm eller oskannlig på en stor. Så de tenderar att göra sidans huvudkolumner en fast bredd, men gör rubriker, sidfot och sidokolonner mer flexibla för att ta upp resterande fastigheter och inte förlora kapaciteten hos större webbläsare.
Vissa webbplatser använder skript för att bestämma storleken på din webbläsarfönster och ändra sedan visningselementen i enlighet med detta. Om du till exempel öppnar en sådan webbplats i ett mycket stort fönster kan du få en extra kolumn med länkar till vänster, så att kunder med mindre bildskärmar kanske inte ser. Textförpackning kring annonseringen är också beroende av hur stort ditt webbläsarfönster är. Om det är tillräckligt stort kommer webbplatsen att lägga in text runt den, annars kommer den att visa artikeltexten under annonsen.Medan de flesta webbplatser inte behöver denna nivå av komplexitet, visar den ett sätt att dra nytta av större skärmar utan att påverka skärmen på mindre skärmar.
