Banner készítés a Tokyo sablonhoz

A Tokyo sabloncsalád főoldali bannere igazán látványos eleme lehet webáruházunknak, ugyanakkor sokszor kőkemény feladatnak tűnik a megfelelő banner elkészítése. Ebben szeretnénk most egy kis segítséget nyújtani. 

Ebben a cikkben 3 dologra fogunk kitérni:

A Tokyo sabloncsalád főoldalának reszponzív nézetei

A banner ideális méretei

Minta bannerek

A Tokyo sabloncsalád főoldalának reszponzív nézetei

A Tokyo sabloncsalád főoldali bannerváltóját úgy alakítottuk ki, hogy minden készüléken jól látható és olvasható legyen a banner tartalma. Emiatt a kisebb kijelzőkön és monitorokon a banner széleit levágjuk, hogy a legfontosabb, vagyis a banner közepén elhelyezett tartalomra nagyobb hangsúly kerülhessen. 

Hogyan is néz ki ez a gyakorlatban?

1) Full HD, vagyis 1920px széles monitorokon még a teljes banner látszik:

tokyo_desktop.jpg

2) Az 1024px széles tablet kijelzőkön ugyanakkor már levágjuk a banner széleit, így a banner közepe jóval nagyobb figyelmet kap:

tokyo_ipad_pro.jpg

3) Egy okostelefon kijelzőjén ugyanígy az optimalizált méretben jelenik meg a banner, hogy a szöveg olvasható, a kép pedig jól kivehető maradjon:

tokyo_iphone_x.jpg

A banner ideális méretei

  • A Tokyo sabloncsalád főoldali bannerének ideális mérete 1920 x 700 px.
  • A mobilbarát terület a banner középső részén helyezkedik el, és egy 1170 x 700 px-es szeletet foglal magában.
  • A mobilbarát terület a banner bal és jobb szélétől egyaránt 375 px-re helyezkedik el.  

A banner szövegét érdemes a mobilbarát területen elhelyezni. Ugyanígy minden olyan tartalmat, amit minden kijelzőn meg szeretnénk jeleníteni, szintén a mobilbarát területben érdemes elhelyeznünk. 

tokyo_minta_banner.jpg

Minta bannerek

A Tokyo sabloncsaládhoz készített minta bannerünket itt lehet letölteni: Letöltés

A Tokyo sabloncsalád főoldali bannerének .psd kiterjesztésű verzióját itt lehet letölteni: Letöltés

 

Amennyiben a sablon váltással vagy testreszabással kapcsolatban további segítségre lenne szükséged, keresd bizalommal egyedi designban jártas csapatunkat.

Van még kérdésed? Kérdés beküldése

Kérdésed van?

  • Böngéssz a Témák között!
  • Keress rá a konkrét kérdésedre!
  • Ha nem találtál megoldást a problémádra, vedd fel a kapcsolatot kollégáinkkal:
  • Írd meg kérdésed a Kérdés beküldése menüpontban!
  • Írj e-mailt az info@shoprenter.hu címre!
  • Írj chat-en webáruházad adminisztrációs felületén!
  • Hívj bennünket a 06-1/234-5011-es számon munkanapokon 9:00-15:00 között!

Hibabejelentés