عنوان الصورة مقابل. نص بديل: أيهما أفضل؟

نشرت: 2020-12-09

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

ولكن إذا كنت تعتقد أن الصور تدور حول مطابقة المحتوى والصور ، فستكون مفاجأة. يمكنك استخدام الصور لجذب ليس فقط زوار الويب ولكن أيضًا لمحركات البحث. ولكن لإطلاق العنان للقوة الكاملة التي تقدمها الصورة ، يجب عليك إلقاء نظرة خاطفة قليلاً على الغطاء وفهم كود HTML الذي يعرض الصور على موقع الويب الخاص بك.

بمجرد مراجعة مكونات علامة الصورة ، يمكنك المضي قدمًا لتحسين تلك التي ستؤثر على تصنيفات محرك البحث الخاص بك. عادةً ما تكون العناصر المراد استهدافها هي عنوان img src وعنوان بديل لـ HTML img. هل تعرف الدور الذي يلعبه هذان الشخصان على موقع الويب الخاص بك؟ الجواب سيكون موضوع هذا المقال.

فهم عنوان الصورة والنص البديل للصورة

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

img src = "rocking-chair.jpg" alt = "كرسي هزاز بني للبيع" title = "كرسي هزاز بني"

في تصميم الويب ، تحصل العناصر التي تحمل علامة التساوي على سمات الاسم. لاحظ أن المثال أعلاه مجرد توضيح. في تطبيقات العالم الحقيقي ، تكون السمات أكثر بكثير وقد تتضمن فئة ومعرفًا وارتفاعًا وعرضًا وما إلى ذلك.

من العلامة ، يكون تحديد النص البديل والعنوان أمرًا مباشرًا. قد تلاحظ أن سمة النص البديل أكثر إفادة مقارنة بعلامة صورة عنوان HTML. تكشف نظرة سريعة على استخدامات كلتا السمتين سبب ذلك.

ما هو عنوان الصورة المستخدمة؟

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

عنوان الصورة مقابل. نص بديل: أيهما أفضل

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

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

ما هو النص البديل المستخدم؟

يخدم النص البديل أكثر من غرض واحد. يمكنك تقسيمها على النحو التالي:

  • يتم عرض النص البديل في كل مرة يفشل فيها تحميل صورة. تسمح جميع المتصفحات تقريبًا بأوصاف بديلة لتمثيل الصور الفارغة. قد يكون ذلك بسبب اسم ملف صورة غير صحيح أو عنوان URL معطل. قد يؤدي ضعف اتصالات الإنترنت أيضًا إلى منع التحميل المناسب للصور. في مثل هذه الحالة ، يظهر عنوان img alt ويشرح للزائر كل ما يتعلق بالصورة.
  • يتم عرض النص البديل أيضًا عندما يقوم المستخدمون بإيقاف تشغيل الصور. بقدر ما تُجمل الصور صفحات الويب ، يفضل بعض المستخدمين الإصدارات النصية فقط. وبالتالي ، يمكنهم معرفة الصور من خلال قراءة النص البديل.
  • يستفيد المستخدمون المكفوفون أيضًا من عناوين img alt المكتوبة جيدًا. تستخدمهم برامج قراءة الشاشة لوصف صورة للزوار الذين لا يمكنهم رؤيتها. بشكل عام ، تساعد النصوص البديلة في زيادة إمكانية الوصول إلى موقعك. أهمية الوصول إلى الحد الأقصى كبيرة جدًا لدرجة أن W3C تدعو إلى نصوص بديلة. يقرأ سطر من إرشاداتهم: "عند استخدام عنصر img ، حدد بديلًا نصيًا قصيرًا باستخدام سمة alt."
  • أخيرًا ، تستخدم محركات البحث نصوصًا بديلة للحصول على فهم أفضل لما تدور حوله الصورة. وبالتالي ، يمكن الزحف إلى النصوص البديلة ، تمامًا مثل المحتوى الآخر على موقع الويب الخاص بك. تُظهر الصورة أدناه مثالاً للنص البديل:

عنوان الصورة مقابل. نص بديل: أيهما أفضل

(مصدر الصورة: MDN-Mozilla)

ما هو الأكثر أهمية: عنوان الصورة أم نص بديل؟

من الآمن تسمية سمة النص البديل بأنها أكثر أهمية بعد النظر في قوائم استخدامات العناوين والنصوص البديلة. ومع ذلك ، سيكون من الخطأ الاعتقاد بأن العناوين عديمة الفائدة. في الحقيقة ، يمكن أن يكون أي من العناصر مهمًا اعتمادًا على أهدافك.

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

سوف تكون مهتمًا

لكن لماذا لا تولي محركات البحث اهتمامًا كبيرًا لعناوين الصور؟

حسنًا ، الجواب يتعلق كثيرًا بتطوير محركات البحث. كتب المطورون معظم قواعد كود Google في عام 1999. كانت هناك أيضًا إضافات مهمة في العام التالي. ومع ذلك ، لم يفكروا أبدًا في عناصر HTML غير الشائعة وغير المكتشفة. نظرًا لأن مصممي الويب لا يستخدمون العناوين بشكل متكرر ، فلا يوجد سبب لتقديمها. التحديثات التي تم إجراؤها على الكود الأساسي لم تجعل علامة صورة عنوان HTML مهمة مثل السمات الأخرى.

إذا كنت تفكر في تحسين محركات البحث ، فيجب أن يكون تركيزك على النص البديل. تذكر أن Google تتعامل مع المعلومات الموجودة في سمة النص البديل كمحتوى عادي لصفحة الويب. وبالتالي ، فإنه يفهرسها. بالإضافة إلى ذلك ، قد تواجه محركات البحث مشكلة في الزحف إلى صورة. تقدم النصوص البديلة طريقة ممتازة بالنسبة لهم لمعرفة ماهية الصورة.

علاوة على ذلك ، تأخذ النصوص البديلة إمكانية الوصول إلى موقع الويب إلى مستوى جديد تمامًا. على الرغم من تقنيات مثل التحميل البطيء ، يكاد يكون من المستحيل التأكد من أن جميع الصور على موقعك سيتم تحميلها بنسبة 100٪ من الوقت. قد يقوم الزائر بإيقاف تشغيل الصور أو يكون الاتصال بطيئًا جدًا بحيث لا يتم تحميل الصور أبدًا. مسلحًا بنص بديل ، يمكنك التأكد من أن المستخدم سيعرف ماهية الصورة سواء تم تحميلها أم لا.

بشكل قاطع ، تفوق أهمية النص البديل سمات العنوان إلى حد بعيد. استخداماتها عديدة نسبيًا ، وتأثيرها على ترتيب موقع الويب جدير بالملاحظة. في حين أنه من المهم تحسين كل من العنوان والنص البديل ، فمن الجيد إعطاء المزيد من الأهمية لمعلومات سمة النص البديل.

تحسين النص البديل لتحسين محركات البحث

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

اختبر أداء موقعك وتحسين محركات البحث في 60 ثانية!

يعد التصميم الجيد لموقع الويب أمرًا بالغ الأهمية لمشاركة الزائرين والتحويلات ، ولكن موقع الويب البطيء أو أخطاء الأداء يمكن أن تجعل أداء أفضل موقع ويب أقل تصميمًا. يعد Diib من أفضل أدوات مراقبة أداء مواقع الويب وتحسين محركات البحث في العالم. يستخدم Diib قوة البيانات الضخمة لمساعدتك على زيادة حركة المرور والتصنيفات الخاصة بك بسرعة وسهولة. كما رأينا في Entrepreneur!

  • أداة آلية لتحسين محركات البحث سهلة الاستخدام
  • أفكار + مراقبة الكلمات الرئيسية والروابط الخلفية
  • يضمن السرعة والأمان وتتبع العناصر الحيوية الأساسية
  • يقترح بذكاء أفكارًا لتحسين مُحسّنات محرّكات البحث
  • أكثر من 250.000 ألف عضو عالمي
  • المقارنة المعيارية المضمنة وتحليل المنافسين

على سبيل المثال "www.diib.com"

مستخدمة من قبل أكثر من 250 ألف شركة ومؤسسة:

  • شعار
  • شعار
  • شعار
  • شعار

يتزامن مع تحليلات كوكل

بناء وصلة

اكتب للبشر

عندما يتعلق الأمر بكتابة نصوص بديلة ، فإن القاعدة الأساسية هي: "اكتب كأنك تكتب لشخص أعمى". بالنظر إلى المناسبات التي يتم فيها عرض النص البديل ، فإن ملاحظة القاعدة في جميع الأوقات لا تسبب أي ضرر. كما ذكرنا ، تظهر المعلومات الواردة في عنوان img alt عندما يتعذر عرض الصور. وبالتالي ، فأنت تريده أن يخبرنا بكل شيء عن الصورة المخفية.

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

عنوان الصورة مقابل. نص بديل: أيهما أفضل

(حقوق الصورة: Web Hosting Hub)

اكتب لمحركات البحث

لا يوفر النص البديل وصفًا للصورة للمستخدمين فحسب ، بل يوفر أيضًا لمحركات البحث. وبالتالي ، قم بتضمين كلمة رئيسية فيه. مثل المحتوى الآخر ، تأكد من ملاحظة أنه يحتوي على كلمة رئيسية تتناغم مع التدفق العام لصفحة الويب التي توجد بها الصورة.

على نفس المنوال ، ابتعد عن ممارسات تحسين محركات البحث السيئة مثل حشو الكلمات الرئيسية. ستقوم محركات البحث بوضع علامة على المحتوى الخاص بك على أنه محتوى غير مرغوب فيه ، مما يحافظ على ترتيبك منخفضًا. من الأفضل كتابة نص بديل بشكل سيئ بدلاً من حشو الكلمات الرئيسية. كتحقق ، تأكد من عدم استخدام الكلمة الرئيسية في أكثر من 70٪ من صورك.

اختصر

يصف النص البديل صورة ، وقد يكون من المغري وضع الكثير من الكلمات في علامات اقتباس سمات النص البديل. لكن الامتناع عن القيام بذلك. لن تعاقبك محركات البحث على ذلك ، لكن اهتمامهم ينصب على الكلمات الستة عشر الأولى من الوصف البديل. يجب أن يصف النص البديل المكون من 125 حرفًا صورة بشكل مناسب دون المساس بتجربة المستخدم.

ومع ذلك ، إذا كنت تشعر أن الصورة تتطلب وصفًا طويلاً ، فمن الحكمة استخدام خاصية "longdesc". تسمح HTML4 وخواصها بهذه السمة في علامة الصورة.

أمثلة على النص البديل

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

يمكن أن تبدو علامة الصورة الخاصة بك كما يلي:

img src = ”speeding-car.jpg” alt = "سيارة حمراء" عنوان = "سيارة"

في مثل هذه الحالة ، لا يكون النص البديل مثاليًا. إنه يوفر معلومات قليلة جدًا بخصوص الصورة. قد تظهر نسخة أفضل على النحو التالي:

img src = ”speeding-car.jpg” alt = "سيارة حمراء مسرعة على طريق سريع" title = "car"

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

img src = ”speeding-car.jpg” alt = ”هذه سيارة حمراء. السيارة الحمراء تتحرك بسرعة كبيرة وهي سيارة حمراء جميلة "title =" car "

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

كيفية إضافة نص بديل

يعتمد إجراء تضمين نص بديل في علامة الصورة على ما استخدمته لإنشاء موقع ويب. إذا كتبت الكود الثابت لموقع الويب ، فمن الأفضل إضافة السمة البديلة يدويًا. علي سبيل المثال:

عنوان الصورة مقابل. نص بديل: أيهما أفضل

ومع ذلك ، فإن تطوير الويب اليوم بالكاد ينطوي على أي ترميز ثابت. من المحتمل أنك استخدمت نظام إدارة المحتوى (CMS) أو منشئ مواقع الويب. تأكد من معرفة العملية التي تستخدمها أداة تصميم الويب عند إضافة جميع النصوص. عادةً ما تتضمن المنهجية خطوتين أو ثلاث خطوات.

في أكثر أنظمة إدارة المحتوى شيوعًا في العالم ، WordPress ، إضافة عنوان بديل بتنسيق HTML هو نزهة في المتنزه. بمجرد تسجيل الدخول إلى حسابك ، حدد الصورة المعنية وانقر فوق الزر "تحرير". يظهر حقل الإدخال جاهزًا لتلقي بيانات السمة البديلة.

يمكنك تضمين نصوص بديلة في مكتبة وسائط WordPress. بعد تحديد صورة ، حدد موقع حقل إدخال الوصف البديل المعروض أسفل تفاصيل مرفق الصورة. على سبيل المثال:

عنوان الصورة مقابل. نص بديل: أيهما أفضل

(حقوق الصورة: WPBeginner)

متى تترك السمة البديلة فارغة

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

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

من الممارسات الجيدة أيضًا استبعاد النص البديل للصور التي تحتوي على كلمات. كل المعلومات في الصورة. لذلك ، فإن وصف الكلمات لن يكون ذا صلة.

تحسين العنوان

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

ومع ذلك ، تدعو W3C علانية إلى تضمين العنوان في علامة الصورة. قد يكون رمز HTML الخاص بك غير صالح لـ W3C إذا فشلت في تسمية صورك.

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

عنوان الصورة مقابل. نص بديل: أيهما أفضل

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

نأمل أن تكون قد وجدت هذه المقالة مفيدة.

إذا كنت تريد معرفة المزيد عن صحة موقعك ، احصل على توصيات وتنبيهات شخصية ، قم بفحص موقع الويب الخاص بك بواسطة Diib. يستغرق 60 ثانية فقط.

أدخل موقع الويب الخاص بك

على سبيل المثال "www.diib.com"

لا أستطيع الحصول على ما يكفي من DIIB !! أفضل أداة وأنا ممتن جدًا للعثور عليها. أنا أحب ذلك تماما!! عبرت أصابعك لا ترفع أسعارك لأن هذا مثالي جدًا.
الشهادات - التوصيات
كاتارينا غيج
مدير العمليات في ahoymatey.com.au

اعتبارات أخرى تتعلق بالصور

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

احتفظ ببيانات النص الحيوية بعيدًا عن الصور

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

ومع ذلك ، لا ضرر من استخدام الصور لعرض الرسوم البيانية. قد يوفر HTML الوظيفة ، لكن الصور هي حل ممتاز.

اهتم بالسياق

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

اكتب اسم ملف صورة جيدة

تظهر أسماء الملفات في السمة img src title لعلامة الصورة. تستخدمه محركات البحث لمعرفة المزيد عن الصور الموجودة على موقعك.

بشكل افتراضي ، تحتوي الصور على أسماء ملفات أبجدية رقمية ، مثل:

A00002.jpg

تأكد من تغيير الأسماء بحيث تعكس محتويات الصورة. أثناء ذلك ، تذكر أن توصّل أسماء الملفات التي تتجاوز كلمة واحدة. سيكون من الصعب على محركات البحث قراءة اسم مثل red-car-on-highyway.jpg إذا كانت الواصلات مفقودة. ومع ذلك ، لا تقم بتغيير تنسيق الصورة ، أي الحروف بعد الفترة. قد يتم الخلط بين المستعرضات إذا كان التنسيق مختلفًا عن التنسيق الذي يقدمه اسم الملف.

دع صورك تخلق فرق تحسين محركات البحث

عندما يتعلق الأمر بمُحسّنات محرّكات البحث ، فلا جدال في أن المحتوى هو الملك. لكن الصور هي جزء من محتوى موقع الويب الخاص بك مثل الكلمات. من خلال تعلم فن إتقان عنوان HTML img وتحسين عنوان HTML img البديل ، يمكنك البدء في استخدام الصور لزيادة تصنيف موقعك.

Diib: حسّن عناوين الصور اليوم!

إذا واجهتك مشكلة في استخدام الصور لتحسين محركات البحث ، فتذكر مراجعة مئات الأدوات المخصصة لتحسين الصور. يمكنك أيضًا إشراك متخصص تحسين محركات البحث (SEO) للمساعدة في موقع الويب الخاص بك أثناء تركيزك على عملك. ولكن قبل أن تفكر في هذا الحد ، خذ الأول وابدأ في استخدام الصور لزيادة حركة المرور بنفسك. بعد ذلك ، اشترك مع Diib Digital لتحقيق أقصى استفادة من عناوين الصور الخاصة بك. ستمنحك لوحة معلومات المستخدم الخاصة بنا تنبيهات وأهدافًا مصممة لتحسين ، من بين أشياء أخرى ، عناوين الصور الخاصة بك.

فيما يلي بعض الميزات التي تميزنا عن الآخرين:

  • أهداف مخصصة مصممة لتحسين أداء الموقع
  • التنبيهات التي تخبرك عن مشكلات تحسين محركات البحث الفنية الأخرى الخاصة بـ Domain Authority
  • الصفحات المكسورة التي يوجد بها روابط خلفية (404 checker)
  • أدوات مراقبة وتتبع الكلمات الرئيسية والوصلة الخلفية والفهرسة
  • تجربة المستخدم وتحسين سرعة الهاتف المحمول
  • تحسين عنوان الصورة
  • منصة محددة أداء ما بعد

انقر هنا للحصول على فحص مجاني أو اتصل ببساطة على 800-303-3510 للتحدث إلى أحد خبراء النمو لدينا.