Det første, som de fleste designere overvejer, når de bygger deres webside, er hvilken løsning at designe for. Hvad dette virkelig betyder, er at afgøre, hvor bredt dit design skal være. Der er ikke længere noget som standardwebstedbredde.
Hvorfor overveje resolution
I 1995 var standard 640x480 opløsningsmonitorer de største og bedste skærme til rådighed. Dette betød, at webdesignere fokuserede på at lave sider, der så godt ud i webbrowsere, maksimeret på en 12-tommers til 14-tommers skærm ved denne opløsning.
Disse dage udgør 640x480 opløsning mindre end 1 procent af de fleste webtrafik. Folk bruger computere med meget højere opløsninger, herunder 1366x768, 1600x900 og 5120x2880. I mange tilfælde fungerer design til en 1366x768 opløsningsskærm.
Vi er på et punkt i webdesignets historie, hvor vi ikke behøver at bekymre os meget om opløsningen. De fleste mennesker har store skærme med bred skærm, og de maksimerer ikke deres browservindue. Så hvis du beslutter dig for at designe en side, der ikke er mere end 1366 pixels bred, vil din side nok se fint ud i de fleste browservinduer selv på store skærme med højere opløsninger.
Browserbredde
Før du går ud med at tænke "okay, vil jeg lave mine sider 1366 pixel bredt," der er mere til denne historie. Et ofte overset problem, når du beslutter bredden af en webside, er, hvor stor dine kunder holder deres browsere. Specifikt maksimerer de deres browsere i fuldskærmstørrelse, eller holder de dem mindre end fuldskærmen?
I en uformel undersøgelse af medarbejdere, der alle brugte en 1024x768 opløsningsbærbar pc-standard, holdt to alle deres applikationer maksimeret. Resten havde forskellige vinduer åbne af forskellige grunde. Dette illustrerer, at hvis 85% af brugerne designer dette firma's intranet med 1024 pixels bredt, skal de rulle vandret for at se hele siden.
Når du er klar over kunder, der maksimerer eller ikke, skal du tænke på browserens grænser. Hver webbrowser har en rullepanel og grænser på siderne, der krymper det ledige rum fra 800 til ca. 740 pixel eller mindre på 800x600 opløsninger og omkring 980 pixel på maksimerede vinduer ved 1024x768 opløsninger. Dette kaldes browser "chrome", og det kan tage væk fra det anvendelige rum til dit side design.
Faste eller flydende bredde sider
Den egentlige numeriske bredde er ikke det eneste du skal tænke på, når du designer dit websites bredde. Du skal også afgøre, om du vil have en fast bredde eller en væskebredde. Med andre ord, vil du indstille bredden til et bestemt antal (fast) eller til en procentdel (flydende)?
Fast bredde
Sideblade med fast bredde er præcis som de lyder. Bredden er fastsat til et bestemt nummer og ændrer sig ikke uanset hvor stor eller lille browseren er. Dette kan være godt, hvis du har brug for dit design til at se præcis det samme, uanset hvor bred eller smal dine læsers browsere er, men denne metode tager ikke højde for dine læsere. Personer med browsere, der er mindre end dit design, skal rulle vandret, og folk med brede browsere vil have store mængder tomt rum på skærmen.
Hvis du vil oprette sider med fast bredde, skal du blot bruge bestemte pixelnumre for bredden af dine sidedivisioner.
Flydende bredde
Flydende bredde sider (undertiden kaldes fleksible bredde sider) varierer i bredden afhængigt af hvor bredt browservinduet er. Dette giver dig mulighed for at designe sider, der fokuserer mere på dine kunder. Problemet med sider med flydende bredde er, at de kan være vanskelige at læse. Hvis scanningslængden på en tekstlinje er længere end 10 til 12 ord eller kortere end 4 til 5 ord, kan det være svært at læse. Det betyder, at læsere med store eller små browservinduer har problemer.
Hvis du vil oprette fleksible bredde sider, skal du blot bruge procentdele eller ems for bredden af dine sidedivisioner. Du bør også gøre dig bekendt med CSS maxbreddeegenskaben. Denne egenskab giver dig mulighed for at angive en bredde i procentdele, men begræns det så, at det ikke bliver så stort, at folk ikke kan læse det.
Og vinderen er: CSS Media Queries
Den bedste løsning i disse dage er at bruge CSS-medieforespørgsler og lydhør design for at oprette en side, der justerer til bredden af browseren, der ser den. Et lydhurt webdesign bruger det samme indhold til at oprette en webside, der fungerer, uanset om du ser den på 5120 pixels bred eller 320 pixels bred. De forskellige sider ser anderledes ud, men de indeholder det samme indhold. Med medieforespørgslen i CSS3 svarer hver modtagende enhed forespørgslen med dens størrelse, og stilarket tilpasser sig den pågældende størrelse.
