في عالم الويب اليوم، يتزايد الاهتمام بتحسين سرعة تحميل صفحات الويب على الأجهزة المحمولة. ومن أجل تحقيق ذلك، تم تطوير تقنية Accelerated Mobile Pages (AMP)، التي توفر تجربة تصفح سريعة وسلسة على الأجهزة المحمولة.
وفي هذا المقال، سنناقش لماذا يجب عليك إضافة جدول محتوى لصفحات AMP على مدونتك. ستتعلم أيضا كيفية إضافة جدول المحتوى بسهولة وفعالية لتحسين تجربة القراءة وتحسين الأداء العام لموقعك.
لماذا يجب عليك إضافة جدول محتوى لصفحات AMP على مدونتك
إضافة جدول محتوى لصفحات AMP على مدونتك يعتبر مفيدا للغاية لعدة أسباب، ومنها:
- يوفر جدول المحتوى للقراء نظرة عامة على المحتوى الذي سيتم تغطيته في المدونة، ويساعدهم على الوصول إلى المعلومات التي يبحثون عنها بشكل أسرع.
- يحسن تجربة المستخدم ويجعلها أكثر سلاسة وفعالية، حيث يمكن للمستخدمين الوصول بسهولة إلى الجزء الذي يهمهم دون الحاجة إلى البحث في المحتوى بشكل عشوائي.
- يساعد جدول المحتوى في تحسين ترتيب صفحتك في محركات البحث، حيث يعتبر المحتوى المرتب والمنظم جيداً عاملاً مهماً في تحسين ترتيب الصفحة في نتائج البحث.
- يعتبر إضافة جدول المحتوى لصفحات AMP جزءاً من متطلبات تقنية AMP، حيث يتطلب استخدام AMP إضافة جدول المحتوى كواحد من العناصر الأساسية المطلوبة.
- يوفر جدول المحتوى أيضاً ميزة للمستخدمين الذين يستخدمون أجهزة الهاتف المحمول، حيث يمكنهم الوصول بسهولة إلى المحتوى الذي يرغبون في قراءته بدون الحاجة إلى التنقل في الصفحة بشكل كبير.
بشكل عام، يعتبر جدول المحتوى عنصرا مهما في تحسين تجربة المستخدم وتحسين ترتيب صفحات الويب في محركات البحث، ويمكن أن يؤدي إلى زيادة عدد الزيارات لمدونتك وتحسين مستوى التفاعل مع المحتوى.
كيف يمكن إضافة جدول محتوى لصفحات AMP
لإنشاء قائمة تحتوي على قائمة فرعية باستخدام علامات وصف HTML، يمكن استخدام الكود التالي:
...<ol><li>العنوان الرئيسي 1</li><li>العنوان الرئيسي 2<ol><li>العنوان الفرعي 1</li><li>العنوان الفرعي 2</li><li>العنوان الفرعي 3</li></ol></li><li>العنوان الرئيسي 3</li></ol>
في هذا المثال، تم استخدام علامة ol لإنشاء قائمة رئيسية، وثم تم إدراج بند في القائمة الرئيسية، ومن ثم تم استخدام علامة ol مرة أخرى داخل البند الثاني لإنشاء قائمة فرعية. وتم تكرار هذا العمل لإضافة بنود إضافية في القائمة الفرعية.
هذا الكود سينتج قائمة تحتوي على بندين في القائمة الرئيسية، والبند الثاني يحتوي على قائمة فرعية تحتوي على ثلاثة بنود فرعية.
يمكن استخدام العلامات ul بدلا من ol إذا كانت القائمة غير مرتبة، ويمكن استخدام العلامة dl أيضا كما هو موضح بالكود أسفله، كلا الكودين صحيح فقط يبقى كل الخيار أيهما ستستخدم.
...<dl><dt>العنوان الرئيسي 1</dt><dt>العنوان الرئيسي 2</dt><dd>العنوان الفرعي 1</dd><dd>العنوان الفرعي 2</dd><dd>العنوان الفرعي 3</dd><dt>العنوان الرئيسي 3</dt></dl>
كيفية تحسين جدول المحتوى الخاص بصفحات amp
لتحسين جدول المحتوى الخاص بصفحات AMP، يمكن اتباع الخطوات التالية:
تحديد المناطق التي تحتوي على المحتوى الهام: يجب تحديد المناطق التي تحتوي على المحتوى الأكثر أهمية والمحتوى الذي يجب عرضه في الجدول. ويمكن عرض هذه المناطق بأسلوب مميز داخل الجدول، مما يجعل المستخدمين ينتبهون إلى هذا المحتوى أولا.
إضافة روابط مختصرة إلى الأجزاء المختلفة من المحتوى: يمكن إضافة روابط مختصرة إلى أجزاء مختلفة من المحتوى كالعناوين الرئيسية والفرعية، وذلك لتمكين المستخدمين من الوصول إلى المحتوى الذي يحتاجونه بسهولة.
وبناءا على الأمثلة أعلاه لجدول المحتوى ol و dd سأريك كيف يمكنك إضافة روابط مختصرة لجدول المحتوى وربطها مباشر بالجزء الصحيح والمناسب في المقال.
تأكد من وضع الرابط في جدول المحتوى وفي المكان المناسب داخل الصفحة، وذلك بإضافة رمز الرابط <a> والذي يتضمن النص الذي يتم النقر عليه والموجه إليه الرابط والقيمة المحددة للمكان المراد الانتقال إليه في الصفحة.
أولا تأكد من وضع الرابط على هذه الشاكلة <a href="#point1">العنوان الرئيسي 1</a> في جدول المحتوى وفي المكان المناسب مع اعطاء قيمة point مختلفة ل قسم من الجدول ليبدو على هذا الشكل:
...<ol><li><a href="#point1">العنوان الرئيسي 1</a></li><li><a href="#point2">العنوان الرئيسي 2</a><ol><li><a href="#point3">العنوان الفرعي 1</a></li><li><a href="#point4">العنوان الفرعي 2</a></li><li><a href="#point5">العنوان الفرعي 3</a></li></ol></li><li><a href="#point6">العنوان الرئيسي 3</a></li></ol>
...<dl><dt><a href="#point1">العنوان الرئيسي 1</a></dt><dt><a href="#point2">العنوان الرئيسي 2</a></dt><dd><a href="#point3">العنوان الفرعي 1</a></dd><dd><a href="#point4">العنوان الفرعي 2</a></dd><dd><a href="#point5">العنوان الفرعي 3</a></dd><dt><a href="#point6">العنوان الرئيسي 3</a></dt></dl>
ثانيا، لكي يقوم الرابط بالانتقال بشكل مباشر إلى العنوان الرئيسي 1 الذي يحمل القيمة "#point1" يتوجب عليك البحث على العنوان الرئيسي 1 على صفحة ال HTML والذي ستجده على هذا النحو <h2>العنوان الرئيسي 1</h2> أضف إليه القيمة point1 ليبدو كهذا <h2 id="#point1" > العنوان الرئيسي 1 </h2> وافعل نفس الأمر مع باقي العناوين.
في النهاية، يمكن القول أن إضافة جدول المحتوى لصفحات AMP هو خطوة ضرورية لتحسين تجربة المستخدم وتحسين أداء موقعك على الويب. يساعد جدول المحتوى القراء على الوصول بسهولة إلى المعلومات التي يحتاجون إليها، كما يساعد في تحسين ترتيب صفحتك في محركات البحث وزيادة عدد الزيارات لمدونتك. لذا، ننصحك بشدة بإضافة جدول محتوى لصفحات AMP على مدونتك لتعزيز جاذبية محتواك وتحسين تفاعل الزوار معه. نتمنى أن تكون المعلومات التي قدمناها مفيدة لك وأن تتمكن من استخدامها بشكل فعال لتحسين تجربة المستخدم وأداء موقعك على الويب.
أنا محمد، مالك مدونة صور نت للمعلوميات والرقمنة، أمتلك خبرة واسعة في تحسين محركات البحث (السيو)، ومهتم بشكل خاص بمجالات التسويق الرقمي والتكنولوجيا المالية الرقمية.