Сізде де осындай жағдай болған шығар. Shopify сайтында өнім беті жылтыратылған көрінеді, фотосуреттер редакторда анық көрінеді, содан кейін мобильді құрылғыларға кірушілер секіре бастайды, ал PageSpeed көрсеткіші алпысыншы жылдары тұрақсыз болады. Мәселе әдетте «жаман дизайнда» емес. Мәселе сурет файлының өлшемдерінің орналасуы үшін тым ауыр болуында және сатып алушы өнімді, бағаны немесе «себетке қосу» түймесін көргенге дейін әрбір қосымша байт өтуі керек.

Сондықтан дүкен витринасындағы кескін шешімдері ешқашан тек дизайн шешімдері ғана емес. Олар бет жылдамдығына , визуалды сапаға және Google беттің қаншалықты тез сканерлеп, көрсете алатынына әсер етеді. Егер сіз болжам жасамай өлшемін өзгертудің практикалық қысқа жолын қаласаңыз, Яссин Малтидің кескін өлшемін өзгерту бойынша нұсқаулығы пайдалы көмекші болып табылады, себебі ол келесі топтаманы жүктемес бұрын механиканы түсінуге көмектеседі.

Мазмұны

Shopify дүкенінде сурет файлының өлшемдері неге маңызды?

Сатушы Shopify әкімшісінде өңделген өнім бетін қарап, негізгі мәселені байқамай қалуы мүмкін. Бет ноутбукта Wi-Fi арқылы жақсы көрінуі мүмкін, содан кейін мобильді құрылғыда жұмыс істей бастауы мүмкін, басты сурет кеш пайда болады және сатып алушы бет дайын болғанша бетті айналдырып жібереді. Жақсы көрінетін бет пен жылдам жүктелетін бет арасындағы алшақтық - сурет файлының өлшемдері келудің кіріске айналатынын немесе үйкеліске айналатынын анықтайды.

Әр беттегі жасырын бәсекелестік

Дүкендегі әрбір сурет көшірмемен, сценарийлермен, схемамен және тұтынушының шыдамдылығымен бәсекелеседі. Егер басты фотосурет тым үлкен болса, ол өткізу қабілеттілігін жеп қана қоймай, келушінің ұсынысты бағалай алатын сәтін баяулатады. Суреттің салмағы - конверсия сұрағы және бір уақытта Core Web Vitals сұрағы.

Shopify саудагерлері мұны әдетте алдымен өнім беттерінде және коллекция беттерінде сезінеді. Бірнеше үлкен фотосуреттер, әсіресе мобильді желілерде, бүкіл макетті ауырлатуы мүмкін, және бұл салмақ ең маңызды жерлерде, кейіпкерде, коллекция торында, өнім масштабында және миниатюраларда көрінеді. Кейіпкер суретінің миниатюрадан басқаша жұмысы бар, сондықтан ол бірдей файл өлшемі жүктемесін көтермеуі керек. Бұл коллекция торларына да қатысты, мұнда қайталанатын суреттер тез жиналып, әрбір айналдыруды қиындатады.

Сурет файлының өлшемі беттің қаншалықты тез пайдалануға болатынына да әсер етеді, сондықтан ол орналасуды жоспарлаумен бірдей талқылауға жатады. Шикі сурет өлшемдері маңызды, бірақ жеткізілетін файл өлшемі браузердің алуы және декодтауы керек нәрсе. Яссин Малтидің сурет өлшемін өзгерту нұсқаулығында түсіндірілгендей, кішірек экспорттау суреттің визуалды рөлін сақтай алады, сонымен бірге қажетсіз салмақты алып тастайды.

Практикалық нәтиже

Мұның маңыздылығының себебі қарапайым. Негізгі пиксель саны бастапқы сызықты белгілейді, ал сығымдау мен пішім файлдың соңғы өлшемін анықтайды. 24 биттік RGB форматындағы 24 мегапиксельді кескінде шамамен 72 миллион байт шикі пиксель деректері бар, ал сол кескін экспорттау таңдауларына байланысты 100% сапамен JPEG ретінде шамамен 423,41 КБ немесе JPEG 90% сапамен шамамен 211,7 КБ болуы мүмкін ( Scantips ). Осы айырмашылық екі дүкеннің бірдей көрінетін және жылдамдық нәтижелері өте әртүрлі суреттерді пайдалана алуының себебі болып табылады.

Тәжірибелік ереже: Егер сурет безендіруден гөрі сату үшін маңыздырақ болса, оны жүктемес бұрын оған файл өлшемін көрсетіңіз.

Бұл саудагерлер қолдануы керек стандартты нәрсе. Әрбір дүкен ұяшығына бюджет белгілеңіз, содан кейін файлды тапсырмаға сәйкестендіріңіз. Батырлық баннер нобайға қарағанда көбірек салмақты ақтай алады, бірақ екеуі де беттің қалған бөлігін қосымша жүк көтеруге мәжбүрлемеуі керек. Бұл әдет қалыптасқаннан кейін, өнім беттерін басқару оңайырақ болады және әрбір жаңа жүктеу тағы бір жасырын сүйреуге айналмай, сәйкес келетін орынға ие болады.

Кескін өлшемі және файл өлшемі және екеуі де неге маңызды

Саудагерлер бұл терминдерді көбінесе бірдей мағынада қолданады, содан кейін суреттің әкімшіде жақсы көрініп, бірақ витрина жұмысын баяулататынына таң қалады. Сурет өлшемі - пиксель өлшемдері, ені мен биіктігі. Файл өлшемі - экспортталған файлдың дискідегі байттармен өлшенген салмағы, әдетте КБ немесе МБ, және ол сығымдауға, пішімдеуге және бит тереңдігіне байланысты өзгереді. Екі сурет бірдей өлшемдерді бөлісе алады және жүктеу шығындары өте әртүрлі болуы мүмкін.

Сандық фотография мен графика үшін пиксельдегі кескін өлшемін байттағы файл өлшемімен салыстыратын диаграмма.

Пиксельдер төбені орнатады

Пиксельдер файлдың қанша визуалды бөлшектерді сақтай алатынын анықтайды. 24 биттік RGB форматындағы 24 мегапиксельді кескінде шамамен 72 миллион байт шикі пиксель деректері бар, себебі 24 миллион пиксель × пиксельге 3 байт = 72 000 000 байт . Бұл шикі сан экспорттау үшін бастапқы нүкте болып табылады, браузер алатын соңғы салмақ емес.

Экспорттау опциялары нәтижені тез өзгертеді. Бірдей бастапқы фотосурет JPEG форматында 100% сапада шамамен 423,41 КБ және JPEG форматында 90% сапада шамамен 211,7 КБ өлшемінде шығарылуы мүмкін. Пиксельдер өзгеріссіз қалады, ал экспорттау бастапқы детальдардың азын-аулақ бөлігін сақтайды.

Сығымдау және пішімдеу нәтижені анықтайды

Көптеген Shopify аудиттері мұнда басқаша әрекет етеді. Саудагерлер үлкен кескін веб үшін тым ауыр болуы керек деп есептейді, бірақ өлшемдері мен файл салмағы бөлек шешімдер болып табылады. Үлкен өлшемді кескін жақсы экспортталса, ол әлі де лайықты файл бола алады. Қарапайым көрінетін графика дұрыс емес форматта немесе дұрыс емес сапада сақталса, үлкейіп кетуі мүмкін.

Бұл айырмашылық дүкеннің рөліне байланысты маңызды. Батырлық баннер нобайға қарағанда көбірек визуалды салмақты көтере алады, бірақ коллекциялық тор кескіні беттің таза жүктелуі үшін жеткілікті жарық болып қалуы керек. Өнімнің масштабтау суреттері жақын ұстау үшін жеткілікті пиксельдік детальдарды қажет етеді, ал нобай ұяшықтары әдетте экспорт макет көрсете алатыннан әлдеқайда көп детальды сақтаса, өткізу қабілеттілігін жоғалтады.

Негізгі ереже: Пиксельдер кескіннің қанша визуалды бөлшектерді көрсете алатынын орнатады. Файл өлшемі сатып алушының қанша жүктеп алуы керектігін орнатады.

Бұл екі санды бөлек ұстаңыз, сонда кескінді жоспарлау оңайырақ болады. Тар нобай ұяшығы үлкен өлшемдерден пайда көрмейді. Өнім бетіндегі масштабтау кескінінің анық көрінуі үшін жеткілікті пиксельдер қажет, бірақ экспортталған файл Core Web Vitals және оның айналасында жүктелуі керек беттің қалған бөлігі үшін әлі де қолайлы болып қалуы керек.

JPEG, PNG, WebP және AVIF салыстырылды

Әрбір кескін форматы Shopify дүкенінде әртүрлі мақсатқа қызмет етеді. Өнімнің фотосуреті, логотипі және скриншоты бірдей тақырыпта болса да, әртүрлі өңдеуді қажет етеді. Пішімді кескіннің әдеттегі емес, беттегі жұмысына негіздеп таңдаңыз.

JPEG, PNG, WebP және AVIF кескін форматтарын олардың мүмкіндіктері мен пайдалану жағдайларымен салыстыратын инфографика.

JPEG және PNG әлі де өз орнын алады

JPEG фотосуреттер үшін стандартты таңдау болып қала береді. Ол жақсы қысылады, барлық жерде дерлік жұмыс істейді және әдетте өнімнің кескіндерін веб үшін жеткілікті түрде ашық ұстайды. PNG өткір жиектерді, тегіс түсті, мөлдірлікті немесе мәтінді қажет ететін кескіндерге сәйкес келеді, сондықтан файлдар әдетте ауыр болса да, логотиптер мен пайдаланушы интерфейсінің графикасы көбінесе сол жерде болады.

Shopify-да бұл екіге бөлінеді, себебі дүкендер әдетте екі түрлі активтерді араластырады. PNG форматында сақталған өмір салтының фотосуреті әдетте дүкен сөресіне қажет салмақтан ауыр болады. JPEG форматында сақталған логотип кедір-бұдыр көрінуі немесе мөлдірлігін жоғалтуы мүмкін, бұл кейінірек тазалаудан аулақ болуға мүмкіндік береді. Пішім әдеттегідей емес, жұмысқа сәйкес келуі керек.

Коллекция картасы жақсы мысал бола алады. Егер сурет таза өнімнің суреті болса, JPEG әдетте сатып алушылардың көру қабілетіне зиян келтірмей, салмағын азайтады. Егер актив түрлі-түсті фонның үстінде тұрған белгі, белгіше немесе логотип болса, PNG жиектерді жақсы қорғайды және жағымсыз галолардан аулақ болады.

WebP және AVIF файл өлшемдерін кішірейтеді

Қазіргі форматтар әдетте файл өлшемін одан әрі кішірейтеді. Мысалы, салыстырмалы сападағы кескін үшін JPEG форматының 75%-ы шамамен 1,25–1,53 МБ , WebP форматының жоғалуы шамамен 0,72–0,88 МБ , AVIF форматы шамамен 0,57–0,69 МБ және JPEG XL форматы шамамен 0,55–0,67 МБ құрайды ( W3Techs ). Бұл ескі экспорттау әдеттерінен айтарлықтай төмендеу және көптеген дүкен сөрелері фотосуреттерді жұмсақ етіп көрсетпей салмақты азайта алатынын түсіндіреді.

Мәселе мынада, форматты таңдау әлі де мазмұнның өзіне байланысты. WebP және AVIF өнімді фотосуретке түсіру үшін өте жақсы жұмыс істей алады, бірақ мөлдірлігі бар графика басқаша әрекет етуі мүмкін. Егер файл көбінесе фотосурет болса, сол кескінді тиімді түрде қысатын пішімді пайдаланыңыз. Егер ол логотип немесе мөлдірлігі бар графика болса, жиектерін таза ұстайтын пішімді пайдаланыңыз.

Shopify дүкенінде бұл әдетте кейіпкер баннері үшін бір форматты, логотип үшін басқа форматты және жақыннан түсірілген өнімдер үшін басқа форматты білдіреді. Дұрыс таңдау - заманауи көрінетін нәрсе емес, беттің жылдам болуын қамтамасыз ету және суретті нақты орнында анық көрсету.

Шешім ережесі: Адамдармен, өнімдермен немесе текстурамен суретке түсіріңіз, JPEG немесе WebP таңдаңыз. Жалпақ графика, логотиптер немесе скриншоттар үшін PNG таңдаңыз. Егер жұмыс процесі резервтік көшірмені қолдай алса, AVIF немесе WebP - ең таза тірі сақтау нұсқасы.

Ажыратымдылық пен сығымдау сандарды қалай өзгертеді

Файл экранда жақсы көрінуі мүмкін, бірақ қажетінен әлдеқайда ауыр болуы мүмкін. Shopify-да сатушылар бұл бірінші кезекте сезінетін нәрсе, себебі сол сурет батыр баннері, коллекция торының плиткасы, өнімнің масштабтау суреті немесе кішкентай нобай сияқты мүлдем басқаша әрекет етуі мүмкін. Ажыратымдылық браузерден қанша пиксельді алып жүруді сұрайтыныңызды басқарады, ал сығымдау бет жүктелмес бұрын сол салмақтың қанша бөлігі кесілетінін басқарады.

Көбірек пиксельдер көбірек деректерді білдіреді

Үлкенірек кескін жай ғана үлкенірек кенеп емес, ол браузер өңдейтін шикі деректер. Бұрын көрсетілгендей, 24 мегапиксельді кескінде қысу басталғанға дейін шамамен 72 миллион байт шикі деректер болады . Егер сіз бірдей көріністі дүкенге қажетті пиксель санынан жоғары экспорттасаңыз, фотосурет көрсетілгеннен кейін бірдей көрінсе де, файл ауырлай түседі.

Сондықтан тым үлкен экспорттау сақтау орнының бітелуінен де көп нәрсені тудырады. Олар тасымалдау салмағын арттырады, браузердің жұмысын қиындатады және сатып алушылар беттің жылдам көрінуін күтетін жерде кескіннің жылдамдығын баяулатуы мүмкін. Коллекциялық тор плиткасы масштабталатын өнім кескіні сияқты бірдей пайдалы жүктемені қажет етпейді, ал нобайға екеуіне қарағанда әлдеқайда аз қажет.

Сығымдау сізді үнемдейді, бірақ қосымша пикселдерді босатпайды

Сығымдау үлкен бастапқы файлды Shopify тиімді қызмет ете алатын деңгейге дейін төмендетуі мүмкін, бірақ ол орналастыру қажет ететіннен көп пиксельді пайдалану құнын жоймайды. Егер өнімнің фотосуреті масштабтау мүмкіндігі бар галереяға жіберілсе, жақсы экранда анық болып қалу үшін жеткілікті бөлшектер қажет. Егер дәл сол сурет тек коллекция картасына жіберілсе, толық өлшемді нұсқасын жеткізу - бұл босқа кеткен күш.

Ойлаудың қарапайым тәсілі. Пиксельдер қалдықтардың ең төменгі деңгейін белгілейді , себебі үлкен өлшемдер болдырмауға болатын салмақты тудырады. Сапа параметрі үнемдеу үшін шекті деңгейді белгілейді , себебі ол экспортта қанша бөлшектер сақталатынын анықтайды. Пішім бұл қысудың қаншалықты көмектесетінін басқарады , себебі әртүрлі файл түрлері бірдей кішіреймейді.

Shopify пайдалану жағдайларына байланысты кескін өлшемін таңдау бойынша нұсқаулық үшін осы Shopify кескінін SEO нұсқаулығы пайдалы көмекші болып табылады. Ол әрбір витрина кескінін бірдей жұмыс атқаратындай етіп қарастырудың орнына, экспорттау туралы шешімді нақты орналастырумен байланыстыруға көмектеседі.

Батырдың суреті, коллекциялық плитка және нобайдың барлығы әртүрлі деңгейдегі мәліметтерді талап етеді. Бұл сатушылар әдетте жіберіп алатын бөлік, сондықтан ажыратымдылықтағы шағын өзгеріс редакторда зиянсыз болып көрінуі мүмкін, ал браузерде дүкен ауырлау болады.

Негізгі веб-маңызды көрсеткіштер және ауыр суреттердің SEO құны

Ауыр суреттер SEO-ға тікелей зиян келтіреді, себебі Google жүктеудің артындағы ниетті емес, тәжірибені өлшейді. Көптеген Shopify беттерінде ең үлкен көрінетін сурет жүктеу тәжірибесін басқаратын нәрсе болып табылады. Егер бұл сурет тым ауыр болса, Largest Contentful Paint баяулайды және келуші бет пайдалануға жарамды болып көрінгенше ұзағырақ күтеді.

Кескін файлының өлшемін арттырудың ең үлкен мазмұнды Paint бетінің жүктелу уақытына қалай кері әсер ететінін көрсететін бағаналық диаграмма.

LCP әдетте дұрыс емес нәрсе үшін кінәланады

Саудагерлер көбінесе алдымен қолданбаларды, сценарийлерді немесе тақырып кодын кінәлайды, кейде олар дұрыс айтады. Бірақ кейіпкердің суреті көбінесе ең оңай жеңіс болып табылады. Үлкен кейіпкердің суреті беттің мағыналы болуын тоқтата алады, әсіресе мобильді құрылғыларда, себебі байланыс сапасы әртүрлі және қарау терезесі шамадан тыс үлкен активтерді оңай байқауға болатындай кішкентай.

Кескін салмағына әсер ететін тағы бір көрсеткіш - жиынтық орналасу өзгерісі . Егер тақырыбыңыз кескіндер үшін орынды дұрыс сақтамаса, активтер жүктелген кезде орналасу секіреді. Бұл сатып алушыларға ұқыпсыз болып көрінеді және бетті пайдалануды қиындатады. Shopify тақырыптары көбінесе бұл жұмыстың бір бөлігін жасайды, бірақ сатушыны нашар кескін жұмыс процесінен құтқару үшін әрқашан жеткіліксіз.

Өлшем нысаналары кездейсоқ емес

Веб-жеткізілімге арналған техникалық нұсқаулықта өнім фотосуреттерінің өлшемі 800-ден 1000 пиксельге дейін және 80-нен 150 КБ-қа дейін , басты суреттердің өлшемі 200 КБ- тан аз, ал жалпы бет кескінінің бюджеті 500 КБ- тан аз болуы керек деп көрсетілген. Сол нұсқаулықта JPEG файлдары көбінесе 200-ден 600 КБ-қа дейін , WebP файлдары 150-ден 450 КБ-қа дейін , AVIF файлдары 80-нен 300 КБ-қа дейін және PNG файлдары 500 КБ-тан 3 МБ-қа дейін болуы керек ( Vizua ). Бұл диапазондар суреттің салмағы мен бет өнімділігі бір-бірімен байланысты болғандықтан бар.

Беттің жылдам болуы үшін жасанды түрде кішірейтілуі міндетті емес. Оны тәртіпке келтіру керек. Егер сіздің суреттеріңіз тым көп болса, сіз браузердің сатып алушының тәжірибесін жақсартпайтын жұмыс істеуіне себеп боласыз. Бұл теориялық емес, тікелей SEO шығыны.

Shopify-ға бағытталған кең аудит процесі үшін Shopify-ға арналған бұл кескін SEO нұсқаулығы пайдалы анықтамалық нүкте болып табылады.

Shopify орналастыруы бойынша мақсатты сурет файлының өлшемдері

Болжауды тоқтатудың ең оңай жолы - дүкен витринасындағы әрбір визуалды рөл үшін файл өлшеміне арналған бюджетті белгілеу. Батырлық баннер нобайдан басқаша жұмыс істейді, ал коллекциялық торды масштабтауға болатын өнім кескінімен бірдей салмақта экспорттауға болмайды. Сатушылар нақты орналастыруларға сурет файл өлшемдерін тағайындағаннан кейін, дүкенді жылдам сақтау және аудиттеу әлдеқайда оңай болады.

Экспорт таңдауларыңызды дүкеннің орналасуына байланысты анықтаңыз

Толық ендік кескіндер әдетте кішкентай орналасу блоктарына қарағанда көбірек орынды қажет етеді. Бейімделгіш кескін нұсқаулығы әдетте 1600 пиксель және 200-ден 300 КБ-қа дейінгі толық ендік кескіндерді, 800 пиксельге жақын 25%-дан 50%-ға дейінгі кішірек орналасу кескіндерін және жоғары тығыздықтағы экрандарда әлі де анық көріну үшін дисплей кеңістігінің шамамен 2 есе үлкен кескіндерді көрсетеді. Іс жүзінде бұл бір бастапқы фотосуреттің көбінесе әртүрлі экспорттауды қажет ететінін білдіреді, біреуі ол толтыратын орын үшін, ал екіншісі тығыз экран күтетін айқынырақ кескін үшін.

Shopify орналастыруы бойынша сурет файлының өлшемінің мақсаттары Орналастыру Мақсатты ені Мақсатты файл өлшемі Ұсынылған формат
Батыр туы Беттің жоғарғы жағындағы кейіпкер Шамамен 1600 пиксель 200-ден 300 КБ-қа дейін JPEG немесе WebP
Жинақ торының нобайы Коллекциялық плиткалар Шамамен 400-ден 600 пиксельге дейін 40-тан 80 КБ-қа дейін JPEG немесе WebP
Өнім бетінің фотосуреті Негізгі өнім галереясы Шамамен 800-ден 1200 пиксельге дейін 100-ден 200 КБ-қа дейін JPEG, WebP немесе AVIF
Нобай немесе үлгі суреті Кішкентай тірек ұяшығы Шамамен 200-ден 400 пиксельге дейін Мүмкіндігінше жеңіл ұстаңыз JPEG немесе PNG, мазмұнға байланысты

Батырдың суреті көбірек салмақ көтере алады, себебі ол қарау терезесінің көбірек бөлігін толтырады. Ал коллекциялық плитка толтыра алмайды. Сатушылар Shopify бөлімдеріне суреттерді экспорттаған кезде осы айырмашылықты есте ұстауы керек, себебі файл өлшемі суреттің беттегі орнымен сәйкес келуі керек.

Неліктен бір суретке бірнеше экспорт қажет болуы мүмкін

Өнім беті көбінесе бір файлдың бірнеше нұсқасын жауап беретін белгілеу арқылы ұсынады. Бұл қалыпты жағдай. Браузер кішірек экрандар үшін кішірек файлды, ал үлкенірек файлды тек орналасу қажет болған жағдайда ғана алуы керек. Бұл орнату әрбір келушіге қажетсіз көлемді жібермей, масштабтау сапасын сақтайды.

Дәл осындай логика өнім галереясынан тыс жерлерде де қолданылады. Дүкен витринасына көбінесе басты кейіпкер үшін бір өңдеу, коллекциялық карталар үшін екіншісі және жақыннан түсірілген суреттер үшін тағы бір өңдеу қажет. Егер сіз әлеуметтік желілер мен бөлісу активтерін дүкен визуалды материалдарымен үйлестіргіңіз келсе, Shopify әлеуметтік кескіндеріне арналған бұл нұсқаулық өнім бетінен тыс қажеттіліктерді бірдей кескін жұмыс процесіне байланыстыруға көмектеседі.

Shopify ережесі: Экспортты ұяшық шешсін. Батыр жомарт бола алады, ал тор нобайы жомарт бола алмайды.

Бұл ереже бір үлкен суретті жүктеп салып, тақырып оны реттейді деп үміттенудің жиі кездесетін қателігін болдырмайды. Тақырыптар көмектесе алады, бірақ олар экспорттау туралы дұрыс емес шешімді жоя алмайды.

Дүкендердің баяу жұмыс істеуіне әкелетін жиі кездесетін қате түсініктер

Shopify дүкендерінің көпшілігі баяу жұмыс істейді, себебі біреу жартылай шындыққа жанасатын ережеге сеніп, оны қайталай береді. Бұл әдеттер аудиттерде қайта-қайта көрінеді, әдетте кеңес бастапқыда ақылға қонымды болып көрінгендіктен және дүкеннің қалай жүктелетініне ешқашан тексерілмегендіктен. Әдеттен өнімділіктен ажыратқаннан кейін, түзетулер әдетте оңай болады.

Іштің кебуіне әкелетін бес сенім

  • Жоғары ажыратымдылық әрқашан жақсы сапаны білдіреді. Кескін толтыратын кеңістіктен үлкен болғаннан кейін бұл шындыққа жанаспайды. Қосымша пиксельдер сатып алушының көрінісі үшін ештеңе істемейді, олар тек салмақ қосады.
  • PNG әрқашан JPEG-ке қарағанда айқынырақ. PNG - қатты жиектері бар логотиптер мен графика үшін дұрыс таңдау, бірақ өнім фотосуреттері әдетте шығынсыз қосымша шығындарды қажет етпейді.
  • Shopify барлығын автоматты түрде оңтайландырады. Shopify кейбір жағдайларда көмектеседі, бірақ бастапқы жүктеу активтің қаншалықты ауыр болуы мүмкін екенін анықтайды.
  • WebP SEO-ға зиян келтіреді, себебі Google оны оқи алмайды. Бұл сенім ескірген. Іздеу жүйелері кәдімгі суреттер сияқты заманауи форматтарды көрсете алады.
  • Кескін өлшемі тек жұмыс үстелінде ғана маңызды. Мобильді сатып алушылар алдымен қажетсіз файл салмағын сезінеді, себебі олардың құрылғылары мен қосылымдарында қателіктерге орын аз.

Түзету саудагерлері бірден пайдалана алады

Түзету әдеттен емес, рөлден басталады. Батыр суреті беттің жоғарғы жағын ұстап тұру үшін жеткілікті сапаны қажет етеді. Тор таза жүктелуі үшін жинақ плиткасы жеңіл болып қалуы керек. Масштабтау кескіні басқа жұмысты атқаратындықтан көбірек мәліметтерді қамтуы мүмкін, ал нобай немесе үлгі орналасу мүмкіндік бергендей кішкентай болып қалуы керек.

Сондықтан әрбір сурет үшін бір экспорттау ережесі қиындық тудырады. Егер актив фотосурет болса, жылдамдық пен сенімді түс үшін экспорттаңыз. Егер ол мәтіні немесе мөлдірлігі бар графика болса, жиектерін қорғаңыз және файлдың үлкенірек болуы мүмкін екенін қабылдаңыз. Егер ол тар ұяшықта болса, толық ендік дисплейге арналған файлды жүктемеңіз.

Ажыратымдылық бөлімінде айтылғандай, 24 мегапиксельді кескін қысылғаннан кейін 2-ден 8 МБ-қа дейін түсірілуі мүмкін, бұл пиксель санының өзі кескіннің веб-сайтқа дайын екенін білдірмейтінін көрсетуге жеткілікті. Негізгі сұрақ - файлдың Shopify орналасқан жеріне сәйкес келуі. Кейіпкер тор картасынан артық нәрсеге шыдай алады, ал масштабтау кескіні нобайдан артық нәрсеге шыдай алады. Экспорттау рөлге сәйкес келуі керек.

Осыған ұқсас қателік - әрбір активті бірдей метадеректерді тазалауға лайық деп есептеу. Егер кескін көрсетілетіндей маңызды болса, алдымен аудит жүргізу маңызды. Жұмыс процесінің сол бөлігін біркелкі ұстау үшін Shopify кескіндері үшін балама мәтін генераторын пайдаланыңыз, содан кейін файл өлшемін ол толтыратын ұяшыққа сәйкес бағалаңыз.

Бұл көптеген дүкендерде жетіспейтін бөлік. Файлдың кішкентай болуы міндетті емес. Ол тиісті түрде болуы керек.

Келесі сурет жинағы үшін қайталанатын тексеру тізімі

Ең таза кескін жұмыс процесі - бұл сіздің командаңыз болжамай қайталай алатын жұмыс процесі. Бірдей тексерулер бірдей ретпен орындалған сайын, сіз аз көлемді жүктеулерді, аз орналасу тосынсыйларын және каталогта жасырынып жатқан баяу өнім беттерін аласыз. Егер сіз жаңа өнім түсірілімін дайындап жатсаңыз немесе тақырыпты жаңартсаңыз, кез келген нәрсе іске қосылмас бұрын топтаманы осы тәртіппен орындаңыз.

Shopify-ге сәйкес келетін қарапайым экспорттау тәртібі

  1. Орналастыру үшін мақсатты енге экспорттаңыз. Кейіпкердің, коллекция картасының, өнімнің масштабтау кескінінің және нобайдың әрқайсысының әртүрлі тапсырмалары бар, сондықтан бастапқы кескін мүмкіндік бергендіктен үлкенірек файлды жүктемеңіз.
  2. Рөл бойынша пішімді таңдаңыз. Фотосуреттер әдетте JPEG, WebP немесе AVIF форматтарына сәйкес келеді. Мөлдірлік немесе айқын жиектер маңызды болған кезде логотиптер мен мәтінге бай графика PNG форматына жақсырақ сәйкес келеді.
  3. Қажет болса, тікелей сақтау нұсқасын және масштабтау нұсқасын сақтаңыз. Масштабтау файлы көбірек мәліметтерді сақтай алады, бірақ көрінетін бет макетке қажет болмаса, мұндай салмақты көтермеуі керек.
  4. Мүмкіндігінше, жеңілірек заманауи форматты пайдаланыңыз. Тікелей кескін үшін WebP немесе AVIF пайдаланыңыз, ал үйлесімділік маңызды болған жағдайда JPEG форматын резервтік көшірме ретінде пайдаланыңыз.
  5. Жарияламас бұрын кескіннің метадеректері мен балама мәтінін тексеріңіз. Егер актив көрсетілетіндей маңызды болса, оны аудиттеу де маңызды. Жұмыс процесінің сол бөлігін біркелкі ұстау үшін RankEngine балама мәтін генераторын пайдаланыңыз.

https://rankengine.app сайтынан алынған скриншот

Қандай тұрақтылық сізді сатып алады

Каталогта шағын жақсартулар жинақталған. Бір ғана жеңіл кейіпкер бейнесі дүкенді өздігінен өзгерте алмайды, бірақ өнімнің жақсы өлшемді суреттерінің, коллекциялық плиткалардың және миниатюралардың жиынтығы дүкенді таза, жылдам және сатып алуды жеңілдете алады. Тұтынушылар файл өлшемдері туралы ешқашан айтпаса да, мұны байқайды.

Егер сіздің командаңыз кескін метадеректерін масштабта өңдесе, RankEngine-дің альтернативті мәтін генераторы әрбір жүктеуді қолмен жасалатын жұмысқа айналдырмай, жұмыс процесінің сол бөлігін қозғалыста ұстай алады.

Бұл тәртіпті келесі партияңызға қолданыңыз, сонда дүкеніңіз бірден жылдамырақ жүктеледі.