Aktuāli! Konsultācija par esošās mājas lapas uzlabošanu!

Cenu tabulu dizains mājas lapu izstrādē

Cenu tabulas

Cenu tabulas ir viena no retajām mājas lapas komponentēm, kuras struktūra un mērķis nav mainījies kopš tās ieviešanas brīža. Parasti cenu tabulas tiek lietotas, lai apkopotu datus par izmaksām salīdzinot atšķirības starp maksāšanas plāniem un gūtajiem labumiem. Tieši tādēļ cenu tabula ir nozīmīgs web dizaina elements, kuram ir jābūt skaidram, pārdomātam, uzskatāmam un pieskaņotam kopējam mājas lapas izskatam.

Cenu tabulas struktūra web dizainā

Katra cenu tabula sastāv no kolonām un rindām, kas kopā formē atsevišķas rūtis, kurās tiek iekļauta tekstuālā informācija, attēls, poga, cena, ikona vai simbols.

Cenu tabulas tiek iedalītas trijos tipos:

1. Vertikāli novietotā cenu tabula – reprezentē informāciju atsevišķās kolonās;

2. Horizontāli novietotā cenu tabula – parāda datus rindu pēc rindas;

3. Matrix tipa cenu tabula – kombinē kopā abus iepriekšminētos cenu tabulu tipus.

Protams, tabulu tipu izvēle atkarīga no vairākiem mājas lapas aspektiem.

Kas veido labu cenu tabulas dizainu?

Labas cenu tabulas uzdevums ir pavedināt mājas lapas apmeklētāju iegādāties pakalpojumu par augstāko cenu, izvērtējot gūtos labumus (tādēļ tiem jābūt skaidri uzskaitītiem). Veidojot izcilu cenu tabulu jāņem vērā divi svarīgi aspekti – estētiskums un nolasāmība. Bez šiem elementiem īsti nav iespējams pavedināt mājas lapas apmeklētājus iegādāties jūs piedāvātās preces vai pakalpojumus.

Lai cenu salīdzinājumu būtu iespējams skaidrāk nolasīt jāparūpējas par pievilcīgu tipogrāfiju (atstarpes starp burtiem un rindām, piemērots burtu izmērs un šrifts, utt.) un jāparūpējas par vizuālo tabulas dizainu (kolonu iekrāsošana, laukumu nodalīšana, burtu krāsas, utt.).

Apsverot kopējo cenu tabulas izskatu, jāatceras ievērot šīs lietas:

1. Atdalīšana ar vizuālajiem elementiem un krāsām netiek veidota vien šūnās un starp kolonām, bet nepieciešams diferencēt izdevīgāko vai akcijas cenu plānu ar atšķirīgu krāsu vai spilgtu rāmīti;

2. Izcel cenu tabulu no pelēcības. Veido to spilgtākā vai krietni vien atšķirīgākā krāsu tonī kā mājas lapas fons. Tā noteikti piesaistīsi interesentu acis;

3. Pielieto ikonas, birkas vai par “aicinājums uz darbību” pogas;

4. Krāsu un izmēru atšķirības;

5. Pieskaņota un vienkārša animācija (piemēram, ritināšanas efekts);

Kad veidojat tabulu izskatu, atcerieties par krāsu pārejām (gradients), ēnām un citiem dekoratīvajiem elementiem. Galvenais, lai viss harmoniski saderētu kopā. Pacentieties pieturēties pie viena stila, lai tas saskanētu ar biznesa formu.

Mūsdienīga cenu tabula ir minimāla, skaidra. Tādu, ko viegli integrēt iekš CSS3 un HTML5.

Aplūko un izmanto 25 bezmaksas CSS3 cenu tabulas paraugus.

Web dizaina modē nācis arī “plakanais dizains“, kurā pieturās pie vienkāršām formām un krāsām. Vienkāršība visu padara skaidrāku un uzskatāmāku.

Aplūko pāris noderīgu cenu tabulu piemērus mājas lapas dizainā. Iedvesmojies un padari savu cenu tabulu daudz modernāku un skaidrāku.

Dropbox cenu tabulas dizaina paraugs

Pricing table example: Dropbox

Aplūkot Dropbox cenu tabulas dizainu

 

Merosys cenu tabulu dizains

Pricing table example: Merosys

Aplūkot Merosys cenu tabulas dizainu

 

Wufoo cenu tabulas dizains

Pricing table example: Wufoo

Aplūkot Wufoo cenu tabulas dizainu 

Fruxx cenu tabulas dizains

Pricing table example: fruux

Aplūkot Fruxx cenu tabulas dizainu

Cerams, ka kāds no šiem cenu tabulu dizaina paraugiem iedvesmoja arī Tevi mājas lapas dizaina atjaunošanai.


Saistītie raksti

Noderīgi jQuery spraudņi “ritināšanas” efektam

Plakanā dizaina ēra mājas lapu izstrādē

Sīkās, bet nozīmīgās mājas lapas detaļas


Lasīt vairāk: Web dizains


Rakstā izmantotie informācijas avoti: Pielieto cenu tabulas web dizainā

25 piemēri ar skaitām cenu tabulām

25 bezmaksas CSS3 cenu tabulas sagataves

Kā izveidot CSS3 cenu tabulu


Radušies papildus jautājumi? Vēlies uzzināt vairāk par cenu tabulām mājas lapas izstrādē? Jautā, mēs palīdzēsim!