النص البديل

الخلاصة — النص البديل هو وصف قصير تضيفه إلى الصورة حتى يعرف الأشخاص الذين لا يستطيعون رؤيتها — ومحركات البحث — الغرض منها. تضيفه عبر سمة alt على عنصر <img>. وهو أحد مدخلات إمكانية الوصول (وليس ضمانًا للامتثال الكامل بحد ذاته)، ويساعد صورك على الظهور في بحث الصور. صف ما تفعله الصورة في تلك الصفحة، وليس فقط ما تعرضه؛ لا تحشو الكلمات المفتاحية؛ استخدم alt="" فارغة للصور الزخرفية البحتة؛ وبالنسبة لأزرار الأيقونات والصور المرتبطة، صف الإجراء أو الوجهة بدلاً من ذلك.

ما هو النص البديل

عندما تضع صورة على صفحة ويب، يبدو الكود هكذا:

<img src="dalmatian-puppy.jpg" alt="Dalmatian puppy playing fetch in a park">

جزء alt="..." هو النص البديل — اختصار لـ النص البديل. وهو بديل مكتوب للصورة: وصف قصير لما تعرضه الصورة أو تفعله. إذا تعذر رؤية الصورة، يُستخدم النص البديل بدلاً منها.

ستسمع غالبًا الناس يسمونه “وسم alt.” هذا هو الاسم الشائع، لكنه ليس دقيقًا تمامًا — <img> هو الوسم، وalt هي سمة عليه. سأستخدم “النص البديل” و”سمة alt” هنا، لكن إذا قلت “وسم alt”، فسيفهم الجميع ما تقصده.

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

لماذا هو مهم

يقوم النص البديل بمهمتين مهمتين:

• إمكانية الوصول. الأشخاص المكفوفون أو ضعاف البصر يستخدمون قارئات الشاشة التي تقرأ الصفحات بصوت عالٍ. عندما تصل قارئة الشاشة إلى صورة، تقرأ النص البديل. بدون نص بديل، لا يحصلون على أي شيء مفيد — أو الأسوأ، تعلن القارئة عن اسم ملف الصورة. هذا ليس مجرد أمر لطيف: غياب النص البديل هو أحد أكثر الأشياء شيوعًا التي يتم الإبلاغ عنها في دعاوى قضايا إمكانية الوصول لمواقع الويب.
• SEO للصور. لا تستطيع محركات البحث “رؤية” صورة كما تراها أنت. النص البديل هو الطريقة الرئيسية التي تخبر بها Google وBing عن موضوع الصورة، مما يساعد صورك على الظهور في بحث الصور.

كيفية كتابة نص بديل جيد

بعض القواعد البسيطة:

• صف ما هو موجود فعليًا في الصورة، في سياق صفحتك. “جرو دالماتي يلعب بالكرة في حديقة” رائع. “جرو، كلب، جراء، وكلاب” هو حشو كلمات مفتاحية — لا تفعل ذلك.
• لا تبدأ بـ “صورة لـ” أو “صورة فوتوغرافية لـ.” محركات البحث وقارئات الشاشة تعرف بالفعل أنها صورة. فقط صفها.
• اجعله قصيرًا. عبارة أو جملة. لا تحتاج إلى فقرة.
• للصور الزخرفية، استخدم alt="" فارغة. إذا كانت الصورة مجرد خط فاصل أو زخرفة خلفية لا تضيف شيئًا، أعطها alt="" (بدون أي شيء بين علامتي الاقتباس). هذا يخبر قارئات الشاشة بتخطيها. لا تترك سمة alt مفقودة تمامًا — هذا أسوأ في الواقع. الاختبار: إذا كانت الصورة لا تضيف أي معلومات تتجاوز ما تقوله الصفحة بالفعل في مكان آخر، فهي زخرفية.
• بالنسبة للأزرار وعناصر التحكم التي تحتوي على أيقونات فقط، صف الإجراء، وليس الأيقونة. زر بحث بأيقونة عدسة مكبرة يجب أن يقول alt="Search"، وليس alt="Magnifying glass" — يحتاج الشخص إلى معرفة ما يحدث عند تفعيله.

الشيء الذي يخطئ فيه معظم الناس

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

تريد النسخة الدقيقة — الاقتباسات الدقيقة من Google، والتمييز بين بحث الصور وبحث الويب، والصور الزخرفية، والصور المرتبطة، وكيفية العثور على النص البديل المفقود على نطاق واسع؟ انتقل إلى علامة التبويب متقدم.

TL;DR — النص البديل هو قيمة السمة alt على عنصر <img> — مطلوب بواسطة HTML، وضرورة لإمكانية الوصول، وأهم جزء من بيانات الصورة الوصفية لمحركات البحث. الفارق الدقيق الذي تخطئه معظم الأدلة: يؤثر بشكل أساسي على بحث الصور، وليس ترتيب نتائج البحث على الويب (Mueller، مرارًا). يقرأه Google بجانب الرؤية الحاسوبية وسياق الصفحة، لذا اكتب من أجل السياق، وليس الوصف المجرد. لا تحشو الكلمات المفتاحية، ولا تبدأ بـ “صورة لـ،” واستخدم alt="" (وليس سمة مفقودة) للصور الزخرفية. على صورة مرتبطة، يعمل النص البديل كـ نص الرابط. لا يوجد حد أحرف من Google؛ 155 حرفًا هو إرشاد كتابي. غياب النص البديل هو المشكلة التقنية الأكثر شيوعًا على الويب — 80,4% من المواقع لديها واحدة على الأقل.

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

النص البديل هو قيمة السمة alt على عنصر <img> في HTML:

<img src="dalmatian-puppy.jpg" alt="Dalmatian puppy playing fetch">

إنه بديل نصي قصير للصورة — لمستخدمي قارئات الشاشة، وللزاحفين، وللمتصفحات حيث تكون الصورة معطلة أو تفشل في التحميل. ملاحظة مصطلحية تستحق التوضيح: يُطلق عليه غالبًا “وسم alt،” لكن هذا تسمية خاطئة. الوسم هو <img>؛ alt هي سمة على ذلك الوسم. التسمية راسخة لدرجة أنني لن أعارضها، لكن المصطلح الدقيق هو سمة alt، والنص بداخلها هو النص البديل.

سمة alt مطلوبة على عناصر <img> وفقًا لمواصفات HTML. حذفها تمامًا هو خطأ توافق. القيمة الفارغة (alt="") صالحة وذات معنى — إنها الطريقة الصحيحة لتمييز صورة زخرفية (المزيد عن ذلك أدناه).

اختيار ما تكتبه ليس مسألة اتباع وصفة وصف عالمية. النص البديل الصحيح هو دالة على غرض الصورة في ذلك الموضع المحدد في الصفحة — وليس جردًا حرفيًا لما في الإطار. نفس الصورة يمكن أن تحتاج بشكل مشروع إلى نص بديل مختلف (أو نص فارغ) اعتمادًا على مكانها وما ينقله المحتوى المحيط بالفعل؛ لا يوجد تسمية توضيحية “صحيحة” واحدة مستقلة عن السياق.

النص البديل له وظيفتان منفصلتان لتحسين محركات البحث — وإحداهما مبالغ فيها

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

1. يضيف نصًا إلى الصفحة. يعتبر Google النص البديل جزءًا من نص الصفحة. Mueller: “The alt text is essentially shown when the images are turned off in most browsers, so that’s something that we would count as part of the on-page text.” (ترجمة) «يظهر النص البديل أساسًا عند إيقاف الصور في معظم المتصفحات؛ لذلك نعدّه جزءًا من نص الصفحة». هذا حقيقي، لكنه محدود.

2. يشير إلى ما تدور حوله الصورة — لبحث الصور. هذه هي الوظيفة الأساسية. وثائق Google الخاصة تسمي النص البديل “the most important attribute” (ترجمة) «السمة الأكثر أهمية» لتوفير بيانات الصورة الوصفية، ويؤطر Mueller تأثيره على أنه يقع في image search: “if someone is searching in Google Images for something that kind of matches the alt text, then we can use that to understand that your image is relevant.” (ترجمة) «إذا كان شخص ما يبحث في صور Google عن شيء يطابق النص البديل نوعًا ما، فيمكننا استخدام ذلك لفهم أن صورتك ذات صلة».

إليك الجزء الذي يجب استيعابه: إضافة النص البديل لا تجعل الصفحة ترتفع في ترتيب بحث الويب ببساطة لأنها تحتوي على صور. قال Mueller مباشرة: “It’s not the case that we would say a textual webpage has more value because it has images. It’s really just we see the alt text and we apply that to the image, and if someone searches for the image we can use that to better understand the image.” (ترجمة) «لا نقول إن صفحة ويب نصية تكتسب قيمة أكبر لأنها تحتوي على صور؛ بل نرى النص البديل ونطبقه على الصورة، وإذا بحث شخص عن الصورة نستخدمه لفهمها على نحو أفضل».

لذا إذا كان هدفك هو ظهور بحث الصور (وزيارات الإحالة التي يجلبها ذلك)، فالنص البديل مهم جدًا. إذا كنت تأمل أن يرفع النص البديل وحده ترتيب روابطك الزرقاء في بحث الويب، فأنت تستخدم الأداة الخاطئة. هذه هي نفس النقطة التي أطرحها في مقالتي عن JavaScript SEO: لبحث الويب، يُعتبر النص البديل نصًا في الصفحة لكن أهميته غالبًا مبالغ فيها — عائده الحقيقي هو بحث الصور وإمكانية الوصول.

ليس الإشارة الوحيدة التي يستخدمها Google

لا يُقرأ النص البديل في فراغ. Google: “Google uses alt text along with computer vision algorithms and the contents of the page to understand the subject matter of the image.” (ترجمة) «تستخدم Google النص البديل مع خوارزميات الرؤية الحاسوبية ومحتوى الصفحة لفهم موضوع الصورة». يمكن للرؤية الحاسوبية بالفعل أن تدرك أنها شاطئ. وظيفة النص البديل هي الشيء الذي لا يمكن للنموذج استنتاجه — السياق: لماذا هذه الصورة موجودة في هذه الصفحة، وماذا تعني هنا. ولهذا كانت نصيحة مولر لعام 2024 دقيقة: الذكاء الاصطناعي الذي ينتج “photo of a beach” (ترجمة) «صورة لشاطئ» يصف البكسلات تقنيًا لكنه يهدر الفرصة، لأن “the alt-text is unique in that it’s what directly connects the image to the page with context.” (ترجمة) «النص البديل فريد لأنه يربط الصورة بالصفحة مباشرة عبر السياق». وقد تحتاج صورة الشاطئ نفسها إلى نص بديل مختلف في صفحة عن ركوب الأمواج أو قائمة عقارات أو مقال عن المناخ.

إمكانية الوصول — والمخاطر القانونية

قبل أن يكون أصلًا لتحسين محركات البحث (SEO)، فإن النص البديل هو متطلب إمكانية وصول. معيار النجاح 1.1.1 من WCAG 2.x (المحتوى غير النصي)، المستوى A يتطلب بديلًا نصيًا للمحتوى غير النصي. يعتمد مستخدمو قارئات الشاشة عليه؛ بدونه، تكون الصورة نقطة ميتة في الصفحة، وقد يؤدي حذف سمة alt إلى قيام بعض القراء بالإعلان عن اسم الملف الخام بدلاً من ذلك.

هذا معيار نجاح واحد من بين عشرات. الحصول على النص البديل بشكل صحيح يلبي معيار 1.1.1 لصورك، لكنه لا يثبت بمفرده الامتثال الكامل لـ WCAG — أو الامتثال لقانون ADA — لصفحة أو موقع. تلك تعتمد أيضًا على معايير منفصلة (تباين الألوان، الوصول عبر لوحة المفاتيح، تسميات النماذج، بنية العناوين، والمزيد). تعامل مع النص البديل كقطعة ضرورية من إمكانية الوصول، وليس كلها.

هذا له أسنان. يتم الاستشهاد بسمات alt المفقودة بشكل روتيني في دعاوى قضائية لإمكانية الوصول إلى مواقع الويب بموجب ADA، والتي تصل إلى الآلاف سنويًا في الولايات المتحدة. كما أشرت في دليلي لتحسين محركات البحث في JavaScript، “missing alt attributes are an accessibility issue, which may turn into a legal issue.” (ترجمة) «سمات alt المفقودة مشكلة في إمكانية الوصول وقد تتحول إلى مشكلة قانونية». يعيد ذلك صياغة الإصلاح: إنه إجراء امتثال أولًا، وإجراء لتحسين محركات البحث ثانيًا. ولهذا السبب أيضًا تضع أدوات الزحف لتحسين محركات البحث (بما في ذلك Ahrefs Site Audit) علامة على alt المفقود ضمن المشكلات الفنية.

كيفية كتابة نص بديل يعمل

• ابدأ بالسياق، وليس بتعليق توضيحي. صف ما تعنيه الصورة للصفحة، وليس فقط ما هو مرئي فيها. مولر، عن البحث عن الصور: “you don’t necessarily need to describe exactly what is in the image, but rather kind of like what this image means for your particular page.” (ترجمة) «لا تحتاج بالضرورة إلى وصف ما هو موجود بالضبط في الصورة، بل إلى ما تعنيه هذه الصورة لصفحتك المحددة».
• لا تبدأ بـ “صورة لـ” / “صورة فوتوغرافية لـ.” ليزي ساسمان من Google: “We already are aware that it’s an image. You don’t need to say, ‘It’s an image of’ and then the thing.” (ترجمة) «نعرف بالفعل أنها صورة؛ ولا تحتاج إلى قول: إنها صورة لـ، ثم ذكر الشيء». العبارة الوصفية جيدة — لا يجب أن تكون جملة كاملة.
• استخدم الكلمات المفتاحية بشكل طبيعي، ولا تحشو أبدًا. Google: “focus on creating useful, information-rich content that uses keywords appropriately and is in context.” (ترجمة) «ركّز على إنشاء محتوى مفيد وغني بالمعلومات يستخدم الكلمات المفتاحية بصورة مناسبة وفي سياقها». والتحذير: “Avoid filling alt attributes with keywords… as it results in a negative user experience and may cause your site to be seen as spam.” (ترجمة) «تجنب ملء سمات alt بالكلمات المفتاحية… لأن ذلك يسبب تجربة مستخدم سلبية وقد يجعل موقعك يبدو بريدًا عشوائيًا». وقال Gary Illyes الأمر بصراحة: النص البديل “shouldn’t be what you want to rank for, but what’s in the image.” (ترجمة) «لا ينبغي أن يكون ما تريد أن تتصدر ترتيبه، بل ما هو موجود في الصورة».
• لا تنسخ فقرتك المحيطة إلى النص البديل. مولر: “I wouldn’t just blindly copy and paste the same text that you already have on a page as an alt text.” (ترجمة) «لن أنسخ وألصق بصورة عمياء النص نفسه الموجود على الصفحة كنص بديل». سمة alt فرصة فريدة لإضافة سياق، وليست تكرارًا.
• لا يوجد حد أحرف من Google. مولر: “we don’t have any guidelines with regards to how long your alt text can be.” (ترجمة) «ليست لدينا إرشادات بشأن طول النص البديل». يأتي رقم «125 حرفًا» الشائع من أدوات إمكانية الوصول؛ ويقترح دليل أسلوب المطورين من Google 155 حرفًا أو أقل كإرشاد كتابي، لا حدًا صارمًا. اجعله قصيرًا لأن الأوصاف الطويلة تقاطع تدفق القراءة لمستخدمي قارئات الشاشة — لا لأن Google تقتطعها.
• استخدم نصًا بديلًا ثابتًا للصور المتكررة. إذا ظهرت الصورة نفسها في أماكن متعددة، فأعطها النص البديل نفسه.

الصور الزخرفية: alt=""، وليس سمة alt مفقودة

بالنسبة للصور الزخرفية البحتة — الفواصل، والمقسّمات، والزخارف الخلفية التي لا تحمل أي معلومات — النمط الصحيح هو سمة فارغة alt:

<img src="divider.svg" alt="">

alt="" تخبر التقنيات المساعدة أن الصورة زخرفية ويجب تخطيها. هذا ليس نفس حذف السمة. حذف alt تمامًا يُعد انتهاكًا لمواصفات HTML، ويمكن أن يتسبب في قراءة بعض قارئات الشاشة لاسم الملف بصوت عالٍ. لذا: الصور الزخرفية تحصل على alt="" (قيمة فارغة موجودة)، وليس سمة مفقودة، وليس وصفًا. كما قلت في دليلي لتحسين محركات البحث في JavaScript — أصلح alt لصور المحتوى الرئيسي، لكن بالنسبة للصور النائبة أو الزخرفية يمكنك ترك alt فارغًا (بمعنى alt="").

اختبار “الزخرفية”: هل تضيف الصورة معلومات لا تنقلها الصفحة بالفعل في مكان آخر — في النص المحيط، أو التسمية التوضيحية، أو بنية الصفحة؟ إذا لم تكن كذلك (فاصل، أو أيقونة متكررة بجانب نص يقول نفس الشيء بالفعل، أو صورة مخزنة تُستخدم كحشو بصري بحت)، فهي زخرفية وتحصل على alt="". إذا كانت تضيف معلومات لا يوفرها أي شيء آخر في الصفحة، فهي ليست زخرفية، مهما بدت صغيرة أو أسلوبية.

الصور الوظيفية: صف الإجراء، وليس الأيقونة

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

<!-- Weak: describes the icon -->
<button><img src="magnifying-glass.svg" alt="Magnifying glass icon"></button>

<!-- Better: describes the action -->
<button><img src="magnifying-glass.svg" alt="Search"></button>

مستخدم قارئ الشاشة الذي يسمع “أيقونة عدسة مكبرة” لا يعرف ماذا يحدث إذا فعّل عنصر التحكم؛ “بحث” يخبره فورًا. هذا هو نفس المبدأ وراء الصور المرتبطة أدناه — يخدم نص alt وظيفة الصورة في الصفحة — لكنه ينطبق حتى عندما لا يكون هناك <a>.

الصور المرتبطة: نص alt يصبح نص الرابط

عندما تكون الصورة هي رابطًا — ملفوفة في عنصر <a> — يعمل نص alt الخاص بها كنص الرابط لذلك الرابط. وتقول Google: “Alt text in images is useful as anchor text if you decide to use an image as a link.” (ترجمة) «نص alt في الصور مفيد كنص رابط إذا قررت استخدام صورة كرابط». ورابط الصورة وحده مع alt فارغ يعادل نص رابط فارغ، وهو سيئ لإمكانية الوصول (لا يستطيع قارئ الشاشة وصف الوجهة) ولإشارة الرابط. في الصورة المرتبطة، يجب أن يصف النص البديل إلى أين يذهب الرابط، لا ما تعرضه الصورة فحسب.

حدد هذا بدقة: ما يوثقه جوجل يتعلق تحديدًا باستخدام نص alt كنص رابط لرابط قابل للزحف. إنه أضيق من حساب “الاسم الميسر” الكامل الذي تستخدمه المتصفحات والتقنيات المساعدة، والذي يمكن أن يستمد أيضًا من aria-label أو aria-labelledby أو نص الرابط المحيط — نص alt هو مدخل واحد في ذلك الحساب الأوسع، وليس كله.

SVGs مختلفة

عناصر <svg> المضمنة لا تأخذ سمة alt — هذه مخصصة لـ <img>. لإعطاء SVG مضمن اسمًا ميسرًا، استخدم عنصر <title> مشارًا إليه بـ aria-labelledby:

<svg role="img" aria-labelledby="logo-title">
  <title id="logo-title">Acme Corp logo</title>
  <!-- paths… -->
</svg>

(SVG مشار إليه عبر <img src="logo.svg"> يستخدم سمة alt عادية مثل أي صورة أخرى — هذا ينطبق فقط على ترميز SVG المضمن.)

الأنماط المضادة التي يجب تجنبها

• حشو الكلمات المفتاحية — إشارة البريد العشوائي التي تحذر Google منها صراحة.
• نسخ الفقرة المحيطة في سمة alt حرفيًا.
• بدايات “صورة لـ” / “صورة فوتوغرافية لـ” — زائدة عن الحاجة.
• حذف alt على الصور الزخرفية بدل استخدام alt="".
• أوصاف “صورة لـ X” المولدة بالذكاء الاصطناعي التي تتجاهل سياق الصفحة.
• وضع اسم شركتك في سمات alt فارغة. كان مولر صريحًا بشأن ذلك: “It makes no sense, it seems like a waste of time to me: once wasted time to implement, and again wasted time to clean up later on.” (ترجمة) «لا معنى له؛ يبدو لي مضيعة للوقت: وقت يُهدر في التنفيذ، ثم وقت آخر في التنظيف لاحقًا».
• الخلط بين alt وسمة title. تظهر سمة title كتلميح عند التمرير؛ وهي ليست نص alt وتحمل وزنًا قليلًا في تحسين محركات البحث أو إمكانية الوصول.

العثور على نص alt المفقود وإصلاحه

السمات البديلة المفقودة ليست حالة حافة — بل هي حالة الفشل الافتراضية للويب. في دراسة تدقيق المواقع التي أجريناها على أكثر من مليون نطاق، كانت 80,4% من المواقع تفتقد سمات بديلة على صفحة واحدة على الأقل، مما يجعلها المشكلة الأكثر انتشارًا في تحسين محركات البحث التقني التي وجدناها.

للعثور عليها:

• تدقيق المواقع من Ahrefs → تقرير الصور يحدد الصور التي تفتقد سمات بديلة عبر موقعك. (أدوات مشرفي المواقع من Ahrefs تمنحك هذا مجانًا للمواقع التي تتحقق منها.)
• فحوصات يدوية — فحص العنصر على صور المحتوى الرئيسية، أو استخدام إضافة متصفح لإمكانية الوصول.

ترتيب الأولوية عند إصلاحها:

1. صور المحتوى الرئيسية أولاً — تلك التي تحمل معنى ويمكن أن تكسب زيارات من بحث الصور.
2. الصور المرتبطة — النص البديل الفارغ هنا مكلف بشكل مضاعف (نص الرابط + إمكانية الوصول).
3. الصور الزخرفية أخيرًا — والإصلاح هو alt=""، وليس وصفًا.

ملاحظة حول التوقعات: اختبارات SearchPilot المنقسمة حول إضافة النص البديل كانت غير حاسمة / غير ذات دلالة إحصائية لترتيب الويب — بما يتوافق مع النقطة أعلاه بأن عائد النص البديل يكون في بحث الصور وإمكانية الوصول، وليس في تعزيز ترتيب الويب. وطمأنة مولر للمواقع التي تبدأ من تغطية صفرية: “if you’re just adding alt text for the first time, then sometimes, even any alt text is better than nothing.” (ترجمة) «إذا كنت تضيف نصًا بديلًا لأول مرة، فأحيانًا يكون أي نص بديل أفضل من لا شيء».

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

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

ملخص الذكاء الاصطناعي

نظرة مختصرة على النسخة المتقدمة:

• ما هو: النص البديل هو قيمة السمة alt في عنصر <img> — بديل نصي قصير يُختار بناءً على الغرض والسياق للصورة، وليس جردًا حرفيًا للبكسلات. مطلوب بواسطة HTML. يُطلق عليه غالبًا بشكل خاطئ “وسم alt” (<img> هو الوسم؛ alt هي السمة).
• مهمتان لتحسين محركات البحث، واحدة مبالغ فيها: (1) يضيف نصًا في الصفحة — حقيقي لكنه ثانوي؛ (2) يشير إلى موضوع الصورة لـ بحث الصور — القيمة الأساسية. إضافة النص البديل لا ترفع ترتيب الويب لمجرد أن الصفحة تحتوي على صور (Mueller، مرارًا)، ولا يعد أي مصدر رسمي تمت مراجعته بنتيجة ترتيب أو حركة مرور أو استشهاد بالذكاء الاصطناعي من إضافته.
• ليس الإشارة الوحيدة: تقرأ Google النص البديل مع الرؤية الحاسوبية وسياق الصفحة. لذا اكتب من أجل السياق — لماذا الصورة في هذه الصفحة — وليس مجرد تسمية “photo of a beach” (ترجمة) «صورة لشاطئ».
• إمكانية الوصول + القانونية: يتطلب WCAG 1.1.1 (المستوى A) بديلًا نصيًا؛ غياب النص البديل عنصر متكرر في دعاوى ADA. لكن 1.1.1 معيار واحد من بين عشرات — النص البديل وحده لا يحقق الامتثال الكامل لـ WCAG أو ADA لصفحة أو موقع. الامتثال أولًا، وتحسين محركات البحث ثانيًا.
• قواعد الكتابة: ابدأ بالسياق؛ لا تفتح بـ “صورة لـ”؛ استخدم الكلمات المفتاحية طبيعيًا (من دون حشو أو صيغة ثابتة)؛ لا تنسخ الفقرة المحيطة؛ لا حد أحرف من Google (155 حرفًا هدف كتابي من دليل الأسلوب، وليس حدًا أقصى).
• الصور الزخرفية: استخدم alt="" (قيمة فارغة موجودة) — لا سمة مفقودة ولا وصفًا. اختبر: هل تضيف الصورة معلومات لا تنقلها الصفحة بالفعل في مكان آخر؟ إن لم تفعل فهي زخرفية.
• الصور الوظيفية: تحصل الأزرار وعناصر التحكم ذات الأيقونة فقط (أيقونة البحث، قائمة الهامبرغر) على نص بديل يصف الإجراء، لا مظهر الأيقونة.
• الصور المرتبطة: يعمل النص البديل كنص رابط لرابط قابل للزحف — وهو أضيق من حساب “الاسم المتاح” الكامل الذي تستخدمه التقنيات المساعدة.
• SVG: تستخدم صور SVG المضمنة <title> + aria-labelledby، لا alt.
• الأنماط المضادة: حشو الكلمات المفتاحية، واسم الشركة في alt فارغ (مولر: “مضيعة للوقت”)، والخلط بين alt وسمة title الخاصة بتلميح الأدوات.
• حجم المشكلة: 80,4% من المواقع لديها سمة alt مفقودة واحدة على الأقل — المشكلة التقنية الأكثر شيوعًا على الويب. دقّق باستخدام تقرير الصور في Ahrefs Site Audit، وأصلح صور المحتوى أولًا ثم الزخرفية (alt="") أخيرًا.

الوثائق الرسمية

وثائق المصدر الأساسي من محركات البحث.

Google

• أفضل ممارسات صور Google — المرجع الأساسي: النص البديل باعتباره “السمة الأكثر أهمية”، تحذير حشو الكلمات المفتاحية، نص الرابط للصورة كرابط، وأمثلة جيدة وسيئة.
• دليل المبتدئين لتحسين محركات البحث — النص البديل الوصفي — النص البديل باعتباره النص الذي “يشرح العلاقة بين الصورة والمحتوى الخاص بك.”
• دليل أسلوب وثائق المطورين — النص البديل — إرشادات الكتابة المكونة من 155 حرفًا، alt="" للصور الزخرفية، لا “صورة لـ”/“صورة فوتوغرافية لـ”، وتضمين علامات الترقيم.
• اكتب نصًا بديلًا مفيدًا (الكتابة التقنية) — دليل Google الموجه لإمكانية الوصول: اجعله قصيرًا، واشرح في السياق، ونص بديل ثابت للصور المتكررة.
• web.dev — بدائل نصية للصور — نص بديل وصفي للصور المهمة، وalt="" فارغ للصور الزخرفية.

Bing / Microsoft

• هندسة المحتوى لتحسين محركات البحث (SEM 101) — منشور Bing قديم يصور الصور على أنها “مناطق ميتة للروبوت” وسمات alt كطريقة لوصفها (استخدم كلمات مفتاحية ذات صلة، ولا تفرضها).
• أن تكون جزءًا من منظومة بحث الصور في Bing — تساعد أسماء الملفات والنص البديل الصفحة على الظهور في دائرة الصور حتى عندما لا تتصدر الصفحة الأولى من بحث الويب.

اقتباسات من المصدر

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

مستندات Google — ما الغرض من نص alt

• “The most important attribute when it comes to providing more metadata for an image is the alt text… which also improves accessibility for people who can’t see images on web pages.” (ترجمة) «السمة الأكثر أهمية عندما يتعلق الأمر بتوفير بيانات وصفية إضافية للصورة هي نص alt… والتي تعمل أيضًا على تحسين إمكانية الوصول للأشخاص الذين لا يستطيعون رؤية الصور على صفحات الويب.» الانتقال إلى الاقتباس
• “Google uses alt text along with computer vision algorithms and the contents of the page to understand the subject matter of the image.” (ترجمة) «تستخدم Google نص alt جنبًا إلى جنب مع خوارزميات الرؤية الحاسوبية ومحتويات الصفحة لفهم موضوع الصورة.» الانتقال إلى الاقتباس
• “Avoid filling alt attributes with keywords (also known as keyword stuffing) as it results in a negative user experience and may cause your site to be seen as spam.” (ترجمة) «تجنب ملء سمات alt بالكلمات المفتاحية (المعروفة أيضًا بحشو الكلمات المفتاحية) لأن ذلك يؤدي إلى تجربة مستخدم سلبية وقد يتسبب في اعتبار موقعك بريدًا عشوائيًا.» الانتقال إلى الاقتباس
• “Alt text in images is useful as anchor text if you decide to use an image as a link.” (ترجمة) «نص alt في الصور مفيد كنص رابط إذا قررت استخدام صورة كرابط.» الانتقال إلى الاقتباس

John Mueller، Google — نص alt مخصص لبحث الصور

• “When it comes to the alt text, we primarily use that to better understand the image. So if someone is searching in Google Images for something that kind of matches the alt text, then we can use that to understand that your image is relevant for that alt text on that specific page.” (ترجمة) «عندما يتعلق الأمر بالنص البديل، نستخدمه أساسًا لفهم الصورة على نحو أفضل. فإذا بحث شخص في صور Google عن شيء يطابق النص البديل نوعًا ما، أمكننا استخدامه لفهم صلة الصورة بهذا النص في تلك الصفحة تحديدًا». — Office Hours, March 18 2022. Listen · SEJ coverage
• “It’s not the case that we would say a textual webpage has more value because it has images. It’s really just we see the alt text and we apply that to the image, and if someone searches for the image we can use that to better understand the image.” (ترجمة) «لا نقول إن صفحة ويب نصية تكتسب قيمة أكبر لأنها تحتوي على صور؛ بل نرى النص البديل ونطبقه على الصورة، وإذا بحث شخص عن الصورة نستخدمه لفهمها على نحو أفضل». — Office Hours, March 18 2022.
• “I think the important part here is we don’t have any guidelines with regards to how long your alt text can be.” (ترجمة) «أظن أن المهم هنا هو أننا لا نملك إرشادات بشأن طول النص البديل». — Office Hours, March 18 2022.
• “The alt-text is unique in that it’s what directly connects the image to the page with context… if you use AI to create alt texts based on the image file, and get ‘photo of a beach’ as the alt text for that image, you’re not getting the most out of the alt text, both for users & search engines.” (ترجمة) «النص البديل فريد لأنه يربط الصورة بالصفحة مباشرة عبر السياق… فإذا استخدمت الذكاء الاصطناعي لإنشاء نصوص بديلة من ملف الصورة وحصلت على “photo of a beach”، فلن تستفيد من النص البديل إلى أقصى حد، لا للمستخدمين ولا لمحركات البحث». — Reddit r/SEO, September 2024. Thread · SEJ coverage
• عن وضع اسم الشركة في سمات alt الفارغة: “It makes no sense, it seems like a waste of time to me: once wasted time to implement, and again wasted time to clean up later on.” (ترجمة) «لا معنى لذلك؛ يبدو لي مضيعة للوقت: وقت يُهدر في التنفيذ، ثم وقت آخر في التنظيف لاحقًا». — Twitter, June 2 2022. Coverage

Lizzi Sassman، Google — لا تقل “صورة لـ”

• “We already are aware that it’s an image. You don’t need to say, ‘It’s an image of’ and then the thing.” (ترجمة) «تدرك المنصة أصلًا أنها صورة؛ فلا حاجة إلى قول: إنها صورة لـ، ثم ذكر الشيء». — برنامج Search Off the Record، «لنتحدث عن تحسين صور SEO»، أكتوبر 2022. النص

Gary Illyes، Google — صف الصورة، لا تستهدف الكلمات المفتاحية

• “Make sure to add alt attribute. This text shouldn’t be what you want to rank for, but what’s in the image.” (ترجمة) «تأكد من إضافة سمة alt. لا ينبغي أن يكون هذا النص ما تريد الترتيب له، بل ما هو موجود في الصورة.» — Pubcon keynote, October 17 2018. Coverage

قائمة تدقيق النص البديل

مراجعة لالتقاط مشكلات النص البديل التي تهم فعلاً — إمكانية الوصول أولاً، ثم SEO للصور:

• سمات alt مفقودة على صور المحتوى — المشكلة رقم 1 (80,4% من المواقع لديها واحدة على الأقل). أصلح هذه أولاً.
• الصور الزخرفية تستخدم alt="" (قيمة فارغة موجودة)، ليست سمة مفقودة وليست وصفًا.
• لا يوجد alt محذوف في أي مكان — السمة الغائبة هي انتهاك لمواصفات HTML ويمكن أن تجعل قارئات الشاشة تقرأ اسم الملف.
• الصور المرتبطة لها alt ذو معنى يصف الوجهة (alt = نص الرابط على صورة مرتبطة؛ alt فارغ = نص رابط فارغ).
• الصور الوظيفية (أزرار/عناصر تحكم بأيقونة فقط) تصف الإجراء — alt="Search"، وليس alt="Magnifying glass icon".
• لا حشو كلمات مفتاحية — لا سلاسل من المرادفات أو الكلمات المفتاحية المستهدفة محشورة.
• لا بدايات “Image of” / “Photo of” — ابدأ مباشرة في الوصف.
• Alt ليس نسخة من الفقرة المحيطة — يجب أن يضيف سياقًا فريدًا لتلك الصورة.
• Alt يصف السياق، وليس فقط المرئيات — ما تعنيه الصورة في هذه الصفحة، وليس “صورة لشاطئ” عامة.
• لا اسم شركة محشور في سمات alt فارغة (Mueller: “a waste of time”).
• alt لا يُخلط مع title — سمة title هي تلميح تمرير، وليست نص alt.
• الصور المتكررة تستخدم نص alt متناسق.
• SVGs المضمنة تستخدم <title> + aria-labelledby بدلاً من سمة alt.
• الجوال = نص alt لسطح المكتب — نسخة الجوال تحمل نفس نص alt كما في سطح المكتب (فهرسة الجوال أولاً).
• تدقيق على نطاق واسع مع تقرير الصور في Ahrefs Site Audit (أو Ahrefs Webmaster Tools، مجاني للمواقع الموثقة).

موارد تستحق وقتك

كتاباتي ذات الصلة

• JavaScript SEO Issues & Best Practices — حيث أغطي سمات alt الفارغة التي تتركها أطر عمل JavaScript، والزاوية المتعلقة بإمكانية الوصول والقانون، ولماذا غالبًا ما تُبالغ في أهمية نص alt لبحث الويب.
• Ahrefs Site Audit Study — دراسة لأكثر من مليون نطاق حيث تبين أن سمات alt المفقودة هي المشكلة التقنية الأكثر شيوعًا في SEO (80,4% من المواقع).
• The Beginner’s Guide to Technical SEO — حيث تندرج معالجة الصور ونص alt في السياق التقني الأكبر.

رسمي

• أفضل ممارسات Google لـ Google Images — المرجع الأساسي لنص alt وبيانات الصور الوصفية.
• دليل أسلوب توثيق المطورين من Google — نص alt — قواعد كتابة ملموسة (155 حرفًا، alt=""، بدون “Image of”).
• WCAG 2.1 — Non-text Content (1.1.1) — معيار نجاح إمكانية الوصول وراء نص alt.

من الآخرين

• اختبارات SearchPilot المنقسمة على النص البديل — إضافة نص بديل (غير حاسمة) ونص بديل وصفي على صور القوائم (تحسن مقدر، غير ذي دلالة إحصائية) — تخفيف واقعي مفيد لعبارة “النص البديل يعزز ترتيب البحث.”
• Search Engine Journal — مولر حول النص البديل لتحسين محركات البحث (مارس 2022) — تغطية لساعات العمل حيث يوضح مولر الخط الفاصل بين بحث الصور وبحث الويب بوضوح.
• Search Engine Journal — نصيحة مولر لعام 2024 حول سياق “صورة شاطئ” — تغطي تعليقه على Reddit حول سبب فشل الأوصاف المولدة بالذكاء الاصطناعي في فهم الغرض من النص البديل.
• SE Roundtable — جوجل حول أسماء الشركات في النص البديل الفارغ (يونيو 2022) — تغطية باري شوارتز لقول مولر إن هذه الممارسة “مضيعة للوقت.”
• Search Off the Record — “لنتحدث عن تحسين صور SEO” (أكتوبر 2022، نص حرفي) — مولر وليزي ساسمان حول النص البديل القائم على السياق أولاً، وخطأ البداية بـ”صورة لـ”، ومتى يكون أي نص بديل أفضل من لا شيء.
• W3C — معيار النجاح 1.1.1 من WCAG 2.1 (محتوى غير نصي) — متطلب إمكانية الوصول من المستوى A الذي يوضح أن غياب النص البديل مشكلة امتثال وليس مجرد مشكلة SEO.
• web.dev — بدائل نصية للصور — إرشادات المطورين من جوجل التي تميز بين النص البديل الوصفي للصور ذات المعنى والنص البديل الفارغ alt="" للصور الزخرفية.

أخطاء النص البديل التي تستحق ذكرها بشكل فردي

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

حشو سمة النص البديل بالكلمات المفتاحية

لماذا هو خاطئ: تحذر Google صراحةً من هذا — “Avoid filling alt attributes with keywords… as it results in a negative user experience and may cause your site to be seen as spam.” (ترجمة) «تجنب ملء سمات alt بالكلمات المفتاحية… لأن ذلك يؤدي إلى تجربة مستخدم سلبية وقد يجعل موقعك يبدو بريدًا عشوائيًا». يقرأ قارئ الشاشة النص البديل بصوت عالٍ، لذا فإن alt="puppy dog pup pups doggies" ليس مجرد بريد عشوائي للزاحف، بل غير قابل للاستخدام لمستمع حقيقي.

افعل بدلاً من ذلك: صف الصورة بلغة بسيطة، في السياق. alt="Dalmatian puppy playing fetch in a park" يقول نفس المعلومات دون كومة الكلمات المفتاحية.

البدء بعبارة “صورة لـ” أو “صورة فوتوغرافية لـ”

لماذا هو خاطئ: كانت ليزي ساسمان من Google صريحة بشأن هذا: “We already are aware that it’s an image. You don’t need to say, ‘It’s an image of’ and then the thing.” (ترجمة) «تقول ساسمان إن الجميع يعلم أنها صورة؛ فلا داعي لعبارة: إنها صورة لـ، ثم ذكر الشيء». كل حرف يُنفق على البداية الزائدة هو حرف لا يُنفق على سياق مفيد.

افعل بدلاً من ذلك: ابدأ الوصف فورًا — alt="Dalmatian puppy playing fetch in a park"، وليس alt="Image of a dalmatian puppy playing fetch in a park".

حذف سمة النص البديل على الصور الزخرفية

لماذا هو خاطئ: ترك alt بالكامل (بدلاً من تعيينه على سلسلة فارغة) هو انتهاك لمواصفات HTML، ويمكن أن يجعل بعض قارئات الشاشة تعلن عن اسم الملف الخام بدلاً من البقاء صامتة.

افعل بدلاً من ذلك: استخدم alt="" — قيمة فارغة، مع وجود السمة — للصور الزخرفية حقًا مثل الفواصل والزخارف الخلفية. يخبر ذلك التقنية المساعدة بتخطي الصورة بشكل نظيف.

استخدام أوصاف مولدة بالذكاء الاصطناعي مثل “صورة لـ X” تتجاهل سياق الصفحة

لماذا هذا خطأ: أشار مولر إلى هذا مباشرة: أدوات الذكاء الاصطناعي التي تنتج “photo of a beach” (ترجمة) «صورة لشاطئ» تصف البكسلات تقنيًا لكنها تفوّت الهدف، لأن “the alt-text is unique in that it’s what directly connects the image to the page with context.” (ترجمة) «النص البديل فريد لأنه يربط الصورة بالصفحة مباشرة عبر السياق». والتسمية التوضيحية البصرية المجردة تهدر الشيء الوحيد الذي يستطيع النص البديل فعله ولا تستطيع الرؤية الحاسوبية فعله.

افعل بدلاً من ذلك: اكتب (أو حرر مسودة ذكاء اصطناعي) لشرح ما تعنيه الصورة في هذه الصفحة — نفس صورة الشاطئ تحتاج نصًا بديلًا مختلفًا في صفحة ركوب الأمواج عنها في قائمة عقارات.

وضع اسم شركتك في سمات alt فارغة

لماذا هذا خطأ: وصف مولر هذا النمط المحدد بأنه مضيعة للجهد: “It makes no sense, it seems like a waste of time to me: once wasted time to implement, and again wasted time to clean up later on.” (ترجمة) «لا معنى لذلك؛ يبدو لي مضيعة للوقت: وقت يُهدر في التنفيذ، ثم وقت آخر في التنظيف لاحقًا». لا يضيف ذلك معلومات للمستخدمين أو محركات البحث، بل يتحول إلى دين تنظيف لاحقًا.

افعل بدلاً من ذلك: إما اكتب نصًا بديلًا حقيقيًا خاصًا بالصورة أو استخدم alt="" للصور الزخرفية حقًا. لا تعتمد على اسم علامة تجارية قالب.

وصف مظهر عنصر تحكم بأيقونة فقط بدلاً من إجراءه

لماذا هذا خطأ: alt="Magnifying glass icon" على زر بحث يخبر مستخدم قارئ الشاشة كيف تبدو الأيقونة، لا ما يفعله الضغط عليها. بالنسبة لعنصر تحكم وظيفي، المظهر ليس المعلومات المفيدة — الإجراء هو.

افعل بدلاً من ذلك: سمِّ الإجراء أو النتيجة: alt="Search"، alt="Close menu"، alt="Play video". هذا هو مبدأ النص البديل لصورة مرتبطة الذي يعمل كنص رابط — يجب أن يخدم النص البديل وظيفة عنصر التحكم.

الخلط بين سمة alt وسمة title

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

افعل بدلاً من ذلك: اضبط alt للبديل النصي الذي تحتاجه كل صورة؛ استخدم title فقط لنص تلميح إضافي حقيقي، إذا كان ذلك ضروريًا.

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

أربعة أزواج ملموسة قبل/بعد مأخوذة مباشرة من القواعد أعلاه.

محشو بالكلمات المفتاحية مقابل وصفي

<!-- Before: keyword stuffing -->
<img src="dalmatian-puppy.jpg" alt="puppy dog pup pups doggies dalmatian puppies for sale">

<!-- After: plain description -->
<img src="dalmatian-puppy.jpg" alt="Dalmatian puppy playing fetch in a park">

النسخة “بعد” تصف ما هو موجود فعلاً في الصورة مرة واحدة، بلغة واضحة، بدلاً من حشر كل مرادف وعبارة نية الشراء التي حذرت منها Google.

تسمية توضيحية عامة مقابل نص بديل مدرك للسياق

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

<!-- Generic, low-value -->
<img src="beach.jpg" alt="Photo of a beach">

<!-- On a surfing page -->
<img src="beach.jpg" alt="Surfer paddling out past the break at sunrise">

<!-- On a real-estate listing -->
<img src="beach.jpg" alt="Private beach access behind the oceanfront property">

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

صورة زخرفية: alt فارغ مقابل alt مفقود

<!-- Wrong: attribute omitted entirely -->
<img src="divider.svg">

<!-- Right: empty value, attribute present -->
<img src="divider.svg" alt="">

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

صورة وظيفية: الإجراء مقابل المظهر

<!-- Weak: describes the icon -->
<button><img src="magnifying-glass.svg" alt="Magnifying glass icon"></button>

<!-- Better: describes what the control does -->
<button><img src="magnifying-glass.svg" alt="Search"></button>

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

صورة مرتبطة: alt كنص رابط

<!-- Weak: doesn't describe the destination -->
<a href="/pricing/"><img src="cta-button.png" alt="Button"></a>

<!-- Better: alt describes where the link goes -->
<a href="/pricing/"><img src="cta-button.png" alt="View pricing plans"></a>

لأن الصورة مغلفة في رابط، يعمل نصها البديل كنص الرابط — “زر” لا يخبر مستخدم قارئ الشاشة شيئًا عن الوجهة، بينما “عرض خطط الأسعار” يفعل ذلك.

ما النص البديل الذي يجب أن تحصل عليه هذه الصورة؟

ثلاثة فروع سريعة للقرارات التي تظهر في كل صورة تقريبًا: هل هي زخرفية، هل هي عنصر تحكم وليس صورة، وهل هي مغلفة في رابط.

مشكلات شائعة مع النص البديل

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

قارئ الشاشة يعلن اسم الملف الخام بدلاً من الوصف

العرض: يقرأ قارئ الشاشة شيئًا مثل “dalmatian-puppy-jpg” أو “IMG_4021” بصوت عالٍ بدلاً من الوصف.

الأسباب المحتملة: تم حذف سمة alt من عنصر <img> بالكامل، بدلاً من تعيينها على سلسلة فارغة. هذا انتهاك لمواصفات HTML، وهو حالة الفشل الافتراضية — تظهر الصور ذات سمات alt المفقودة على 80,4% من المواقع وفقًا لدراسة تدقيق الموقع من Ahrefs لأكثر من مليون نطاق.

الإصلاح والتحقق: أضف alt وصفيًا للصور ذات المحتوى، أو alt="" للصور الزخرفية حقًا. تأكد باستخدام إضافة متصفح لقياس إمكانية الوصول أو عن طريق فحص العنصر — يجب أن تكون السمة موجودة في كلتا الحالتين.

سمات alt المفقودة يتم الإبلاغ عنها عبر الموقع بأكمله

العرض: تعود أداة تدقيق بمئات أو آلاف الصور التي تم الإبلاغ عنها بسبب سمات alt المفقودة.

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

الإصلاح والتحقق: رتب الأولويات — صور المحتوى الرئيسية أولاً (لأنها تحمل المعنى ويمكن أن تكسب زيارات بحث الصور)، ثم الصور المرتبطة (الـ alt الفارغ هناك يكلفك نص الرابط أيضًا)، وأخيرًا الصور الزخرفية (والإصلاح هناك هو alt=""، وليس وصفًا). أعد تشغيل مدقق تحسين محركات البحث للصور أو أداة تدقيق موقعك بعد كل تمريرة للتأكد من أن العدد في انخفاض.

الصور لا تظهر في صور Google على الرغم من وجود نص alt

العرض: صور المحتوى تحتوي على نص alt، لكنها لا تزال لا تظهر في عمليات بحث صور Google ذات الصلة.

الأسباب المحتملة: نص alt هو تسمية توضيحية بصرية عامة (“صورة شاطئ”) بدلاً من وصف خاص بالسياق لما تعنيه الصورة في تلك الصفحة — قال مولر إن هذا النوع من نص alt العام المولد بالذكاء الاصطناعي لا يحقق النتائج المرجوة. ومن الجدير أيضًا أن نتذكر أن نص alt هو مجرد إشارة واحدة: تجمعه Google مع الرؤية الحاسوبية وسياق الصفحة، لذا يمكن لصفحة محيطة ضعيفة أو غير ذات صلة أن تمنع الصورة من الظهور حتى مع نص alt جيد.

الإصلاح والتحقق: أعد كتابة نص alt ليعكس الموضوع والغرض الفعليين للصفحة، وليس فقط البكسلات. أعد التحقق من الأداء في Search Console → الأداء → نوع البحث: الصور بعد أن تمنح Google وقتًا لإعادة الزحف والمعالجة.

زر بأيقونة فقط لا يخبر مستخدمي قارئ الشاشة بما يفعله

العرض: يعلن قارئ الشاشة شيئًا مثل “أيقونة عدسة مكبرة” أو “صورة زر” قبل عنصر تحكم بأيقونة فقط، دون أي إشارة إلى ما يفعله الضغط عليه.

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

الإصلاح والتحقق: أعد كتابة النص البديل لتسمية الإجراء أو النتيجة (alt="Search"، alt="Close menu"، alt="Play video")، لا الأيقونة. تأكد بالانتقال إلى عنصر التحكم باستخدام لوحة المفاتيح والاستماع إلى ما يعلنه قارئ الشاشة.

وجهة الصورة المرتبطة غير واضحة لمستخدمي قارئ الشاشة

العرض: مستخدم يتنقل عبر الروابط (أو الصور) باستخدام قارئ الشاشة لا يسمع أي شيء مفيد قبل تفعيل رابط صورة فقط.

الأسباب المحتملة: الصورة المرتبطة تحتوي على نص alt فارغ أو مفقود — وهو ما يعادل نص رابط فارغ على رابط نصي.

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

مؤشرات الأداء الرئيسية الثابتة لنص alt للصور

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

تغطية نص alt عبر الموقع

• المقياس — نسبة عناصر <img> في الموقع بأكمله التي تحتوي على سمة alt غير فارغة وغير زخرفية (صور المحتوى فقط — يجب أن تُظهر الصور الزخرفية alt="" بشكل صحيح، وهذا ليس ثغرة).
• ما يخبرك به — ما إذا كان النص البديل إصلاحًا لمرة واحدة أم عادة مستمرة. نظرًا لأن 80,4% من المواقع في دراسة تدقيق الموقع من Ahrefs تحتوي على سمة alt مفقودة واحدة على الأقل، فإن التغطية تميل إلى التآكل مرة أخرى مع نشر محتوى جديد ما لم يتم فحصها بانتظام.
• كيفية استخراجه — مدقق صور SEO على صفحة، أو تقرير الصور في Ahrefs Site Audit عبر زحف كامل، أو ملحق متصفح لإمكانية الوصول للفحوصات السريعة.
• المعيار / النطاق الواقعي — لا توجد نسبة مستهدفة عالمية — فالموقع الذي يحتوي على الكثير من الصور الخلفية الزخرفية سيُظهر بشكل مشروع alt="" أكثر من مدونة تعتمد على الصور. حدد خط الأساس الخاص بك للتغطية الحالية في أول فحص، ثم راقب ألا تتراجع مع نشر صفحات جديدة.
• الإيقاع — ربع سنوي كفحص دائم، وفورًا بعد أي ترحيل جماعي للمحتوى أو تغيير في نظام إدارة المحتوى/القالب يؤثر على طريقة رفع الصور.

أداء البحث عن الصور (مرات الظهور والنقرات في بحث Google Images)

• المقياس — مرات الظهور والنقرات ونسبة النقر إلى الظهور لموقعك بعد تصفيتها إلى نتائج البحث عن الصور.
• ما يخبرك به — ما إذا كان النص البديل الذي تكتبه يترجم فعليًا إلى ظهور وزيارات من البحث عن الصور — وهي المهمة الأساسية التي قال مولر مرارًا إن النص البديل يقوم بها، على عكس تعزيز ترتيب الويب.
• كيفية استخراجه — Search Console ← الأداء ← نوع البحث: صور.
• المعيار / النطاق الواقعي — يعتمد كليًا على مدى كثافة الموقع وموضوعه بالصور — لا يوجد رقم عالمي يمكن الدفاع عنه. حدد خط الأساس الخاص بك في أول مرة تستخرج فيها هذا التقرير، ثم تتبع الاتجاه بعد تغييرات النص البديل أو محتوى الصور بدلاً من المقارنة بأي معيار خارجي.
• الإيقاع — شهريًا كفحص دائم؛ راقبه عن كثب لبضعة أسابيع بعد أي إعادة كتابة جماعية للنص البديل لمعرفة ما إذا كان يتحرك.

أدوات لتدقيق وإصلاح النص البديل

• مدقق صور SEO — يدقق إشارات صور HTML الخام مباشرة، بما في ذلك سمات alt، وتلميحات التحميل البطيء، وتنسيقات الصور. إنها أسرع طريقة لفحص تغطية النص البديل لصفحة واحدة قبل الإصلاح أو بعده.
• مدقق SEO للصفحة — يقدم مذكرة على الصفحة مرتبة حسب الأولوية بالإضافة إلى فحوصات HTML خام متقدمة تغطي الصور إلى جانب العناوين والروابط وعناصر الصفحة الأخرى، وهو مفيد عندما يكون النص البديل واحدًا من عدة أشياء تدققها في صفحة واحدة في نفس الوقت.
• Ahrefs Site Audit — تقرير الصور — يحدد الصور التي تفتقد سمات alt عبر زحف كامل لموقعك (تمنحك Ahrefs Webmaster Tools هذا مجانًا للمواقع الموثقة)، وهذا هو كيف تم قياس رقم 80,4% للصور المفقودة في دراسة تدقيق الموقع من Ahrefs.
• Search Console — الأداء، نوع البحث: صور — مصدر الحقيقة حول ما إذا كان النص البديل الخاص بك يكسب بالفعل مرات ظهور ونقرات من البحث عن الصور.
• ملحقات إمكانية الوصول في المتصفح / فحص العنصر — للفحوصات اليدوية السريعة على صور المحتوى الرئيسية، وللتأكد مما سيقوله قارئ الشاشة فعليًا.

اختبر نفسك: النص البديل

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

سجل التغييرات