Web lapu dizains

Laba dizaina pamati
(mans subjektīvais viedoklis)

Nodarbojos ar Web lapu dizainu jau 7 gadus. Sākumā manas lapas bija primitīvas un par dizainu tur vispār varēja nerunāt, tikai vēlāk sāku apzināties kas ir skaista lapa, kāda nozīme ir krāsām un pareizai navigācijai. Zemāk mēģināšu izklāstīt to, kas manuprāt ir laba dizaina pamati.

Pirmais un iespējams ka galvenais ir izvēlēties krāsu gammu. Jo izstrādāt lapas dizainu bez iepriekšējā plāna (krāsu) būs grūti, pastāvīgi jauksies krāsas un lapa izskatīsies pēc varavīksnes. Cilvēkam, kas ieies šādā, lapā būs grūti koncentrēties uz lapas navigāciju un tekstiem. Praktiski vienmēr labu rezultātu dot pelēkās krāsas izmantošana. Pelēks der praktiski ar jebkuru krāsu. Protams nevajag aprobežoties tikai ar pelēkām krāsām, jo tad lapa izskatīsies pārāk garlaicīga vai arī pārāk nopietna. Eksperimentējiet, bet nevajadzētu lapā izmantot vairāk par 3-4 pamatkrāsām. Zemāk ir neliels palīgs webmasteriem (ja nepietiek gradāciju tad palabojiet PNG failu paši).

Mazs palīgmateriāls. 
Bildes augšpusē ir 3 iespējamās lapas pamatkrāsas un to gradācijas ar 10% atšķirību.  Zem pamatkrāsām ir vieta (More colors), kur var "sajaukt" kādu papildus krāsu ar 69 gradācijām (5% atšķirība).

colors.png fails (38,1 Kb) ar piemēru priekš Macromedia Fireworks.

Kā izmantot PNG failu.
Lai dabūt krāsas toņus jebkurai no Jūsu lapas pamatkrāsām jāizdara sekojošais: laukā (100) nomainiet krāsu, kad tas tiks izdarīts visi pamatkrāsas toņi izmainīsies automātiski (90% ... 10%). Tāds pats rezultāts būs ja izmainīt krāsu laikā "More colors" vienīgi rezultātā būs 69 krāsas toņi - 90% ... 10% (kā ar pamatkrāsām) papildus katram tonim būs vēl papildus 6 gradācijas 85% ... 35% (skaties no augšas uz leju).

Krāsu lauki failā atrodas līmenī "Krasas", tekstuālā informācija līmenī "Teksti" un filtri gradāciju izveidei atrodas līmenī "Filtri".

Fotogrāfijās izmantojamās krāsas šim noteikumam netiek pakļautas. Ideālā gadījumā protams būtu piemeklēt bildi ar tuvu krāsu gammu.

Nevajadzētu lapu pārslogot ar tekstiem un grafiku, vajag atstāt kādu brīvu vietu, kas kalpos kā "atpūtas" vieta acīm. Bieži vien redzu portālu tipa lapās kad teksts burtiski aizņem visu lapu, nav nekādu "spaceru" vai arī teksts "pielīp" pie tabulu malām. Rodas sajūta ka skaties nevis uz lapu, bet uz burtu (svītru, bilžu) briketi (kokteili). Varbūt atstājiet starp teksta blokiem kādu 5-10 pikseļu brīvu vietu. Ja lapā ir daudz tekstuālas informācijas izmantojiet to savā labā - izmantojiet tekstu kā lapas bloku sadalītāju (pamēģiniet neizmantot starp teksta blokiem līnijas, vai arī to krāsu izvēlieties mazāk krītošu acīs). Jebkurā gadījumā eksperimentējiet, pamēģiniet nodzēst kādu dizaina elementu un paskatieties vai lapa izskatās skaistāk, ja jā tad šis elements droši vien ir lieks. Neliels piemērs zemāk.


Piemērs ar "pielipušu" tekstu un ar 10 pikseļu "spaceri".

Ja lapas dizains prasa kādu grafisku elementu (bildi) tad jebkura "dzīva" fotogrāfija vienmēr (nu praktiski vienmēr) padara lapu dzīvāku. Šeit es domāju reālu (nevis zīmētu) priekšmetu un cilvēku fotogrāfijas. Protams arī zīmēti (sintētiski) objekti var būt skaisti. Galvenais nepārcensties ar grafisko elementu daudzumu.

Noformējot lapu mēģiniet pieturēties pie noteikta stila, nevajag lapā izmantot daudz fontus. Saprotams ka Jums gribas parādīt citiem cilvēkiem cik Jūsu sistēmā ir daudz skaistu fontu, bet padomājiet  - vai šādu "fontu izstādi" būs ērti lasīt. Lapas grafiskā noformējumā ir pieļaujams izmantot citus fontus, bet arī tiem nevajadzētu būt pārāk daudz.

Neaizmirstiet ka taisot lapu nacionālā valodā (jebkurā: latviešu, krievu, poļu, igauņu u.t.t.) vajag HTML kodā norādīt kodu tabulu. Pat ja taisot lapu Jūs visu varat izlasīt uz sava datora monitora tas nenozīmē ka to redzēs tādā pat izskatā arī citi. Cilvēki parasti neceļo tikai pa vienas valsts Internet zonu (teiksim Latviju), bet gan apciemo arī citas lapas un ja Jūs nenorādāt lapai tieši, kādā kodējumā tā ir (Windows-1257 piemēram), tad pārlūkprogramma atstās lapas kodējumu no pēdējās apmeklētās lapas. Piemēram cilvēks skatījās www.gazeta.ru lapu (krievu valodā) tad pārgāja uz Jūsu lapu (latviešu valodā):


Korekts un nekorekts teksta attēlojums.
Pirmā gadījumā lapas kodējums ir Windows-1257,
otrā tā vispār nav (lapā atvērta pēc www.gazeta.ru).

Ja lapa ir kādā no nacionālām valodām izmantojies tikai standarta fontus (Arial, Verdana, Times), jo tikai šie fonti Windows sistēmā praktiski ir vienmēr (Unicode)  un Jūsu lapu varēs izlasīt saglabājot nacionālos burtus. Šeit es neminēju iMac datorus, bet domāju ka ar šiem fontiem nebūs problēmu. 

Kā jau rakstīju pašā sākumā viss rakstā ir mans subjektīvais viedoklis. Ja ir kādi jautājumi vai precizējumi, kā arī ja ir vēlēšanās padiskutēt šajā jautājumā tad izmantojiet kontaktu lapu.