Google изображения – пълен Guide

Никола Минков е Founder & CEO на Serpact и има над 7 години международен опит в оптимизацията на търсещи машини. Фокусът му е върху Техническа оптимизация, изграждане на Content маркетинг стратегии, планиране и прогнозиране на цялостни кампании по SEO, създаване на стратегии за управление на SERP резултати.

---

Google images е вариант за търсене на различни типове визуално съдържание в търсачката. Потребителите имат възможност да намират нужната информация с по-широк контекст около изображенията чрез различни функции, които Google публикуваха през последните години. В днешно време имаме възможност още в резултатите в Google изображения да видим достатъчно полезна информация, което да ни ориентира дали да извършим действие в самите резултати или не.

? СЪДЪРЖАНИЕ:

---

1. История на Google Images
2. Аутопсия на Google Images към 2019 година
3. Първа е винаги заявката (търсене в Google Images)
4. Използване на категории в Google Images
5. Използване на инструменти в Google изображения
6. Оптимизация на Google изображения
7. Оптимизирайте заглавията на изображенията
8. Потребителско преживяване (UX)
9. Какъв да е размерът на файла – оптимизация на скорост
10. Оптимизирайте Alt таговете на снимките предварително
11. Използвайте правилните формати в точните ситуации
12. Структурирани данни
13. Помогнете на Google да открие вашите изображения
14. Заключение

? Вижте и тези ТОП 25 приложения за премахване на дефекти и разкрасяване на снимките, лицето и тялото ви – за Инстаграм и Фейсбук сторита.

? История на Google Images:

Google Images е собственост на Google Inc., която пък е част от Alphabet Inc. В зората на Google през 2000 г. резултатите са били сведени до страници с текстове.

Google Images е пуснат на 12 юли 2001 г. поради големия брой търсения на снимки на Дженифър Лопес и прословутата “зелена рокля на Versace”. Темпото на нарастване на индексирани изображения е забележително, вижте колко:

• до края на 2001 г. общият брой индексирани изображения в Google достигат 250 милиона
• до 2005 г. над 1 милиард
• до 2010 г. над 10 милиарда
• към днешна дата се предполага, че има над 50 милиарда индексирани изображения (неофициални данни)

Хронология на големите промени:

• През 2009 г. е внедрена функция за разпознаване на подобни изображения.
• През 2010 г. е добавена функция, чрез която при преминаване на мишката през изображението се визуализира допълнителна информация.
• В началото на 2011 г. Google добавя нова актуализация за филтриране на изображения според схема от категории.
• Към края на 2011 г. е добавена опция да се търси чрез upload на друго изображение или директно чрез добавяне на url адрес.
• През 2012 година е въведен нов алгоритъм, който има за цел да филтрира резултати неподходящи за непълнолетни. Все пак при търсене на фрази, свързани директно с подобни заявки, такива резултати се показват в търсачката за изображения.
• Една от последните големи промени е от февруари 2018 година, когато интерфейсът беше променен за последно, за да се уреди партньорство със Getty Images (доставчик на стокови изображения). Промяна засяга опцията да се изтеглят изображения директно от Google Images. Така Google стимулира потребителите да влизат в източника генерирал резултата, което е и собственик на изображението (ще обясним по-долу в материала, защо не винаги авторът на изображението се показва сред първите резултати в Google Images). Също така бутонът за “Авторски права” е бил увеличен, за да стане по-видим за потребителите.

Аутопсия на Google Images към 2019 година

За да бъде полезен този материал на читателите на LifeHack, ще се опитаме да направи кратка архитектура на всички възможности в Google Images. Съществуват два url адреса, чрез които може да достъпите Google изображения:

• https://www.google.com/imghp?hl=bg
• https://images.google.com/

Няма официална документация, която да обяснява причината за двата адреса, но ако направите търсене в google.com, и натиснете бутона “изображения” ще забележите, че този бутон води към едни и същи резултати както през google.com/imghp и images.google.com. Ако обаче превключите от google.com ще забележите, че Google ще ви отведе до google.com/imghp. От друга страна в патент на Google с име “Cascading cluster collages: visualization of image search results on small displays” през далечната 2006 година се споменава основно images.google.com. Този патент на Google, има основна цел да унифицира и подготви търсачката за ерата на мобилни устройства, чрез така наречения алгоритъм k-means, който групира изображенията чрез k-tree с поглед към идващите смартфони. Ако искате да разберете повече за Google патенти прочетете тук.

Първа е винаги заявката

Ако искате да търсите в Google Images, трябва да въведете заявка (дума, фраза или израз), но както споменахме в историята на Google изображения има няколко промени, които ще демонстрираме сега.

Имаме 4 основни типа търсения за настолни устройства, както следва…

? Търсене чрез думи или фрази (стандартно)

Въвеждате фраза или дума в търсачката и натискате Enter или бутона за търсене. Например въвеждаме “Lifehack bg” и резултата е този. Все пак това е доста проста задача за Google и е очаквано да се справи лесно с нея.

? Търсене по URL адрес или чрез качване на изображение

Когато кликнете на този бутон, ще ви изскочи този Pop-up (вижте изображението долу) и ще имате следните възможности:

• Търсене чрез поставяне на URL адреса на изображението, което ви позволява например на добавите адрес на изображение от някой уеб-сайт и след това Google ще се опита да разпознае това изображение и на базата на него да ви поднесе релевантни резултати. Например правим търсене на това изображение.

Google ни показва резултат на изображението, което най-вероятно екипът на Lifehack е свалило от този сайт. Разбира се, това няма да се види с просто око от непрофесионалист, но все пак ние го забелязахме в самите резултати от тук.

• Търсене чрез качване на изображение ви дава възможност да качите (upload) дадено изображение и да намерите релевантни (подобни) резултати на вашето изображение или самото него, ако не е ваша собственост.

Първо трябва да превключите на “Качване на изображение”. След това качвате изображението, ние използвахме това (долу).

След като изображението се качи, което се случва сравнително бързо  (зависи от големината му) ще ви се появят подобни резултати. Както се вижда Google е достатъчно умен, защото тук се включват т.нар. невронни мрежи, които изследват релевантността на изображението и се опитват да разпознаят заявката.

Както е видно изображението в Lifehack няма: alt tag, нито заглавие, а и файлът е кръстен “релевантно”: 87987-332×143.jpg. Съответно Google няма избор освен да опита да анализира това изображение чрез невронната си мрежа по определени белези.

Това все пак не е много лесна задача, но резултатът е брутален, насладете се.

Основни белези на резултата са свързани с “Жокера” (ако сте гледали Батман), но е интересно, че екипът на Lifehack.bg нито един път не е споменал в статията си за “Лудите гении” думата “жокер”, дори и “батман”, дори проверихме по-далеч и няма споменаване на “филм” или “актьор”. Е, да си зададем въпроса: Колко умен е Google?

Отговорът на този въпрос се крие в дълбочината и начина на използване на невронните мрежи в алгоритъма на Google.

Наличието на Knowledge Graph (панела вдясно на изображението долу, което идва от Wikipedia) в резултата е белег на напълно разпознаване на същността спрямо intent (намерението) на потребителската заявка.

? Търсене чрез гласова команда (Voice Search)

След като кликнете на бутона “микрофон” ще ви се появи един Pop-up чрез, който Google ще иска разрешение от вас да използва микрофона ви за целите ви. След като му разрешите (иначе няма да може да ползвате услугата), ще ви се появи подобен панел.

Ако не успеете да кажете нещо в рамките на 8 секунди, ще ви се появи следния прозорец, който ви дава възможност да повторите заявката.

За тест използваме фразата “Последна публикация на Lifehack” и Google се опитва да разпознае речта ни, това се нарича “Google Speech-to-Text”, което пък е съвсем различна технология на Google. Резултатите, които получаваме отварят стандартния панел за търсене на изображения, който сме свикнали да виждаме.

Няма нищо учудващо в този резултат, освен че Google успя да разпознае български език и английски в една фраза, което е част от “Google Speech-to-Text” технологията.

Една клавиатура повече никога не е излишна

Google ни дава възможност да използваме клавиатура, чрез натискане на определения бутон за целта. Тази клавиатура е полезна ако искаме да търсим на определен език, но нямаме на клавиатурата на устройството си инсталиран съответния езиков пакет.

? Използване на категории в Google Images

Отново ще използваме “последни публикации от lifehack” линк към тази заявка.

Както виждаме в резултати има хоризонтален списък с категории, по които може да ги филтрираме. Това е удобна функция, но откъде Google предлага, кои да бъдат тези категории?

Вече установихме, че Google е достатъчно умен.

Тук търсачката прави изчисление на споменаването на фрази според различните типове документи (страници) във всички елементи: менюта, заглавия, body текст, връзки, вътрешни и външни връзки. На базата на това Google предлага този тип филтрация.

Ето и примерите, които ще покажем:

• Често споменаване на “Никола Тесла”, резултати вижте тук; Тук основен носител е статията на тема “Тайната на Никола Тесла”, която е носител на тези резултати; Може би ще ви направи впечатление, че категориите се променят при този резултат, ще обясним защо при следващия резултат.
• Често споменаване на “Facebook”, резултати вижте тук; Тук Lifehack.bg имат една супер статия на тема “22 Facebook трика”, която е основен носител на тези резултати; Тук напомняме, че категориите се променят при този резултат. Това не е случайно, защото Google се опитва да свърже новите категории на базата на филтрацията.

Ако искаме да разберем защо се наблюдават различни категории, трябва да погледнем малко по-дълбоко в свързаността на същностите по перифериите.

Както виждате имаме:

• Един тъмно зелен цвят на думите: facebook, фейсбук, apps; Това са директни фрази свързани с Facebook. Българският вариант на фейсбук е превод и често се търси така в Google. Думата apps е част и допълва търсенето след Facebook доста често.
• Един светло зелен цвят на думата: чат; Кой е най-известният чат на света? Това е “messenger”, а той е собственост на Facebook.
• Един жълт цвят на думите: админ, настройки; Често се срещат заявки като: как да настроя, как да направя админ – във Facebook. Е, това също се знае от Google.
• Един светло червен цвят на думите: виждат, скрия, вижда; Това вече са фрази по абсолютната периферия, те не са директно свързани със заявки в комбинация на Facebook, но участват в редица документи (страници) като използвани фрази, например: “за да се скриете от Facebook” или “дали Facebook ни вижда”.

Ако помните първоначалната ни заявка е “Последни публикации на lifehack”, обаче категориите, по които Google ни предлага да филтрираме са такива, които предоставят публикации на повече от 2 и 4 години. Тук Google не прихваща интента в категориите за думата “последна” и я пренебрегва, но предлага такива според интереса на потребителите. От друга страна, при търсения в Google свързани с Facebook ще забележите, че сайтът на Lifehack.bg има мнго добра видимост. А, конкретно на заявка “Facebook трикове”, сайтът на Lifehack.bg се класира на топ позиция, вижте сами.

Използване на инструменти в Google изображения

Отново тестът ще е на тази заявка “последни публикации от lifehack”, който може да достъпите от тук.

Инструментите в Google изображения се разделят на няколко основни типа:

• Размер
• Цвят
• Права на ползване
• Тип
• Време
• Още инструменти, което включва “С показване на инструменти”

Размер

Този инструмент ви позволява да филтрите резултати си за:

• Всички размери (по подразбиране)
• Големи
• Средни
• Икони
• Точно – сами определяте размера
• Предварително зададени изображения по размери. Това е удобен инструмент, но в същото време ни дава доста ценна информация, освен че е полезен за потребителите. Ако някой потребител търси точно съотношение в размера на изображенията, а ние сме единствените които му го предлагат, то тогава възможността да класираме е значително по-висока и така ще спечелим трафик към уеб-сайта си.

Ето и списък с всички размери:

• 400×300
• 640×480
• 800×600
• 1024×768
• 2 МПкс (1600×1200)
• 4 МПкс (2272×1704)
• 6 МПкс (2816×2112)
• 8 МПкс (3264×2448)
• 10 МПкс (3648×2736)
• 12 МПкс (4096×3072)
• 15 МПкс (4480×3360)
• 20 МПкс (5120×3840)
• 40 МПкс (7216×5412)
• 70 МПкс (9600×7200)

Цвят

Тук имаме възможност да филтрираме по цвят, ето как:

• Всички цветове (по подразбиране)
• Пълноцветни
• Черно-бели
• Прозрачни
• Филтър по цветова гама

Права за ползване

Това е доста удобно ако не искате да попаднете под закона за авторско право на някоя държава или институция. Ето и самите възможности:

• Означени за повторно използване и възможност за промяна (по подразбиране)
• Означени за повторно използване
• Означени за повторно използване с нетърговска цел и възможност за промяна
• Означени за повторно използване с нетърговска цел

Тип

Тук може да се възползвате от филтрация според типа изображение:

• Всички типове (по подразбиране)
• Лица
• Снимки
• Графични колекции
• Скици
• Анимирани

Време

Това е много подходящо ако търсите архив или нещо актуално. Все пак едно е да търсите изображение на Дженифър Лопес от 2001 година и такова от 2019 година:

• Независимо кога (по подразбиране)
• Последните 24 часа
• Последната седмица
• Последния месец
• Последната година
• Конкретен период от време

Още инструменти

Тук нямате кой знае колко възможности, така че ви остава да изберете измежду:

• Всички резултати (по подразбиране)
• С показани размерти

Разлика между ? Мобилно и Декстоп ?

Умишлено до момента не сме дали пример или сравнявали мобилни и декстоп търсения на изображения. Причината е много проста.

На мобилно устройство сме в пъти по-ограничени и основната разлика идва в инструментите за филтрация, които всъщност не присъстват като такива в мобилното търсене на изображения, а са подредени в хоризонтална лента. Нека покажем как.

Както се вижда (на горното изображение), имаме инструменти и категории в хоризонтална лента, които могат да се слайдват с пръст наляво и да изберете подходящата за вас категория или инструмент за филтрация.

Категориите са идентични като на десктоп устройства, но нека проверим какво присъства от инструментите за десктоп в мобилно търсене:

• Най-нови. Това присъства само на мобилни устройства и е нещо като съкратена версия от десктопа по дата на търсене.
• GIF. Това е доста удобно и не присъства в десктоп.
• HD. Това е доста удобно и не присъства в десктоп.
• Продукт. Това е доста удобно и не присъства в десктопа, като ще го засегнем в секцията “Оптимизация на Google изображения”.
• По различни (най-често използвани) цветове (присъства на десктоп)
• Означени за повторно ползване (присъства на десктоп)
• Графични колекции (присъства на десктоп)

Оптимизация на Google изображения

Правилното SEO на изображения за уеб-сайт е нещо, което много собственици на бизнеси пренебрегват или дори подминават когато реализират сами своята SEO кампания. Неговото значение всъщност е ключово и спомага както за по-доброто класиране на вашия уеб-сайт в Google Images и Google Search, така и за репутацията на компанията ви пред вашите потенциални /реални/ клиенти.

Това изключително силно засяга и собствениците на онлайн магазини, които често смесват различни формати на снимки на случаен принцип или ъплоудват файлове с прекалено големи размери, което забавя зареждането на уеб-сайта значително.

В следващите редове ще засегнем най-важните аспекти при процесите на оптимизиране на изображенията за уеб-сайт, така че и търсачките да бъдат „приятелски“ настроени към тях и вашите клиенти/посетители. Преди да започнете процес по оптимизация на изображения ви препоръчваме да се запознаете с официалната документация на Google: “Най-добри практики на Google Images”.

Оптимизирайте заглавията на изображенията

Използвайте имена на файловете, така че да отговарят на съдържанието им и да бъдат разбрани от търсачките, тъй като търсещите машини обхождат не само текстовете на страниците, но и имената на изображенията.

Не забравяйте да включите в заглавието и ключовата дума, по която бихте искали да ви откриват – по възможност в началото на заглавието. Не включвайте обаче тази дума във всяка снимка на вашата страница, защото рискувате страницата ви да бъде понижена в класирането или дори да получите наказание за манипулиране на търсачките, поради претрупване на една и съща ключова дума /Keyword stuffing/!

Размерът има значение, дори и при оптимизация на изображенията

Както вече стана ясно, бързото зареждане на сайта е от съществено значение, както за потребителите, така и за търсачките. Никой не харесва бавно зареждащи сайтове, нали?

Представете си сега как големите и тежки снимки или графични елементи се зареждат на телефон и таблет? Често се е случвало да се дразните, че даден сайт не ви се зарежда изцяло, нали? Доста често проблемът с бавното зареждане идва точно от големия файлов размер на снимките и тоталната липса на оптимизирани изображения.

Основното правило тук е: колкото по-малко толкова по-добре, но не за сметка на качеството. Съществуват редица инструменти за корекция на файловия размер на изображенията, без тяхното качество да бъде засегнато.

Разбира се, най-доброто решение е да използвате софтуерният лидер за обработка на снимки. За целта може да се насочите към Photoshop и неговата команда “Save for web” от менюто File, но не всеки е запознат технически със спецификата на различните формати изображения, както и с интерфейса и функционалността на Photoshop. Затова може да използвате друга услуга, като тези на Tinypng.com или compressor.io.

Потребителско преживяване (UX)

Едно от големите предимства, които вашите изображения дават на съдържанието е, че те го правят по-привлекателно, удобно и разбираемо за потребителя.

Разбира се, всяко изображение трябва да бъде съобразено и за мобилни устройства, за да не се получи обратен ефект.

В контекста е ключът

Поставяйте изображенията близо до релевантния текст, на който те отговарят, за да не объркате търсачките. Търсещите машини прихващат тематиката на вашите изображения, като се фокусират върху 2 фактора – на коя страница се намират те и какъв е заобикалящият ги текст. Не допускайте безсмисленото поставяне на снимки, които не отговарят на съдържанието, което публикувате.

Оптимизация на разположението на изображението

Много е важно вашето изображение да не застъпва текст, да не е залепено до него и да го закрива, което ще попречи за потребителското преживяване.

Затова винаги трябва да се стараете да се съобразявате с поставянето на изображението и дали то ще е центрирано, в ляво или дясно на текста.

Не се опитвайте да вграждате текстове

Това е погрешно, особено в заглавия, менюта или в самото изображение да има много текст, защото това би нарушил цялостната консистенция на UX на страницата ви.

Не забравяйте, че потребителите използват все по-често смартфоните си

В голяма част от нишите, които сме анализирали в Serpact, а и световната тенденция, която се наблюдава от края на 2016 година е, че трафикът от мобилни устройства превъзхожда тази от настолни. Затова като планираме как да изградим архитектурата на дадена страница се налага да се съобразим и фокусираме основно в/у мобилните потребители. За целта може да прочетете тези кратки съвети от Google за удобство на мобилни устройства. Ако искате да тествате дали вашият уеб-сайт е удобен за мобилни устройства, може да посетите т.нар. Google Mobile Friendly Test (GMFT).

Създайте добра URL структура

Често не се обръща внимание на името на файла при качване на изображението, както показахме в примера горе с уеб-сайта на Lifehack.bg, което води до изображения с адрес: IMG123456.jpg.

? Ето и нашият съвет:

Ако името на файла включва повече от една дума, то нека думите бъдат разделени със средно тире “-”. Избягвайте прекалено дългите имена на файловете, максимум до 4-5 думи са напълно достатъчни (възможно е да има редки изключения), в това число и ако снимката е на продукт – просто изпишете името или марката, серията и модела.

Пример: ime-na-izobrajenie.jpg.

Също така не забравяйте да използвате латиница, а не кирилица.

Какъв да е размерът на файла – оптимизация на скорост?

Няма точна рецепта за това. Използвайте Google PageSpeed Insights, за да следите скоростта си на зареждане. Принципно е добре снимките да бъдат под 100 Kb, но това разбира се не е нито стандарт, нито правило, защото всяка снимка се различава предвид нейната резолюция, размери на изображението /в пиксели/ и т.н.

Друг много удобен инструмент за анализ на скорост на зареждане, в който може да прегледате дали вашите изображения са оптимизирани и ако не са да изтеглите директно оптимизираната версия, е GTmetrix. На посочения адрес ще видите, че GTmetrix ни дава в полето “Optimize images”, версия на изображението, което е на сайта на Lifehack.bg.

Също така ви препоръчваме да се запознаете с основните препоръки на Ilya Grigorik относно оптимизацията на изображенията за търсещи машини в частта – скорост на зареждане на страници.

Оразмерявайте предварително снимките, когато ги оптимизирате, защото това играе важна роля и за размера на файла на изображението. Не оставяйте на браузъра да скалира снимките вместо вас, защото това също забавя зареждането на вашия сайт.

Винаги можете да свържете изображението чрез линк към по-големия му размер, за да бъде видяно от потребителя в пълните му ширина и дължина, но като основно правило публикувайте в сайта си изображения в желан, или изискван от дизайна размер.

Важно е също да настроите правилно дълбочината на цветността на изображението, така че то да не загуби своето качество, но и размерът на файла да не е прекалено голям.

Бихте могли да използвате и инструмента YSlow, за да разберете дали оптимизирането на изображенията на вашия сайт е било успешно.

Не забравяйте да направите тест и на мобилен телефон или таблет.

Оптимизирайте Alt таговете на снимките предварително

Когато погледнем дадена снимка веднага разпознаваме изобразеното на нея, но не по същия начин стоят нещата с търсачките. За да разбере търсещата машина какво съдържа вашата снимка и да я свърже със съдържанието ви, тя използва именно алт текста изписан в алт тага, освен заглавието (разбира се, по-горе обяснихме и какво правят невронните мрежи, но не е добра идея да им се доверявате напълно).

? Как да го добавите?

Просто открийте тага <img> в кода на Вашия сайт и изпишете alt=”Вашият алт таг“.

Пример: <img src=“chocolate-donuts.jpg“ alt=“chocolate donuts“ />

Алт таговете също добавят своята стойност към оптимизацията на вашия уеб-сайт и те са с доста голямо значение. Добавянето на подходящи алт тагове спомага за по-доброто класиране на сайта чрез асоциирането на желаните от вас ключови думи с публикуваните изображения. Не забравяйте, обаче, при добавяне на алт текста да включите и желаните от вас ключови думи. Не прекалявайте с дължината на алт таговете, нека бъдат описателни, но и кратки. Не прекалявайте и с ключовите думи!

Алт текстът представлява и текст алтернатива, която описва накратко изображенията, когато браузърът не може да ги зареди правилно.

На всички ни се е случвало да заредим уебсайт, имейл или каквото и да е онлайн и по една или друга причина изображенията да не се заредят – дали заради бавна интернет връзка, дали заради защита от спам. Така на мястото на изображението се появява точно alt tag му, който ни подсказва какво изображение е публикувано.

Винаги проверявайте алт таговете на вашия сайт и в случай, че те са празни ги попълнете, защото това би донесло само позитиви за класирането му.

Използвайте правилните формати в точните ситуации

Доста често сме ставали свидетели на използване на изображения на принципа „ами това имаше – това сложих“. Подборът на правилния формат е също важен етап в процеса на оптимизация на изображения. Съществуват най-различни инструменти, с които може  да конвертирате изображенията си в различни формати.

Кои обаче са най-често използваните формати?

Стандартни формати на изображения използвани в web:

• Jpeg – https://jpeg.org/. Стандартът сред форматите на изображения в интернет. Изображенията в този формат могат да бъдат компресирани без особена загуба на качеството, при което резултатът е качествено изображение с малък файлов размер. Особено подходящи са за продуктови изображения.
• Gif – https://giphy.com/. Това е формат изображения с по-ниско качество от jpeg и макар напоследък да се използва все по-малко, то той намира приложение в изображенията от типа – иконки или елементи от дизайна на сайта. Използвайте gif за малки като размери изображения с проста концепция, която допълва дизайна на сайта или съдържанието на определена страница/пост и тн.
• Png – https://libpng.org/. Това е формат, който добива все по-голяма популярност като алтернатива на гифовете. Предимството му е, че поддържа много по-голяма дълбочина на цветността и качеството на изображението не спада след пре-съхраняване /re-saving/, за разлика от jpeg формата. Въпреки всичко обаче файловите размери на тези изображения са все още доста големи. Напоследък png форматът се използва изключително засилено за поставяне на лога или map маркери в уеб-сайтовете, предвид високото му качество.

Новите формати на изображения по препоръка на Google:

• WebP –  https://developers.google.com/speed/webp/. WebP е модерен формат на изображението, който осигурява забележителна компресия без загуби на качеството на изображенията. Чрез WebP уеб администраторите и разработчиците могат да създават по-малки като големина изображения, които правят глобалната мрежата по-бърза. Изображенията с формат WebP могат да намалят до 26% тези с формат PNG и дори 25-34% тези на JPEG. Също така WebP формата има предимството, че поддържа прозрачност – известна още като алфа канал, която разбира се би увеличила големината на снимката с до 22%.
• Jpeg XR – https://jpeg.org/jpegxr/. Стандартът JPEG XR предоставя практична технология за кодиране за широк спектър от приложения с отлични възможности за компресия и важни допълнителни функции. Основното предназначение на JPEG XR е представянето на статични изображения с непрекъснат тон, като например фотографски изображения.
• Jpeg 2000 – https://jpeg.org/jpeg2000/. JPEG 2000 е система за кодиране на изображения, която използва най-съвременни техники за компресия, базирани на технологията на вълните и предлага изключително високо ниво на мащаб и достъпност. Съдържанието може да бъде кодирано веднъж при каквото и да е качество, до без загуби, но достъпно и декодирано при потенциално много голям брой други качества и резолюции.

Структурирани данни

Ако положите усилия да маркирате различните типове съдържание в уеб-сайта си според най-добрите практики за описване на основните структурирани данни ще бъде добре първо да се запознаете с техните речници.

Все пак днес разглеждаме конкретно оптимизация на изображения в Google и затова ще посочим основните типове маркирания според официалната документация на Google:

• Продукти – https://schema.org/Product
• Видео – https://schema.org/video
• Рецепти – https://schema.org/Recipe

? Продукти

Както писахме в началото на този guide, дойде моментът да развием как може да оптимизираме изображенията си ако имаме онлайн магазин и съответно продукти в него.

Препоръчваме ви да се запознаете с официалната документация на Google за този вид Product маркировка. За да опишете един свой продукт в уеб-сайта, може да използвате 3 различни типа маркировка, като ще видите че във всяка от тях присъства “image”:

• JSON-LD (препоръчан), ето примерния код за единичен продукт:

• JSON-LD (препоръчан), ето примерния код за Shopping aggregator page:

• RDFA – ето примерния код за единичен продукт:

• RDFA – ето примерния код за Shopping aggregator page:

• Microdata – ето примерния код за единичен продукт:

• Microdata – ето примерния код за Shopping aggregator page:

Използването на такъв вид маркировка може да ви докара доста добри резултати свързани с продукти в SERP.

Ето и как се визуализират те в търсене по изображения в Google.

Както се вижда на изображението google добавя етикет “Продукт”, при заявка в Google “iphone xs цена” което се прихваща от подадената маркировка на двата уеб-сайта. Нека все пак проверим дали това е така в инструмента на Google – Structured Data Testing Tool {SDTT}, с първия резултат. Макар и със 7 предупреждения се вижда, че на Google му е достатъчно да изведе този резултат като #1 в SERP за снимки.

Да видим дали е така и при резултат 2, при същата заявка на същия адрес от резултати. Ето и screenshot на него и линк към теста. Макар и със 97 предупреждения това се оказва достатъчно на втория уеб-сайт да заеме същата позиция.

Какво обаче се случва и се показва на потребителя като предимство, когато имаме подобна маркировка и защо се появява този етикет? Може би за етикета вече ви се изясни, но сега ще покажем и допълнителен плюс при отваряне на самото изображения, какво вижда потребителя за разлика от другите резултати.

Както виждате имаме 4 зелени маркирани полета, които описват и дават така ценната информация на потребителя за:

• Рейтинг
• Цена и валута
• Наличност
• Марка
• Долу в червено имаме отново съобщение за авторските права на изображението.

? Видео

Няма да засягаме и акцентираме над този модел Markup, защото не е директно свързан с оптимизацията на изображения. Все пак ако имате интерес може да се запознаете в официалната документация за Video Markup на Google.

? Рецепти

Определено тук изображенията имат своята ключова роля в SERP {Search Engine Result Pages}. Нека разберем как! Първо да се запознаем с основните Structured Data Markup за рецепти от официалната документация на Google от тук.

Също така ще направим следното уточнение, че за “рецепти” освен познатия ни вече SDTT, е редно да тестваме и използваме т.нар. RRTT {Rich Results Testing Tool}.

Нека се обърнем към различните типове маркировки и техните примерни кодове, като започнем с този за една рецепта.

А тук ще ви предоставим примерни код за carousel от рецепти:

Да започваме с примерите.

От тук, може да проследите резултата в Google на “рецепта за пица маргарита”.

Както виждате отново имаме етикет, но този път той е Рецепта.

Да погледнем дали има маркиране на някой от резултатите. Както може да видите от теста в SDTT, имаме валидна маркировка, макар да е с 3 предупреждения.

Както споменахме горе, тук един тест не е достатъчен, нека да видим какво се случва ако тестваме в RRTT. Както се вижда теста е абсолютно валиден.

Пак имаме предупреждения, но това да не ни плаши, важно е да няма грешки.

Хубавото на RRTT е, че можем да визуализираме как ни се показва резултата в Google. Освен това вече можем да избираме User Agent или така казано да избираме дали искаме да превключим от мобилно на декстоп устройство. Също така както при SDTT можем да тестваме като копираме целия си source code. Може да разгледате всички функции на този толкова полезен инструмент на Google за всеки един SEO специалист.

Остана да видим какви елементи има в рецепти, спрямо продукти и да се насладим на разликата в елементите. Ето ги и тях в зелено:

• Рейтинг в звезди и брой оценили
• Време за приготвяне
• Количество
• Основни съставки, като там се описват всички продукти и количества нужни за рецептата
• Забележете, че пак имате предупреждение в червено за авторските права

Помогнете на Google да открие вашите изображения

Използвайте Image XML Sitemap за да покажете вашите изображения на Google. Разбира се, като всеки един елемент във вашия уеб-сайт, така и изображенията имат своята роля и стойност. Затова препоръката ни от Serpact е да положите усилия и да създадете своя собствена Image XML Sitemap, според най-добрите практики.

Ето и дефиницията на различните Tags в този Image XML:

? Бонус съвет: Защо изображението ми не се появява във Facebook?

Решението е просто – интегрирайте OpenGraph протокол. В случай, че не можете да се справите с тази стъпка винаги можете да потърсите уеб програмист. Именно в един от мета таговете на OpenGraph се включва и изображението, което ще се показва, когато споделяте публикация в страницата на вашия бизнес или личния си профил.

При интегрирането на графа е важно да бъде поставен следният таг:

<meta property=“og:image“ content=“https://example.com/image‐title.jpg“ />

Какво е предимството?

Бихте могли да използвате напълно различно изображение в сравнение с това, което сте публикували като основно за вашия блог пост например, но с единственото условие да бъде релевантно на съдържанието ви.

Друго предимство на OpenGraph е и това, че се използва и от Pinterest. Абсолютно аналогичен е и случаят с Twitter, който използва Twitter card.

? Заключение

Както видяхме до този момент процесите на оптимизацията за търсачки на изображения далеч не се изчерпват само с правилното заглавие и алт таг.

Всъщност, за да разберем как да оптимизираме изображенията си, трябва да се научим как да търсим и какви възможности имаме около този процес.

Съветваме ви да отделите нужното време и да се запознаете подробно с този материал, преди да започнете да прилагате съветите посочени в него.

Ако имате въпроси или тема, която искате да доразвием от този материал, не се колебайте да се свържете с екипа на LifeHack.bg в секретната им група или директно с мен (Никола Минков). Бих отговорил на всички, които вече са абонирани за уеб-сайта, а ако не сте, може да го направите оттук: https://www.lifehack.bg/club/. Успех на всички!

---

Никола Минков е Founder & CEO на Serpact и има над 7 години международен опит в оптимизацията на търсещи машини. Фокусът му е върху Техническа оптимизация, изграждане на Content маркетинг стратегии, планиране и прогнозиране на цялостни кампании по SEO, създаване на стратегии за управление на SERP резултати.