The Ultimate Shopify Képméret-útmutató

Ha előfizet egy szolgáltatásra az ezen az oldalon található hivatkozásról, a Reeves and Sons Limited jutalékot kereshet. Lásd a mi etikai nyilatkozat.

Amikor egy potenciális ügyfél rábukkan Shopify , a képek alapján eldöntik, hogy vásárolni szeretnének-e. Ezért az Ön feladata kereskedőként annak biztosítása, hogy a képek ne torlaszolják le a webhely betöltési sebességét (hogy eltolja az embereket), és format és megfelelően méretezzük a képeket.

Így a képek nem tűnnek kinyújtottnak vagy levágottaknak. A mi végsőségünkben Shopify képméret útmutató, megmutatjuk az adott képméretek fontosságát Shopify fotózáshoz, és ideális méretet biztosítanak az olyan dolgokhoz, mint az embléma, a szalaghirdetés és a termékképek.

Olvasson tovább, hogy mindent megtudjon Shopify képméretek!

Miért érdekelne Shopify Képméretek?

Fárasztó a képek kezelése és feltöltése. Ennek ellenére gyakran ők a fő szabálysértők, amikor a webhely lassú sebességéről, a SEO-problémákról és az e-kereskedelmi webhelyek alacsony konverziójáról van szó.

Az összes webhelykészítő és e-kereskedelmi platform trükkös része pedig az, hogy ragaszkodnia kell a nagyon meghatározott képméretekhez, hogy azok optimalizáltak legyenek és reprezentatívak legyenek.

Összegezve, íme, miért Shopify a képméretek számítanak:

  1. Minden kép beírható Shopify egyedi méreteket igényel, például azt, hogy az emblémák méretűek legyenek eltérőek a szalaghirdetések képeitől.
  2. A felhasználók nagyobb valószínűséggel válnak fizető ügyfelekké, ha tisztán látják a jobb oldalon lévő képeket format.
  3. A megfelelő méretű és optimalizált képek növelhetik SEO potenciálját.
  4. A rossz méretű fényképezés kinyújtott vagy levágott képeket okozhat, ami csúnya webhelyhez vezethet.
  5. Előfordulhat, hogy a nem megfelelő méretű képek lelassítják webhelyét, vagy megakadályozzák, hogy az ügyfelek teljesen várakozzanak.

Ezekkel a pontokkal együtt: az éles, jó méretű képek bizonyos szintű professzionalizmust mutatnak be, érzelmi reakciókat keltenek az ügyfelekben, hogy Ön megbízható vállalkozás, és termékei a legjobb minőségűek. A rossz fotók egyszerűen úgy jelennek meg, mintha nem törődne a termékeivel vagy a megjelenítésük módjával. Ügyfelei feltehetik a kérdést: „hol máshol vágnak neki a sarkoknak?”

Ennek ellenére vessen egy pillantást gyors útmutatónkra a legjobbakról Shopify képméretek olyan területekhez, mint a termékoldalak, szalaghirdetések és logók.

A legjobb Shopify Képméretek (a képek felhasználási helyétől függően)

Nem mindegyik kemény szabály, de a legjobb, ha a lehető legjobban ragaszkodunk az „ideális mérethez”. A témáknak időnként saját képszabványai vannak, ezért tartsa szemmel ezt. Egyébwise, elmagyarázzuk, ha lesz némi mozgástere a méretek tekintetében.

Van-e keresztben használható képméret? Shopify?

Nem, de ha ezt a megközelítést tervezi, a következőket javasoljuk:

  1. Győződjön meg arról, hogy minden kép elég nagy ahhoz, hogy a termék bonyolult részleteit is megjelenítse.
  2. A képeket azonban tartsa elég kicsinek, hogy ne akadályozza a webhely teljesítményét.
  3. Jó hüvelykujjszabály, hogy ragaszkodj a 2048 × 2048 pixelhez square képeket.
  4. Kerülje a 800 × 800 képpontnál kisebb méreteket square képeket.
  5. Kerülje el a 4472 × 4472-nél nagyobb méreteket square képeket.

Nemsquare képeket, mindenképpen javasoljuk az alábbi útmutatók használatát. Azt is érdemes megjegyezni, hogy egyes témák másképp vágják le a képeket, így előfordulhat, hogy kitalálnia kell és ellenőriznie kell, hogy melyik képméret felel meg a legjobban az Ön online áruházának.

A legjobb útmutatásért vessen egy pillantást az ideálisra Shopify képméretek lent, mindegyik képtípus alapján kategorizálva:

1. Shopify Termék képméret (ideális méret: 2048 × 2048 képpont)

A termékképek az értékesítéshez használt média elsődleges formái. ShopifyA témái elég jól kivágják és optimalizálják a termékképeket, de soha ne hagyatkozzon az automatizált eszközökre.

A termékképek ajánlott méretei Shopify 2048x2048 pixelesek.

Ez egy csodálatos hely annak biztosítására, hogy a képek ne lassítsák az oldal sebességét, ugyanakkor ügyfelei is részletesen látják az eredeti fényképek gazdagságát.

Javasoljuk a square kép a termékfotókhoz, hogy elkerülje a nem kívánt kivágást Shopify témákat.

Az alábbi képernyőképen egy 2048 × 2048 pixel felbontású kép látható, amely nem eredményezett levágást.

Shopify képméret a termékfotókhoz

A hosszabb és szélesebb képek továbbra is működhetnek a termékfotóknál, de kevésbé szabályozható, hogy a téma mit csinál a képekkel. Előfordulhat, hogy a fekvő fotók mérete csökken a portrékhoz képest format.

2. Shopify Gyűjtemény képmérete (ideális méret: 2048 × 2048 képpont)

Egy gyűjtemény hozzáadásához nem feltétlenül van szükség képre, de ezzel lehetővé válik, hogy külön oldalt hozzon létre a gyűjteményhez, mintegy olyan céloldalhoz, amely csak a termékek egy kis részéhez készült.

alatt van feltöltve egy gyűjteményképe Gyűjtemény létrehozása szakaszban Shopify.

kép hozzáadása a gyűjteményhez

Ezt követően hozzáadhat egy terméket a gyűjteményhez, és megjelenítheti a kezdőlap tartalmi blokkjában vagy önálló oldalként.

Ha elhagyja a Kép üres mezőt a gyűjtemény oldalán, akkor az adott gyűjtemény egyik kiemelt termékképe lesz alapértelmezett.

Az ajánlott Shopify A gyűjtemények képmérete 2048 × 2048 pixel.

A square méretek segítik a szabványosított format minden gyűjteményben, különösen, ha egymás mellett jelennek meg.

Shopify képméret gyűjteményekhez

Azt is megtalálod square A képekkel könnyebben lehet dolgozni, ha gyűjteményeket bemutató tartalomblokkokat használ.

Mint mindig, az eredmények a használt témától függően változhatnak. Egyes témák valójában további lehetőségeket kínálnak a gyűjteményképekkel, lehetővé téve a kép megosztását szalaghirdetésként egy külön gyűjteményoldalon. Ebben az esetben a gyűjtemény képének optimális mérete teljesen eltérhet attól, amiről itt beszéltünk. Összességében a legjobb cselekvési terve az, ha végigmegy a témája tesztelésén. Tölts fel több egyedi méretű képet a gyűjteményeidbe. Írja le azokat, amelyek működnek, majd mindig használja ezeket a méreteket. Csak ügyeljen arra, hogy a képek ne legyenek túl nagyok vagy túl kicsik, és minden rendben lesz.

3. Shopify Embléma képmérete (ideális méret: 450 W × 250 H képpont)

A logó az Ön e-kereskedelmi üzletének sátoraként tűnik ki. Pontosan akkor jelenik meg, amikor valaki a kezdőlapjára érkezik, és az egész webhelyen, tekintve, hogy általában a fejléc területén látható.

Shopify A logómérettel kapcsolatos problémákkal küzdő felhasználók azt tapasztalhatják, hogy az embléma nem elég nagy, vagy valamilyen módon deformálja a navigációs menüt. Vagy azt tapasztalhatja, hogy az embléma sok fehér helyet hagy alatta vagy fölött.

A legtöbb probléma megoldásához javasoljuk, hogy használjon 250 képpont magas és 450 képpont széles emblémát.

szélesebb logó

Tény, Shopify azt javasolja, hogy szélességben és magasságban soha ne menjen ennél magasabbra. Ennek ellenére kisebb is lehet, ha a témája ezt lehetővé teszi.

Gyakran előfordul, hogy az oldalsáv kidob valamit, vagy esetleg a navigációs menü túl sok elemet tartalmaz, amelyek furcsa irányba tolják a logót. Ettől függetlenül a legjobb, ha a logó méreteivel és webhely-beállításaival játszol a legjobb megjelenés elérése érdekében.

Alternatív megoldásként néhány téma jól mutat square logók, de tartsa a 250 x 250 pixel jelölés alatt, így nem foglal túl sok helyet.

square logo

A legtöbb sokoldalúság érdekében látogasson el ide Beállítások > Márka in Shopify hozzá a alapértelmezett és a Square kép. Így a helyzettől függően bármelyiket feltöltheti.

logó opciók

4. Shopify Szalaghirdetés képmérete (ideális méret: 2000 W × 600H pixel)

Rendszerint hősképnek vagy képes szalaghirdetésnek nevezik, ezek azok a nagyobb képek, amelyeket elhelyezhet a kezdőlap tetején, hogy új termékeket mutasson be, és szöveget is tartalmazzon egy gombbal. Alapvető fontosságú, hogy a szalaghirdetések nagy felbontásúak legyenek, hogy elkerüljük a szemcsésséget az átméretezés után és különböző eszközökön való megtekintéskor.

Shopify képméret a bannerhez

Shopify is van egy Fejléc tartalom szekció, amely a Banner kép tartalom szakasz.

Függetlenül attól, hogy melyiket választja, javasoljuk, hogy ragaszkodjon az 1200 pixel szélességhez x 600 pixel magassághoz a szalaghirdetéseknél és a hősképeknél.

Shopify képméret a kép bannerhez

Ennek ellenére gyakran megúszhatja 1200–2000 képpont szélességét és 400–600 képpont magasságát. És mint mindig, ez a témától függ.

Végül is az wise az összes képszalag és hőskép beállításainak módosításához. Módosíthatja a legtöbb téma szalaghirdetésének magasságát, és megmondhatja Shopify ahol a szalaghirdetés tartalmát szeretné elhelyezni, például a jobb alsó sarokban vagy a tetején – hogy jobban lássa a tartalom mögötti képet.

5. Shopify Diavetítés képmérete (ideális méret: 2000 W × 600 H pixel)

A szalaghirdetésekhez hasonlóan nagy felbontású képeket kell használnia a diavetítésekben. Ezek a tartalomrészek lehetővé teszik több fénykép megjelenítését az oldal egy területén. Ezután egymás után a következő képre csúsztatnak.

Mivel nagyon hasonlítanak a szalaghirdetésekre, valójában ugyanaz a szélesség és magasság marad meg, mint egy hős vagy szalaghirdetés esetében. Az ajánlott szélesség 2000 pixel és magasság 600 pixel. A magasság azonban 400-600 pixel, a szélesség pedig 1200-2000 pixel lehet.

képcsúszka és Shopify képméret

Ügyeljen arra, hogy minden diavetítés-beállítást kezeljen a legjobb eredmény elérése érdekében formata diavetítéshez. Lehet, hogy a tartalomdobozt egy másik helyre kell mozgatnia, vagy a diavetítés jobban nézne ki, ha egy kicsit megnövelné a magasságot.

A diavetítés egyik fő szabálya, hogy mindig azonos méretű képeket tölts fel ugyanahhoz a diavetítéshez. Szívesen módosíthatja a méreteket, amikor külön diavetítést hoz létre, de csak győződjön meg arról, hogy az egyetlen diavetítésben egyesített képek azonos méretűek a folytonosság és a felhasználói élmény érdekében.

Hogyan lehet optimalizálni Shopify képek

A képek optimalizálása segít javítani a fotók betöltődését az e-kereskedelmi áruházban. Segít abban is, hogy felhasználóbarátabb élményt teremtsen a webhelyen, mivel a képeknek hogyan kell kiegészíteniük a vásárlási élményt, nem pedig felülmúlniuk azt.

A képek optimalizálásakor több szempontot is figyelembe kell venni Shopify. Ezek a területek magukban foglalják az optimális képet formats, tömörítések, képforrások, stílus stb. Olvasson tovább, hogy mindent megtudjon a bevált módszerekről és a képek optimalizálásának lépéseiről Shopify.

1. lépés: Válassza ki az optimális képet Format

Shopify A képméretek fontosak, de minden fotóoptimalizálás első lépéseként a legjobb kép kiválasztását kell végezni format.

Számos kép található formats ez Shopify lehetővé tesz.

Íme, mi teszi őket különlegessé:

  1. JPEG/JPG: Talán a leggyakoribb fájl format képekért, és joggal. A JPEG-fájlok jól tömörítenek és kiváló minőséget biztosítanak. Termékoldalakra ajánljuk őket, különösen akkor, ha finom részletek vannak a fotókon.
  2. PNG: Ez a fájltípus valójában jobb, mint a JPEG a képméret csökkentése utáni minőség megőrzésében. Azonban előfordulhat, hogy a PNG-k nem tömörítenek annyira. Akkor a legjobbak, ha átlátszó háttérre van szüksége (a JPEG-ek nem támogatják), ezért szeretjük őket logók és szalaghirdetések esetében.
  3. GIF: A GIF egy kép format animációkhoz. Lényegében olyan, mintha egy rövid videót mozgóképpé alakítanánk, ami segít röviden elmagyarázni egy terméket, anélkül, hogy a videó túlnyomó méretei lennének. Kedveljük őket a honlapokon, a termékoldalakon és a blogbejegyzésekben. Ne használd túl azonban a GIF-eket, mert hiányzik belőlük a másokban található gazdag színminőség formatpéldául JPEG, TIFF és PNG.
  4. WebP: Talán a legsokoldalúbb az összes kép közül formats, a WebP egyre elterjedtebb, mivel erősebb tömörítést és minőséget kínál, mint a JPEG és a PNG, valamint a PNG átláthatósági előnyeit. Arról nem is beszélve, hogy WebP-vel is lehet animációkat készíteni. Fontolja meg a WebP használatát minden típusú képhez Shopify. Reméljük, hogy a jövőben gyakrabban fogjuk használni a WebP-t az interneten.

Eltérő, Shopify támogatja formatolyan, mint a HEIC, a progresszív JPEG és az AVIF. HEIC a kép format az Apple eszközökön használt szabvány. Rendkívül kompakt, több képet is tartalmazhat egy képen, és kiváló minőséget biztosít. Azonban nem kompatibilisek a legtöbb nem Apple-eszközzel, ezért nehéz ajánlani. Az AVIF kép format meglehetősen erős előnyökkel rendelkezik a kiváló minőség és a drámai tömörítési arány miatt. Röviden, az AVIF-fel való teljesítménynek erősebbnek kell lennie, mint a JPEG- és WebP-képekkel. Ez azonban eltart egy ideig desktop és a mobilböngészőket, hogy fájlként alkalmazzák format alapértelmezett. Szóval, most nem tudjuk ajánlani. Addig nem, amíg szinte mindenki, akinek internetkapcsolata van, valóban meg tudja nézni a képeket online.

Az alapján, hogy mire szeretné használni a képet, válassza ki a megfelelőt format felülről. Ezután lépjen a következő lépésre, hogy a képstílusok ugyanazok maradjanak a webhelyen.

2. lépés: Készítsen az összes fényképet azonos stílusban

A folytonosság kulcsfontosságú az e-kereskedelemben a fényképezéshez. Megalakítja a márka általános megjelenését, és szabványos hangulatot teremt az egész webhelyen.

Például gyakori, hogy a márkák egy háttérszínt használnak az összes termékképhez.

szabványosított stílusok

Ez vonatkozik a képek méretére és stílusára is. Ha a legtöbb termékképe fekvő tájolású, ne keverjen néhány fotót fekvő tájolással. Szívesen beépítheti az életmód- és termékfotókat is a keverékbe, de a legjobb, ha a felvételek többségénél egy stílust választ.

3. lépés: Készítsen keveréket termék- és életmódfotózásból

Amint már említettük, valószínűleg egyfajta fényképezési stílust szeretne használni termékfotói többségénél. Mindazonáltal elengedhetetlen, hogy a szabványos termékfotókat kiegészítse néhány életstílus-fotó fekete-fehér háttérrel és a termékek eltérő nézetével.

Shopify képméret életmód fotókkal

Az e-kereskedelmi vállalkozások hátránya, hogy az ügyfelek nem tudják felpróbálni vagy megérinteni a termékeket ott. Itt jönnek képbe az életmódfotók. A felhasználók láthatják, hogyan néznek ki a termékek működés közben. Hogyan terül el egy ing a testen, vagy akkora, mint egy gördeszka, és valaki valóban áll rajta.

4. lépés: Válassza ki a megfelelő fájlneveket és címeket

Minden képfájlnak van neve és Shopify felveszi a fájlnevet, és közzéteszi a webhely metaadatai között (minden e-kereskedelmi platform ezt teszi).

Tehát, ha a fényképeket másként menti új-fotó(1).jpg számítógépén, és töltse fel őket az üzletébe, a keresőmotorok nem fognak bejutniformation a fotó tartalmáról. Ez árthat a SEO-nak.

A képek optimalizálásakor kövesse ezeket a lépéseket, hogy a keresőmotorok (és a látássérültek) megértsék, mi történik a képen:

  1. Adjon hozzá egy fájlnevet, amely emlékeztet a képen belülre.
  2. Ha véletlenül általános fájlnevet tölt fel, módosítsa a képet Cím in Shopify. Ez leváltja az alapértelmezettet.
  3. Használjon alt címkéket a képen látható dolgok még erősebb megjelenítéséhez. A keresőmotorok ezeket a fő elemeket veszik figyelembe, mivel ez azt mutatja, hogy a látássérültek számára javult a felhasználói élmény.

5. lépés: A képek tömörítése a feltöltés előtt vagy közben

Shopify automatikus tömörítést kínál a szervereire feltöltött összes képhez, de nem szabad teljesen erre hagyatkozni.

A legjobb megoldás az, ha harmadik féltől származó eszközt használ a képek tömörítésére, mielőtt feltöltené őket ide Shopify, vagy telepítse a Shopify plugin amely automatikusan tömöríti a képeket feltöltéskor.

Sokkal egyszerűbb az alkalmazás útján haladni, de a legtöbbjük előfizetést igényel, így megértjük, ha a költségvetésben kell maradnia.

tömörítse a képeket egy alkalmazással

Néhány olyan alkalmazás, amely jól működik a képtömörítéshez:

Tesztelje ezeket az alkalmazásokat ingyenes próbaverzióikkal, hogy megértse, milyen jól tömörítik a képeket, és mennyire automatizált ez a folyamat az Ön számára. Ezt követően elkötelezheti magát az előfizetés mellett. Harmadik féltől származó eszközök esetén javasoljuk TinyPNG és a Image Resizer.

6. lépés: Vegye fontolóra az ingyenes képkereső alkalmazásokat

Bár erősen ajánlott, hogy az e-kereskedelmi márkák saját maguk készítsék el a fotóikat (ahelyett, hogy ingyenes alternatívákat keresnének, vagy a gyártó webhelyéről vennék le őket), az online áruháznak vannak olyan területei, amelyek alkalmasak ingyenes képekkel való használatra.

Például szükség lehet egy festői felvételre, amelyen valaki egy kanyon felett néz, kiegészítve egy blogbejegyzést. Másrészt, érdemes lehet fényképet használni egy hőskép háttereként, így a tényleges termékképet és leírást a háttér tetejére helyezheti.

Ilyen helyzetekben javasoljuk a Creative Commons licenccel rendelkező képoldalak némelyikének használatát:

Fontos kiemelni, hogy a Creative Commons licenc nem azt jelenti, hogy egyszerűen elkészítheti a képet, és felteheti a webhelyére. Időnként ez a helyzet, de minden képet ellenőriznie kell, hogy megbizonyosodjon arról, milyen jogai vannak a használatához.

Creative Commons példa Shopify képméret

Például a Creative Commons licence a következőket mondja:

  • Ha felhasználhatja a képet kereskedelmi vagy nem kereskedelmi célokra
  • Amikor az alkotót kell elismerned, vagy ha egyszerűen ajánlott, tedd meg
  • Ha bármilyen módon módosíthatja a képet

Ezen kívül rengeteg ingyenes képszerkesztő alkalmazás áll rendelkezésre, amelyekkel egy fillér fizetése nélkül átveheti az irányítást az átméretezés, a szűrők és a vágás felett:

Azt javasoljuk:

7. lépés: Futtassa az A/B tesztelést a legjobb képek kiderítéséhez és Formats

Miután megfelelő fájlneveket adott fényképeinek, átméretezte őket, levágta őket, és eldöntötte, melyik a tökéletes format és mérete, ideje megnézni, hogyan néznek ki az üzletében.

Szerencsére nem szabad összetenni az ujjait, és remélni, hogy a képek a legjobbak a konvertáláshoz. Lehetősége van ugyanazon képek több változatának feltöltésére a termékoldalakra, a céloldalakra és a kezdőlapokra, majd megtekintheti, hogy melyik teljesít a legjobban a konverziók tekintetében.

Mindkét Téma tudós és a Shogun A/B tesztelési funkciókat kínál a készüléke több részéhez Shopify tervezés.

Az A/B tesztelésben az a nagyszerű, hogy a kísérletnek soha nincs vége. Lehetővé teszi, hogy szemmel tartsa webhelye minden aspektusát. Kicserélheti azokat a képeket, amelyek idővel veszítenek lendületükből, és több tesztet is futtathat egy időtartam alatt.

Shopify Képméret-útmutató: Következtetésünk

Ragaszkodva square A képek az egyik módja annak, hogy az e-kereskedelmi fotók körbevágatlanok maradjanak. Azonban előfordulhat, hogy ez a szabály nem mindig igaz, ha Önről van szó Shopify téma.

Ezért azt javasoljuk, hogy több méretű képet töltsön fel a termékekhez, gyűjteményekhez és szalaghirdetésekhez, hogy megértse, mit tud a legjobban kezelni a témája. Egyébwise, szeretjük a 2046 × 2046 pixeles szabványt. A szalaghirdetések, logók és diavetítések esetében azonban érdemes a cikkben fent említett konkrétabb méreteket használni.

Kérjük, tudassa velünk az alábbi megjegyzésekben, ha bármilyen magyarázatra van szüksége ezzel kapcsolatban Shopify képméretek!

Joe Warnimont

Joe Warnimont chicagói író, aki az e-kereskedelmi eszközökre, a WordPressre és a közösségi médiára összpontosít. Amikor nem horgászik vagy jógázik, bélyegeket gyűjt a nemzeti parkokban (bár ez főleg gyerekeknek szól). Tekintse meg Joe portfólióját felvenni vele a kapcsolatot és megnézni a múltbeli munkáit.

Hozzászólások 0 válaszok

Hagy egy Válaszol

E-mail címed nem kerül nyilvánosságra. Kötelező kitölteni *

Értékelés *

Ez az oldal Akismet-et használ a levélszemét csökkentése érdekében. Ismerje meg, hogyan dolgozik a megjegyzésed.

Megpróbál Shopify 3 hónapig 1$/hó áron!