Prva stvar, ki jo večina oblikovalci razmišljajo pri oblikovanju spletne strani, je, kakšna je rešitev za oblikovanje. Kaj to resnično pomeni, je odločitev, kako širok bi moral biti vaš design. To ni več kot standardna širina spletnega mesta.
Zakaj razmisliti o resoluciji
Leta 1995 so bili standardni monitorji ločljivosti 640 x 480 najboljši in najboljši monitorji na voljo. To je pomenilo, da so se spletni oblikovalci osredotočili na izdelavo strani, ki so bile v spletnem brskalniku čim bolj privlačne na zaslonu s 12-palčnim zaslonom do 14-palčnim zaslonom.
Te dni, ločljivost 640 x 480 je manj kot 1 odstotka večine prometa na spletnem mestu. Ljudje uporabljajo računalnike z veliko višjimi resolucijami, vključno z 1366x768, 1600x900 in 5120x2880. V mnogih primerih deluje zasnova zaslona za ločljivost 1366x768.
Smo na mestu v zgodovini spletnega oblikovanja, kjer nam ni treba veliko skrbeti za rešitev. Večina ljudi ima velike monitorje širokega zaslona in ne povečuje okna brskalnika. Torej, če se odločite za oblikovanje strani, ki ni širša od 1366 pik, vaša stran verjetno dobro izgleda v večini oken brskalnika tudi na velikih monitorjih z višjimi resolucijami.
Širina brskalnika
Preden začnete razmišljati "v redu, bom naredil moje strani 1366 slikovnih pik širok," je še več do te zgodbe. Ena pogosto spregledana težava pri odločanju o širini spletne strani je, kako velike so vaše stranke obdržale svoje brskalnike. Natančneje, ali maksimirajo svoje brskalnike v velikosti celotnega zaslona ali pa jih ohranjajo manjše od celotnega zaslona?
V enem neformalnem pregledu sodelavcev, ki so vsi uporabljali standardni 1024x768 laptop za rešitve podjetja, sta dva ohranila vse svoje aplikacije. Ostali so imeli različna okna odprta iz različnih razlogov. To ponazarja, da bi morali, če načrtujete intranet tega podjetja na široko 1024 pik, 85% uporabnikov, bi se moralo pomikati vodoravno, da bi videli celotno stran.
Ko računate za stranke, ki povečajo ali ne, razmislite o mejah brskalnika. Vsak spletni brskalnik ima drsni trak in meje na straneh, ki zmanjšujejo razpoložljivi prostor z 800 na približno 740 slikovnih pik ali manj na resoluciji 800x600 in okoli 980 slikovnih pik na oknih z največ 1024x768 resolucij. To se imenuje brskalnik "chrome" in lahko zavzame od uporabnega prostora za oblikovanje strani.
Fiksne ali tekoče širinske strani
Dejanska številčna širina ni edina stvar, o kateri morate razmišljati pri oblikovanju širine vaše spletne strani. Prav tako se morate odločiti, ali boste imeli fiksno širino ali širino tekočine . Z drugimi besedami, ali boste nastavili širino na določeno številko (fiksno) ali na odstotek (tekočino)?
Fiksna širina
Strani s fiksno širino so ravno tako zvok. Širina je določena na določenem številu in se ne spreminja ne glede na velikost ali majhnost brskalnika. To je lahko dobro, če potrebujete svoj dizajn, da bi izgledali popolnoma enako, ne glede na to, kako široki ali ozki so brskalniki vaših bralcev, vendar ta metoda ne upošteva vaših bralcev. Ljudje z brskalniki, ožji od vašega oblikovanja, se bodo morali pomikati vodoravno, ljudje s širokimi brskalniki pa bodo imeli na zaslonu velike količine praznega prostora.
Če želite ustvariti strani s fiksno širino, preprosto uporabite specifične številke pikslov za širino razdelkov strani.
Tekoča širina
Strani s širino tekočin (včasih imenovane prilagodljive strani širine) se razlikujejo glede na širino okna brskalnika. To vam omogoča, da oblikujete strani, ki se bolj osredotočajo na vaše stranke. Težava s stranmi širine tekočine je, da jih je težko prebrati. Če je dolžina skeniranja vrstice besedila daljša od 10 do 12 besed ali krajša od 4 do 5 besed, je težko prebrati. To pomeni, da imajo bralci z velikimi ali majhnimi okni brskalnika težave.
Če želite ustvariti prilagodljive strani s širino, preprosto uporabite odstotke ali ems za širino razdelkov strani. Prav tako se morate seznaniti s CSS lastnostjo max-width. Ta lastnost vam omogoča, da nastavite širino v odstotkih, nato pa jo omejite tako, da ne bo tako velika, da jo ljudje ne bodo mogli prebrati.
In Winner Is: CSS Media Queries
Najboljša rešitev v teh dneh je uporaba medijskih poizvedb CSS in odziven dizajn za ustvarjanje strani, ki se prilagaja širini brskalnika, ki si jo ogleda. Odziven spletni dizajn uporablja isto vsebino za ustvarjanje spletne strani, ki deluje, če jo gledate s širokozo 5120 pik ali široko 320 pik. Različne strani izgledajo drugače, vendar vsebujejo enako vsebino. Z medijsko poizvedbo v CSS3 vsaka sprejemna naprava odgovori na poizvedbo z njegovo velikostjo, slogovni list pa se prilagodi tej določeni velikosti.