أتش تي أم أل هي لغة ترميز تستخدم لإنشاء صفحات الويب. تتمثل إحدى ميزاته في إضافة إشارات مرجعية إلى الموقع. تسمح الإشارات المرجعية ، المعروفة أيضا باسم نقاط الارتساء ، للمستخدمين بالتنقل بسرعة عبر صفحة إلى أقسام أو كتل معينة من المعلومات.
لإضافة إشارة مرجعية إلى موقعك ، تحتاج إلى استخدام العلامة مع سمة الاسم ، والتي تحدد اسم الإشارة المرجعية. فمثلا, لإنشاء إشارة مرجعية داخل هذه الفقرة, يمكنك استخدام الكود التالي:.
ثم ، لإنشاء ارتباط إلى هذه الإشارة المرجعية ، تحتاج إلى استخدام العلامة مع السمة هريف ، مما يدل على اسم المرجعية. على سبيل المثال: رابط إلى إشارة مرجعية. عند النقر فوق هذا الرابط ، ستنتقل الصفحة إلى الإشارة المرجعية المقابلة.
يمكنك أيضا إضافة تأثيرات إضافية إلى الإشارات المرجعية ، على سبيل المثال ، تغيير اللون أو إضافة الرسوم المتحركة. يمكنك استخدام أنماط كس لهذا الغرض. يمكن أن يكون إنشاء إشارات مرجعية إضافية مفيدا إذا كانت صفحة الويب تحتوي على نص طويل أو العديد من الأقسام ، وقد يحتاج المستخدم إلى التنقل بسرعة عبر الصفحة.
- إضافة إشارات مرجعية إضافية إلى الموقع
- قائمة الإشارات المرجعية
- الجدول المرجعية
- كود هتمل لإنشاء الإشارات المرجعية
- المعلمات ووصف سمات الإشارات المرجعية
- سمة هريف
- السمة الهدف
- سمة العنوان
- السمة ريل
- معلمات المظهر
- كيفية وضع الإشارات المرجعية على الصفحة
- المرجعية 1
و
:
إذا كنت ترغب في تنظيم الإشارات المرجعية ، يمكنك استخدام قائمة مرقمة. الوسم
إنشاء منطقة قائمة ، والعلامة
يستخدم لكل إشارة مرجعية.
المرجعية 2
المرجعية 3
3. جدول مع الإشارات المرجعية باستخدام العلامات
,
و
:
للحصول على تخطيط أكثر تعقيدا ومرونة للإشارات المرجعية ، يمكنك استخدام جدول. الوسم
إنشاء جدول ، والعلامات
و
تستخدم لإنشاء صفوف وخلايا الجدول ، على التوالي.
المرجعية 1
المرجعية 2
المرجعية 3
يعتمد اختيار كيفية وضع الإشارات المرجعية على الصفحة على المظهر والوظائف المطلوبة ، وكذلك على احتياجات وتفضيلات المطور.
العناوين التصميم مع المغلق
عندما نضيف إشارات مرجعية إضافية إلى موقع ما ، فإننا نريدها غالبا أن تبدو جذابة وسهلة الاستخدام. العناوين التصميم مع المغلق يسمح لنا لتغيير مظهرها وخلق تصميم مذهل.
بادئ ذي بدء ، يمكننا استخدام خصائص كس لتغيير الألوان والخطوط وخلفية الإشارات المرجعية. على سبيل المثال ، يمكننا تعيين لون النص باستخدام خاصية اللون وتغيير الخلفية باستخدام خاصية لون الخلفية.
لإنشاء تأثير تحوم الماوس فوق إشارة مرجعية ، يمكننا استخدام الخاصية: تحوم. على سبيل المثال ، عندما يحوم المستخدم فوق إشارة مرجعية ، قد تتغير الخلفية إلى لون مختلف ، وقد يصبح النص غامقا باستخدام خاصية وزن الخط ، وقد يتغير حجم الخط باستخدام خاصية حجم الخط.
إذا أردنا إنشاء قائمة أفقية من الإشارات المرجعية ، فيمكننا استخدام عناصر القائمة
و
. ثم يمكننا نمط القائمة باستخدام خصائص كس مثل العرض لجعل الإشارات المرجعية أفقية ، ونوع نمط القائمة لإزالة علامات القائمة.
بالإضافة إلى ذلك ، يمكننا استخدام جداول كس لإنشاء تخطيط إشارة مرجعية أكثر تعقيدا. على سبيل المثال ، يمكننا استخدام العلامات
لإنشاء شبكة من الإشارات المرجعية.
من المهم أن تتذكر أنه عند تصميم الإشارات المرجعية باستخدام كس ، تحتاج إلى ضمان إمكانية الوصول إليها وسهولة الاستخدام. ليس من الضروري تغيير المظهر كثيرا ، لأن هذا قد يجعل من الصعب على المستخدم العثور على الإشارات المرجعية واستخدامها.
إنشاء روابط مرجعية على صفحات مختلفة
غالبا ما تحتوي صفحات الويب على العديد من الأقسام أو صفحات مختلفة تحتوي على معلومات. لتسهيل التنقل عبر هذه الصفحات ، يمكنك إضافة روابط مرجعية.
تسمح روابط الإشارات المرجعية للمستخدمين بالتنقل بسرعة بين الأقسام أو الصفحات المختلفة لموقع الويب. عندما ينقر المستخدم على رابط إشارة مرجعية ، ينتقل إلى الجزء المقابل من الصفحة أو صفحة أخرى.
- يمكنك إنشاء روابط مرجعية على صفحات مختلفة باستخدام علامة. للقيام بذلك ، حدد السمة هريف مع عنوان الصفحة المقصودة أو رابط مرساة.
في المثال أعلاه ، سيقوم رابط الإشارة المرجعية "من نحن" بإعادة توجيه المستخدم إلى صفحة تحمل الاسم حول.أتش تي أم أل .
لإنشاء ارتباط إشارة مرجعية ينقل المستخدم إلى جزء معين من نفس الصفحة ، تحتاج إلى استخدام نقاط الارتساء في هتمل.
مثال على ارتباط إشارة مرجعية مع مرساة:
- انتقل إلى القسم 1
- في المثال أعلاه ، سينقل رابط الإشارة المرجعية" انتقل إلى القسم 1 "المستخدم إلى العنصر الذي يحمل المعرف" القسم 1 " في الصفحة الحالية.
- لإنشاء مرساة ، تحتاج إلى استخدام سمة المعرف:
كيفية جعل الإشارات المرجعية تفاعلية
يمكن للإشارات المرجعية التفاعلية على موقع الويب تحسين تجربة المستخدم بشكل كبير وتسهيل التنقل في الموقع. في هذا القسم ، سننظر في عدة طرق لإضافة التفاعل إلى إشاراتك المرجعية.
1. باستخدام جافا سكريبت
| واحدة من أكثر الطرق شيوعا لجعل الإشارات المرجعية تفاعلية هي استخدام لغة برمجة جافا سكريبت. باستخدامه ، يمكنك إضافة تأثيرات مختلفة عند التمرير فوق إشارة مرجعية أو النقر عليها. على سبيل المثال ، يمكنك تغيير الخلفية أو لون النص أو إضافة رسوم متحركة أو إعادة توجيه المستخدم إلى صفحة أخرى. | لإضافة شفرة جافا سكريبت إلى موقعك ، تحتاج إلى إدخالها داخل العلامة. على سبيل المثال: |
|---|---|
| 2. باستخدام كس | |
| بدلا من استخدام جافا سكريبت ، يمكنك أيضا استخدام كس لإضافة التفاعل إلى المواقع المفضلة لديك. على سبيل المثال ، يمكنك استخدام فئات زائفة مثل :التمرير أو :نشط لتغيير نمط الإشارة المرجعية عند التمرير فوقها أو النقر عليها. |
لإضافة أنماط كس إلى الإشارات المرجعية الخاصة بك ، يمكنك استخدام سمة النمط المضمنة أو إنشاء فئة وتطبيقها على علامات الإشارة المرجعية الخاصة بك. على سبيل المثال:
بلدي المرجعية
3. استخدام الإضافات والمكتبات
تتيح إضافة إشارات مرجعية إضافية إلى الموقع للمستخدمين التنقل بسهولة في محتوياته. في هذا القسم ، سنلقي نظرة على بعض الميزات المثيرة للاهتمام التي يمكنك استخدامها لتحسين التنقل على موقعك.
1. الإشارات المرجعية المتداخلة
بدلا من أن تقتصر على مستوى إشارة مرجعية واحد فقط ، يمكنك إنشاء إشارات مرجعية متداخلة مجمعة حسب الموضوع. هذا يجعل من السهل التنقل في الموقع وجعل الهيكل أكثر قابلية للفهم للمستخدمين.
مثال:
2. روابط لموارد خارجية
قد تتضمن الإشارات المرجعية الإضافية روابط ليس فقط للصفحات الداخلية لموقعك ، ولكن أيضا إلى الموارد الخارجية مثل الشبكات الاجتماعية أو الشركاء أو المقالات المفيدة على مواقع أخرى. يساعد هذا المستخدمين في الحصول على معلومات أكثر اكتمالا وتوسيع آفاقهم.
الرئيسية