أحد الفوارق الأساسية بين مواقع الويب وغيرها من أشكال وسائط الاتصال هو فكرة "الروابط" ، أو الارتباطات التشعبية كما هي معروفة من الناحية الفنية في شروط تصميم الويب.
بالإضافة إلى المساعدة في جعل الويب على ما هو عليه اليوم ، فإن الروابط ، بالإضافة إلى الصور ، هي بسهولة أكثر الأشياء شيوعًا على صفحات الويب. لحسن الحظ ، من السهل إضافة هذه العناصر (فقط علامتي HTML أساسيتين) ويمكنهما أن يجلب الإثارة والتفاعل إلى ما قد يكون صفحات صفحات نصية بسيطة. في هذه المقالة ، ستتعرف على العلامة (الارتساء) ، وهي عنصر HTML الفعلي المستخدم لإضافة روابط إلى صفحات موقع الويب.
إضافة روابط
يسمى الرابط نقطة ارتساء في HTML ، وبالتالي فإن العلامة التي تمثلها هي علامة A. عادة ما يشير الأشخاص ببساطة إلى هذه الإضافات على أنها "روابط" ، لكن المذيع هو ما يتم إضافته بالفعل إلى أي صفحة.
عند إضافة رابط ، يجب عليك الإشارة إلى عنوان صفحة الويب الذي تريد أن ينتقل إليه المستخدمون عند النقر أو النقر (إذا كانوا على شاشة تعمل باللمس). قمت بتحديد هذا مع السمة.
ال أ href تشير السمة إلى "مرجع النص التشعبي" ، والغرض منه هو إملاء عنوان URL الذي تريد أن ينتقل إليه الرابط المحدد. وبدون هذه المعلومات ، يكون الرابط عديم الجدوى - فهو سيخبر المتصفح أنه يجب إحضار المستخدم إلى مكان ما ، ولكن لن يكون لديه معلومات الوجهة المتاحة لأين يجب أن يكون "مكان ما". هذه العلامة وهذه السمة تسير جنبا إلى جنب.
على سبيل المثال ، لإنشاء رابط نصي ، تكتب:
النص الذي سيكون الرابط
لذلك ، للارتباط بصفحة الرئيسية حول تصميم الويب / HTML ، يمكنك كتابة:
Lifewire
يمكنك ربط أي شيء تقريبًا في صفحة HTML ، بما في ذلك الصور. ببساطة تحيط عناصر HTML أو العناصر التي تريد أن تكون وصلة مع
و العلامات. يمكنك أيضًا إنشاء روابط المواضع عن طريق ترك أ href السمة - ولكن فقط تأكد من العودة وتحديث معلومات href في وقت لاحق أو الارتباط لن تفعل أي شيء في الواقع عند الوصول إليها.
يجعل HTML5 صالحًا لربط عناصر مستوى الكتلة مثل الفقرات و DIV عناصر. يمكنك إضافة علامة ارتساء حول منطقة أكبر بكثير ، مثل تقسيم أو قائمة تعريف ، وستكون المساحة بأكملها "قابلة للنقر". يمكن أن يكون هذا مفيدًا بشكل خاص عند محاولة إنشاء مناطق ضرب أكبر وأكثر ملائمة للأصابع على موقع الويب.
بعض الأشياء تذكر عند إضافة روابط
- الاخير العلامة هي مطلوب. إذا نسيت تضمينه ، فسيتم أيضًا ربط كل شيء يتبع هذا الرابط ، إلى أن يغلق رابط آخر العلامة.
- في معظم الأحيان ، من الأفضل ربط صور مفردة وممتدات قصيرة للنص ، بدلاً من كتل كبيرة من النص. يمكن أن تؤدي الروابط إلى إضافة ألوان وتسطير أنماط إلى صفحتك يمكن أن يكون من الصعب قراءتها. بالطبع ، يمكنك استخدام CSS لتغيير أنماط الروابط وتحرير الألوان أو إزالة التسطير ، ولكن لا يزال من الجيد أن تضع في اعتبارها هذا الواقع.
- تأكد من التحقق من الروابط حتى لا تسيء. يمكن لـ Link Rot جعل كل من المستخدمين ومحركات البحث يعتبرون موقعك غير صالح. استخدم أداة فحص الروابط بانتظام للتحقق من الروابط الموجودة على صفحاتك. وينطبق ذلك بشكل خاص عند الربط بمواقع تابعة لجهات خارجية (تلك التي لا تديرها) والتي قد تغير صفحاتها مرات متعددة ، مما يترك لك روابط ميتة. سيجد مدقق الارتباط هذه الروابط غير الصالحة حتى تتمكن من إجراء أية تحديثات ضرورية.
- تجنب النص مثل "انقر هنا" في الرابط الخاص بك. تذكر أن الأشخاص الذين يستخدمون الشاشات التي تعمل باللمس لا يمكنهم "النقر" ، بحيث يبدو النص وكأنه منتج من حقبة ماضية ولا يكون ملائمًا في الوقت الحالي في الويب متعدد الأجهزة.
أنواع أخرى مثيرة للاهتمام من الروابط
ال ا يقوم العنصر بإنشاء رابط قياسي إلى مستند آخر ، ولكن هناك أنواع أخرى من الروابط التي قد تكون مهتمًا بها:
- الروابط الداخلية أو الروابط - هذه روابط إلى مكان ما داخل صفحة الويب ، وليس بالضرورة أعلى الصفحة.
- خرائط الصور - تسمح خرائط الصور بإنشاء روابط على الصور التي تم تعيينها لمناطق محددة من الصورة. هذه يمكن استخدامها للألعاب أو الملاحة الإبداعية. غالبًا ما تشاهدهم باستخدام الخرائط حيث تكون المناطق على الخريطة قابلة للنقر. لاحظ أنه لا يتم استخدام خرائط الصور على معظم المواقع الحديثة ، ويرجع ذلك جزئيا إلى أنها يمكن أن تسبب مشاكل على الجهاز المحمول.
- العنصر - يتم استخدام هذا العنصر لربط المستندات والصفحات الأخرى بالوثيقة الحالية. لن يؤدي ذلك إلى إنشاء منطقة قابلة للنقر على صفحتك على الويب ، ولكن من المفيد استيعابها.