تحسين SEO الصور: النص البديل وأسماء الملفات والتحميل الكسول
لماذا تحتاج الصور إلى SEO مستقل؟
كثير من أصحاب المواقع يهتمون بعنوان الصفحة والكلمات المفتاحية وينسون أن الصورة نفسها جزء من تجربة البحث. الصورة الجيدة لا تساعد المستخدم بصرياً فقط، بل تشرح محتوى الصفحة لمحركات البحث، وتظهر في بحث الصور، وتؤثر في سرعة التحميل. لذلك فإن تحسين الصور ليس خطوة تجميلية، بل عمل أساسي ضمن تحسين الموقع.
القاعدة العملية بسيطة: اجعل الصورة مفهومة باسم ملف واضح، ونص بديل مفيد، وحجم مناسب، ثم قدمها للمتصفح بطريقة لا تبطئ الصفحة. عند جمع هذه الخطوات، تحصل على صفحات أسرع ومحتوى أسهل فهماً للأشخاص ومحركات البحث.
اسم الملف: ابدأ بالوصف قبل الرفع
اسم الملف مثل IMG_2048.jpg لا يقول شيئاً. الأفضل أن تستخدم اسماً مختصراً يصف الصورة، مثل coffee-shop-menu-arabic.jpg أو png-transparent-logo.png. لا تحشو الاسم بكلمات كثيرة، ولا تكرر الكلمة نفسها. الهدف هو وصف الصورة لا خداع البحث.
استخدم الشرطة العادية بين الكلمات عند الكتابة بالإنجليزية، وتجنب المسافات والرموز الغريبة. إذا كان جمهورك عربياً، يمكنك أيضاً استخدام اسم عربي واضح، لكن بعض أنظمة إدارة المحتوى تتعامل مع أسماء الملفات اللاتينية بشكل أسهل. الأهم أن يكون الاسم منظماً وثابتاً.
النص البديل Alt Text: وصف لا إعلان
النص البديل يظهر لقارئات الشاشة ويستخدمه المتصفح عند تعذر تحميل الصورة. اكتب جملة قصيرة تصف ما في الصورة ضمن سياق الصفحة. إذا كانت الصورة لمنتج، اذكر نوع المنتج ولونه أو استخدامه. إذا كانت رسماً توضيحياً، صف الفكرة التي يشرحها الرسم.
أمثلة عملية
- ضعيف: "صورة جميلة"
- أفضل: "واجهة أداة ضغط الصور بعد اختيار ملف JPG"
- ضعيف: "أفضل أداة صور مجانية ضغط تحويل JPG PNG"
- أفضل: "مقارنة بين حجم صورة JPG قبل الضغط وبعده"
لا تضع النص البديل للصورة الزخرفية فقط لإضافة كلمات مفتاحية. إذا كانت الصورة لا تضيف معنى، يمكن ترك alt فارغاً في HTML حتى لا تزعج قارئات الشاشة.
الحجم والصيغة قبل أي شيء
حتى أفضل نص بديل لن ينقذ صفحة بطيئة بسبب صورة ضخمة. قبل رفع الصورة، غيّر أبعادها إلى المقاس الفعلي المطلوب باستخدام أداة تغيير حجم الصورة. بعد ذلك اضغطها عبر ضغط الصور أو حوّلها إلى WebP عبر تحويل JPG إلى WebP.
استخدم JPG للصور الفوتوغرافية، PNG للشفافية والرسومات الحادة، وWebP لصور الويب عندما تريد توازناً جيداً بين الجودة والحجم. إذا كانت الصورة تحتوي نصاً صغيراً أو شعاراً، قارن النتيجة بعد الضغط باستخدام مقارنة صورتين.
التحميل الكسول Lazy Loading
خاصية loading="lazy" تؤخر تحميل الصور البعيدة عن الشاشة حتى يقترب المستخدم منها. هذا يقلل وزن الصفحة عند الفتح الأول، خصوصاً في المقالات الطويلة وصفحات الأدوات التي تحتوي أمثلة كثيرة. لا تستخدم التحميل الكسول للصورة الرئيسية في أعلى الصفحة، لأن المتصفح يحتاجها فوراً.
مثال بسيط:
<img src="example.webp" alt="مثال على صورة مضغوطة" loading="lazy">
قائمة فحص سريعة
- اكتب اسم ملف واضحاً قبل الرفع.
- أضف نصاً بديلاً يصف الصورة ضمن سياقها.
- غيّر الأبعاد إلى المقاس الفعلي لا المقاس الأصلي للكاميرا.
- اضغط الصورة أو حوّلها إلى WebP عند النشر على الويب.
- استخدم التحميل الكسول للصور غير الظاهرة في الشاشة الأولى.
تحسين صورك بهذه الطريقة يجعل الصفحة أخف، والمحتوى أوضح، وتجربة المستخدم أفضل. لا تحتاج إلى أدوات معقدة، بل إلى خطوات ثابتة تطبقها على كل صورة قبل النشر.
مثال كامل قبل وبعد
لنفترض أن لديك صورة منتج باسم IMG_8831.png بحجم 3 ميجابايت وأبعاد 4000×3000. الخطوة الأولى تغيير الاسم إلى شيء واضح مثل leather-wallet-brown.jpg. بعد ذلك تصغّر الصورة إلى العرض المطلوب في صفحة المنتج، مثلاً 1200 بكسل. ثم تضغطها أو تحولها إلى WebP إذا كان المتجر يدعم ذلك.
النص البديل يمكن أن يكون: "محفظة جلدية بنية مفتوحة تظهر الجيوب الداخلية". هذا النص يصف الصورة فعلاً، ولا يحشو كلمات مثل شراء أو أفضل أو رخيص. النتيجة صورة أخف، واسم مفهوم، ونص بديل يخدم الوصول والبحث في الوقت نفسه.
أخطاء تضر SEO الصور
- استخدام النص البديل نفسه لكل صور الصفحة.
- رفع صور بأبعاد الكاميرا الأصلية دون حاجة.
- تسمية الملفات بأرقام عشوائية فقط.
- استخدام PNG للصور الفوتوغرافية الكبيرة دون سبب.
- تطبيق تحميل كسول على الصورة الرئيسية فوق الطية الأولى.
تحسين الصور عملية تراكمية. كل صورة محسّنة توفر جزءاً من وقت التحميل، ومع عدد كبير من الصور يصبح الفرق واضحاً للمستخدم ومحركات البحث.