اصول بهینه سازی عکس

هدف گوگل در جستجوی عکس همانند جستجوی وب، ارائه نتایج با کیفیت به کاربران است. نکاتی که در ادامه به آنها اشاره شده به گوگل کمک خواهد کرد که دید بهتری نسبت به تصاویر سایت داشته باشد و در نتیجه ورودی سایت شما از جستجوی عکس نیز افزایش پیدا کند.

متن روی عکس

متنها و نوشته های با اهمیت را درون عکس قرار ندهید. در صورتیکه متن در کد HTML صفحه توسط گوگل دیده شوند بسیار موثرتر از حالتی خواهد بود که متن را درون عکس قرار دهید. توجه داشته باشید که اهمیت متن از عکس در هنگام جستجوی متن در گوگل بیشتر است.

نام فایل عکس

توصیه می شود نام فایل عکس ها حاوی جزئیاتی در مورد عکس باشند. به عنوان مثال گوگل با توجه به نام فایل IMG001.JPG نمی تواند درک کند که این عکس در مورد چه موضوعی است ولی با توجه به نام فایل white-iphone-15.jpg می تواند به راحتی متوجه شود که عکس در مورد گوشی آیفون 15 سفید است. سعی کنید که در نام فایل ها فقط از حروف کوچک استفاده کنید و از خط تیره به جای space و underline استفاده کنید.

استفاده از صفت Alt

برای هر عکس در سایت، alt مناسبی بنویسید که عکس را توصیف کند. به دو دلیل استفاده از alt حائز اهمیت است:

  • Alt مناسب می تواند در مورد عکس به گوگل اطلاعات بدهد و گوگل نیز از آن اطلاعات در جستجوی عکس استفاده خواهد کرد.
  • هنگامیکه یک عکس در صفحه به هر دلیلی بارگذاری نشود، Alt آن عکس به جای خود عکس در صفحه نمایش داده خواهد شد. عدم بارگذاری عکس می تواند دلایلی مانند سرعت اینترنت پایین یا استفاده کاربران کم‌ بینا یا نابینا از دستگاه های screen reader باشد. در ادامه به مثال های زیر توجه کنید:

بدون Alt – (توصیه می شود که حتما alt دارای مقدار باشد)

<img src="laptop.jpg" alt=""/>

Alt خوب

<img src="laptop.jpg" alt="laptop"/>

Alt عالی

<img src="chromebook.jpg" alt="silver 13 inch Chromebook"/>

Alt زیر از نظر فنی ایرادی ندارد ولی از دیدگاه سئو بهتر است که به صورت مختصر و مفید نسبت به نوشتن متن جایگزین اقدام شود و متن به نحوی باشد که یک اگر آن را برای یک نابینا بخوانیم، بتواند متوجه محتوای عکس شود.

<img src="laptop.jpg" alt="silver 13 inch Chromebook with intel core i3 CPU and 4GB RAM and 2GB VGA and 4G modem"/>

در Alt زیر بیش از اندازه از کلمات کلیدی استفاده شده است و عکس را توصیف نمی کند.

<img src="white-lenovo-laptop.jpg" alt="لپ تاپ لنوو، لپ تاپ لنوو ارزان،
لپ تاپ لنوو جدید، خرید لپ تاپ لنوو، نوت بوک لنوو"/>

از نظر تعداد کاراکتر یا کلمه برای Alt از طرف گوگل محدودیتی تعیین نشده است ولی توجه داشته باشید که استفاده از کلمات کلیدی متعدد و نامرتبط به عنوان صفت Alt از آنجایی که اثر منفی روی تجربه کاربر از موتور جستجو می گذارد ممکن است منجر به این شود که گوگل این برداشت را کند که سایت شما اسپم است. در نتیجه تلاش کنید همیشه برای هر عکس، Alt توصیفی مختصر و مفید بنویسید و از درج توضیحات اضافه خودداری کنید. بهتر است Alt به زبان کاربر سایت نوشته شود که تاثیرگذاری بیشتری در جستجوهای کاربران سایت داشته باشد.

همچنین این نکته را نیز مد نظر داشته باشید که Alt انتخاب شده برای هر عکس، با خود عکس همخوانی کامل داشته باشد و این طور نباشد که Alt عکس های یک صفحه فقط با توجه به کلمه کلیدی مورد نظر آن صفحه نوشته شوند و ارتباطی با مضمون عکس نداشته باشد. از سال 2018 موتور جستجوی گوگل از تکنولوژی پردازش تصویر برای درک عکس ها و یا حتی خواندن نوشته های درون عکس ها در جستجوی متن گوگل استفاده می کند.

درج محتوای مناسب برای عکس

تلاش کنید اطراف هر عکس محتوای مرتبط داشته باشید. توضیحات اطراف عکس مانند محتوای صفحه، عنوان عکس (image title) و caption به موتور جستجو کمک خواهند کرد که درک بیشتری درباره موضوع عکس داشته باشد.

استفاده از عکس با کیفیت

استفاده از عکس های با کیفیت، تاثیر مثبتی در تجربه کاربران در استفاده از سایت خواهند داشت. همچنین احتمال لینک دادن به عکس های با کیفیت بیشتر از عکس های کم کیفیت است. در صورت استفاده از عکس های با کیفیت و شفاف، عکس های بندانگشتی (thumbnail) در نتایج جستجوی گوگل نیز با کیفیت تر خواهند بود و در نتیجه احتمال کلیک کاربران بر روی عکسها بیشتر خواهد شد.

موقعیت عکس

در صورتیکه عکس مورد نظرتان از اهمیت بالایی برخوردار است، تلاش کنید آن را در بالای صفحه قرار دهید زیرا بسیاری از کاربران صفحه را اسکرول نمی کنند و در نتیجه اگر عکس را در بالای صفحه قرار دهید، احتمال دیده شدن آن بیشتر می شود.

ابعاد عکس

در روند بارگذاری یک صفحه توسط مرورگر، ابتدا کد HTML صفحه به همراه CSS و منابع احتمالی دیگر خوانده می شوند و سپس صفحه شروع به رندر شدن می کند و در نهایت شما می توانید صفحه را در مرورگرتان ببینید. با این توضیح اگر عرض و ارتفاع همه عکسها را در HTML بیاورید، سرعت رندر شدن صفحه توسط مرورگر را بالاتر خواهید برد چرا که در روند بارگذاری صفحه قبل از بارگذاری عکسها، امکان رندر شدن صفحه وجود دارد و عکس ها می توانند پس از رندر شدن صفحه بارگذاری و نمایش داده شوند.

در نمونه زیر برای مرورگر مشخص شده است که عرض عکس 637 پیکسل و ارتفاع آن 335 پیکسل است و بنابراین مرورگر در هنگام رندر صفحه در صورتیکه هنوز عکس را بارگذاری نکرده باشد میتواند باکسی با ابعاد 637 در 335 پیکسل را برای عکس در نظر بگیرد و صفحه را رندر کند و هر موقع عکس مورد نظر بارگذاری شد، آن را در موقعیت و ابعاد اختصاص یافته به خودش نمایش دهد.

<img src="/images/pixel-8-pro.jpg" alt="Google Pixel 8 pro phone" width="637" height="335"/>

نکته دیگری که در سئو عکس حائز اهمیت است، استفاده از عکس با ابعاد مناسب و عدم تغییر ابعاد نمایش عکس در HTML است. اگر به عنوان نمونه از یک عکس با ابعاد 1000*1000 پیکسل استفاده کنید و آن را توسط HTML با ابعاد 500*500 پیکسل در صفحه نمایش دهید، در حقیقت از یک عکس با سایز بزرگ استفاده کرده اید و آن را scale کرده و کوچک تر نمایش داده اید. در آن صورت کاربران باید فایل حجیم تری را دانلود کنند و در نتیجه به غیر از بالا رفتن هزینه پهنای باند برای کاربر و سرور، سرعت بارگذاری صفحه که یکی از سیگنال های محاسبه رنکینک است با افت مواجه می شود.


🔗 منبع: Google Search Console Help

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *