Določanje širine vaše spletne strani

click fraud protection

Večina oblikovalcev upošteva prvo oblikovanje svoje spletne strani resolucija oblikovati za. To v resnici pomeni odločitev, kako široka naj bo vaša zasnova. Standardne širine spletnega mesta ni več.

Zakaj razmislite o resoluciji

Leta 1995 so bili standardni monitorji velikosti 640 x 480 slikovnih pik največji in najboljši monitorji na voljo. To je pomenilo, da so se spletni oblikovalci osredotočili na to, da so strani, ki so v spletnih brskalnikih videti dobro, maksimirane na 12-palčnem do 14-palčnem monitorju pri tej ločljivosti.

Danes ločljivost 640 krat 480 predstavlja manj kot 1 odstotek večine prometa na spletnem mestu. Ljudje uporabljajo računalnike z veliko višjo ločljivostjo, vključno s 1366 x 768, 1600 x 900 in 5120 x 2880. V mnogih primerih oblikovanje zaslona z ločljivostjo 1366 x 768 deluje.

Todya, večina ljudi ima velike monitorje s širokim zaslonom in okna brskalnika ne poveča. Torej, če se odločite za oblikovanje strani, ki ne bo večja od 1366 slikovnih pik, bo vaša stran verjetno videti v večini oken brskalnika tudi na velikih monitorjih z višjo ločljivostjo.

instagram viewer

Širina brskalnika

Pri odločanju o širini spletne strani se pogosto spregleda težava, kako velike bodo vaše stranke obdržale brskalnike. Natančneje, ali povečajo svoj brskalnik na celozaslonski način ali pa so manjši od celozaslonskega?

Ko upoštevate stranke, ki povečajo ali ne, razmislite o mejah brskalnika. Vsak spletni brskalnik uporablja drsni trak in obrobe na straneh, ki zmanjšajo razpoložljivi prostor z 800 na približno 740 slikovnih pik ali manj pri ločljivostih 800 x 600 in približno 980 slikovnih pik v maksimiziranih oknih pri 1024 x 768 ločljivosti. Temu se reče brskalnik krom in vam lahko odvzame uporaben prostor za oblikovanje strani.

Strani s fiksno ali tekočo širino

Dejanska številčna širina ni edina stvar, na katero morate pomisliti pri oblikovanju širine spletnega mesta. Odločiti se morate tudi, ali boste imeli fiksna širina ali širina tekočine. Z drugimi besedami, ali boste nastavili širino na določeno število (fiksno) ali na odstotek (tekočina)?

Fiksna širina

Strani s fiksno širino so natanko takšne, kot se slišijo. Širina je določena na določeno število in se ne spremeni, ne glede na to, kako velik ali majhen je brskalnik. Ta pristop je lahko dober, če potrebujete, da je vaš videz popolnoma enak, ne glede na to, kako široki ali ozki so brskalniki bralcev, vendar ta metoda ne upošteva vaših bralcev. Ljudje z brskalniki, ki so ožji od vaše zasnove, se bodo morali pomikati vodoravno, ljudje s širokimi brskalniki pa bodo imeli na zaslonu veliko praznega prostora.

Če želite ustvariti strani s fiksno širino, uporabite določene številke slikovnih pik za širine odsekov strani.

Širina tekočine

Strani s širino tekočine (včasih imenovane strani s prilagodljivo širino) se razlikujejo po širini, odvisno od tega, kako široko je okno brskalnika. Ta strategija prinaša modele, ki so bolj osredotočeni na stranke. Problem strani s širino tekočine je v tem, da jih je težko brati. Če je dolžina skeniranja vrstica besedila je daljša od 10 do 12 besed ali krajša od 4 do 5 besed, je težko brati. To pomeni, da imajo bralci z velikimi ali majhnimi okni brskalnika težave.

Za ustvarjanje strani s prilagodljivo širino uporabite odstotke oz ems za širino odsekov strani. Seznanite se s CSS največja širina lastnine. Ta lastnost vam omogoča, da nastavite širino v odstotkih, nato pa jo omejite, da ne bo tako velika, da je ljudje ne bodo mogli prebrati.

CSS medijske poizvedbe

Danes je najboljša rešitev uporaba medijskih poizvedb CSS in odzivnega oblikovanja za ustvarjanje strani, ki se prilagodi širini brskalnika, ki si jo ogleduje. Odziven spletni dizajn uporablja isto vsebino za ustvarjanje spletne strani, ki deluje, ne glede na to, ali si jo ogledate s širino 5120 ali 320 slikovnih pik. Različne strani so videti drugače, vendar vsebujejo enako vsebino. Z medijsko poizvedbo v CSS3 vsaka sprejemna naprava na poizvedbo odgovori s svojo velikostjo, slog pa se prilagodi tej velikosti.

instagram story viewer