It earste wat de measte ûntwerkers beskôgje by it bouwen fan har webside is wat resolúsje foar ûntwerp. Wat dit eigentlik oanbelanget is beslút hoe't jo jo ûntwerp wêze moat. Der is gjin soad mear as in standert webside breed.
Wêrom Consider Resolution
Yn 1995 binne de standert 640x480 resolúsje monitors de grutste en bêste monitoren beskikber. Dit betsjutte dat webûntwikkelders rjochte binne op it meitsjen fan siden dy't goed fine yn webbrowsers op in 12-inch oant 14-inch-monitor yn 'e resolúsje.
Dizze dagen, 640x480 resolúsje makket minder dan 1 persint fan 'e measte websideferkear. Minsken brûke komponinten mei folle hegere resolúsjes, lykas 1366x768, 1600x900 en 5120x2880. Yn in protte gefallen wurket it ûntwerp foar in resolúsje skerm op 1366x768.
Wy binne op in punt yn 'e skiednis fan web-ûntwerp wêr't wy net folle oer resolúsje soargen moatte. De measte minsken hawwe grutte, breed skermmonitoaren en se makket gjin maksimum fan har browserfenster. As jo beslute om in side te foarmjen dy't net mear as 1366 piksels breed is, sil jo side wierskynlik fine yn de measte browserfensters sels op grutte monitors mei hegere resolúsjes.
Browserbreedte
Foardat jo nei tinke "goed, ik meitsje myn siden 1366 piksels breed," is der mear fan dit ferhaal. Men wurdt faak oerlevere as it besluten fan 'e breedte fan in webside is hoe grut jo klanten harren browsers hâlde. Hjirmei makken se har browsers maksimearje op in folslein skermgrutte of as se se lytser hâlde as it folsleine skerm?
Yn ien ynformeel ûndersyk fan 'e wurknimmers dy't allegearre in bedriuw-standert 1024x768 resolúsje laptop brûkten, hâldden twa alle applikaasjes maksimale. De rest hie ferskillende rigels iepen foar ferskate redenen. Dit ferjit dat as jo in ynternasjet fan dizze bedriuw oanmeitsje op 1024 piksels breed, dan moatte 85 persint fan brûkers horizontaal scrollen om de hiele side te besjen.
Nei jo akkount foar kliïnten dy't maksimale of net, tinke oer de browsergren. Eltse webblêder hat in scrollbalke en grinzet oan 'e kanten dy't de beskikbere romte fan 800 oant sawat 740 piksels of minder op 800x600 resolúsjes en om 980 piksels op maksimale finsters op 1024x768 resolúsjes skine. Dit hjit browser 'chrome' en it kin ôfbrekke fan de brûkbere romte foar jo side-ûntwerp.
Fêste of flakke breedste siden
De echte numerike breed is net it iennichste ding dat jo tinke moatte oer wannear't jo de webside fan jo webside foarmje. Jo moatte ek beslute as jo in fêste breed of floeibere breed hawwe . Mei oare wurden wurde jo de breedte op in spesifike nûmer (fêst) of yn in persintaazje (flak) setten?
Fêste breedte
Fêste breedseiten binne krektlyk as se lûd binne. De breedte is fêstlein op in spesifyk nûmer en feroaret net lykas grut of lyts is de browser. Dit kin goed wêze as jo jo ûntwerp nedich hawwe om krekt deselde te sjen, lykas breed of smelle jo lêzers 'browsers binne, mar dizze metoade hat jo lêzers net rekken hâlden. Minsken mei browsers slimme as jo ûntwerp ha horizontaal skoweljen, en minsken mei brede browsers hawwe grutte bedragen fan lege romte op it skerm.
Om fêste breedseiten te meitsjen brûke jo gewoan spesifike pixelnûmers foar de breedte fan jo side divyzjes.
Liquid Width
Flesside breedseiten (soms as fleksibele breidtiden neamd) ferskille yn breedte ôfhinklik fan hoe brede it browserfenster is. Dit soarget jo te meitsjen siden dy't mear op jo klanten rjochtsje. It probleem mei floeibere siden is dat se lestich wêze kinne om te lêzen. As de scanlange fan in tekenrige langer dan 10 oant 12 wurden of koarter as 4 oant 5 wurden, kin it lestich wêze om te lêzen. Dit betsjut dat lêzers mei grutte of lytse browserfensters problemen hawwe.
Om flugzele breidseiten te meitsjen, brûke jo gewoan persintaazjes of ems foar de breedtes fan jo side divyzjes. Jo moatte dysels ek fertrouwe mei de CSS max-width property. Dit eigenskip lit jo in breedte yn persintaazjes ynstelle, mar dan bepale it sadat it net sa makket dat minsken net lêze kinne.
En de winner is: CSS Media Queries
De bêste oplossing is yn dizze dagen om CSS-media-fraachstikken te brûken en reageare ûntwerp om in side te meitsjen dy't oan de breedte fan 'e browser bepale. In antwurde webûntwerp brûkt itselde ynhâld om in webstee te meitsjen dy't wurket oft jo it sjen op 5120 pixels breed of 320 pixels breed. De ferskillende siden sjogge ferskillend, mar se befetsje dezelfde ynhâld. Mei de media-query yn CSS3 antwortet elke ûntfanger-apparaat de query mei de grutte, en de stylblêd oanpast oan dy bepaalde grutte.