Bir çoxlarımızın yenilənməsini səbrsizliklə gözlədiyimiz Xeberler.az axır ki, yeniləndi. Saytın audiotoriyasının İT ilə maraqlandıqlarını nəzərə alaraq sayt yenilənərkən nələr baş verdiyini blogda da yazmaq qərarına gəldim. Bu barədə yazacağımı bildiyimdən işi görərkən nələri yazacağım barədə özüm üçün bəzi qeydlər etdim. Buna görə Google Docs`dan və Evernote`dan aktiv istifadəyə başladım. Doğurdan da yararlı «alətlər» imiş. Özün üçün qeydlər etmək çox yararlıdır (bu başqa bir blog yazısına belə çevrilə bilər), bunu davam edəcəm. Əvvəla onu deyim ki yazının çox uzun alınmasına görə üzr istəyirəm (bu ixtisar olunmuş halıdır). Sadəcə bu yazını yazarkən əsas məqsədim, bir sayt ərsəyə gələrkən hansı mərhələrədən keçir və nələrə diqqət edilir onu göstərmək oldu. Çox uzatmadan Xeberler.az`ın ikinici həyata başlaması barədə qeydlərmi paylaşmağa başlayım.
    Sahil İT`dən sonra, Xeberler.az`ı yenidən qurmaq Labrin`in boynuna düşdü. Əsasən visual dəyişikliklərə məruz qalan saytda bəzi funksiyalar təkmilləşdirildi və bəzi funksiyalar da əlavə edildi. Əvvəlcə işə başlamadan birinci mərhələ olaraq «Concept Research» aparıldı. Onu xüsusi olaraq qeyd eləmək istəyirəm ki, peşəkar müştəri ilə işləyəndə fərqi hiss eləmək mümkün olur. Dizayn zamanı minimum müdaxilə və yeniliklərin tətbiqinə maksimum maraq iş prosesini də maraqlı edir. Concept Research zamanı bir çox əcnəbi təcrübəni araşdırdıq və local olaraq nələr tətbiq olunsa yaxşı olar onları qərarlaşdırdıq, ümimiyyətlə saytın yeni imici formalaşmağa başladı. Concept Research`dən sonra qarşımızda konkret məqsədlər var idi. İşin sonunda bunlardan bir çoxunu həyata keçirmək mümkün oldu fikrimcə. 
    Araşdırmadan sonra işə başlamaq vaxtı gəldi. Dizayn edərkən qarşımda bəzi meyarlar var idi. Birincisi bu xəbər saytı olduğundan əsas diqqət xəbərə yönəldilməli idi. Bu çox primitiv yanaşma tərzi kimi görünsə də halhazırda ən çox işə yarayan metoddur. Gündə bir sektora əl atan Google`un belə mühəndislərinin 70% vaxtı onun axtarış sistemini daha da inkişaf etdirməyə yönəldiyini nəzərə alsaq və Twitter CEO’su Evan Williams`ın «düzgün seçilmiş 1 xidməti 100 dəfə yoxlayıb saytı inkişaf etdirmək, 100 fərqli xidmət göstərməyə çalışmaqdan daha yaxşıdır» dediyini görəndə bu metodun həqiqətən də işə yaradığını fikirləşmək olar...
    Saytın əsas funksiyası informasiya çatdırmaqdır. Deməli onda xəbərlər maksimum rahat şəkildə istifadəçiyə çatdırılmalı, oxuyarkən gözü yormamalı idi. Digər bir məsələ ondan ibarət idi ki, bu saytın artıq müəyyən istifadəçi auditoriyası olduğundan onları öyrəşdikləri köhnə sistemdən çox uzaqlaşdırmaq usability cəhətdən ağıllı addım olmazdı. Müştəri köhnə dizayndan «sarı» rəngin qalmasını istəmişdi. Deməli artıq dizayn üçün müəyyən mənzərə yaranmağa başladı. Mənim dizayn zamanı istifadə edəcəyim sarı rəngi ifadə edən taglar — xəbərdarlıq, şən, qorxaqlıq, maraq, xoşbəxtlik, sevinc, zarafatcıl, müsbətlik, günəş işığı və səmimiyyətdir. Dizaynlarda sarı rəngi ümumiyyətlə, diqqəti çəkmək və səmimiyyət, xoşbəxtlik vs. hissləri yaratmaq üçün istifadə edilir. Əgər yalnız sarı rəngin tonlarından istifadə etsəm onda sayt həddindən artıq diqqət çəkəcək və qeyri ciddi görünəcəkdi. Ona görə köməkçi rəng lazım idi. Mən saytın mövqelənmək istədiyi imicə uyğun olaraq göy rəngi seçməyi qərara aldım. Göy rəngi ifadə edən taglar — nüfuz, sükunət, gizlilik, zadəganlıq, sədaqət, hakimiyyət, müvəffəqiyyət, təhlükəsiz və etibarlılıqdır. Beləcə dizaynın verəcəyi mesajı — səmimi, etibarlı, nüfuzlu və müvəffəqiyyətli olaraq təyin etməyə çalışdım. Yenidənqurma zamanı logo`nu da ümimi konsepsiyaya uyğun olaraq dəyişdirdik. Sadə və Web 2.0 standartlarına yaxın birşey etməyi qərara aldıq.

    Webdizaynın çətin tərəflərindən biri odur ki, cəmisi 5 saniyə vaxtım var. Çünki araşdırmalar göstərir ki, bir istifadəçinin saytı incələmək üçün sayta verdiyi vaxt 5 saniyədir. Yəni 5 saniyə sayta baxan hər bir istifadəçi sayt haqqında özündə fikir formalaşdırır və əgər sayt xoşuna gəlmirsə 5 san. sonra browserdəki «X» düyməsini köməyə çağırır. Deməli istifadəçinin marağını oyatmaq lazımdı. Bunun üçün isə «F» pattern qaydasına riayyət eləmək lazımdı.

İstifadəçilər saytı sol üst hissədən başlayaraq «F»`ə bənzər bir yolla analiz etməyə başlayırlar. Məhz ona görə saytlarda logo əsasən sol üst hissədə yer alır. Düzdür indiki araşdırmalar göstərir ki, artıq istifadəçilər «Above the fold» (sayt açılarkən saytın browserdə ilk görünən hissəsi) qaydasına riayyət etmirlər, amma hər halda ilk təəssürat saytda çox vaxt keçirilməsini təmin etmə üçün vacib amildir. Birdəki saytın yeni konsepsiyasına əsasən Xeberler.az artıq yazarlara və onların məqaləsinə istifadəçi diqqəti daha çox yönəltmək istəyir və F pattern`i amilini nəzərə alsaq onda dizaynda yazarlar blokuna daha çox diqqət yönəlməsini təmin etməliydim. Ona görə dizaynda  yazarlar bloku daha ön plana çıxardıldı.
    Saytda istifadəçilərin aktivliyini təmin etmək üçün artıq onlar şərhlər vasitəsilə yazılara reaksiya da verə biləcəklər. Amma bu istifadəçilər üçün nə qədər yaxşı bi imkan olsa da administrasiya tərəfindən əlavə problemlər demək idi. Spamlarla mübarizə aparmaq vaxt itkisinə gətirib çıxaracaqdı. Bu problemi də həll etmək üçün saytın şərh hissəsini Akismet`in bazası ilə əlaqələndirib (xeyr, Xeberler.az Wordpress üzərində qurulmayıb) spam problemini minimuma endirməyə çalışdıq. Başqa bir göz önündəki yenilik isə artıq Xeberler.az texnologiya haqqında Azəbaycanca yazan bloglara keçid verəcək.

    Yeni dizaynda əsas usability`nı rahat şəkildə təmin etməyə çalışdım. Buna görə də təkcə dizayn yox həmdə «coding» prosesində də bəzi məqamlarda diqqətli olmalıydım. Birincisi köhnə versiyadan fərqli olaraq sayt əsas browserləri dəstəkləməli idi. Çünki saytın auditoriyası təkcə peşəkar İT həvəskarları deyil, ən müxtəlif auditoriyanı hədəf qrup olaraq götürübdür (bəli, İE6 ilə işləmək yenə çox vaxtımı apardı). Sayt kontent yüklü sayt olduğundan və tekstlər çox olduğuna görə koding də maksimum optimal olmalı idi. Ona görə Xeberler.az`ı kodlayarkən "CSS Sprites" metodundan maksimum istifadə etdim. Beləki koding zamanı optimallığı əldə etmək üçün bütün dekorativ şəkilləri 4 faylda birləşdirdim və istifadə etdim. Bu sayədə təxminən 30% optimallıq əldə edə bildim.
    Usability asanlaşdırmaq üçün istifadə etdiyim digər bir detal isə Fitts qanunu kimi bilinən metodun coding zamanı tətbiqidir. Fitts qanunu "Bir hədəfə çatmaq üçün lazım olan vaxt aradakı məsafənin və hədəfin böyüklüyünün funskiyasına bərabədir" şəklində ifadə olunur. Yəni hərhansı bir obyekt böyükdürsə və ona olan məsafə qısadırsa onda həmin obyektə daha tez çatmaq olar. Bu metod əsasən linklərin dizaynını kodlayarkən istifadə olunur. Eyni metoddan məndə sol tərəfdəki əsas menuda və üst tərəfdəki naviqasiya hissəsində istifadə etdim.
    Düzü bu yazını yazanda bu qədər çətinlik çəkəcəyimi düşünməmişdim, qeydlərim həddən artıq çoxdur, amma yazının uzun olması isə postun əleyhinə olacağı üçün daha da uzun yazmaq istəmirəm. Yazıda bəzi global qəbul olunmuş məqamlardan sitat çəkməyə çalışdım. Məqsədim bir saytın yaranmasında keçilən bəzi mərhələləri göstərmək və yeri gələndə bu postu misal çəkərək göstərmək idi =).