وردپرس و انتشار محتوا
حدود ۱۱ دقیقه مطالعهآخرین به‌روزرسانی: ۱۴۰۵/۷/۵

چطور عکس مقاله‌مون رو توی وردپرس درست بذاریم که هم سبک باشه هم قابل‌فهم؟

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

مقدمه

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

این راهنما برای صاحب سایت، مدیر سئو و مدیر محتوا نوشته شده؛ یعنی قرار نیست فقط درباره فشرده‌سازی حرف بزنیم. قدم‌به‌قدم می‌ریم جلو تا بدونید قبل از آپلود چه کاری انجام بدید، داخل کتابخانه رسانه چه چیزهایی رو بررسی کنید و قبل از انتشار از کجا بفهمید عکس مقاله واقعاً آماده است.

فهرست مطالب

اول مشخص کنید عکس قرار است چه کاری انجام بدهد

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

بین تصویر تزئینی و تصویر اطلاعاتی فرق بذارید

تصویر تزئینی قرار نیست اطلاعات تازه‌ای به کاربر بده؛ مثلاً یک پس‌زمینه ساده یا تصویری که فقط فضای مقاله رو بهتر می‌کنه. تصویر اطلاعاتی اما چیزی رو توضیح می‌ده، مثل اسکرین‌شات تنظیمات وردپرس، نمودار یا عکس محصول. این تفاوت بعداً روی متن جایگزین هم اثر می‌ذاره.

برای عکس اطلاعاتی، قبل از انتشار از خودتون بپرسید: «اگه کاربر تصویر رو نبینه، چه بخشی از اطلاعات رو از دست می‌ده؟» جواب همین سؤال کمک می‌کنه متن جایگزین رو دقیق بنویسید، نه اینکه فقط چند کلمه کلی مثل «عکس مقاله» وارد کنید.

عکس رو با هدف مقاله هماهنگ کنید

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

قبل از آپلود، اندازه و فرمت فایل رو درست انتخاب کنید

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

اندازه تصویر رو با جای نمایش هماهنگ کنید

برای عکس شاخص، عرض محتوای سایت و اندازه‌ای که قالب استفاده می‌کنه رو بررسی کنید. برای تصویرهای داخل مقاله هم همین منطق رو به کار ببرید. لازم نیست همه عکس‌ها یک اندازه باشن، اما بهتره نسبت تصویرها بی‌دلیل تغییر نکنه؛ چون کشیده شدن عکس یا فضای خالی نامنظم، فهم صفحه رو سخت می‌کنه.

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

فرمت مناسب رو بر اساس نوع عکس انتخاب کنید

  • JPEG: برای عکس‌های واقعی و تصویری که رنگ‌های زیادی دارن، معمولاً انتخاب مناسبیه.
  • PNG: برای تصویرهایی که شفافیت، لبه‌های دقیق یا نوشته‌های گرافیکی دارن، کاربردی‌تره؛ ولی ممکنه حجم بیشتری ایجاد کنه.
  • WebP: برای بسیاری از تصاویر وب گزینه کم‌حجم و کاربردیه، به شرطی که فرایند سایت و مرورگرهای هدف شما باهاش سازگار باشه.
  • SVG: برای آیکون و لوگوی برداری مناسبه، نه برای عکس‌های معمولی. استفاده ازش باید با ملاحظات امنیتی و پشتیبانی وردپرس و هاست هماهنگ باشه.

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

حجم عکس رو کم کنید، بدون اینکه خوانایی از بین بره

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

یک روند ساده برای فشرده‌سازی داشته باشید

  1. نسخه اصلی تصویر رو جدا نگه دارید تا اگه لازم شد دوباره خروجی بگیرید.
  2. تصویر رو به اندازه مناسب برش بدید و بخش‌های اضافی رو حذف کنید.
  3. فرمت رو بر اساس نوع تصویر انتخاب کنید.
  4. خروجی رو فشرده کنید و بعد در اندازه واقعی نمایش روی صفحه بررسی کنید.
  5. اگر متن یا جزئیات مهم تار شده، کیفیت یا ابعاد رو کمی اصلاح کنید.

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

نام فایل و متن جایگزین رو طوری بنویسید که معنی داشته باشه

نام فایل خوب به شما و تیم‌تون کمک می‌کنه بعداً تصویر رو در کتابخانه رسانه پیدا کنید. به‌جای اسم‌هایی مثل IMG_4832.jpg، از یک نام کوتاه و توصیفی استفاده کنید؛ مثلاً wordpress-featured-image-settings.webp. کلمات رو با خط تیره جدا کنید و اسم فایل رو بیش از حد طولانی یا پر از کلیدواژه نکنید.

متن جایگزین باید تصویر رو توصیف کنه

متن جایگزین یا alt برای وقتی استفاده می‌شه که تصویر بارگذاری نشه یا کاربر با صفحه‌خوان سایت رو بخونه. این متن باید بگه تصویر چه چیزی رو نشان می‌ده، نه اینکه صرفاً کلیدواژه اصلی رو تکرار کنه.

  • بد: «تصویر بهینه سازی تصویر در وردپرس»
  • بهتر: «بخش تنظیم تصویر شاخص در ویرایشگر وردپرس»

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

عنوان و کپشن رو با alt قاطی نکنید

عنوان تصویر برای مدیریت رسانه و بعضی نمایش‌های سایت کاربرد داره. کپشن هم متنیه که معمولاً زیر عکس به کاربر نمایش داده می‌شه. این سه مورد می‌تونن مرتبط باشن، اما قرار نیست یک جمله رو در هر سه‌جا کپی کنید. کپشن فقط وقتی لازمه که منبع، توضیح یا نکته‌ای برای فهم عکس وجود داشته باشه.

عکس رو داخل وردپرس درست وارد و تنظیم کنید

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

برای تصویر شاخص این موارد رو بررسی کنید

  • موضوع تصویر با عنوان و محتوای مقاله هم‌خوان باشه.
  • سوژه اصلی در برش‌های مختلف قالب از بین نره.
  • متن جایگزین کوتاه و توصیفی نوشته شده باشه.
  • تصویر در پیش‌نمایش موبایل هم قابل‌فهم بمونه.

بعضی قالب‌ها تصویر شاخص رو در صفحه مقاله، صفحه دسته‌بندی و کارت‌های مرتبط با نسبت‌های متفاوت نمایش می‌دن. برای همین، عکس رو فقط در صفحه ویرایش نبینید؛ پیش‌نمایش مقاله و چند جای اصلی سایت رو هم بررسی کنید.

برای عکس‌های داخل متن، جای درست مهم‌تر از تعداد عکس‌هاست

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

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

داده‌های تصویر رو بعد از آپلود پاک‌سازی کنید

فایل‌های دوربین یا نرم‌افزارهای طراحی ممکنه اطلاعات اضافی مثل موقعیت جغرافیایی، مدل دستگاه یا داده‌های فنی داشته باشن. این اطلاعات برای نمایش عکس مقاله معمولاً لازم نیست. حذف متادیتای غیرضروری می‌تونه فایل رو ساده‌تر کنه و از انتشار ناخواسته اطلاعات جلوگیری کنه.

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

قبل از انتشار، یک کنترل سریع انجام بدید

برای اینکه بهینه سازی تصویر در وردپرس از یک توصیه کلی به یک کار قابل‌اجرا تبدیل بشه، این چک‌لیست رو قبل از انتشار هر مقاله اجرا کنید:

  • عکس به موضوع همان بخش کمک می‌کنه و فقط تزئینی نیست؟
  • ابعاد فایل با جای نمایش هماهنگه؟
  • فرمت انتخاب‌شده برای نوع تصویر مناسبه؟
  • تصویر بعد از فشرده‌سازی هنوز نوشته‌ها و جزئیات مهم رو واضح نشون می‌ده؟
  • نام فایل کوتاه، توصیفی و قابل جست‌وجو در رسانه است؟
  • متن جایگزین برای تصویر اطلاعاتی نوشته شده؟
  • عکس در موبایل، دسکتاپ و برش تصویر شاخص درست دیده می‌شه؟
  • کپشن یا منبع، اگر لازم بوده، اضافه شده؟
  • نسخه اصلی و نسخه آماده انتشار رو از هم جدا نگه داشته‌اید؟

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

چند خطای رایج که بهتره تکرارشون نکنید

آپلود عکس اصلی دوربین یا فایل طراحی

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

تکرار کلیدواژه در نام و alt

توصیف مصنوعی به کاربر کمک نمی‌کنه. تصویر رو همان‌طور که هست توضیح بدید و فقط وقتی کلیدواژه رو بیارید که واقعاً بخشی از توصیف طبیعی تصویر باشه.

استفاده از یک عکس برای چند مفهوم متفاوت

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

بی‌توجهی به برش قالب

ممکنه عکس در متن عالی دیده بشه، اما در کارت مقاله سوژه‌اش بریده بشه. پیش‌نمایش جایگاه‌های مهم قالب رو ببینید و سوژه اصلی رو در ناحیه امن تصویر قرار بدید.

یک روند ثابت برای تیم محتوا بسازید

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

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

برای سایت‌های بزرگ‌تر، بهتره یک نمونه تأییدشده از تصویر شاخص، اسکرین‌شات آموزشی و تصویر تزئینی داشته باشید. این نمونه‌ها به اعضای جدید تیم نشون می‌دن «قابل‌فهم» و «سبک» در سایت شما دقیقاً یعنی چه.

سوالات متداول

آیا وردپرس خودش حجم همه عکس‌ها را کم می‌کند؟

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

برای تصویر مقاله JPEG بهتر است یا WebP؟

به نوع تصویر و پشتیبانی فرایند سایت‌تون بستگی داره. برای عکس‌های واقعی، JPEG و WebP هر دو می‌تونن مناسب باشن؛ WebP در بسیاری از موارد خروجی کم‌حجم‌تری می‌ده. قبل از تصمیم نهایی، خوانایی تصویر و سازگاری قالب و ابزارهای سایت رو بررسی کنید.

متن جایگزین تصویر را چقدر طولانی بنویسیم؟

تا جایی بنویسید که محتوای واقعی تصویر برای کاربر روشن بشه؛ نه بیشتر. یک جمله کوتاه و طبیعی معمولاً کافیه. اگه تصویر تزئینیه و اطلاعاتی منتقل نمی‌کنه، می‌شه متن جایگزین رو خالی گذاشت.

آیا کوچک کردن عکس در ویرایشگر وردپرس حجم فایل را کم می‌کند؟

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

برای هر مقاله چند عکس بگذاریم؟

عدد ثابتی وجود نداره. هرجا تصویر به فهم موضوع، دنبال کردن مراحل یا خوانایی متن کمک می‌کنه ازش استفاده کنید. عکس اضافی هم صفحه رو شلوغ می‌کنه و هم ممکنه زمان بارگذاری و نگهداری محتوا رو بیشتر کنه.

نتیجه‌گیری

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

این راهنما رو روی سایت خودت امتحان کن

با حرفو، از انتخاب موضوع تا انتشار جلو برو. شروعش با ۲ مقالهٔ رایگانه.

شروع با ۲ مقالهٔ رایگان