الروابط التشعّبيّة: العنصر الذي جعل الويب شبكة

وصلتَ إلى هذه الصفحة على الأرجح بنقرةٍ على رابط. والرابط أبسط عنصرٍ في لغة HTML، سطرٌ واحد فيه وجهةٌ ونصّ، لكنّه الفكرة التي أعطت الويب اسمه: «الشبكة» (Web) سُمّيت كذلك لأنّ الروابط تصل صفحاتها المتفرّقة بعضها ببعض. في المقالات السابقة عرفتَ الصفحة والموقع ورأيتَ كيف يعرضهما المتصفّح، وهنا العنصر الذي يربط ذلك كلّه.

أبدأ من تاريخ الفكرة، ثمّ أفكّك الرابط في الشيفرة: وجهته، ونصّه، والسمات التي تضبط سلوكه، وما تغيّر في نصائحها منذ 2019. ثمّ أنتقل إلى الرابط الجيّد: كيف يكتبه من يهتمّ بالقارئ الكفيف ومحرّك البحث معًا، ولماذا تُكسر الروابط مع الزمن، وماذا تفعل حيال ذلك.

الفكرة التي سبقت الويب بأربعة عقود

في 1945 كتب المهندس الأمريكيّ فانيفار بوش مقالًا في مجلّة Atlantic Monthly عن جهازٍ تخيّله وسمّاه Memex، «امتدادًا للذاكرة»، يستطيع أن يصنع روابط بين المستندات ويتّبعها. وفي 1965 صاغ تيد نلسون كلمة «النصّ التشعّبيّ» (Hypertext) في ورقةٍ قدّمها في مؤتمرٍ لجمعيّة الحوسبة الأمريكيّة ACM. وفي الستّينيّات بنى دوغلاس إنغلبارت نظامًا اسمه NLS يتيح تصفّح النصّ التشعّبيّ وتحريره، واخترع الفأرة لأجله.^[1]

وقد عرض إنغلبارت نظامه على جمهورٍ من المهندسين في مؤتمر خريف 1968 لعلوم الحاسوب، بالروابط والفأرة ونوافذ على الشاشة، قبل عقدين من الويب. وانتهى العرض بتصفيقٍ وقوفًا، وصار يُعرف لاحقًا باسم «أمّ العروض» (The Mother of All Demos).^[2] فالفكرة كانت جاهزةً قبل أن تكون الشبكة التي تحملها جاهزة.

والذي جمع الاثنين هو تيم بيرنرز لي. أخذ النصّ التشعّبيّ الموجود قبله، ومدّ روابطه عبر الإنترنت كلّها بدل أن تبقى داخل حاسوبٍ واحد أو نظامٍ واحد. وبحلول نهاية 1990 كان أوّل خادم ويبٍ وأوّل متصفّحٍ يعملان في مختبر CERN.^[3] وتفصيل هذا التاريخ في مقال تاريخ الإنترنت.

تشريح الرابط

يُصنع الرابط في HTML بعنصرٍ واحد، هو وسم «المرساة» a. وأبسط صوره:

<a href="/guide/">اقرأ الدليل</a>

وله جزآن لا غنى عنهما. سمة href، اختصار «مرجع النصّ التشعّبيّ» (Hypertext REFerence)، وهي الوجهة التي ينقلك إليها الرابط. و«النصّ الظاهر» (Anchor Text) بين وسمي البداية والنهاية، وهو الكلمات التي تراها وتنقرها. الأولى تحدّد إلى أين، والثاني يخبر القارئ ماذا ينتظره هناك. وإلى جانبهما سماتٌ اختياريّة تضبط سلوك الرابط، والشكل 1 يضعها كلّها على سطرٍ واحد.

شكل 1

والرابط لا يقتصر على النصّ. تستطيع أن تجعل صورةً رابطًا بوضع وسم الصورة داخل وسم a، وهذا ما تراه في شعار الموقع الذي يعيدك إلى صفحته الرئيسة. وحينها يصير النصّ البديل للصورة هو نصّ الرابط: هو ما يسمعه الكفيف، وهو ما تستعمله جوجل نصًّا ظاهرًا للرابط.^[4] فالشعار الذي يربط إلى الرئيسة يحتاج نصًّا بديلًا مثل «الصفحة الرئيسة لموقع كذا»، لا كلمة «شعار».

إلى أين يشير الرابط

قيمة href ليست عنوانًا كاملًا دائمًا. «الرابط المطلق» يحمل العنوان كلّه، بالبروتوكول والنطاق والمسار، ويُستعمل للانتقال إلى موقعٍ آخر. و«الرابط النسبيّ» مسارٌ مختصر مثل /about/، يكمله المتصفّح بنطاق الصفحة الحاليّة، ويُستعمل داخل موقعك نفسه. وقد فصّل مقال عنوان الويب أجزاء العنوان التي يُبنى منها كلا النوعين.

ولبعض الوجهات بداياتٌ خاصّة. الرابط الذي يبدأ بعلامة # يقفز إلى موضعٍ داخل الصفحة نفسها، ويُستعمل في فهارس المقالات الطويلة. ورابط mailto: يفتح برنامج البريد برسالةٍ إلى العنوان المذكور، ورابط tel: يبدأ اتّصالًا على الهاتف. وسمة download تحوّل الرابط من انتقالٍ إلى تنزيل، فيُحفَظ الملفّ بدل أن يُفتح في المتصفّح.^[5]

<a href="https://example.com/page/">...</a>
<a href="/about/">...</a>
<a href="#section-2">...</a>
<a href="mailto:[email protected]">...</a>
<a href="tel:+12025550123">...</a>
<a href="cv.pdf" download>...</a>

وكثيرًا ما تحمل الوجهة معلوماتٍ إضافيّةً بعد علامة الاستفهام، تسمّى «معاملات الاستعلام». وأشهر استعمالاتها وسوم UTM التي تضيفها الحملات التسويقيّة لتعرف من أين جاء الزائر، فيعرف الموقع أنّك وصلت إليه من نشرةٍ بريديّةٍ بعينها أو من منشورٍ بعينه. فالرابط قد يحمل مع وجهته رسالةً عن طريقه.

وثمّة نوعٌ حديثٌ من الروابط الداخليّة يفيد الكاتب والقارئ معًا: «أجزاء النصّ» (Text Fragments). تضيف إلى نهاية العنوان صيغةً تبدأ بـ #:~:text= وبعدها عبارةٌ من الصفحة، فيمرّر المتصفّح الذي يدعمها الصفحة إلى أوّل موضعٍ فيه تلك العبارة ويبرزها عادةً بلون.^[6] وبها تستطيع أن تشير إلى جملةٍ بعينها في مقالٍ طويل، لا إلى المقال كلّه.

سماتٌ تضبط السلوك، وما تغيّر فيها

سمة target تحدّد أين يُفتح الرابط: في التبويب نفسه، وهو الافتراضيّ، أو في تبويبٍ جديدٍ بالقيمة _blank. ومتى تفتح تبويبًا جديدًا؟ في رأيي أنّ الأصل ترك القرار للزائر، لأنّ الفتح القسريّ يأخذ منه زرّ الرجوع. وأستثني ما يقطع عملًا جاريًا، كرابطٍ في منتصف نموذجٍ يملؤه، وحينها يحسن أن تنبّهه إلى أنّ الرابط سيُفتح في تبويبٍ جديد.

وكانت النصيحة سنواتٍ أن تضيف rel="noopener" إلى كلّ رابطٍ يُفتح في تبويبٍ جديد، لأنّ الصفحة الجديدة كانت تستطيع أن تتحكّم بصفحتك الأصليّة عبر واجهةٍ اسمها window.opener. وتقول MDN اليوم إنّ ضبط target="_blank" يعطي في المتصفّحات الحديثة الحماية نفسها تلقائيًّا.^[5] فبقاء السمة لا يضرّ، وقد يحمي زائرًا بمتصفّحٍ قديم، لكنّها لم تعد الشرط الذي كانته. أمّا noreferrer فما زالت تعني شيئًا مختلفًا: ألّا يُخبر المتصفّح الموقع الهدف بالصفحة التي جاء منها الزائر.

وتغيّرت نصيحة ثانية تخصّ محرّكات البحث. كانت nofollow القيمة الوحيدة لرابطٍ لا تريد أن يُحسب «توصية». وفي 10 أيلول 2019 أعلنت جوجل قيمتين جديدتين: sponsored للروابط الإعلانيّة والمدفوعة، وugc للروابط التي يكتبها المستخدمون في التعليقات والمنتديات. وأعلنت معهما أنّ القيم الثلاث صارت «إشارات» تستأنس بها جوجل في قرارها، لا أوامر ملزمة.^[7] وتوصي جوجل اليوم بـ sponsored للروابط المدفوعة، وتقبل nofollow لها بديلًا.^[8] وتفصيل أثر الروابط في الترتيب في مقال السيو خارج الصفحة.

<a href="https://example.com/" target="_blank" rel="noopener noreferrer">...</a>
<a href="https://shop.example/" rel="sponsored">...</a>
<a href="https://forum.example/" rel="ugc">...</a>

الروابط الداخليّة: لا تترك صفحةً يتيمة

تنقسم الروابط بحسب وجهتها قسمين. «الروابط الداخليّة» تصل بين صفحات موقعك نفسه، و«الروابط الخارجيّة» تصل موقعك بمواقع أخرى، صادرةً منه أو واردةً إليه. والداخليّة هي الجهاز العصبيّ للموقع: بها يتنقّل الزائر، وبها يفهم بنية الموقع، وبها يكتشف زاحف البحث الصفحات.

ولها وظيفةٌ يغفل عنها كثيرون: ألّا تترك «صفحةً يتيمة». الصفحة التي لا يصل إليها أيّ رابطٍ من صفحات موقعك تكاد تكون غير موجودة، لأنّ الزائر لا يبلغها متنقّلًا، وزاحف البحث الذي يتّبع الروابط لا يبلغها أيضًا. والشكل 2 يرسم موقعًا صغيرًا فيه صفحةٌ كهذه. والقاعدة بسيطة: كلّ صفحةٍ مهمّة يصلها رابطٌ واحدٌ على الأقلّ من صفحةٍ أخرى، وخريطة الموقع التي يشرحها مقال خريطة الموقع تعين لكنّها لا تحلّ محلّ الروابط.

ويهمّ النصّ الظاهر في الروابط الداخليّة كما يهمّ في الخارجيّة. تقول جوجل إنّ العناية بنصوص روابطك الداخليّة تعين الناس ومحرّكها معًا على فهم موقعك واكتشاف صفحاته. وتقول في الموضع نفسه: اكتب بطبيعيّة، ولا تحشر في نصّ الرابط كلّ كلمةٍ مفتاحيّة تتعلّق بالصفحة الهدف، لأنّ حشو الكلمات المفتاحيّة مخالفةٌ لسياساتها ضدّ الرسائل غير المرغوب فيها. والسؤال الذي تقترحه بسيط: هل يحتاج القارئ هذه الكلمات ليفهم الصفحة التالية؟^[9]

شكل 2

وحين تجتمع روابط داخليّة في مجموعة تنقّل، تُوضع في عنصر nav الذي يخبر المتصفّح وقارئ الشاشة أنّها قائمة تنقّلٍ رئيسة. ومن الأنماط المفيدة أيضًا «مسار التنقّل» (Breadcrumbs): سلسلة روابط صغيرة أعلى الصفحة، مثل «الرئيسة، ثمّ تطوير الويب، ثمّ هذه المقالة»، تبيّن للزائر موضعه في الموقع وتتيح له الصعود بنقرة. ومن أهمّ الروابط لإتاحة الوصول «رابط التخطّي»: رابطٌ مخفيّ في رأس الصفحة يظهر عند التركيز ويقول «تخطَّ إلى المحتوى»، فيتجاوز به من يتصفّح بلوحة المفاتيح قائمةً طويلة في كلّ صفحة.

ولهذه الروابط كلّها أثرٌ في تحسين محرّكات البحث. محرّك البحث يقرأ الروابط ليفهم بنية موقعك ويقدّر أهمّيّة صفحاته، ويعدّ الروابط الواردة من المواقع الأخرى إشارةً إلى الثقة. وهذا بابٌ قائمٌ بذاته في سلسلة السيو، يبدأ من مقال السيو داخل الصفحة.

الرابط الجيّد: واضحٌ وصادق

أهمّ ما في الرابط الجيّد نصّه. اجعله يخبر القارئ بوجهته، وتجنّب «اضغط هنا» و«المزيد». رابطٌ نصّه «دليل JavaScript للمبتدئين» يقول إلى أين يأخذك، و«اضغط هنا» لا يقول شيئًا. وجوجل نفسها توصي بنصٍّ ظاهرٍ وصفيٍّ قصير، مكتوبٍ بين وسمي الرابط حيث يستطيع زاحفها أن يقرأه.^[9]

والصدق ركنٌ ثانٍ: ينبغي أن يفي الرابط بما يعد به نصّه. فإن كتبتَ «حمّل الكتاب» وأخذ الرابط الزائر إلى صفحة اشتراك، خنتَ توقّعه وخسرتَ ثقته. ويحسن أيضًا ألّا تكثر الروابط في فقرةٍ واحدة، لأنّ كلّ رابطٍ يدعو العين إلى التوقّف، والفقرة التي تتوقّف فيها العين في كلّ سطرٍ تُتعب القارئ. اربط حين يضيف الرابط شيئًا يحتاجه القارئ فعلًا.

واحترم أعراف الشكل التي تعلّمها الناس في ثلاثين سنة. النصّ المسطّر أو المختلف لونًا يعني رابطًا، والرابط الذي يبدو نصًّا عاديًّا لا يكتشفه أحد، والنصّ العاديّ الذي يبدو رابطًا يخدع الزائر. ولا تعتمد على اللون وحده لتمييز الرابط، لأنّ من لا يميّز الألوان لن يراه. الخطّ تحت الرابط، أو أيّ علامةٍ غير اللون، يحلّ المشكلة.

لماذا «اضغط هنا» خطأ عند قارئ الشاشة

هنا السبب الأعمق لقاعدة النصّ الوصفيّ. الكفيف يتصفّح بقارئ شاشة، وكثيرًا ما يطلب منه قائمةً بكلّ روابط الصفحة، فيسمع نصوصها منفصلةً عن جملها. تخيّل أن تسمع قائمةً تقول: «اضغط هنا، اضغط هنا، اضغط هنا». أمّا «دليل JavaScript، تحميل الكتاب، صفحة التواصل» فكلّ رابطٍ فيها يقول وجهته وحده.

وهذا ما يطلبه معيار WCAG صراحةً في معياره 2.4.4. يجب أن يُفهم غرض كلّ رابطٍ من نصّه وحده، أو من نصّه مع السياق المرتبط به برمجيًّا، إلّا حيث يكون الغرض ملتبسًا على الجميع.^[4] وحين يفرض التصميم نصًّا مختصرًا كزرّ «اقرأ المزيد» تحت كلّ بطاقة، تضيف سمة aria-label تعطي قارئ الشاشة وصفًا كاملًا، مثل «اقرأ المزيد عن الاستضافة المشتركة».

وإن كان الرابط يفتح ملفًّا لا صفحة، فاذكر ذلك في نصّه نفسه، مثل «دليل الأسعار (PDF، 2 ميغابايت)». الزائر على هاتفٍ وشبكةٍ بطيئة يريد أن يعرف قبل النقر أنّه سينزّل ملفًّا وكم حجمه، وقارئ الشاشة يقرأ له هذه المعلومة مع الرابط فلا يفاجئه برنامجٌ آخر يُفتح.

ويخطئ كثيرٌ من المبتدئين في الفرق بين الرابط والزرّ. الرابط a للانتقال إلى مكان، والزرّ button لتنفيذ فعلٍ في المكان نفسه، كإرسال نموذجٍ أو فتح قائمة. واستعمال أحدهما مكان الآخر يكسر أمورًا كثيرة. المتصفّح يتيح للرابط ما لا يتيحه للزرّ، كفتحه في تبويبٍ جديدٍ أو نسخ عنوانه، وقارئ الشاشة يعلن «رابط» أو «زرّ» فيتوقّع المستخدم سلوكًا بعينه. وجوجل لا تتّبع إلّا ما كان عنصر a له سمة href، ولا تستطيع أن تستخرج العناوين من عناصر تعمل روابطَ بشيفرة JavaScript وحدها.^[9]

حالات الرابط ومؤشّر التركيز

للرابط حالاتٌ بصريّة يضبطها CSS: لونٌ لرابطٍ لم يُزر، وآخر لرابطٍ زرته، وتغيّرٌ حين يمرّ فوقه المؤشّر. وأهمّها لمن لا يستعمل الفأرة «حالة التركيز»، أي الإطار الذي يحيط بالرابط حين يصل إليه الزائر بمفتاح Tab، فيعرف أين يقف. وحذف هذا الإطار «لأنّه لا يعجب المصمّم» خطأٌ يترك من يتصفّح بلوحة المفاتيح تائهًا في الصفحة.

والحلّ الحديث الذي يرضي الطرفين هو الصنف الزائف :focus-visible. هو يطبّق التنسيق حين يكون العنصر في حالة تركيز ويقرّر المتصفّح أنّ التركيز يجب أن يظهر، كما يحدث مع لوحة المفاتيح عادةً، ولا يطبّقه غالبًا عند النقر بالفأرة. وتصنّفه MDN ميزةً «متاحةً على نطاقٍ واسع» في المتصفّحات.^[10]

a:link          { color: #1a5c8a; }
a:visited       { color: #6b3f8a; }
a:hover         { text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

الرابط في تطبيقات الصفحة الواحدة

في تطبيقات الصفحة الواحدة يغيّر النقر المحتوى داخل الصفحة نفسها بشيفرة JavaScript، دون أن يطلب صفحةً جديدةً من الخادم. ويبقى العنوان مع ذلك مهمًّا: لكلّ «شاشة» في التطبيق الجيّد عنوانها الذي تنسخه وتشاركه وتعود إليه. ومن يبني تطبيقًا بلا عناوين حقيقيّة يكسر أبسط ما يتوقّعه الزائر: أن يحفظ رابطًا ثمّ يعود إليه فيجد ما تركه.

وكلّ رابطٍ يأخذك إلى محتوًى بعينه في عمق موقعٍ أو تطبيق، لا إلى صفحته الرئيسة، يسمّى «رابطًا عميقًا» (Deep Link). ورابط المقال الذي ترسله لصديق رابطٌ عميق، وكذلك رابط المنتج في متجر. وهذا ما يجعل محتوى الويب قابلًا للمشاركة بدقّة.

ماذا يحدث حين تنقر

حين تنقر رابطًا يقرأ المتصفّح قيمة href، ثمّ يطلب الصفحة الجديدة، أو يحدّث المحتوى داخليًّا في تطبيقات الصفحة الواحدة، ويسجّل الوجهة في سجلّ التصفّح فيعمل زرّ الرجوع. وبعض المواقع اليوم لا تنتظر النقرة أصلًا. «واجهة قواعد التخمين» (Speculation Rules API) تتيح للموقع أن يخبر المتصفّح بالصفحات التي يُرجَّح أن يزورها الزائر بعد قليل، فيجلبها مسبقًا أو يجهّزها كاملةً قبل النقر، فتُفتح لحظة النقر تقريبًا.^[11] وهي تحلّ محلّ طرقٍ أقدم كانت تؤدّي جزءًا من هذا.

الروابط تموت

المواقع تُغلق، والعناوين تتغيّر، فتنكسر الروابط التي كانت تشير إليها وتنتهي إلى صفحة 404. وتسمّى هذه الظاهرة «تعفّن الروابط» (Link Rot). وفي 2024 قاس مركز Pew للأبحاث حجمها. ربع الصفحات التي وُجدت في وقتٍ ما بين 2013 و2023 لم يعد الوصول إليها ممكنًا في تشرين الأوّل 2023. ومن الصفحات التي وُجدت في 2013 وحدها اختفت 38 في المئة.^[12]

والأرقام أقرب إلى موقعك ممّا تظنّ. في القياس نفسه وُجد رابطٌ مكسورٌ واحدٌ على الأقلّ في 23 في المئة من صفحات المواقع الإخباريّة، وفي 21 في المئة من صفحات المواقع الحكوميّة. ووُجد أيضًا في 54 في المئة من صفحات ويكيبيديا ضمن قسم المراجع.^[12] والشكل 3 يضع النسب الثلاث متجاورة. فكلّ موقعٍ يربط إلى غيره يتراكم فيه مع الزمن ما يشبه الأعشاب الضارّة، والموقع الجادّ يراجع روابطه الصادرة دوريًّا ويصلح المكسور منها أو يستبدله.

شكل 3

ولا تحتاج أن تنقر كلّ رابطٍ بيدك لتجد المكسور منها. تقرير «فهرسة الصفحات» (Page indexing) في Google Search Console يُظهر الصفحات التي وجدتها جوجل تعيد خطأ 404 في موقعك. وتنصح جوجل بأن تصلح منها ما تربط إليه أنت أو تذكره في خريطة موقعك.^[13] وأدوات الزحف تمرّ على موقعك كلّه كما يمرّ زاحف البحث، وتعطيك رمز الحالة لكلّ رابطٍ فيه. وقد بنيتُ أداتين لهذا العمل. إضافة Full SEO Page Analyzer لمتصفّح كروم تعرض روابط الصفحة المفتوحة داخليّةً وخارجيّة، مع نصّ كلّ رابط وقيمة nofollow، وتفحص إن شئت رمز الحالة لكلٍّ منها. وبرنامج Crawlix يفعل ذلك لموقعٍ كامل، فيجد الروابط المكسورة وسلاسل التحويل عبر كلّ الصفحات. واختر ما يناسبك منها أو من غيرها، والمهمّ أن تجعل الفحص عادةً دوريّة.

وحين تغيّر أنت عنوان صفحةٍ في موقعك، لا تترك الرابط القديم يموت. أعد توجيه العنوان القديم إلى الجديد بتحويلٍ دائم (301)، فيصل الزائر الذي يحمل الرابط القديم إلى مكانه الصحيح، ويفهم محرّك البحث أنّ الصفحة انتقلت ولم تختفِ.

الرابط العربيّ

للرابط في موقعٍ عربيٍّ مشكلتان تستحقّان الانتباه. الأولى في العنوان نفسه. الحروف العربيّة ليست ضمن الرموز التي يقبلها العنوان كما هي، فيحوّلها المتصفّح عند النسخ والمشاركة إلى ترميزٍ بالنسبة المئويّة، على قواعد معيار العناوين من WHATWG.^[14] فكلمة «صفحة»، وهي أربعة حروف، تصير 24 رمزًا: %D8%B5%D9%81%D8%AD%D8%A9. ورابطٌ كُتب مساره بالعربيّة يصل إلى من ترسله إليه سطرًا طويلًا من الرموز لا يُقرأ. ولهذا يستعمل كثيرٌ من المواقع العربيّة، ومنها هذا الموقع، مساراتٍ بحروفٍ لاتينيّة، ويترك العنوان العربيّ للصفحة نفسها.

والثانية في شكل الرابط داخل النصّ. الخطّ الذي يوضع تحت الروابط يقطع أحيانًا الحروف العربيّة التي تنزل تحت السطر، كالراء والواو والميم في آخر الكلمة، فيصعب تمييز الكلمة. والحلّ في CSS خاصّيّة text-underline-offset، التي تبعد الخطّ عن موضعه الأصليّ بمقدارٍ تحدّده، وهي متاحةٌ على نطاقٍ واسع في المتصفّحات.^[15] خطّ الرابط الذي ينزل قليلًا تحت الحروف العربيّة يبقى علامة رابط، ويترك الكلمة مقروءة.

حين تشارك رابطًا

حين ترسل رابطًا في محادثة أو تنشره في منصّةٍ اجتماعيّة، يظهر غالبًا بعنوانٍ وصورةٍ ووصفٍ قصير بدل العنوان وحده. هذه «معاينة الرابط»: تجلب المنصّة الصفحة وتقرأ وسومًا خاصّةً في رأسها، أشهرها وسوم بروتوكول Open Graph، الذي يطلب لكلّ صفحةٍ أربع خصائص على الأقلّ: العنوان والنوع والصورة والعنوان الدائم للصفحة.^[16] فضبط هذه الوسوم يقرّر الانطباع الأوّل الذي يراه الناس قبل أن ينقروا رابطك.

خلاصة عمليّة

اكتب نصّ كلّ رابطٍ بحيث يُفهم وحده، واستعمل a للانتقال وbutton للأفعال، واترك إطار التركيز ظاهرًا بـ :focus-visible. وسِم الروابط المدفوعة بـ sponsored، وتعليقات الزوّار بـ ugc، وراجع روابطك الصادرة مرّةً كلّ بضعة أشهر، وحوّل كلّ عنوانٍ تغيّره إلى عنوانه الجديد. وبهذا تكتمل صورة الويب: صفحة، وموقع، ومتصفّح، ورابط. والخطوة التالية أن تبدأ البناء بنفسك، وأوّلها تجهيز أدواتك في المقال التالي.

المصادر

1. اتّحاد W3C، «A Little History of the World Wide Web»: مقال بوش عن Memex في Atlantic Monthly سنة 1945، وصياغة نلسون كلمة Hypertext في مؤتمر ACM سنة 1965، ونظام NLS لإنغلبارت واختراعه الفأرة.
2. معهد دوغ إنغلبارت، «The Mother of All Demos»: العرض في مؤتمر خريف 1968 لعلوم الحاسوب، والتصفيق وقوفًا، والتسمية اللاحقة.
3. مختبر CERN، «A short history of the Web»: أوّل خادم ويبٍ ومتصفّحٍ بحلول نهاية 1990.
4. اتّحاد W3C، «Understanding SC 2.4.4: Link Purpose (In Context)»: غرض كلّ رابطٍ يُفهم من نصّه وحده أو مع سياقه المحدَّد برمجيًّا.
5. موسوعة MDN، «<a>: The Anchor element»: سمات href وtarget وrel وdownload ووجهات mailto وtel، وأنّ target="_blank" يعطي في المتصفّحات الحديثة حماية rel="noopener" نفسها.
6. موسوعة MDN، «Text fragments»: صيغة #:~:text=، والمتصفّح الداعم يمرّر إلى العبارة ويبرزها.
7. مدوّنة جوجل للبحث، «Evolving “nofollow”: new ways to identify the nature of links» (10 أيلول 2019): قيمتا sponsored وugc، والقيم الثلاث إشارات.
8. شركة جوجل، «Qualify your outbound links to Google»: sponsored مفضّلة للروابط المدفوعة وnofollow مقبولة، وugc لروابط المستخدمين.
9. شركة جوجل، «Link best practices for Google»: جوجل تزحف عادةً إلى الرابط إن كان عنصر a بسمة href فقط، والنصّ الظاهر الجيّد وصفيٌّ وموجز.
10. موسوعة MDN، «:focus-visible»: يُطبَّق حين يقرّر المتصفّح أنّ التركيز يجب أن يظهر؛ متاحٌ على نطاقٍ واسع.
11. موسوعة MDN، «Speculation Rules API»: جلب الصفحات أو تجهيزها مسبقًا لتسريع الانتقال التالي، بديلًا لطرقٍ أقدم.
12. مركز Pew للأبحاث، «When Online Content Disappears» (17 أيار 2024): ربع الصفحات التي وُجدت بين 2013 و2023 لم تعد متاحة، و38% من صفحات 2013؛ ورابطٌ مكسور في 23% من الصفحات الإخباريّة و21% من الحكوميّة و54% من صفحات ويكيبيديا ضمن المراجع.
13. شركة جوجل، «Page indexing report»: تقرير فهرسة الصفحات، والنصيحة بإصلاح أخطاء 404 التي تربط إليها بنفسك أو تذكرها في خريطة الموقع.
14. مجموعة WHATWG، «URL Standard»: ترميز الحروف بالنسبة المئويّة بعد تحويلها إلى UTF-8.
15. موسوعة MDN، «text-underline-offset»: تحدّد بُعد خطّ التسطير عن موضعه الأصليّ؛ متاحةٌ على نطاقٍ واسع.
16. بروتوكول Open Graph، «The Open Graph protocol»: الخصائص الأربع المطلوبة لكلّ صفحة: og:title وog:type وog:image وog:url.