بهینه سازی و سئو تصاویر در وردپرس نقش خیلی موثری در کسب رتبههای بالاتر سایت دارد. وقتی صحبت از سئو سایت میشود، شما باید روی ریزترین نکات هم کار کنید که هم برای موتورهای جستجو و هم برای کاربران قابل درک و ملموس باشند.
از نگاه کاربری و انسانی تصاویر برای ما (البته نه همه ما، دلیل آن را در ادامه متوجه خواهید شد) مشخص هستند. اما برای موتورهای جستجو باید نکاتی را رعایت کنیم که به درک بهتر انها از تصاویر کمک کند.
لذار در ادامه این مقاله از وبلاگ سون هاست به معرفی 8 نکتهای که باید روی بهینهسازی تصاویر در وردپرس به آنها توجه داشته باشید پرداختهام.
8 ترفند عالی بهینه سازی و سئو تصاویر در وردپرس
بعد از محتوای متنی، تصاویر هستند که فراوانی زیادی در سایت داشته و از نظر رابط کاربری و چیدمان کلی که برای صفحات وب وجود دارد، در انتقال محتوا به کاربر هم موثر هستند. تصاویر در سایت نقش پر رنگی دارند و لازم است که بههمان اندازه متون روی بهینهسازی آنها تمرکز کنید.
استفاده از تگگذاری ALT
یکی از معروفترین تگهایی که در HTML مورد استفاده قرار میگیرد تگ ALT است. به کمک این تگ میتوانید به شرح دادن تصویر پرداخته و درون تگ img توضیح دهید که این تصویر حاوی چیست.
هدف از ساخت این تگ اولا این بوده تا موتورهای جستجو و زبان ماشین قادر به فهم تصاویر باشند. در دورهای که خبری از هوش مصنوعی پیشرفته امروزی نبود، نیاز به ساختاری داشتیم تا به زبان ماشین توضیح دهید این فایل رسانهای حاوی چه چیزی است. مثلا اگر تصویر یک خانه بود، در تگ ALT توضیح دهید که این خانه چه شکلی است، با چه سبکی ساخته شده و اگر رنگبندی خاصی داشته و المانهای دیگری مثل حیاط، درخت و… را شامل میشود توضیح دهید.
با وجود این تگ زمانی هم که به هر دلیلی تصویر مانند عکس بالا لود نشود، متن جایگزین تصویر به کاربر نمایش داده میشود که بداند چه چیزی در اینجا قرار داشته باشت.
مسئله دیگر این است که از همین تگ ALT صفحه خوانها استفاده میکنند تا برای افراد نابینا شرح دهند چه محتوایی در این تصویر جاگذاری شده است. امروزه تگ ALT در شبکههای اجتماعی نظیر X، اینستاگرام و… هم وجود دارد که هم به افراد کمک میکند و هم موتورهای جستجو درک بهتری از تصاویر دارند.
استفاده از اندازه استاندارد برای تصاویر شاخص
بسته به اینکه از چه قالبی استفاده کنید، در بخشهای مختلف از یک اندازه خاصی برای تصاویر شاخص استفاده میشود. مثلا در همین قالب جنه که برای وبلاگ سون هاست استفاده میشود، اندازههای مشخصی برای تصویر نوشته تکی، مطالب مرتبط زیر پستها، مطالب مرتبط در نوار کناری، مطالب در صفحه ساز، اسلایدر و… وجود دارد.
اگر قرار باشد برای همه این بخشها از یک تصویر استفاده کنیم که اندازه استاندارد ۷۸۰ در ۴۷۰ را داشته باشد، بخشهایی مثل مطالب مرتبط و ابزارکها که اندازه کوچکتری دارند، عملا با یک تصویر بزرگ اشغال خواهد شد که صرفا با استفاده از CSS اندازه تصویر کوچک شده است. پس چه بهتر که تصویری با همان ابعاد برش خرده را داشته باشیم.
بنابراین استفاده از اندازه درست کمک میکند تا هم حجم صفحات به دلیل لود تصاویر با ابعاد کمتر کاهش پیدا کند و هم اینکه سرعت لود سایت افزایش خواهد یافت.
استفاده از فرمت تصویر و حجم مناسب
با اینکه پیش از این در مقالهای با عنوان بهترین فرمت تصاویر برای سایت به معرفی چند فرمت مختلف پرداختهایم، اما لازم بهذکر است که بعد از گذشت چند سال تغییراتی در این حوزه شکل گرفته است.
گوگل برای اینکه بهینهسازی روی بخش تصاویر انجام داده باشد، بیش از یک دهه پیش بود که فرمت webp را معرفی کرد که حجمی بسیار کمتر در مقایسه با فرمتهای png و jpg رایج دارد. اما متاسفانه بخت با آن یار نبود و آنطور که باید مورد توجه قرار نگرفت.
اما با اینوجود استفاده از این فرمت واقعا روی کمتر شدن حجم عکس ضمن حفظ کیفیت آن بسیار موثر است. بنابراین توصیه میکنم تا جایی که میتوانید از این فرمت استفاده کنید.
برای درک بهتر موضوع خروجی که برای تصویر این مقاله با فرمت webp تهیه کردم حجم ۴۴ کیلوبایت را دارد در حالی که فرمتهای PNG و JPG بهترتیب برابر با ۷۲ و ۹۷ کیلوبایت هستند.
تنظیم کش کنترل (Cache-Control) در htaccess
زمانی که شما برای اولین بار از یک صفحه سایتی بازدید میکنید، چه لزومی دارد که برای بازدیدهای بعدی فایلهایی که شاید تا سالها هیچ تغییری نکنند دوباره از سرور و هاست سایت لود شوند؟
قابلیت cache-control که از طریق هدر صفحه تعیین میشود در این خصوص به شما کمک میکند. میتوانید برای فرمتهای مختلف فایل تعیین کنید که چه تعداد روز در مرورگر کاربر ذخیره شوند. با انجام این کار وقتی تصویری که از قبل لود شده باشد، بهجای اینکه دوباره از هاست سایت درخواست شود از حافظ کش مرورگر لود خواهد شد که میتواند روی کاهش تعداد درخواست HTTP به سرور موثر بوده و همچنین بخاطر لود از سیستم کاربر، روی بالا رفتن سرعت صفحات موثر باشد.
<FilesMatch "\.(ico|jpg|jpeg|png|gif|webp)$">
Header set Cache-Control "max-age=31536000, public"
</FilesMatch>برای این منظور کافی است قطعه کد بالا را در فایل htaccess. خود قرار داده و ذخیره کنید. مقداری که برای max-age تعیین شده بر حسب ثانیه است که به این میزان فایلهای با فرمت تصویر در مرورگر کاربر ذخیره خواهند شد.
استفاده از سیستم کش مناسب
یکی دیگر از روشهایی که میتواند از نظر سرعت روی بهینهسازی تصاویر نقش موثری داشته باشد، استفاده از یک سیستم کش مناسب است. برای این کار میتوانید از افزونههای کش وردپرس مثل wp rocket یا litespeed cache استفاده کنید.
اما توصیه من استفاده از راهکاری است که در مقاله افزایش سرعت وردپرس با استفاده از opcache آموزش دادم. این روش به کمک ساختار آبجکت کش که در کلیه هاستهای اشتراکی سون هاست نیز در دسترس است با استفاده از یک فایل ساده php قابل پیادهسازی است که میتواند روی سرعت کلی سایت نیز تاصیر مثبتی بگذارد.
نوشتن متن روی تصاویر
در اولین راهکار به معرفی تگ ALT پرداختم که از گذشته برای شرح تصاویر مورد ستفاده قرار میگیرد. اما برای موتورهای جستجو و ابزارهایی که در دنیای پر سروصدای امروزی هوش مصنوعی در جریان است، پا از این فراتر رفته است.
امروزه موتورهای جستجو درک دقیقی از تصاویر دارند. آنها میتوانند همانطوری که ما تصاویر را میبینیم درک کرده و بدانند چه چیزی در آنها قرار دارد. پس چه بهتر که با استفاده از متن و ایجاد خلاقیت به بهینهسازی تصاویر کمک کنیم.
به جای اینکه تصاویر آماده را همینطور از منابع رایگان و غیر رایگان کپی کرده و در سایت خود قرار دهید، روی آنها از متون مناسب همراه با کلمه کلیدی استفاده کنید تا از این طریق هم درک بهتری ازت صویر داشته باشند و هم اینکه با سئو تصاویر وردپرس از جستجوی تصاویر نیز ورودی بگیرید.
استفاده از شبکه توزیع محتوا (CDN)
کلودفلر امروزه به ابزار بی رقیب برای شبکه توزیع محتوا تبدیل شده که شرکتهای بزرگی نظیر OpenAI هم از آن استفاده میکنند. این سایت با تنظیمات و قابلیتهایی که در خود دارد به بالاتر رفتن امنیت و سرعت سایت شما کمک میکند.
در بخشی از ابزار مدیریتی این سایت ابزارهایی برای بهینهسازی تصاویر نیز در نظر گرفته شده که میتوانید از آنها استفاده کنید. اما مهمترین آن همان ابزار cdn است که میتواند با کاهش مصرف منابع هاست و همچنین پهنای باند، به افزایش سرعت سایت نیز کمک کند که در بخش تصاویر موجب بالاتر رفتن سرعت کلی سایت و بهدنبال آن سئو بهتر صفحات خواهد شد.
برای کسب اطلاعات بیشتر در این زمینه میتوانید به مقاله CDN چیست و چطور کار میکند مراجعه کنید.
استفاده از تگ بارگذاری تنبل تصاویر (LazyLoad)
این مطلب را با معرفی تگ شروع کردم، پس چه بهتر که با معرفی تگ دیگری به پایان آن برسیم. تگ بارگذاری تنبل تصاویر که با نام LazyLoad شناخته میشود هم یکی دیگر از روشهای سئو تصاویر در سایت است.
این تگ مشابه با تگ آلت درون تگ img استفاده میشود. کافی است مانند زیر مورد استفاده قرار گیرد:
<img src="لینک تصویر" alt="شرح تصویر" loading="lazy">وقتی مرورگر با این تگ مواجه شود دیگر از لود تصویر جلوگیری خواهد کرد و تا زمانی که کاربر به ناحیهای که عکس در آن قرار دارد اسکرول نکرده باشد تصویر را از منبع درخواست نمیکند. برای همین باعث افزایش سرعت سایت در هنگام لود صفحه خواهد شد که روی بهبود مقدار LCP نیز موثر است.
اگر قالب سایت شما از این ویژگی پشتیبانی نمیکند میتوانید با استفاده از افزونههای بارگذاری تنبل تصاویر در وردپرس (lazy load) این ویژگی را در سایت خود فعال کنید که در صورت استفاده از افزونه موشک وردپرس (wp rocket) گزینهای برای این مورد وجود دارد و نیازی هم به استفاده از افزونه جدا ندارید.
جمعبندی نهایی
نکاتی که در این مقاله برای سئو تصاویر در وردپرس و بهینهسازی انها ذکر کردم جزو مهمترین موارد هستند که در بسیاری افزونهها نظیر افزونههای سئو، کش و افزایش سرعت سایت، این قابلیتها وجود دارند یا اینکه روی آنها کار شده است.
بهنظر شما چه موارد دیگری وجود دارد که باید به آنها توجه کنیم؟ از بخش نظرات تجربیات خود را با ما بهاشتراک بگذارید.
