ადამიანი შეიძლება პირველად შენი პროდუქტის ფოტოს შეხვდეს და მხოლოდ შემდეგ გახსნას საიტი. ამ გზაში სურათი დამოუკიდებელი მორთულობა აღარ არის: მან ნივთი უნდა ამოაცნობინოს, შესაბამის გვერდამდე მიიყვანოს და სწორი მოლოდინი შეუქმნას. ამიტომ სურათების SEO ფაილის ზომის შემცირებაზე უფრო ფართო სამუშაოა.
პირობითად განვიხილოთ კერამიკის სახელოსნო, რომელსაც რამდენიმე ჭიქის კოლექცია აქვს. მაგალითი გამოგონილია. მიზანია თითოეული ჭიქის ფოტო სწორ პროდუქტს დაუკავშირდეს და მკითხველმა ფერი, ფორმა და დეტალი გაიგოს. ამ ამოცანისთვის შვიდი ნაბიჯი გამოგვადგება.
1. ჯერ გადაწყვიტე, რას უნდა ამტკიცებდეს კადრი
ერთ ფურცელზე ჩამოწერე პროდუქტის შესახებ სამი ყველაზე ხშირი კითხვა. ჩვენი სახელოსნოსთვის ეს შეიძლება იყოს ჭიქის ფორმა, სახელურის ზომა და ზედაპირის ტექსტურა. თითოეულ კითხვას შესაბამისი ფოტო მიუწერე. ერთი საერთო კადრი კოლექციის ხასიათს აჩვენებს, მაგრამ სახელურის ახლო ხედვას ვერ ჩაანაცვლებს.
გაარჩიე კატალოგის მთავარი ფოტო, დეტალის ფოტო და გარემოში გადაღებული კადრი. არცერთს არ სჭირდება ყველა ამოცანის ერთად შესრულება. თუ მცირე წინასწარ ხედში პროდუქტი ვერ ამოიცნობა, გადახედე კადრირებას. მომხმარებლისთვის მნიშვნელოვანი ნაწილი დეკორატიულმა გარემომ არ უნდა დაფაროს. რეალური პროდუქტის გადაღების დაგეგმვაში გამოგადგება ფოტოების დანიშნულების წინასწარ განსაზღვრა; იგივე პრინციპი საკვების მიღმაც მუშაობს.
2. ფოტოს გვერდით მისი ზუსტი კონტექსტი შექმენი
სურათი იმ გვერდზე განათავსე, რომელიც მასზე ნაჩვენებ ნივთს ან საკითხს ხსნის. ჭიქის ფოტო შემთხვევითი ზოგადი სტატიის შუაში მომხმარებელს ნაკლებ ინფორმაციას აძლევს, ვიდრე შესაბამისი მოდელის აღწერასთან. გვერდის სათაური, ფოტო და ტექსტი ერთსა და იმავე ობიექტს უნდა ეხებოდეს.
Google სურათის თემის გასაგებად გვერდის კონტექსტსა და alt ტექსტსაც იყენებს; ფაილის აღწერითი სახელი დამატებითი მცირე მინიშნებაა. ეს ახსნილია სურათების SEO ოფიციალურ გზამკვლევში. სახელოსნოს ფაილი შეიძლება იყოს blue-ceramic-cup-side.webp. სახელში დაუდასტურებელი მასალა ან შემთხვევითი პოპულარული ფრაზა არ დაამატო. პროდუქტის გვერდის სხვა ნაწილები შეამოწმე პროდუქტის SEO გზამკვლევით.
3. alt ტექსტი სურათის როლით დაწერე
კარგი alt პასუხობს კითხვას: რა ინფორმაცია დაეკარგება ადამიანს, თუ ამ სურათს ვერ დაინახავს? პირობითი კადრისთვის გამოდგება „ლურჯი კერამიკის ჭიქა მრგვალი სახელურით, გვერდიდან“. „საუკეთესო ჭიქა, ჭიქები თბილისი, იაფი ჭიქა“ გამოსახულების განმარტება არ არის. ტექსტში მხოლოდ ნაჩვენები ან კონტექსტით დადასტურებული დეტალი ჩაწერე.
დეკორატიულ სურათს შეიძლება ცარიელი alt="" სჭირდებოდეს, ხოლო ინფორმაციულს — გამოსადეგი აღწერა. განსხვავებას MDN-ის img დოკუმენტაცია განმარტავს. ლოგოს, ბმულისა და პროდუქტის ფოტოს ერთი წესით ნუ დაამუშავებ. თუ სურათი ერთადერთი ბმულია, მომხმარებელმა მის დანიშნულებასაც უნდა მიაგნოს. გრძელ დიაგრამას მხოლოდ მოკლე alt ვერ ახსნის; ძირითადი ინფორმაცია გვერდზეც დაწერე.
4. მთავარ ფოტოებს ტექნიკურად აღმოჩენის გზა ჰქონდეს
დეველოპერთან გადაამოწმე, მნიშვნელოვანი ფოტო ჩვეულებრივი img ელემენტით არის ჩასმული თუ მხოლოდ CSS ფონად. Google-ის სურათების გზამკვლევი HTML სურათის ელემენტებს მოითხოვს აღმოჩენისთვის და აღნიშნავს, რომ CSS ფონურ სურათებს არ ინდექსირებს. პროდუქტის ერთადერთი მთავარი ფოტო მხოლოდ დეკორატიული ფონით არ შემოიფარგლოს.
სატესტო სიაში შეიტანე სურათის პირდაპირი მისამართი, გვერდზე მისი ადგილი და დატვირთვის შედეგი. გაუმართავი ბმული, წვდომის მოთხოვნა ან შემთხვევითი ბლოკირება ჯერ ტექნიკურად უნდა გასწორდეს. ფოტოს ხელმისაწვდომობა შეამოწმე სტუმრის რეჟიმში. ადმინისტრატორი ზოგჯერ ხედავს მასალას, რომელიც ჩვეულებრივი მომხმარებლისთვის ჯერ არ გამოქვეყნებულა. კოდში ფაილის არსებობა მის წარმატებულ ჩატვირთვას ყოველთვის არ ნიშნავს.
5. ფორმატი და ზომები საცდელი შედარებით აირჩიე
WebP ან AVIF ავტომატური ჯილდო არ არის. შეადარე ერთი და იმავე ფოტოს ექსპორტები: შენარჩუნდა ჭიქის ფაქტურა, ფერი და კიდეები? ფაილი შემცირდა? მხარდაჭერა შეესაბამება შენს მომხმარებლებსა და სისტემას? საჭიროების შემთხვევაში სხვა ფორმატის სათადარიგო ვარიანტიც მოამზადე. მცირე ფაილი მაშინ გამოგადგება, როცა პროდუქტი კვლავ გასაგებად ჩანს.
srcset და sizes ბრაუზერს სხვადასხვა ზომის ვარიანტის შერჩევაში ეხმარება; მათი მუშაობა აღწერილია MDN-ის იმავე დოკუმენტაციაში. ტექნიკურ დავალებაში უბრალოდ „გავხადოთ responsive“ ნუ დაწერ. მიუთითე ბარათის, პროდუქტის მთავარი კადრისა და სრულეკრანიანი ნახვის საჭიროებები. ტელეფონზე პატარა ბარათმა უმიზეზოდ უზარმაზარი ორიგინალი არ უნდა ჩამოტვირთოს.
6. განახლებისას ფაილების კავშირებიც შეინარჩუნე
სურათის შეცვლამდე ნახე, სად გამოიყენება ის: პროდუქტის გვერდზე, სტატიაში, გაზიარების სურათად თუ კატეგორიის ბარათში. თუ ფაილი ერთი ადგილიდან წაშალე, სხვა განლაგებაში გატეხილი კადრი შეიძლება დარჩეს. საერთო მედიათეკის მოვლა თითოეული გამოყენების შემოწმებას მოითხოვს.
პირობით სახელოსნოში ერთი თანამშრომელი ახალ ფოტოებს ამზადებს, მეორე კი პროდუქტებს ანახლებს. მათთვის მარტივი ცხრილი გამოდგება: პროდუქტი, ძველი ფოტო, ახალი ფოტო, alt და შემოწმების სტატუსი. თავდაპირველი მაღალი ხარისხის ფაილი ცალკე შეინახე. თუ მომავალში ახალი კადრირება გახდა საჭირო, უკვე შეკუმშული პატარა ასლისგან დაწყება არ მოგიწევს. ტექნიკურ დანერგვას პროდუქტის მონაცემების დამადასტურებელი ადამიანი შეახვედრე.
7. შედეგი ფოტოს ნახვის შემდეგი ქმედებითაც შეაფასე
შეამოწმე, სურათით მოსულ სტუმარს სწორ გვერდზე ხვდება თუ არა პროდუქტი, მოქმედი პირობები და შემდეგი ნაბიჯი. ახალი ფოტო შეიძლება ლამაზი იყოს, მაგრამ აღარარსებულ პროდუქტს აჩვენებდეს. ასეთ შემთხვევაში პრობლემა მხოლოდ საძიებო ხილვადობა არ არის: გვერდზე მიღებული გამოცდილება დასაზუსტებელია.
- კადრი რეალურ ნივთსა და მიმდინარე აღწერას ემთხვევა.
- ინფორმაციული ფოტოს alt საჭირო დეტალს გადმოსცემს.
- მთავარი სურათი ტექნიკურად ხელმისაწვდომია.
- სხვადასხვა ზომაზე პროდუქტის მნიშვნელოვანი ნაწილი ჩანს.
- ფოტოს შესაბამის გვერდზე ქმედების გზა მუშაობს.
ძიების დაკვირვებისთვის გამოიყენე Search Console-ის სამუშაო პროცესი. კატალოგის ფოტოებისა და გვერდების ერთობლივი აუდიტისთვის SEO მომსახურების განხილვა პრიორიტეტული პროდუქტებით დავიწყოთ.
