أولاً: ما الذي يراه العميل فعلاً
كثيرون يفهمون "رابط الصورة" على أنه مسألة تقنية، لكن العميل لا يرى كود الرابط إطلاقًا. ما يراه العميل على الصفحة هو ثلاثة أشياء: الصورة نفسها، والنص المجاور للصورة، والنص البديل الذي يظهر عند فشل تحميل الصورة. تقليل تكلفة الفهم يعني جعل هذه الثلاثة تشير إلى نفس الشيء، بحيث لا يضطر العميل للتخمين حول ما سيحدث عند النقر على الصورة.
الحالة السلبية الشائعة هي: الصورة عبارة عن غلاف منتج، واسم الملف IMG_2043.jpg، والنص البديل مكتوب "banner"، والنص المجاور يقول "اعرف المزيد". العميل لا يعرف قبل النقر ما الذي سيراه، ويضطر للتجربة بناءً على الحدس. هذا مثال نموذجي على ارتفاع تكلفة الفهم.
اسم الملف: اجعل فريقك قادرًا على البحث أولاً
على الرغم من أن اسم الملف لا يظهر مباشرة على الصفحة، إلا أنه يؤثر على أمرين: الأول هو أحد أسس حكم محركات البحث عند الزحف إلى الصور، والثاني هو قدرة فريق التشغيل على العثور على الصورة لاحقًا في مكتبة الوسائط. يُنصح باستخدام تركيبة "موضوع المحتوى + الغرض أو الموقع"، مع ربط الكلمات بشرطة قصيرة، مثل valve-product-cover.jpg أو factory-workshop-01.jpg. تجنب استخدام أرقام الكاميرا الافتراضية، أو الصينية مع مسافات، أو الشرطات السفلية المتعددة.
معيار الحكم بسيط: أرسل اسم الملف لزميل بمفرده، هل يستطيع تقريبًا وصف ما هي هذه الصورة؟ إذا لم يستطع، فهذا يعني أن التسمية لم تؤدِ الغرض. يُفضل توحيد الأسلوب لنفس الدفعة من الصور، فلا يكون جزء بالإنجليزية وجزء بالبينيين وجزء بالأرقام، وإلا سيكون التنظيم لاحقًا مرهقًا للغاية.
النص البديل (alt): جملة توضيحية لمن لا يرى الصورة
النص البديل هو النص الذي يظهر عند فشل تحميل الصورة، ويقرأه أيضًا قارئ الشاشة. وظيفته شرح ما تعبر عنه الصورة، وليس حشو الكلمات المفتاحية. يُنصح بجملة واحدة توضح محتوى الصورة، مع ذكر موضوع الصفحة التي تشير إليها عند الحاجة، مثل "مخطط عملية فحص الجودة في الورشة"، بدلاً من "ورشة فحص جودة مصنع سعر" هذا النوع من الحشو.
إذا كانت الصورة نفسها مدخل رابط، يمكن كتابة النص البديل ليعبر عن المحتوى الذي سيراه العميل عند النقر، مثل "عرض شرح عملية فحص الجودة". هنا يجب ملاحظة حد: كتابة النص البديل تنتمي إلى خبرة تنظيم المحتوى، أما كيف تستخدم محركات البحث النص البديل تحديدًا وما إذا كان يؤثر على الترتيب، فهي مسألة آلية تحتاج إلى تحقق، ولا تتوسع هذه المقالة في استنتاجاتها. على مستوى التشغيل، الضمان أولاً أن يفهم العميل والأدوات المساعدة، وهذا الاتجاه سليم.
النص المحيط: لا تدع الصورة والنص يتحدثان بلغات مختلفة
فهم العميل للصورة غالبًا لا يعتمد على الصورة نفسها، بل على النص المجاور لها. إذا كانت الصورة صورة منتج، والنص المجاور يقول "انقر لعرض المواصفات التفصيلية"، يعرف العميل أن النقر سيؤدي إلى صفحة المواصفات؛ وإذا كان النص المجاور يقول "مرحبًا للاستشارة"، سيظن العميل أن النقر سيفتح نافذة خدمة العملاء. هذان التوقعان مختلفان تمامًا.
عند كتابة النص المحيط، حدد أولاً الصفحة التي ستنتقل إليها الصورة عند النقر، ثم استخدم جملة واحدة لتوضيح ما تقدمه هذه الصفحة. عندما تشير الصورة والنص البديل والنص المحيط إلى نفس المحتوى، تنخفض تكلفة الفهم تلقائيًا. وعلى العكس، إذا كانت الثلاثة غير متسقة، حتى لو نقر العميل بشكل صحيح، سيشعر بعدم الارتياح.
منطقة النقر والموقع: اجعل العميل يعرف أن هنا قابل للنقر
بعض روابط الصور لا يعرف العميل أنها قابلة للنقر لأنها تبدو مثل صورة عادية. التعديلات الممكنة تشمل: إعطاء الصورة القابلة للنقر حالة بصرية واضحة، مثل تغيير طفيف عند التمرير؛ وضع الصور القابلة للنقر في أماكن يتوقع العميل النقر فيها، مثل قائمة المنتجات؛ تجنب إدراج صورة قابلة للنقر في منتصف فقرة نصية، حتى لا يختلط على العميل ما إذا كان ينقر على الصورة أم النص.
بالإضافة إلى ذلك، لا تضع هدفين مختلفين للانتقال على نفس الصورة. بعض الصفحات تنقر على يسار الصورة للانتقال إلى صفحة المنتج، وعلى يمينها للانتقال إلى صفحة الاستشارة، مما يصعب على العميل التمييز ويؤدي إلى نقرات خاطئة. إذا كنت بحاجة فعلًا إلى مدخلين، استخدم صورتين أو زرين نصيين منفصلين.
قبل النشر، يمكن الفحص بهذا الترتيب
- اسرد جميع روابط الصور على الصفحة، وتأكد من الصفحة التي تؤدي إليها كل صورة عند النقر.
- تحقق مما إذا كان اسم الملف قابلاً للبحث، وما إذا كان أسلوب التسمية موحدًا لنفس الدفعة من الصور.
- تحقق مما إذا كان النص البديل يوضح محتوى الصورة، وهل يحتوي على حشو كلمات مفتاحية.
- تحقق من النص المجاور للصورة، هل يتوافق مع محتوى الصفحة بعد النقر.
- افتح الصفحة على الهاتف، وانظر هل الصور القابلة للنقر واضحة وسهلة النقر.
- أخفِ الصور مؤقتًا أو افصل الشبكة لتحميل الصفحة مرة واحدة، وانظر هل لا يزال النص البديل يجعل العميل يفهم ما هنا.
هذا الفحص لا يحتاج إلى أدوات متخصصة، ويمكن لفريق التشغيل إنجازه بنفسه. بعد الانتهاء، يتحول رابط الصورة من "العميل ينقر بناءً على الحدس" إلى "العميل يعرف ما سيراه عند النقر"، وهذا هو التأثير الفعلي لتقليل تكلفة الفهم.
