Viltor webáruház blog

Gondolatok a webáruházak világából

Új webáruház arculat - 012 sorozat

A Viltor rendszer legújabb, 012 sorozatszámú arculatának fejlesztése során egy olyan sablon elkészítése volt a cél, amely a lehető legegyszerűbb vonalvezetésű, ugyanakkor nem érezni rajta a mai trendeknek megfelelő minimál dizájn néha igencsak üres tereit. A weboldal elemei szorosan egymás mellett, csempeszerűen helyezkednek el, ami sokkal jobb térkihasználást, így egy oldalon belül nagyobb funkcionalitást enged meg.

Az új arculat minden eszköztípuson előnyt jelent a korábbi, hagyományosabb kialakításokkal szemben. Asztali monitoron a vásárló élvezheti a teljes szélességű, háttérkép és oldalvonal nélküli navigálást, a felszabaduló helyeken pedig állandóan jelen lévő plusz funkciókat tud elérni, mint pl. a termék szűrő, blog menü stb.

Webáruház arculat széles monitoron

Táblagépen és okostelefonon pedig egy egy soros menü szolgálja a navigálást, amely minimális helyen, nem zavaró módon, de még jól kezelhető nagyságban tapad a webáruház felső részéhez.

Webáruház arculat okostelefonon

Az új arculat a termék képeket un. "lazy load" technikával tölti be a gyorsabb felhasználói élmény érdekében. A módszer lényege, hogy a képek csak akkor kerülnek letöltésre a szerverről, ha azok a vásárló böngészőjének ablakában amúgy is megjelennének. Pl. egy hosszú terméklista esetén csak a felső pár termék képe jelenik meg, majd ahogy görget lefelé a látogató, úgy töltődnek be az újabb képek egymás után.

Színek

Az új arculat alapszínei a világos szürke árnyalatai, amelyek kellően semlegesek ahhoz, hogy a kiegészítő színek (jellemzően gombok, címsorok) segítségével sok termékcsoporthoz illeszkedő webáruház kinézetet biztosítsanak. (Tervben van egy sötét színárnyalatú sablon változat fejlesztése is.) A korábbi Viltor sablonokhoz hasonlóan ennek a kinézetnek a színei is kód (CSS) szinten módosíthatóak, azonban az adminisztrációs felületen itt is mód van a legfontosabb, az arculat stílusát meghatározó színek egyszerű kezelésére.

Webáruház arculat okostelefonon

Az egyes szín kódok értelmezésében segít az alábbi táblázat:

  • header_color: Fejléc (header) szövegek színe.
  • btn_color: Gombok (button) színei. Jellemzően a listában egymást követő két szín a gomb normál, illetve hover (egérrel a gomb fölé navigálunk) színe.
  • bg_color: Az egyes szekciók, oldal részek hátterének (background) színei.
  • txt_color: Szöveg (text) elemek, linkek színei.
  • border_color: Az egyes szekciók, oldal részek keretének (border) színei.
  • msg_bg_color: Az üzenetek (message) háttér színei.
  • msg_color: Az üzenetek (message) szöveg színei.

Fejlesztési tervek a 012 sablon változatokhoz

A 012 sablon sorozat már fel van készítve a Viltor rendszerben a közeljövőben bevezetésre kerülő többnyelvű webáruházak kezelésére. Amikor ez a fejlesztés elkészül, akkor adott beállítások mellett a sablon már képes lesz megjeleníteni a nyelv, illetve deviza választó elemeket asztali számítógépen és okostelefonon is.

A szélesebb termékkínálattal rendelkező áruházak részére készülni fog egy un. "mega menü" változat is, ahol a főbb termékcsoportok egy ablakban jelennek meg majd a könnyebb átláthatóság kedvéért.

Próbálja ki ingyen a Viltor webáruház szolgáltatást!

A rendszer kipróbálása csak egy gyors regisztrációhoz kötött, ahol megadhatja új webáruháza nevét, majd azonnal birtokba veheti és 20 napig tesztelheti azt! Nincs kezdeti költség, nincs kockázat!