السلام عليكم، سنرى في هذا الدرس الروابط، أنواعها، و كيفية إنشائها عبر تحريرها في ملف HTML.
هناك أربع أنواع من الروابط :
* الروابط الخارجية External Links
* الروابط الداخلية Internal Links
* روابط التحميل Download Links
* روابط المراسلة Contact Links
العنصر المسؤول في إنشاء الروابط هو عنصر 'A'، حيث أن حرف A مأخود من كلمة إنجليزية تسمى Anchor، أي مرساة السفينة، بحيث السفينة تبحر و تقف متبثتاً نفسها بالمرساة، كذلك مستعمل الإنترنت يبحر و يتصفح الويب -Navigation- ثم يرسي عن طريق الروابط في مكان ما في الويب، و عنصر 'A' هو عنصر Inline، ثنائي الأوسمة، و لديه Attribut إجبارية تسمى 'HREF' أي Hyper Referance و تعني الإرتباط التشعبي، و قيمتها هي المسؤولة عن تحديد نوع الرابط، أما ما يوجد بين وسمي العنصر 'A' هو ما يظهر في متصفحات الإنترنت، فإذا تم النقر في متصفح الإنترنت على ما بين وسمي عناصر الروابط الخارجية أو الروابط الداخلية من طرف الزائر سيُوجَّه إلى صفحة الرابط المُقحم في قيمة الـAttribut، أما إذا تم النقر في متصفح الإنترنت على ما بين وسمي عناصر روابط التحميل من طرف الزائر، فهذا الأخير سيُحمِّل شيئاً ما من الويب، أما إذا تم النقر في متصفح الإنترنت على ما بين وسمي عناصر روابط المراسلة، فستتم المراسلة بالبريد الإلكتروني بين الزائر و صاحب الموقع الإلكتروني.
الروابط الخارجية External Links
ما هي الروابط الخارجية ؟
رابط الخارجي هو الرابط الذي إذا نُقر عليه من طرف الزائر سيؤدي بهذا الأخير إلى صفحات أو عناصر خارج الموقع الإلكتروني الذي يحتوي الرابط المنقر عليه، و يمكنه أن يكون عبارة عن كلمة\جملة محايدة، أو كلمة\جملة داخل نص، أو صورة أو فيديو أو أوديو، أو مجموعة روابط مفرقة في عناصر قائمة.
كيفية إنشاء الروابط الخارجية
دائماً تقحم وجهة الرابط الخارجي في 'HREF' لعنصر الرابط على شكل عنوان URL سواء كانت الوجهة عبارة عن صفحة ويب أو عنصر ويب كصورة أو فيديو أو أوديو..أما بالنسبة لما يظهر في متصفحات الإنترنت، أي ما يوجد بين وسمي عنصر الرابط، فهو حسب الحالات التالية :
- إذا كان عبارة عن كلمة\جملة محايدة، يجب كتابة الكلمة\الجملة المحايدة بين وسمي عنصر الرابط.
- إذا كان عبارة عن كلمة\جملة داخل نص، يجب كتابة الكلمة\الجملة بين وسمي عنصر الرابط علماً أن هذا الأخير سيقحم مكان الكلمة\الجملة داخل النص.
- إذا كان عبارة عن صورة أو فيديو أو أوديو، يجب إقحام عنصر الصورة أو الفيديو أو الأوديو بين وسمي عنصر الرابط.
- إذا كان عبارة عن مجموعة روابط مفرقة في عناصر قائمة، يجب إقحام كل عنصر رابط داخل كل عنصر 'LI' في القائمة.
الروابط الداخلية Internal Links
ما هي الروابط الداخلية ؟
رابط داخلي هو الرابط الذي إذا نُقر عليه من طرف الزائر سيؤدي بهذا الأخير إلى صفحات أو عناصر داخل الموقع الإلكتروني الذي يحتوي الرابط المنقر عليه، و هو نوعان :
* النوع الأول هو نوع مثله مثل الرابط الخارجي، أي يمكنه أن يكون عبارة عن كلمة\جملة محايدة، أو كلمة\جملة داخل نص، أو صورة أو فيديو أو أوديو، أو مجموعة روابط مفرقة في عناصر قائمة؛ و يشبهان بعضهما أيضاً في نوع الوجهة، أي يمكن وجهة الرابط الداخلي أن تكون عبارة عن صفحة ويب أو عنصر ويب كصورة أو فيديو أو أوديو، إلا أنهما يختلفان في مكان الوجهة، مكان وجهة الرابط الداخلي يكون داخل الموقع الإلكتروني الذي يوجد فيه، أما مكان وجهة الرابط الخارجي يكون خارج الموقع الإلكتروني الذي يوجد فيه.
* النوع الثاني هو نوع تكون وجهته داخل نفس صفحة الويب الذي يتواجد فيها.
كيفية إنشاء الروابط الداخلية
النوع الأول
بالنسبة لهذا النوع، تنسيق كود عنصر الرابط الداخلي مثله مثل تنسيق كود الرابط الخارجي، لكن الفرق في قيمة 'HREF'، بحيث في الرابط الداخلي يجب إقحام قيمة الوجهة حسب مكان العنصر أو الصفحة نسبة للصفحة التي تحتوي على الرابط، هناك ثلاث حالات :
- إذا كان عنصر\صفحة الوجهة يوجد في نفس المجلد الذي توجد فيه الصفحة التي تحتوي على الرابط، يجب إقحام إسم ملف عنصر\صفحة الوجهة في قيمة 'HREF' لعنصر الرابط الداخلي.
- إذا كان عنصر\صفحة الوجهة يوجد في مجلد داخل المجلد الذي توجد فيه الصفحة التي تحتوي على الرابط، يجب إقحام إسم المجلد المحتوي لعنصر\صفحة الوجهة ثم هذه العلامة '/' ثم إسم ملف عنصر\صفحة الوجهة في قيمة 'HREF' لعنصر الرابط الداخلي.
- إذا كان عنصر\صفحة الوجهة يوجد في مجلد يحتوي المجلد الذي توجد فيه الصفحة التي تحتوي على الرابط، يجب إقحام نقطتان أفقيتان '..' ثم '/' ثم إسم ملف عنصر\صفحة الوجهة في قيمة 'HREF' لعنصر الرابط الداخلي.
النوع الثاني
بالنسبة للنوع الثاني الذي يخص الروابط التي إذا نُقر عليها من طرف الزائر سيُوجّه إلى أمكنة داخل نفس الصفحة التي يوجد فيها الرابط المنقور عليه، يتطلب على الصفحة أن تكون طويلة، و تتوفر على الأقل على عنصر HTML، و يجب على الرابط أن يكون أعلى من العنصر HTML في الصفحة حيث يمكن إقحام Attribut تسمى 'ID' في العنصر HTML الموجود في الصفحة و المراد جعله وجهة الرابط، ثم إعطاء لقيمة 'ID' كلمة تصنف كإسم، ثم يجب كتابة في قيمة 'HREF' لعنصر الرابط هذه علامة '#' متبوعة بقيمة 'ID' للعنصر HTML، و بالتالي إذا تم النقر على الرابط سيتم التوجيه إلى العنصر HTML في نفس الصفحة ليظهر أعلى الشاشة.
هناك Attribut تقحم في عناصر 'A' للروابط الداخلية و للروابط الخارجية تمنح خاصية فتح الرابط المنقور عليه في صفحة أخرى داخل نفس متصفح الإنترنت، حيث تلعب دوراً أساسياً رغم أنها ليست إجبارية للعنصر ألا و هو تخفيض معدل الإرتداد المعروف بـ Bounce Rate للمواقع الإلكترونية مما يساعد الموقع في الحصول على نسبة عالية للسيو SEO، و تسمى هذه Attribut بـ 'TARGET' و قيمتها 'BLANK_'
الفيديو التوضيحي للدرس
روابط التحميل Download Links
ما هي روابط التحميل ؟
رابط التحميل هو رابط إذا نقر عليه الزائر سيحمِّل شيئاً كملفات أو صور أو فيديوهات أو ما شابه..
كيفية إنشاء روابط التحميل
يتوفر عنصر رابط التحميل على نفس تنسيق عنصر الرابط الخارجي، سواء كان يظهر كنص أو كصورة أو كفيديو.. إلا أن الإختلاف يكمن في قيمة 'HREF' حيث يجب الأخذ بعين الإعتبار مكان ملف التحميل بتطبيق الحالات الثلات في تحديد مكان الملف المراد تحميله نسبة لمكان ملف الصفحة المحتوية للرابط (كما رأينا في كيفية إنشاء النوع الأول للروابط الداخلية) و يجب إضافة Attribut تقحم في عنصر 'A' تسمى 'DOWNLOAD' في حالة إنشاء عنصر رابط تحميل ملف Multimedia كصورة أو فيديو أو أوديو..
روابط المراسلة Contact Links
ما هي روابط المراسلة ؟
روابط المراسلة هي روابط يضعها مصممو الويب في صفحات الويب بحيث إذا نقر عليها الزوار سيظهر لهم نظام المراسلة التلقائي في جهازهم من أجل مراسلة أصحاب صفحات الويب بالبريد الإلكتروني.
كيفية إنشاء روابط المراسلة
يتوفر عنصر رابط التحميل على نفس تنسيق عنصر الرابط الخارجي، سواء كان يظهر كنص أو كصورة، إلا أنه يكمن الفرق في قيمة 'HREF' حيث يجب الكتابة فيها كلمة 'MAILTO' ثم نقطتان عموديتان ':' ثم عنوان البريد الإلكتروني للمراسلة.
الأكواد المستعملة في هذا الدرس
أتمنى أن تستفيدوا من الدرس