SEO الصور: 9 عناصر أساسية

1. اعتبارات عامة لـ SEO الصور

كثيرًا ما نبذل كل جهدنا لترتيب URLs ذات قيمة SEO في SERP. لكن، كما ذكرنا، فإن تحسين الصور أمر مهم لتحقيق ترتيب أعلى في نتائج بحث Google Images وزيادة فرص جذب حركة مرور عضوية من خلالها.

لا يستطيع bot Google "قراءة" الصور. فقد صُمِّم لقراءة كود الموقع، وليس قراءة رسوم متحركة أو صور معينة. لهذا السبب، علينا اتباع مجموعة بسيطة من إرشادات SEO لتزويد bots بهذه المعلومات. وهذا يتيح لـ bot تفسير المعلومات التي نريد عرضها، وتقييم الصورة، وتحديد ما إذا كانت تستحق ترتيبًا أعلى في قسم Google Images.

2. حجم ووزن الصور

من أهم عاملين يجب أخذهما في الاعتبار عند تحسين الصور هما الوزن والحجم.

الوزن:

استخدام صور ثقيلة على الموقع يُطيل زمن تحميل URL الذي تُنفَّذ فيه، ونتيجة لذلك يُبطئ الموقع بأكمله. ولأن زمن التحميل أحد العوامل المؤثرة على الترتيب العضوي على سطح المكتب والجوال، فإن تحسين الصور أمر ضروري.

أدوات لتقليل وزن الصور:

هناك العديد من الأدوات لتقليل وزن الصور. حتى لو لم يكن لديك برنامج تحرير صور احترافي مثل Photoshop أو Illustrator، يمكنك استخدام منصات على الإنترنت مثل:

• ›

  ImageOptim أو TinyJPG، اللتان تقللان وزن الصور دون التأثير على الجودة.

• ›

  Website Speed Test Image Analysis Tool يتيح لك تنزيل تنسيقات صور جديدة بسهولة.

الحجم:

من المهم أيضًا تنفيذ عدة أحجام للصور في كل موقع لعرض الصورة الأنسب وفقًا للجهاز المستخدم. حتى مع وجود plugins تُعدّل حجم الصور، قد لا يكون هذا الخيار هو الأفضل في الواقع. فعلى سبيل المثال، يمكن تقليل الحجم البصري لصورة 1000px إلى 400px، لكن وزن الصورة سيظل كما هو وزن صورة 1000px، مما يؤثر على أداء الويب وسرعته.

الأدوات:

أهم عامل عند اختيار الصور هو معرفة المنصة التي ستعمل عليها. على سبيل المثال، إذا كنت تعمل في WordPress، يمكنك استخدام SmushIt. وهو plugin يتيح تحديد الحد الأقصى للعرض والارتفاع قبل تعديل الحجم وضغط الصور ورفعها إلى الخادم.

أما إذا كنت تعمل على منصة بكود خاص، فعليك إنشاء عملية يدوية أو تلقائية لتحسين الصور قبل رفعها إلى الخادم.

3. تنسيقات الصور الودودة لـ SEO

حاليًا، أفضل طريقة لحفظ صور الويب هي استخدام أحد التنسيقات الأربعة التالية:

• ›

  WebP: يمكن أن يقلل الوزن الأصلي للصورة بنسبة 25-35%. وهو حاليًا أحد أكثر التنسيقات الموصى بها، وعلى الرغم من أن بعض إصدارات المتصفحات لا يمكنها قراءته بعد، إلا أنه أحد التنسيقات التي تسمح بضغط أكبر دون التأثير على جودة الصورة.

• ›

  PNG: أفضل خيار للصور ذات الألوان القليلة والخلفية الشفافة. يُستخدم على نطاق واسع للشعارات.

• ›

  JPG: التنسيق الذي يجب استخدامه للصور الفوتوغرافية أو الصور العامة. تفقد الصورة بعض الجودة عند ضغطها لكنها تحتفظ بنفس الألوان والدرجات.

• ›

  GIF: يُستخدم للرسوم المتحركة والصور المتحركة.

توصيات:

• ›

  استخدم دائمًا تنسيق الصورة الأنسب من حيث الوزن والتوافق.

• ›

  اضغط الصور دائمًا، يدويًا أو من خلال أدوات معالجة تلقائية.

• ›

  إذا كان موقعك يحتوي على عدة أيقونات، فقم بتجميعها في صورة واحدة عبر CSS Sprites لتقليل عدد طلبات الخادم وتحسين أداء الويب.

4. حقول SEO للصورة

تأتي كل صورة مع مجموعة من الحقول المرتبطة بها لتوفير وصول محسَّن لـ bots محركات البحث (وأيضًا للمستخدمين بالطبع).

اسم الصورة

يشير اسم الصورة إلى اسم الملف. هو عنوان الصورة، باستخدام الواصلات والشرطات السفلية بين الكلمات. يُنصح بتضمين الكلمة المفتاحية التي تريد ترتيب الصورة لها وتجنب الأحرف غير المعتادة (مثل "ñ"، "?"، أو الأحرف ذات النبرة "á" وما إلى ذلك).

كما يُنصح بحذف حروف الجر أو الأحرف الأخرى غير الأساسية من اسم الصورة لاختصار URL وجعله ودودًا قدر الإمكان لـ SEO.

Title

هو النص الذي يظهر عند تمرير المؤشر فوق الصورة. يُنصح بإدخاله لإضافة عنوان دلالي للصورة، مع تضمين الكلمة المفتاحية التي تريد تحقيق ترتيب أعلى لها.

يمكن أن يكون مطابقًا للنص alt، ولكن لا يستغرق إعادة كتابة هذه الخاصية وقتًا طويلًا مع بعض التعديلات الطفيفة.

خاصية "Alt"

هذا هو العنصر الأهم لأن Google يقرأه. يجب أن يحتوي على الكلمة المفتاحية الرئيسية التي تريد ترتيب URL لها ووصف قصير.

البنية على النحو التالي:

<img src=”IMAGE LINK” alt=”IMAGE ALT DESCRIPTION” />

مثال على صورة محسَّنة:

استنادًا إلى الكلمة المفتاحية المستهدفة "ciberseguridad pymes" بمتوسط بحث شهري قدره 90 (في إسبانيا)، لنرَ كيف يمكن تحسين كل حقل لهذه الصورة:

اسم الملف:

• ›

  مثال خاطئ: 04745892595295.jpg

• ›

  مثال صحيح: ciberseguridad-pymes.jpg

Title: Consejos de ciberseguridad para empresarios y pymes. (نصائح أمن سيبراني لرواد الأعمال والشركات الصغيرة والمتوسطة.)

نص Alt: Ciberseguridad para pymes y empresarios: consejos. (أمن سيبراني للشركات الصغيرة والمتوسطة ورواد الأعمال: نصائح.)

بهذه الطريقة، تكون لديك صورة مُحسَّنة في جميع الحقول وجاهزة للمنافسة على المراكز العليا. بالطبع، تحسين الصورة لا يضمن ظهورها أولًا، لكنه الخطوة الأولى لتحقيق ذلك :)

5. السياق الدلالي

يعتبر Google أن الصور الأكثر صلة هي تلك التي تتطابق مع المحتوى المحيط بها. لذلك، يُنصح بتضمين نص ذي صلة. وبهذه الطريقة، يتسع السياق الدلالي الكلي لـ URL.

6. sitemap مخصص للصور

لتمكين bot Google من تتبع الصور بكفاءة أكبر، من الضروري إنشاء sitemap.xml مخصص لهذا النوع من الملفات. في WordPress، يمكن إنشاؤه تلقائيًا بأدوات (plugins) مثل Yoast أو RankMath. وإذا لم تكن تعمل في WordPress، يمكنك استخدام أدوات بديلة أو أدوات برمجة يدوية (تتبع URL).

دعنا نرى مثالًا على sitemap يحتوي على صورتين داخل المقال:

<?xml version="1.0" encoding="UTF-8"?> <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1"> <url> <loc>http://example.com/sample.html&lt;/loc> <image:image> <image:loc>http://example.com/image.jpg&lt;/image:loc> </image:image> <image:image> <image:loc>http://example.com/photo.jpg&lt;/image:loc> </image:image> </url> </urlset>

بعض الوسوم الأكثر استخدامًا عند إنشاء sitemap للصور هي:

→ عنوان الصورة

→ URL أو المسار حيث يُحفظ الملف

→ التعليق التوضيحي

→ نوع الترخيص

→ معلومات الموقع الجغرافي

• ›التوثيق: يمكنك العثور على الكثير من المعلومات حول أمثلة sitemap للصور، ودروس التنفيذ، وأكثر في مدونة Google.

بمجرد الانتهاء من التنفيذ، يمكنك التحقق من حالة تغطية الفهرسة في Search Console.

7. Lazy Loading للصور (التحميل عند الطلب)

الصور هي أحد أكثر الموارد استخدامًا على المواقع، لأنه كما يُقال "صورة تساوي ألف كلمة". لذلك، يُطوَّر الجانب البصري لكل موقع بعناية باستخدام عناصر الوسائط المتعددة هذه. ومع ذلك، إذا لم تُحسَّن، فقد تؤثر سلبًا على تجربة المستخدم وزمن تحميل الموقع. لهذا السبب، يُوصى بـ lazy loading.

بفضل lazy loading، تُحمَّل الصور فقط عند ظهورها على الشاشة. على سبيل المثال، إذا كانت في الجزء السفلي من الصفحة الذي لا يظهر بعد على شاشة الجهاز، فلن تُحمَّل حتى يقوم المستخدم بالتمرير. هذا يقلل بشكل كبير من عدد طلبات HTTPS ويختصر زمن التحميل، مما يجعل الصفحة أكثر جاذبية لـ Google.

Plugins لتنفيذ Lazy loading في WordPress

إذا كنت تدير موقعك على هذه المنصة، فهناك plugins قد تثير اهتمامك عندما ترغب في تحسين الصور بتنفيذ lazy loading. لا تنسَ التحقق مما إذا كان القالب المثبت يتضمن هذه الميزة. وإذا لم يكن كذلك، فهناك بعض الخيارات المثيرة للاهتمام:

• ›

  BJ Lazy Load: سهل التثبيت والإعداد، وأحد أكثر الأدوات شعبية بأكثر من 90,000 تثبيت. بفضل هذه الميزة المكملة، يمكنك تكييف الصور مع أحجام شاشات مختلفة.

• ›

  Lazy Load by WP Rocket: الإعداد بسيط وسهل (لأنه لا يقدم خيارات أخرى أساسًا)، وميزة هذا الـ plugin أنه لا يستخدم مكتبات JavaScript مثل jQuery.

8. استخدام CDN للصور

CDN (Content Delivery Network) هو مجموعة من الخوادم الموزعة حول العالم تقدم محتوى الموقع المخزن مؤقتًا وفقًا لموقع مقدم الطلب. بفضل شبكة الاستضافة هذه، يقدم الخادم الأقرب من مقدم الطلب نسخة من الموقع المطلوب.

لذا، باستخدام CDN، يتم تنزيل URLs بشكل أسرع، مما يقلل من زمن تحميل الموقع ويحسن الترتيب العضوي.

استخدام CDN (مثل Cloudflare) لعرض الصور يجعل الصور تُنزَّل وتُعرض بشكل أسرع. هذا التدفق البديهي يحسن SEO مباشرةً.

9. اعتبارات أخرى

يجب أن تكون الصور ذات قيمة SEO، أي تلك التي ترغب في تحقيق ترتيب أعلى لها، مدرجة في كود مصدر URL. الصور المُنفَّذة بخاصية background في CSS لا تكون مرئية لأن Google لا يفهم هذا النوع من أوراق الأنماط.

كما توجد تفاصيل أخرى لا ينبغي تفويتها عند تحسين الصور:

• ›

  Exif: تُحفظ مع كل صورة مجموعة من السمات مثل تاريخ التقاط الصورة وبيانات أخرى ذات صلة بالمحترفين في هذا المجال. ومع ذلك، فهذه المعلومات ليست لها قيمة SEO وتشغل مساحة فقط. حذف هذه المعلومات يمكن أن يساعد في تحسين الصورة وتقليل وزنها.

• ›

  "longdesc": عادة ما تُنسى هذه الخاصية، لكن قد يكون من المثير للاهتمام تنفيذها في الصور. إنها وصف طويل للصورة.

• ›

  الربط: بناء الروابط يلعب دورًا أساسيًا في النمو العضوي للصفحة، لكنه كذلك أيضًا للصور. يمكنك أيضًا ربط هذه الصور وبالتالي تحقيق رؤية أكبر في محركات البحث.

هل تفوتك نصيحة أساسية؟ نود سماع رأيك. اترك تعليقًا أدناه ولا تتردد في مشاركة معرفتك!