Kui SUUR tuleks veebileht teha?
Kui suure ekraaniga peaks veebi tehes arvestama? Üks (niru) võimalus on teha veebileht laiupidi veniv – nagu näiteks Google. Siis on küll üsna keeruline head layouti teha, meie majast polegi vist ühtegi venivat lehte välja läinud. Jätaks veniva lehe teatud valdkondadele nagu otsimootorid jms. Aga millega arvestada? Ja kas kõigil on ka flash-player? Mis brausereid kasutatakse?
METRIX.EE tuleb appi
Üks lihtsamaid viise on hiljuti taasavatud metrix.ee lehelt vaadata alajaotust "Tehniline statistika" kuhu koondatakse ligi 400 liitunud eestimaise veebilehe külastuste summeeritud statistika. Jätkuvalt domineerib suhteliselt madal ekraaniresolutsioon 1024x768px ("px" on mõõtühik piksel ehk täpikesed millest ekraanid koosnevad), tasapisi tõuseb sülearvuti standartmõõt 1280x800px ja vähegi uuemate lauakuvarite 1280x1024px, ülejäänud on väiksema osakaaluga ja üldiselt suuremamõõdulised.
allikas: metrix.ee
Meie OKIA-s arvestame (juuni 2009 seisuga) 1024×768 ekraanipinnaga, sealt lähevad maha menüüd, nupud, scrollid jms ning veebi laiuseks teeme üldiselt ~ 980px või väiksema. Kõrgustpidi on sõltuvalt seadetest korraga nähtavat ala 600px ringi, kõige olulisem võiks kohe nähtava sisse ära mahtuda. Servadesse on mõistlik jätta ka veidi õhuruumi.
.jpg)
See ei tähenda, et kõik peab vertikaalipidi ühte vaatesse mahtuma: olulisem olgu kohe näha, aga leht võib olla tunduvalt kõrgem, me kõik oskame hiirel scrollinuppu vuristada. Siin tuleks läheneda case by case (vt näiteks www.roccaalmare.ee vs www.hansaplant.ee).
Teisest küljest ekraanid vähenevad – nutitelefonid a la iPhone, pisikesed sülearvutid ehk netbookid (näiteks 1024x600px). Seetõttu võiks veebi luues arvestada "raskusastet" nii palju kui võimalik, et ka vähemvõimeka tehnikaga külastaja saaks kenasti hakkama. Või looma veebist spetsiaalse "iPhone"-versiooni. Viimast tehakse küll harva.
Hea disainer teab
Kogenud veebidisainer muidugi teab seda kõike. Kuna disainerite monitorid on tihti elutoa teleri mõõtu on neil omad nipid kuidas loodavat kavandit "tavamõõdus" piiluda. Üks võimalus on otse disainiprogrammis kasutada spetsiaalset maski mis imiteerib nähtavat osa, teine juba brauseris vaadates mõnda spetsiaalset tarkvara kasutades, näiteks Firefoxile "Web Developer Toolbar". Lisaks tuhandele muule võimaluse saab selles defineerida erinevaid ekraanimõõte ning neid imiteerida.
Flashi olemasolu
Flash on teadupäerast vahva võimalus teha efektseid lahendusi – detaile tavaveebides, "friigilehti", bannereid, täis-flash-kampaanialahendusi jms. Flashi puhul peaks teadma kahte näitajat:
- Kui paljude arvutid üleüldse flashi suudavad näidata (senine iPhone muide ei suuda)?
- Kui, siis mis versiooniga peaks arvestama flashi luues?
Metrix ütleb, et flash on olemas 97% kasutajatest ning arvestama peaks versiooniga 9 alates.
Brauserid
Igas teises päringus on sees nõue, et veeb peab toimima erinevates brauserites. Eks see ole loogiline ja nii tehaksegi, kuigi veebimeistritele on see paras peavalu: igal brauseril on rohkem või vähem "iseärasusi", üks asi on ühes ühtmoodi, teises teistmoodi. Õnneks on asi tasapisi ühtlustumas. Kõige halvem unenägu on "Internet Explorer 6" või vanem. Seega kõik kel see on: palun uuendage (versiooninumbrit näed Help/About alt)! Näiteks OKIA veebi külatajatest 16% on veel IE 6 kasutajad…
Mõistagi on kogu maailma statistika veidi erinev, igaüks saab googeldada, aga olulised on suurusjärgud.
Allar
02.07.2009 10:32
netbookide puhul kasutatakse ilmselt fullscreen funktsiooni, sest vastasel juhul pole lehekülgi lihtsalt võimalik vaadata. lisaks olen osade saitide puhul kasutanud brauseri zoomi funktsiooni, et laius ekraanile ära mahuks. ehk et väga kaugele netbookid “tavalisest” resolutsioonist ei eksi. algajamale kasutajale oleks ehk abiks, kui sait vihjaks talle fullscreeni ja zoomi funktsioonide kohta?
Kaupo Kalda
02.07.2009 10:40
Firefoxil minu teada paar versiooni tagasi kadus suumimine üldse ära. Suumides halveneb reeglina kogu pildi kvaliteet niikuinii.
F11 ehk fullscreeni kasutamist peaks propageerima jah, nii palju kui mina olen näinud siis tavakasutajatest ei kasuta sisuliselt keegi fullscreeni ning selle näitamine tuleb uudisena.
w
02.07.2009 12:43
firefoxil kadus zoomimine ära? wtf, kaups? :)
ctrl + “+” ja ctrl + “-” oled proovinud vajutada? või kasutad sa IEd? :D
ja selles, et resolutsioonist sõltuvaid lehti vähe tehakse, julgeksin pisut kahelda. kahtlemata tehakse neid hetkel vähem kui fikseeritud suurusega lehti, aga see on ilmselgelt ainult aja küsimus – samamoodi nagu mõned aastad tagasi üks veebifirma tegelane ütles mulle, et tabelid ruulivad ja css põhine layout on mõttetu ajaraisk ;) nüüd aga tulevad sealtsamast firmast kiirel vaatlusel kah peaasjalikult ainult CSSiga layoudid …
samas on muidugi ka selge, et resosõbralik layout on lisatöö, mis tuleb kliendil kinni maksta – vähemalt eestis aga ilmselt enamus kliente seda küsida ei oska/kinni maksta ei taha/otstarvet ei näe. Samas miski trendipedede veebileht võiks ju iPhones ikka kenasti vaadatav olla… :)
muide, resolutsioonisõbraliku CSSi suht hea demo:
http://www.themaninblue.com/experiment/ResolutionLayout/
Kaupo Kalda
02.07.2009 13:22
Indeed. Varem oli firefoxi suumimine vist brauseri all servas, uusi menüüsid polegi põhjalikult uurinud.
kingokana
02.07.2009 13:39
Naljakas lähenemine siin IE6 probleemile. Selle vastu ei aita veebikasutaja “harimine” ega hirmutamine. Isegi kui lehele vastav hoiatus panna.
No kuidas suhtub esimest korda lehele sattunud klient firmasse, kui leht on vildakas või talle hüppab ette teade “brauser on vana ja paha, vaheta see parema vastu”.
Kõige ohutum on serveripõhiselt kontrollida, mis brauseriga tegu ja siis vastav kujundus saata. Levinumatele/uuematele üks ja vanadele ning väiksematele ekraanidele teine. Ja iPhone jaoks kolmas :). Ei ole küll OKIA mootoriga tuttav, aga vabavaralistes sisuhaldussüsteemides ei ole see nii keeruline ühti.
Kaupo Kalda
02.07.2009 15:30
Ei olegi NII keeruline, samas on rohkelt uuemate tehnoloogiate ja disainiga pusimist”. Kasutaja ei pea midagi märkama, see polnud minu point.
Naljakaks ma seda suhtumist ei pea vaid üritan teadvustada, et IE 6 on ajast maha jäänud kehvasti tehtud rudiment mis teeb kõigi elu raskeks.
Mitut disaini sõltuvalt brauserist mina oma kogemusest ei tea, küll aga tehakse nii stiilides kui scriptides tihti mööndusi ja variatsioone vastavalt lehitsejale.
Võib lisada, et IE 6 peaks olema minu andmetel ka üks ebaturvalisemaid lehitsejaid üldse. Vaata ka näiteks siia :) http://ie6update.com
Janar
02.07.2009 17:14
Eestis tuleks korraldada mingi propageerimise kampaania nagu seda tegid norrakad. http://www.wired.com/epicenter/2009/02/norwegian-websi/
Kaua võib ie6 kasutada, varsti windows 7 aga mõnel veel ie6.
w
03.07.2009 21:09
veel üks sarnane näide:
http://www.alistapart.com/d/switchymclayout/transition_layout_tab.html
Top 5 populaarsemat artiklit OKIA blogis, 2009 II | OKIA Blogi
05.10.2009 15:18
[...] Kui suur tuleks veebileht teha? (juuli 2009) [...]
Eksperiment: lokkavad bannerimassiivid | OKIA Blogi
15.10.2009 08:47
[...] sülearvutid, väikesed netbookid, iPhone jt nutitelefonid. Siiamaani on populaarseim kuvari resolutsioon Eestis 1024 x 768 pikslit ning võttes just selle mõõdu aluseks tegin väikese [...]
Kõik, mida sa Twitteri konto taustadest teadma peaksid | netiturundus.net
07.01.2010 22:12
[...] Rääkides taustapildi suurusest, siis 1024×768 monitoriga vasakul olevat infot näiteks minu kontol näha ei ole, sest ruumi liiga vähe selleks. Kuna monitorid ja resolutsioonid lähevad iga päevaga suuremaks, siis ei tohiks see väga oluliseks probleemiks olla. Alates resolutsioonist 1280×1024 ja ülespoole on vasakpoolne tekst näha. Et rohkem aimu saada, mis ekraaniresolutsiooniga arvutikasutajad internetis ringi liiguvad, siis loe seda OKIA blogipostitust. [...]
ap
15.12.2010 13:28
w saadetud näide on popp ja efektne, aga reaalsuses tähendab konkreetne näide SEITSET erinevat disainilayouti. vaataja jaoks tore, aga tellija jaoks päris sügav auk rahakotis. meie kodumaine reaalsus on see et enamus meie top20 saitidest ei suuda isegi KAHTE versiooni teha või hallata.
mulle sümpatiseerib postimees.ee lihtne lahendus: telefoniga neile lähendedes visatakse lihtsalt minema kõik sidebar’id ja minu 480px ekraanil ei pea isegi zoomi kasutama et sisu lugeda!
Anti
15.12.2010 15:39
Kuidagi võiks ehk selle tööriista integreerida veebilehele, et kui on IE6 vms, siis kuvab plain-texti…
Anti
15.12.2010 15:39
Link ununes: http://lab.arc90.com/experiments/readability/
Kaupo Kalda
15.12.2010 15:42
Anti, abiks link :) Aga IE 6 vastu võib pidada väikese sissisõda kasvõi selliste asjadega http://www.incerteza.org/blog/projetos/shockingly-big-ie6-warning/
Priit
21.12.2010 11:21
Sõda IE6 vastu on idiootlik. 99% IE6 kasutajatest ei saa oma brauserit vahetada. Kas siis on nii vana arvuti või korporatiivne poliitika. Kui millegi vastu sõdida (täna), siis on see IE7 ja FF2, sest nende kasutaja SAAB 99% juhtudest oma brauserit uuendada ja kui ta pole seda teinud siis pasunasse. IE6′d tuleks aga rahule jätta.
Kaupo Kalda
22.12.2010 11:25
Priit, IE6 kasutajad saavad alati piketi korraldada, oma it-osakonna akna all.