HTML

الوصلات التشعبية

أھلاً وسھلاً بك إلى الدرس السادس من تعلم HTML .

Links …الروابط أو الوصلات التشعبیة ھي أساس المواقع و شبكة روح الإنترنت. وإذا كانت الإنترنت بمجملھا ھي
شبكة العنكبوت فإن ھذه الوصلات ھي الخیوط التي تشكل ھذه الشبكة وتؤلف حلقات
الربط بین الملایین من مواقعھا. تنقر على رابط ما فتنقلك إلى صفحة أخرى في
نفس الموقع… وتنقر على رابط أخر لتنقلك كلیاً إلى أحد المواقع في الجانب الآخر
من العالم… وصلة تجعلك تحمّل ملفاً وأخرى تجعلك تشغّل مقطعا موسیقیاً وثالثة
تعرض لك صورة…

حسناً، من المؤكد أنك استنتجت الآن من ھذه المقدمة أنك بصدد تعلم كیفیة إدراج
الوصلات التشعبیة في صفحاتك… لقد صدق استنتاجك لذلك ھیا إلى العمل…

ھناك عدة خیارات للوصلات التشعبیة، منھا أن تكون الوصلة لموقع آخر، أو أن تكون
لصفحة أخرى داخل الموقع نفسھ، ومنھا أن تكون لمكان آخر في نفس الصفحة (إلى
أعلى أو أسفل على سبیل المثال) أو أن تكون وصلة لعنوان برید إلكتروني mail-E
وفي جمیع الحالات فإن المبدأ واحد لكن تختلف بعض التفاصیل. وسوف أناقش معك
كل حالة على حدة وبالتفصیل.

نستخدم الوسوم

 </A> ... <A>

كوسوم أساسیة لإدراج الوصلات التشعبیة، وھي اختصار لكلمة Anchor .وھي لا تعمل لوحدھا بل تتطلب إضافة خصائص معینة أولھا وأھمھا الخاصیة HREF التي نحدد من خلالھا الموقع الذي نرید الدلالة علیھ، ویجب أن یكتب

عنوان الموقع كاملاً.
الحالة الأولى: إدراج رابط يشیر إلى موقع خارجي.
لنقم بإدراج رابط إلى أحد المواقع المعروفة

<A HREF="http://www.google.com"> </A>

أي لكي تكتمل الوصلة السابقة یجب أن نكتب معھا أي عبارة نریدھا، لكي ینقر علیھا الزائر فتنقلھ إلى العنوان المطلوب. ما رأیك بعبارة: Google To Go والتي تصبح الشیفرة معھا بالشكل التالي: لكن بقي شيء واحد وھو العبارة أو الكلمة التي سیتم النقر علیھا لتشغیل الوصلة، وھذه یجب أن توضع بین الوسمین

<A HREF="http://www.google.com"> Go To Google </A>

وبشكل عام فإن أي شيء یوضع بین الوسمین <A>… </A> سوف یكون الوسیلة
أو العنوان الذي ینقلنا إلى الموقع المشار إلیھ في الوصلة التشعبیة، سواءً كان ھذا
الشيء نصاً أو صورة أو كلاھما معاً.

والآن ھل تلاحظ الإطار الظاھر حول الصورة؟ وھل تذكر متى قمنا بالحدیث عن ھذا
النوع من الإطارات؟ نعم، في الدرس السابق. عند إدراج صورة كوصلة تشعبیة یظھر
حولھا إطار سمكھ 2 بیكسل وھذه ھي الحالة الإفتراضیة. وبالطبع نستطیع إزالتھ
بكتابة الخاصیة “0=”BORDER ضمن وسم الصورة.

<A HREF="http://www.google.com""><IMG SRC="
google.gif" BORDER="0"></A>

ننتقل الآن إلى الحالة الثانیة، وھي أن تشیر الوصلة التشعبیة إلى ملف موجود في نفس الموقع (أي ملف محلي) سواءً كان ملف HTML أو صورة أو غیر ذلك. وفي ھذه الحالة فإن ما یكتب مع الخاصیة HREF ھو اسم ھذا الملف المطلوب الوصول إلیھ. لنقم بإنشاء وصلة تشعبیة تقودنا إلى الصفحة الرئیسیة لھذا الموقع وبالمناسبة فإن الملف الذي یحتویھا اسمھ html.index ، والشیفرة الخاصة بذلك ھي:

 <A HREF="index.html">Main Page</A>

وأذكرك عزيزي المتابع بأنك تستطیع إدراج صورة ما مكان عنوان الوصلة التشعبیة وذلك بنفس التفاصیل التي شرحتھا في الحالة السابقة. لنقم الآن بادراج صورة مصغرة كعنوان لوصلتنا مكان الصورة الأصلیة

<A HREF="image.jpg"><IMG SRC=" image_1.jpg"
 BORDER="0"></A>

في ھذا المثال قمت بتحدید الصورة المصغرة المسماه jpg.1 _image كوصلة تشعبیة تصلنا إلى الصورة الأصلیة المسماه jpg.image

لكن إنتبھ إذا كان الملف المطلوب والذي ترید الإشارة إلیھ موجوداً في مجلد مختلف عن
المجلد الذي یوجد بھ الملف الحالي، فیجب علیك تحدید المسار الكامل لھذا الملف وذلك
بنفس الطریقة التي ناقشناھا في الدرس السابق عندما قمنا یإدراج الصور.

الحالة الثالثة ھي أن نقوم بالإشارة إلى مكان آخر داخل نفس الصفحة، إلى أولھا مثلاً أو
إلى آخرھا أو أي مكان آخر نریده…

طبعاً مھما بلغت درجة الذكاء والألمعیة التي یتصف بھا الكمبیوتر ومتصفح الإنترنت،
فھما لا یستطیعان معرفة ما یدور بفكرك وبالتالي لا یستطیعان معرفة المكان الموجود
في نفس الصفحة والذي ترید نقل زائرك إلیھ من خلال الوصلة التشعبیة. لذلك یجب أن
تقوم أنت بتحدیده.

والمراد هنا ھو أن تقوم باعطاء اسم معين لھذا المكان بإسم آخر سوف تقوم لاحقا
باستخدامه في الرابط الخاص بنا. وفي ھذه الحالة یتحتم علیك استخدام الخاصیة الثانیة

للوسم <A <وھي NAME

لنقم معاً بإدراج وصلة تشعبیة داخل ھذه الصفحة تقوم بنقل الزائر من مكان وجود ھذه
الوصلة إلى الفقرة الثالثة من ھذه الصفحة والتي بدأنا فیھا الحدیث عن الوصلات
التشعبیة Links

أول ما یجب فعلھ ھو الذھاب إلى ھذه الفقرة واختیار أول كلمة فیھا ثم وضعھا داخل

<A>LINKS</A>

والآن حان الوقت لاستخدام الخاصیة NAME فالخطوة الثانیة ھي تعریف ھذه الكلمة بأي اسم نریده (المھم أن نبقى متذكرین لھ). سوف أقوم بإعطاء الاسم attrib1

 <A NAME="attrib1">LINKS</A>

لقد أصبحت ھذه الفقرة جاھزة لكي نقوم بإدراج وصلات تشعبیة إلیھا من أي مكان في
ھذا الملف، بل ومن أي ملف آخر … وأكثر من ذلك أنھ إذا أراد أحد ما في أحد المواقع
الأخرى أن یضع وصلة تشعبیة لھا من موقعھ فإن باستطاعتھ ذلك شرط أن یعرف الإسم
الذي عرّفناھا بھ وھذا لیس صعباً بالطبع.

الخطوة الثالثة ھي إدراج الوصلة التشعبیة لھذه الفقرة.

ویلزمنا ھنا معرفة اسم الملف الذي توجد بھ ھذه الفقرة (أي ھذا الملف الذي نعمل بھ)
واسمھ html.htutor06 لأنھ سیشكل المدخل الأساسي للوصول إلى الفقرة المحددة.
وتكون شیفرة الوصول إلى ھذه الفقرة ھي كالتالي: الوسوم