Tyrimas

Nesenai atlikau mini-tyrimą (apklausą), kurios esmė buvo išsiaiškinti, kur vartotojai laiko pelės kursorių, kai skaito tekstą. Šis tyrimas remiasi tuo, jog vartotojai skaitydami tekstą, nevalingai įgauna įprotį laikyti kursoriu tam tikroje vietoje ar varinėti jį palei skaitomą tekstą (Remiantis popieriuje atspausdinto teksto modeliu).
Apklausos klausimas skambėjo taip: „Kai skaitai turinį interneto naršyklėje, kurioje teksto pusėje paprastai laikai pelės kursorių?“, o štai rezultatai yra tokie:

Rezultatuose matoma, jog daugiau nei pusė vartotojų atsakė, jog kursorių paprastai laiko dešinėje pusėje – tai yra logiška, nes dešinėje pusėje yra pateikiamas scrollbar‘as puslapio pozicijos valdymui, be to dauguma žmonių yra dešiniarankiai.
Ant paties teksto kursorių laiko apie trečdalis žmonių, kaip ir minėjau aukščiau, tai siejasi su realaus pasaulio, knygos skaitymo modeliu, kai pirštu vedame per skaitomą tekstą. Tuo tarpu, tų kurie skaitomą tekstą pasižymi yra palyginti mažai, nors tokia praktika padeda sukoncentruoti dėmesį į skaitomą teksto dalį. Galbūt to priežastis yra tai, kad pagal nutylėjimą pažymėtas tekstas įgyja invertuotas fono ir teksto spalvas ir taip yra sudaromas „akį pjaunantis“ aukštas kontrastingumas, kurį tiesiog nemalonu skaityti.
Kairėje pusėje laikančių kursorių yra apie 10%, o tai sutampa su kairiarankių santykiu (8-15% pasaulio populiacijos yra kairiarankiai)

Praktika

Remiantis tokiais rezultatais ir bendromis informacinio dizaino taisyklėmis galima sudaryti kelis dėsnius, kuriuos įmanoma pritaikyti projektuojant vartotojo interfeisą:

• Palikti tarpą, laisvos vietos puslapio kraštuose, kad vartotojas turėtų kur „laikyti“ kursorių, kai skaito tekstą ir nevalingai nepaspaustų kokių nors aktyvių elementų – Geriausiai tinka taikyti 960px puslapių šabloną.

• Kita vertus, jeigu dešinėje pusėje yra išdėliotos reklaminės pozicijos (banneriai) – nevalingi/valingi paspaudimai tik į nauda tinklapio savininkams, tačiau vartotojui – tai yra nepatogumas.

• Pateikti vartotojui navigacinius komponentus, bei kvietimus imtis veiksmų (call for action) dešinėje tinklapio pusėje, kad vartotojui būtų patogu juos paspausti ir jis baigęs skaityti tekstą nepaliktų tinklapio, o turėtų savo veiksmų tęstinumą.
  Pvz.: patogus sprendimas yra įgyvendintas tinklapyje www.thenextweb.com: ten baigus skaityti straipsnį, apačioje, dešinėje su animacija išvažiuoja blokelis, kviečiantis paskaityti ankstesnį straipsnį, tokia pačia tema (aš asmeniškai ant jo dažai užkimbu ir paspaudžiu ant nuorodos į kitą straipsnį)

• Sukurti teksto pažymėjimo stilių, kad jis nebūtų toks priešiškas vartotojui. Tai galima padaryti su CSS pseudo-klase :selection, o jeigu dar panaudojus javascript, būtų galima padaryti, jog skaitomo paragrafo stilius pasižymėtu automatiškai pagal dešinėje esančio kursoriaus  poziciją (Žinoma tokia funkcija kai kuriuos vartotojus gali erzinti, todėl turėtų būti galimybė ją išjungti)

• Padaryti funkcija, kuri invertuotų puslapio struktūrą horizontaliai. Taip vartotojas visada galėtų pasirinkti kokia struktūra jam labiausiai patinka – pvz.: „sidebar“ blokas dešinėje ar kairėje.

Tai tik keli iš praktiniai patarimai paremti vartotojų veiksmų dėsningumu. Jeigu žinote daugiau variantų kur galima pritaikyti šiuos dėsningumus – pakomentuokite :)

Šiam tikslui Yahoo yra apibrėžusi interneto naršyklių palaikymo klasifikaciją, apie kurią trumpai papasakosiu.

Iš viso yra 3 naršyklių palaikymo klasės (lygiai):

C klasė – žemo lygio ir kokybės palaikymas. Iš esmės tai tik gryno HTML kodo pateikiamas naršyklei, be stilių ar JavaScript įgyvendintų funkcijų. Realizuojant šis klasės palaikymo lygį dažnai pasitaiko įvairių defektų.

X klasė - tai absoliučiai visų naršyklių palaikymas. Realizuojant tokį palaikymo lygmenį yra palaikomos retos arba sustabdyto palaikymo ir vystymo naršyklės – tai reiškia kad tinklapis yra atvaizduojamas teisingai net ir ant pačių rečiausių naršyklių. Toks palaikymas yra įgyvendinamas labai retai, nes dažniausiai neįmanoma nuspėti visų egzistuojančių naršyklių niuansų.

A klasė – Pati svarbiausia klasė, nes tai palaikymo lygmuo skirtas pačioms populiariausioms naršyklėms.  Šis lygmuo, pagal Yahoo statistiką yra įgyvendintas 96% tinklapių. Būtent šio lygmens mes ir rekomenduojame laikytis.

Kad būtų lengviau “sugaudyti”  kokias naršykles privalo palaikyti A-klasės palaikymas, čia pateikta naršyklių matrica, kuri parodo visas A klasės naršykles:

DropBox - tai internetinė failų talpykla, kuri savo patogumu pranoksta visas kitas panašaus pobūdžio paslaugas. Didžiausias privalumas yra tai, kad nereikia sukėlinėti failų per naršyklę – tiesiog užtenka atsisiųsti DropBox programėlę, kuri jūsų kompiuteryje sukuria katalogą, į kurį įdedant failus, jie iškarto patalpinami internete.

Dar keli šios sistemos privalumai:

• Galimybė prieiti prie savo failų iš bet kurio kompiuterio.
• Galima turėti įvairaus privatumo lygmens katalogus: Viešą, Beveik viešą (pvz.: pasidalinimui nuotraukomis su draugais) ir visiškai privatų.
• Darbas su direktorijomis.
• Mini versijų valdymo sistemėlė, kurios pagalba galima valdyti failų revizijas.
• Patogus darbas su nuotraukomis
• Saugumas – Prisijungimui naudojamas HTTPS protokolas.
• 2 GB nemokamos vietos serveryje
• … ir galų galiausiai labai patogi vartotojo sąsaja – puikus pavyzdys, kaip reikia kurti tokio pobūdžio projektus.

Taigi visko tikrai nepapasakosiu, o tiesiog parekomenduosiu šią sistemėlę išbandyti patiems :)

Taip pat būtų įdomu sužinoti jūsų nuomone, taigi nepatingėkit pakomentuoti.

Paprasčiausias būdas naudotis šiuo įrankiu yra įsikelti jo kodo nuorodą į savo Bookmark’us – Tiesiog nutempkite FireBug Lite tinklapyje pateiktą nuorodą į savo BookMarko juostą ir turėsite nuorodą, kurią paspaudus FireBug Lite atsidarys bet kuriame tinklapyje.
Gaila tačiau ši FireBug’o versija dar negali redaguoti tinklapio turinio, bet manau pradžia jau padaryta :)
Taip atrodo FireBug Lite:

Nusprendžiau trumpai ir aiškiai aprašyti kaip centruojama svetainė interneto naršyklėje. Viso labo tai kelios CSS kodo eilutės, tačiau net ir tokie dalykai kai kuriems žmonėms praverčia.

Norint svetainę centruoti, turime žinoti jos plotį. Vienintelis dalykas, kurio reikia iš HTML pusės, tai apsirašyti šakninį svetainės elementą, pavadinkime jį pvz.: site. Dabar CSS faile aprašome stilių site ir body žymoms.

Po Rimanto komentaro, išsiaiškinom, kad tai gali būti atlikta su dar mažiau kodo. O tam kad IE6 rodytų teisingai tiesiog turi būti nurodytas DOCTYPE. Nemanau, kad dabar yra svetainių, kuriose jis būtų praleistas. Liko tik dvi eilutės CSS.

Su paaiškinimu:

Vartotojo interfeisas

Lankytojai į svetainę ateina naudodamiesi įvairiomis www naršyklėmis. Ne visos jos buvo kurtos laikantis standartų (ankstesnės Internet Explorer versijos), ne visos gali juos palaikyti (pvz. per maži įrenginio, kuriame veikia naršyklė, skaičiavimo pajėgumai). Visų naršyklių ir įrenginių, bei operacinių sistemų variacijų išbandyti neįmanoma, o greičiausiai ir nereikia – juk neįmanoma prisitaikyti prie visų. Mes rekomenduojame naujai paleidžiamą svetainę patikrinti su populiariausiomis naršyklėmis :

Frontend rekomendacija: svetainę kurti, peržiūrint ją su Firefox, o su IE ją pratestuoti paskutiniame žingsnyje. Taip bus sutaupoma daug laiko nes naudojant Firefox naršyklės priedais, tokiais kaip Firebug, galima keisti išvaizdą, pačioje naršyklės aplinkoje.

• Patikrinti, kaip svetainė atrodo su skirtingomis vaizduoklio ekrano rezoliucijomis.
• Žvilgtelėti, kaip svetainė atrodo su mobilia naršykle – vis daugiau lankytojų naudoja mobilius įrenginius.
• Pabandykite, kaip svetainė veikia išjungus JavaScript, Sausainėlius (Cookies), CSS. Ar įmanoma surasti pagrindinę informaciją, naviguoti svetainėje?
• Svetainė turi galimybę siųsti elektroninius laiškus? Būtinai patikrinkite, kaip laiškai atrodo su populiariausiomis elektroninio pašto sistemomis:
  • Microsoft Outlook
  • Mozilla Thunderbird
  • Google Gmail
  • Yahoo Mail
  • Hotmail

Patogumas vartotojui

• Sukurkite galimybe vartotojui bendrauti su svetainės kūrėju. Taip bus pranešamos klaidos, siunčiami pasiūlymai.
• Niekada neleiskite, kad elektroninio pašto adresas svetainėje būtų paprastu tekstu.  Frontend rekomendacija: mailto nuorodą iškviesti JavaScript pagalba.
• Patikrinkite, ar paspaudus ant logotipo pateksite į pradinį puslapį.

Veikimas, greitis

SEO

• Patikrinkite, ar svetainės adresai yra draugiški SEO atžvilgiu (Nenaudojami dinaminiai adresai)
• Patikrinkite, ar visi puslapiai turi prasmingas antraštes (title).
• Pasižiūrėkite, ar nėra nuorodų, sakančių “spausk čia” ir panašiai. Jei taip, pasistenkite jas optimizuoti įdedant reikšmingesnius pavadinimus su raktažodžiais.
• Ar turite XML žemėlapį? Ar jis “paduotas” paieškos sistemoms?
• Ar integravote statistikos sistemą? Pavyzdžiui, Google Analytics?
• Ar naudojate robots.txt? Jis tikrai veikia taip, kaip turėtų?
• Ar svetainės išdėstymas nėra paremtas lentelės elementu?
• Ar sesija, vartotojų prisijungimas arba registracija, javascript arba flash technologijomis paremta navigacija neužkerta kelio paieškos robotams aptikti naudingą turinį?
• Naudojate nukreipimus (redirect)? Ar žinote skirtumą tarp 301 ir 302 nukreipimų?
• Ar neliko svetainėje neveikiančių nuorodų? Ar yra priemonės stebinčios ir pranešančios apie neveikiančias nuorodas?
• Ar nuorodos svetainėje yra tekstinės? T.y. ar navigacija svetainėje nėra pagrįsta paveikslėliais, arba Adobe Flash technologija?
• Ar nenaudojami frame ir iframe elementai?

Turite svetainę, paieškos sistemos atveda lankytojus, kurie neša pelną. Vieną dieną verslas sustoja. Imate ieškoti to priežasties. Randate – lankytojai neateina, nes jūsų neberanda paieškoje. Tai išmetimas (ban) iš Google, arba Google bauda (penalty). Pirmuoju atveju jūsų svetainė visiškai nerandama, antruoju, jūsų rezultatas toli – toli, kokiame 50-tame paieškos rezultatų puslapyje. Panagrinėsime kokios gali būti šio reiškinio priežastys. Pirmieji punktai yra paimti iš oficialaus Google gido, skirto užtikrinti kokybišką turinį svetainėse, tolimesni rasti kituose šaltiniuose internete.

• Flat: Forumas, kuriame komentarai paprasti rašomi vienas po kitu – panašiai, kaip kokioje žinučių lentoje (message board)

• Threaded: Forumas, kuriame kiekvienas komentaras yra atsakymas į kitą postą (Populiarus sprendimas, techninės pagalbos forumuose, kur daug žmonių atsako į vieną klausimą.) Toks tipas labai primena susirašinėjimą el paštu, kai tenka daug kartų naudoti “Reply” funkciją viename laiške.

Gera žinia, kad dauguma forumų sistemų paprastai palaiko abu šiuos tipus.

Šiuo metu, yra sukurta visokio sudėtingumo forumų sistemų, įvairiomis programavimo kalbomis (php, python, ruby…), tačiau čia paminėsiu tik tas kurios yra sukurtos php platformai. Čia išrinkau pačių populiariausių sistemų penketuką:

• phpBB (Pati populiariausia sistemą, pasižyminti labai gausiu funkcionalumu. Tinka dauguma projektų ir yra atviro kodo. Specializuotuose forumuose ši sistema minima, kaip pati geriausia.)
• vbulletin (Labai populiari ir gerai įvertinta sistema. Praktiškai lygi (gali net geresnė) nei phpBB. Vienintelė blogybė, kad sistema yra mokama (Licencijos kaina: 100$ terminuotam laikotarpiui, 180$ – neterminuotam))
• simple machines forum (SMF) (Labai populiarus forumas. Užima 3 vietą po phpBB ir vbulletin. Labai daug kur minimas, ir naudojamas. Yra atviro kodo.)
• Phorum (Taip pat įdomus sprendimas, gan paprastas naudoti ir neperkrautas. Turi visas reikiamas funkcijas ir daugiau, bei yra atviro kodo.)
• invision power board (Sistema tikrai patenka į populiariausių penketuką (4-5 vietą – panašiai, kaip ir Phorum). Sistema yra mokama, tačiau labiau orientuotą į verslo klientus (yra du atskiri paketai, po 150$ standartinis ir 300$ verslui), todėl nelabai populiari, tačiau keliuose forumuose radau pareiškimus, kad tai pati geriausia tokio tipo sistema.)

Kalbant apie forumų sistemų  funkcionalumą, tai jų funkcijos praktiškai standartinės. Išrinkau kelias, į kurias reikėtų atkreipti dėmesį, renkantis sistemą:

1. WYSIWYG redaktorius (What You See Is What You Get), kuris suteikia galimybę, į forumo komentarus rašyti formatuotą tekstą.
2. Failų pridėjimas prie komentarų
3. Automatinio citavimo funkcija (Quatation)
4. Vartotojų skaidymas į grupes, vertinimas
5. Detalaus vartotojo profilio sukūrimas
6. Komentarai RSS/Atom formatu
7. Įvairios apsaugos priemonės (Juodieji sąrašai, IP adreso blokavimas, etc.)

Pabaigai, noriu paminėti, kad internete gamina rasti forumų palyginimų tinklapius, kuriais naudojantis, galima išsirinkti vieną sistemą, kuri labiausiai atitinka jūsų poreikius:

• http://www.forummatrix.org/
• http://www.forum-software.org/