سئو تصاویر در وردپرس؛ راهنمای کامل و کاربردی

تکمیل این اپیزود

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

متن منتشرشده توسط پادکستر

توضیحات اپیزود

سئو تصاویر در وردپرس فقط به نوشتن Alt یا کم‌کردن حجم عکس محدود نمی‌شه. برای اینکه تصاویر به تجربه بهتر کاربر، سرعت سایت و دیده‌شدن محتوا در گوگل کمک کنن، باید از همون لحظه انتخاب تصویر تا نام‌گذاری، فشرده‌سازی و انتشارش چند نکته ساده رو رعایت کنید. توی این راهنما یاد می‌گیرید چه تصویری برای هر صفحه مناسبه، بین JPEG، PNG، WebP، AVIF و SVG کدوم فرمت رو انتخاب کنید، متن جایگزین رو چطور بنویسید و تنظیمات تصویر رو در وردپرس از کجا تغییر بدید. همین‌طور با تصاویر واکنش‌گرا، بارگذاری تنبل و راه‌های جلوگیری از جابه‌جایی صفحه آشنا می‌شید. سئو تصاویر در وردپرس یعنی چی و چرا مهمه؟ سئو تصاویر در وردپرس یعنی عکس‌ها رو طوری انتخاب و منتشر کنید که هم برای کاربر مفید باشن، هم سریع بارگذاری بشن و هم موتور جستجو بتونه موضوعشون رو درست بفهمه. این کار مجموعه‌ای از چند تصمیمه؛ از انتخاب تصویر مرتبط گرفته تا اندازه فایل، فرمت، نام فایل، متن جایگزین و محل قرارگرفتن عکس. تصویر خوب می‌تونه یک مرحله آموزشی، تفاوت دو محصول یا نتیجه یک کار رو سریع‌تر از چند پاراگراف توضیح بده. ولی تصویر سنگین یا بی‌ارتباط نتیجه برعکس داره؛ صفحه رو کند می‌کنه و تمرکز کاربر رو می‌گیره. اگه سرعت سایتتون مشکل داره، راهنمای دلیل کند بودن سایت وردپرسی هم می‌تونه به پیدا‌کردن علت‌های دیگه کمک کنه. گوگل برای فهمیدن موضوع یک تصویر فقط به نام فایل نگاه نمی‌کنه. متن جایگزین، نوشته‌های اطراف عکس، عنوان صفحه و امکان دسترسی خزنده گوگل به فایل هم بهش سرنخ می‌دن. کیفیت مناسب تصویر هم تجربه بهتری برای کاربر می‌سازه، ولی نباید اون رو به‌تنهایی نشونه‌ای برای تشخیص موضوع تصویر بدونیم. به همین دلیل، یک عکس باید در جای درست و کنار توضیح مرتبط قرار بگیره. چطور تصویر مناسب برای مقاله انتخاب کنیم؟ قبل از اضافه‌کردن هر تصویر از خودتون بپرسید: «این عکس چه چیزی رو برای کاربر روشن‌تر می‌کنه؟» اگه تصویر یک مرحله، نمونه، مقایسه یا نتیجه رو بهتر نشون می‌ده، استفاده ازش مفیده. اگه فقط فضای خالی رو پر می‌کنه، احتمالاً بهش نیاز ندارید. تصویر باید با موضوع صفحه و نیت جستجوی کاربر هماهنگ باشه. مثلاً کاربری که دنبال آموزش تنظیم Alt در وردپرسه، از تصویری که محل این کادر رو نشون بده بیشتر از یک عکس تزئینی نتیجه می‌گیره. متن اطراف عکس هم بهتره دقیقاً درباره همون چیزی باشه که داخل تصویر دیده می‌شه. برای تعداد تصاویر قانون ثابتی وجود نداره. بعضی آموزش‌ها به چند تصویر مرحله‌به‌مرحله نیاز دارن و بعضی مقاله‌ها با یک نمودار کامل می‌شن. پس به‌جای رسیدن به یک عدد مشخص، نیاز واقعی خواننده رو معیار قرار بدید. بهترین فرمت تصویر برای وردپرس کدومه؟ یک فرمت واحد برای همه تصاویر بهترین انتخاب نیست. نوع تصویر، نیاز به شفافیت و تعادل بین کیفیت و حجم فایل تعیین می‌کنه که کدوم فرمت مناسب‌تره. JPEG برای عکس‌های معمولی JPEG برای عکس‌هایی با رنگ‌ها و جزئیات زیاد، مثل تصویر محصول یا منظره، انتخاب ساده‌ایه. می‌تونید حجمش رو خیلی کم کنید، ولی فشرده‌سازی شدید جزئیات تصویر رو خراب می‌کنه. این فرمت برای لوگو، نوشته داخل تصویر یا بخش‌های شفاف مناسب نیست. PNG برای تصاویر شفاف و جزئیات دقیق PNG شفافیت رو پشتیبانی می‌کنه و لبه‌های نوشته، آیکن و رابط کاربری رو واضح نگه می‌داره. در عوض، حجم عکس‌های واقعی با این فرمت معمولاً زیاده. پس PNG رو وقتی انتخاب کنید که واقعاً به شفافیت یا جزئیات دقیق نیاز دارید. WebP برای کاهش حجم تصاویر WebP برای خیلی از عکس‌ها و طرح‌های وب حجم کمتری نسبت به JPEG یا PNG می‌سازه و می‌تونه شفافیت هم داشته باشه. برای بیشتر سایت‌های وردپرسی، این فرمت نقطه شروع مناسبیه؛ البته بعد از تبدیل باید کیفیت خروجی رو با چشم بررسی کنید. AVIF برای فشرده‌سازی بیشتر AVIF در بعضی تصاویر و با تنظیمات مناسب می‌تونه فایلی کوچک‌تر از WebP بسازه، ولی این نتیجه برای همه تصاویر تضمین‌شده نیست. نوع تصویر، ابزار تبدیل و تنظیم کیفیت روی خروجی اثر می‌ذارن. بهتره نسخه‌های AVIF و WebP رو کنار هم ببینید و فایلی رو نگه دارید که با حجم کمتر، ظاهر مناسبی داره. قبل از انتخاب AVIF هم پشتیبانی نسخه وردپرس، مرورگرهای مخاطبان و سرور سایتتون رو بررسی کنید. SVG برای آیکن و طرح‌های برداری SVG یک فرمت برداریه؛ یعنی آیکن و طرح ساده رو در اندازه‌های مختلف بدون تارشدن نشون می‌ده. فایل SVG می‌تونه کد فعال و ناامن داشته باشه، پس فقط فایل‌های مطمئن و پاک‌سازی‌شده رو استفاده کنید. وردپرس در نصب عادی SVG رو جزو فرمت‌های مجاز بارگذاری قرار نمی‌ده؛ بنابراین نباید محدودیتش رو با یک روش نامطمئن دور بزنید. چطور حجم و ابعاد تصاویر رو بهینه کنیم؟ حجم فایل با ابعاد تصویر فرق داره. حجم با کیلوبایت یا مگابایت سنجیده می‌شه، ولی ابعاد تعداد پیکسل‌های عرض و ارتفاعه. ممکنه تصویری ابعاد بزرگی داشته باشه ولی فشرده شده باشه؛ یا تصویر کوچکی با تنظیمات نامناسب حجم زیادی بگیره. اول مشخص کنید تصویر قراره با چه عرضی دیده بشه. اگه ستون محتوای سایتتون عرض محدودی داره، نمایش مستقیم یک فایل چند هزار پیکسلی فایده‌ای نداره. البته برای واضح‌ماندن عکس در نمایشگرهای پرتراکم، مثل بعضی صفحه‌نمایش‌های موبایل و لپ‌تاپ، ممکنه فایلی کمی بزرگ‌تر از اندازه نمایشی لازم باشه. وردپرس و مرورگر هم می‌تونن از بین اندازه‌های آماده، گزینه متناسب رو انتخاب کنن. بعد از اصلاح ابعاد، تصویر رو فشرده کنید. هدف این نیست که عدد حجم رو به هر قیمتی پایین بیارید. هدف اینه که فایل تا جایی کوچک بشه که افت کیفیتش برای کاربر محسوس نباشه. برای بهینه‌سازی گروهی تصاویر می‌تونید راهنمای افزونه نگار آرا رو هم ببینید. در پایان، خروجی رو با اندازه واقعی داخل صفحه بررسی کنید. به نوشته‌های ریز، لبه‌ها، رنگ پوست و بخش‌های دارای سایه توجه کنید. اگه تصویر تار، دانه‌دانه یا لکه‌دار شده، مقدار فشرده‌سازی رو کمتر کنید. نام فایل تصویر رو چطور انتخاب کنیم؟ نام فایل بهتره کوتاه، توصیفی و مرتبط با خود تصویر باشه. برای نمونه، نام wordpress-image-alt-field.webp از IMG_4582.webp معنی روشن‌تری داره. کلمه‌ها رو با خط تیره جدا کنید تا نام فایل خواناتر بمونه. لازم نیست کلمه کلیدی صفحه رو به زور در نام همه فایل‌ها تکرار کنید. نام فایل فقط یک سرنخ کوچیکه و جای ارتباط واقعی تصویر با محتوا یا متن جایگزین درست رو نمی‌گیره. بهتره نام هر فایل چیزی رو توضیح بده که واقعاً داخل همون تصویر دیده می‌شه. متن جایگزین یا Alt تصویر چیه؟ Alt یا متن جایگزین، توضیح کوتاهی درباره تصویر در کد صفحه‌ست. اگه تصویر نمایش داده نشه یا کاربر از صفحه‌خوان استفاده کنه، این متن کمک می‌کنه مفهوم تصویر از دست نره. موتور جستجو هم می‌تونه از Alt برای فهم بهتر ارتباط عکس با صفحه استفاده کنه، ولی Alt به‌تنهایی رتبه بهتر رو تضمین نمی‌کنه. چطور Alt مناسب بنویسیم؟ توضیح بدید تصویر چه اطلاعاتی به همین صفحه اضافه می‌کنه. متن رو کوتاه و طبیعی نگه دارید و جزئیاتی رو بنویسید که برای فهم محتوا مهم هستن. مثلاً برای تصویری از کادر متن جایگزین در کتابخانه رسانه، «کادر نوشتن متن جایگزین تصویر در کتابخانه رسانه وردپرس» توضیح مناسبیه. Alt تصویر اطلاعاتی چه تفاوتی با تصویر تزئینی داره؟ تصویر اطلاعاتی پیام یا نکته‌ای داره که بدون اون بخشی از محتوا ناقص می‌مونه. Alt این تصویر باید همون پیام ضروری رو منتقل کنه. تصویر تزئینی فقط ظاهر صفحه رو زیباتر می‌کنه و اطلاعات تازه‌ای به کاربر نمی‌ده. چه زمانی Alt تصویر باید خالی باشه؟ اگه تصویر کاملاً تزئینیه و حذفش هیچ اطلاعاتی رو از بین نمی‌بره، Alt خالی انتخاب مناسبیه. خالی‌بودن Alt با حذف‌کردن ویژگی Alt فرق داره؛ در کد HTML، تصویر تزئینی بهتره ویژگی alt="" داشته باشه تا صفحه‌خوان ازش عبور کنه. چرا تکرار کلمه کلیدی در Alt به سئو کمک نمی‌کنه؟ تکرار یک عبارت در Alt چند تصویر، توضیح دقیقی درباره اون‌ها نمی‌ده و تجربه کاربران صفحه‌خوان رو خراب می‌کنه. کلمه کلیدی رو فقط وقتی بنویسید که به شکل طبیعی تصویر رو توصیف می‌کنه. هر تصویر اطلاعاتی باید متن جایگزین متناسب با خودش رو داشته باشه. عنوان، کپشن و توضیحات تصویر چه کاربردی دارن؟ Alt جایگزین متنی تصویر محسوب می‌شه، ولی عنوان معمولاً نامی برای مدیریت رسانه یا اطلاعات تکمیلیه. کپشن هم متنیه که کاربر زیر تصویر می‌بینه. این سه مورد یک کاربرد ندارن و بهتره یک متن یکسان رو بی‌دلیل داخل همه‌شون کپی نکنید. وقتی تصویر به منبع، تاریخ، واحد اندازه‌گیری یا توضیحی نیاز داره که باید جلوی چشم خواننده باشه، کپشن مفیده. اگه متن اطراف تصویر همه‌چیز رو روشن گفته، اضافه‌کردن کپشن تکراری کمکی نمی‌کنه. بین فیلدهای کتابخانه رسانه، متن جایگزین به دسترس‌پذیری و فهم معنی تصویر کمک مستقیم‌تری می‌کنه. کپشن هم می‌تونه توضیح قابل‌مشاهده و مفیدی به صفحه اضافه کنه. عنوان و توضیحات رسانه بیشتر برای مدیریت فایل یا نمایش در بعضی قالب‌ها کاربرد دارن. پرکردن این فیلدها به‌تنهایی رتبه بهتر رو تضمین نمی‌کنه. سئو تصویر چطور مشخصات تصویر رو در وردپرس ویرایش کنیم؟ از پیشخوان وردپرس وارد بخش «رسانه» و بعد «افزودن پرونده رسانه‌ای جدید» بشید و تصویر بهینه‌شده رو بارگذاری کنید. تصویر رو در کتابخانه رسانه باز کنید. متن جایگزین مناسب رو بنویسید و در صورت نیاز، عنوان و کپشن رو اصلاح کنید. داخل ویرایشگر نوشته، بلوک تصویر رو انتخاب کنید. از تنظیمات کناری، وضوح یا اندازه‌ای رو انتخاب کنید که با محل نمایش تناسب داره. پیش‌نمایش نوشته رو در حالت دسکتاپ و موبایل ببینید. واضح‌بودن تصویر، بریده‌نشدن بخش مهم و فاصله مناسب اون با متن رو بررسی کنید. تصاویر واکنش‌گرا در وردپرس چطور کار می‌کنن؟ تصویر واکنش‌گرا یعنی مرورگر بتونه برای صفحه‌نمایش‌های مختلف، فایل مناسبی رو انتخاب کنه. وردپرس معمولاً برای تصاویر بارگذاری‌شده چند اندازه می‌سازه و اطلاعات نسخه‌های مناسب رو با ویژگی‌های srcset و sizes داخل کد تصویر قرار می‌ده. قالب، افزونه‌ها و نحوه درج تصویر می‌تونن روی خروجی نهایی اثر بذارن. srcset فهرست نسخه‌های موجود تصویر رو به مرورگر معرفی می‌کنه. sizes هم به مرورگر سرنخ می‌ده که تصویر تقریباً با چه عرضی نمایش داده می‌شه. مرورگر با توجه به اندازه صفحه و تراکم نمایشگر، نسخه مناسب رو دریافت می‌کنه. این قابلیت به این معنی نیست که می‌تونید هر فایل خیلی بزرگی رو بدون بهینه‌سازی بارگذاری کنید. فایل اصلی هنوز فضای هاست رو اشغال می‌کنه و ممکنه در بعضی موقعیت‌ها استفاده بشه. پس بهتره قبل از آپلود، ابعاد فایل اصلی رو هم منطقی کنید. بارگذاری تنبل تصاویر چه کمکی به سرعت سایت می‌کنه؟ Lazy Loading یا بارگذاری تنبل یعنی دریافت بعضی تصاویر تا زمانی که کاربر به نزدیکی اون‌ها برسه عقب بیفته. این روش باعث می‌شه مرورگر در شروع بازشدن صفحه، منابعش رو صرف بخش‌هایی کنه که همون لحظه دیده می‌شن. تصاویر پایین مقاله معمولاً گزینه‌های خوبی برای بارگذاری تنبل هستن. وردپرس می‌تونه برای تصاویر واجد شرایط ویژگی loading="lazy" رو به‌صورت خودکار اضافه کنه، ولی تصمیم نهایی به نسخه وردپرس، محل تصویر، قالب و افزونه‌های سایت هم بستگی داره. تصویری که از همون شروع بازشدن صفحه دیده می‌شه، به‌خصوص تصویری که احتمالاً بزرگ‌ترین بخش محتوایی قابل‌مشاهده یا LCP صفحه‌ست، معمولاً نباید با تأخیر بارگذاری بشه. LCP یکی از معیارهای سرعت و تجربه کاربره و زمان نمایش بزرگ‌ترین بخش اصلی صفحه رو می‌سنجه. هر تصویر بالای صفحه الزاماً LCP نیست، پس بهتره بعد از انتشار، نتیجه واقعی رو با ابزار سنجش سرعت بررسی کنید. چطور جلوی جابه‌جایی صفحه هنگام بارگذاری تصویر رو بگیریم؟ وقتی مرورگر از قبل عرض و ارتفاع تصویر رو بدونه، پیش از دریافت فایل فضایی متناسب براش کنار می‌ذاره. در نتیجه، متن و دکمه‌ها بعد از ظاهرشدن عکس ناگهان جابه‌جا نمی‌شن. وردپرس معمولاً مشخصات ابعاد تصاویر کتابخانه رسانه رو در خروجی قرار می‌ده. بهتره این مشخصات رو بدون دلیل حذف نکنید و با CSS هم نسبت تصویر رو به‌هم نزنید. بعد از انتشار، صفحه رو با اینترنت کندتر و در موبایل آزمایش کنید تا جابه‌جایی احتمالی راحت‌تر دیده بشه. چطور تصاویر رو برای گوگل قابل‌فهم‌تر کنیم؟ تصویر رو کنار متنی قرار بدید که موضوعش رو توضیح می‌ده. عنوان اصلی، سرتیتر بخش و موضوع کلی صفحه هم باید با چیزی که تصویر نشون می‌ده هماهنگ باشن. این ارتباط برای گوگل از تکرار بی‌هدف یک کلمه در نام فایل و Alt مفیدتره. از تصویر واضح و باکیفیت استفاده کنید، ولی حجمش رو کنترل کنید. فایل باید برای گوگل قابل‌خزش باشه؛ یعنی تنظیمات سرور، فایل robots.txt یا روش نمایش تصویر نباید دسترسی لازم رو بی‌دلیل مسدود کنه. جزئیات بیشتر رو می‌تونید در راهنمای رسمی تصاویر گوگل ببینید. نقشه سایت تصاویر می‌تونه پیدا‌شدن بعضی فایل‌هایی رو که دسترسی بهشون سخت‌تره راحت‌تر کنه، ولی همه سایت‌ها به نقشه جداگانه تصاویر نیاز ندارن. اگه افزونه سئو براتون نقشه سایت می‌سازه، اول خروجی فعلی و تنظیمات همون افزونه رو بررسی کنید و مطمئن بشید آدرس تصاویر مهم داخل صفحه‌های قابل‌خزش قرار گرفته. برای آشنایی با یکی از ابزارهای رایج هم می‌تونید آموزش رنک مث رو بخونید. داده ساختاریافته، یعنی اطلاعات استانداردی که نوع محتوای صفحه رو برای موتور جستجو روشن‌تر می‌کنه، باید با محتوای واقعی صفحه هماهنگ باشه. این داده برای صفحه‌هایی مثل محصول یا دستور غذا کاربرد مشخص‌تری داره. بیشتر کاربران لازم نیست فقط برای هر تصویر یک نشانه‌گذاری جدا بسازن؛ بهتره داده ساختاریافته مربوط به نوع خود صفحه رو درست تنظیم کنن. این کار هم جای کیفیت تصویر، Alt مناسب و متن مرتبط رو نمی‌گیره. برای بررسی بخش‌های فنی مرتبط هم راهنمای سئو تکنیکال وردپرس به کارتون میاد. اشتباهات رایج در سئو تصاویر وردپرس فایل‌هایی با حجم یا ابعاد خیلی زیاد رو بدون بهینه‌سازی بارگذاری نکنید. برای چند تصویر متفاوت، Alt یکسان ننویسید. متن جایگزین رو با تکرار کلمه کلیدی پر نکنید. از تصاویر بی‌ارتباط، تار یا کم‌کیفیت فقط برای طولانی‌تر نشان‌دادن مقاله استفاده نکنید. نمایش تصویر در موبایل رو نادیده نگیرید. مشخصات عرض و ارتفاع تصویر رو بدون دلیل حذف نکنید. تصویری رو که احتمالاً LCP صفحه‌ست، بدون آزمایش سرعت با بارگذاری تنبل نمایش ندید. چک‌لیست سئو تصاویر در وردپرس بررسی کنید که صفحه واقعاً به تصویر نیاز داره. فرمت مناسب رو براساس نوع تصویر انتخاب کنید. ابعاد و حجم فایل رو پیش از بارگذاری کاهش بدید. برای فایل یک نام کوتاه و توصیفی بنویسید. برای تصویر اطلاعاتی Alt مناسب بنویسید و Alt تصویر تزئینی رو خالی بذارید. نمایش تصویر رو در موبایل و دسکتاپ بررسی کنید. سرعت صفحه و جابه‌جایی چیدمان هنگام بارگذاری رو آزمایش کنید. سؤال‌های رایج درباره سئو تصاویر در وردپرس آیا همه تصاویر وردپرس به Alt نیاز دارن؟ همه تصاویر باید وضعیت Alt مشخصی داشته باشن، ولی متن اون همیشه پر نمی‌شه. برای تصویر اطلاعاتی توضیح کوتاه و مرتبط بنویسید. اگه تصویر فقط تزئینیه، Alt رو خالی بذارید تا صفحه‌خوان ازش عبور کنه. آیا نام فایل تصویر روی سئو اثر می‌ذاره؟ نام توصیفی می‌تونه سرنخ کوچیکی درباره موضوع تصویر بده، ولی عامل اصلی و مستقل رتبه‌بندی نیست. ارتباط تصویر با متن صفحه، Alt مناسب، کیفیت و سرعت بارگذاری هم اهمیت دارن. WebP بهتره یا AVIF؟ انتخاب بهتر به خود تصویر، ابزار تبدیل، پشتیبانی سایت و کیفیت خروجی بستگی داره. AVIF در بعضی تصاویر می‌تونه فایل کوچک‌تری بسازه، ولی این نتیجه تضمین‌شده نیست. هر دو خروجی رو مقایسه کنید و فایلی رو بردارید که با حجم کمتر، کیفیت مناسبی نشون می‌ده. آیا وردپرس تصاویر رو خودکار واکنش‌گرا می‌کنه؟ وردپرس معمولاً چند اندازه از تصویر می‌سازه و با srcset و sizes به مرورگر اجازه می‌ده نسخه مناسب رو انتخاب کنه. بااین‌حال، باید فایل اصلی رو هم بهینه کنید و مطمئن بشید قالب یا افزونه‌ها این قابلیت رو مختل نکردن. آیا برای سئو باید تعداد مشخصی تصویر در مقاله بذاریم؟ نه، تعداد ثابتی برای همه مقاله‌ها وجود نداره. فقط وقتی تصویر اضافه کنید که به فهم مطلب، نمایش یک مرحله یا مقایسه گزینه‌ها کمک می‌کنه. آیا کم‌کردن حجم تصویر باعث افت کیفیت می‌شه؟ فشرده‌سازی می‌تونه بخشی از اطلاعات تصویر رو کم کنه، ولی با تنظیم درست این افت معمولاً برای کاربر محسوس نیست. بعد از فشرده‌سازی، تصویر رو در اندازه واقعی صفحه بررسی کنید و اگه تار یا لکه‌دار شده، کیفیت خروجی رو کمی بالاتر ببرید. جمع‌بندی برای سئو تصاویر در وردپرس لازم نیست سراغ روش‌های پیچیده برید. اول تصویری رو انتخاب کنید که واقعاً به فهم مطلب کمک می‌کنه. بعد فرمت، ابعاد و حجمش رو متناسب با محل نمایش تنظیم کنید و یک نام توصیفی براش بذارید. اگه تصویر اطلاعات مهمی داره، Alt کوتاه و دقیقی بنویسید؛ ولی Alt تصویر کاملاً تزئینی رو خالی بذارید. در آخر هم نتیجه رو روی موبایل و دسکتاپ ببینید و سرعت بارگذاری و جابه‌جایی صفحه رو بررسی کنید. با همین روند ساده، تصاویر هم برای کاربر مفیدتر می‌شن، هم فشار کمتری به سرعت سایتتون وارد می‌کنن و هم گوگل راحت‌تر موضوع اون‌ها رو می‌فهمه. منبع این مقاله: سئو تصاویر در وردپرس؛ راهنمای کامل و کاربردی

نظرها