دورة البرمجة بلغة html الدرس 2: الروابط

الروابط التشعبية في لغة Html ( الوسم a )
لو أردنا إنشاء زر يذهب إلى صفحة ما أو إلى موقع ما مثل الزر التالي
اضغط هنا 
فإن الوسم الخاص بعمل هذا هو a ويكتب الكود كالتالي:

كود HTML:

<a href="http://shabsug.blogspot.com">اضغط هنا</a>

لاحظ طريقة كتابة الكود كالتالي:
بعد وسمة a و في داخلها نضع الخاصة href و هي لوضع الرابط الذي سيتم الانتقال له عند الضغط على الزر
وبدلاً من كلمة اضغط هنا يمكنك كتابة أي نص ليتحول إلى زر

ملاحظات هامة ومفاهيم يجب معرفتها:
لاحظ في الكود السابق أننا وضعنا الرابط كالتالي:

http://shabsug.blogspot.com

إنه من الضروري وضع http في بداية المسار في حال أردنا الزر ينتقل لموقع آخر
أو لمكان غير الذي نحن فيه
- خلينا نفهم المعنى العام لهذه العملية
هناك نوعين من المسارات ( الروابط \ لينك \ url )
المسار المطلق: وهو مسار مختلف عن المكان الذي نحن موجودون فيه
مثل الكود السابق الذكر حيث نريد للزر أن يذهب إلى الرابط www.shabusg.blogspot.com ونحن مثلاً في موقع آخر أو أي مكان آخر
المسار النسبي : وهو رابط للصفحة بحيث تذهب إلى صفحة قريبة من صفحة العمل
ليكن لدينا مجلد فيه الصفحتين التاليتين :

و نريد وضع زر في الصفحة index اسمه راسلني يقوم بفتح الصفحة sendme.htm
مع ملاحظة أن كلاهما في مجلد واحد أي بجوار بعضهم
عندئذ نكتب الكود كالتالي:

<a href="sendme.htm">راسلني</a>

مثال آخر لتوضيح الفكرة أكثر:
ليكن لدينا الملف Index.htm و بجواره مجلد اسمه programs

وداخل المجلد programs يوجد ملف اسمه kaspersky.zip

و الآن نريد وضع زر بداخل الصفحة Index.htm اسمه " تحميل البرنامج " وعند الضغط عليه
يتم تحميل الملف kaspersky.zip
لاحظ توضع الملفات و المجلدات وانظر كيف يكون الكود:

<a href="programs/kaspersky.zip">تحميل البرنامج</a>

ملاحظة :
لاحظ في كتابة المسارات كيف نضع إشارة / بين المسارات في برمجة الويب
على عكس جهة الاشارة \ في داخل مجلدات ويندوز

طريقة فتح الروابط:
يوجد عدة طرق لفتح الروابط مع الوسم a
للناقش الكود التالي :

<a  href="http://www.shabsug.blogspot.com">محترفي الكمبيوتر</a>

عند الضغط على زر طه سوفت سيفتح موقع http://www.shabsug.blogspot.com في نفس الصفحة التي نحن فيها
ولكن ماذا لو أردنا أن نجعل الزر عند الضغط عليه يفتح الموقع http://www.shabsug.blogspot.com في صفحة مستقلة ( أو تبويب جديد tab ) في مستعرض الانترنت
لعمل ذلك نضيف الوصف target إلى الكود كما يلي:
كود الروابط في صفحة مستقلة:

<a target="_blank" href="http://www.shabsug.blogspot.com">محترفي الكمبيوتر</a>

أكيد أنتم تجربون الأكواد معي خطوة بخطوة أليس كذلك 
للخاصة target أشكال أخرى نناقشها ان شا ءالله لاحقاً مع الاطارات
طريقة إنشاء رابط لإرسال بريد الكتروني:
لنرى الكود فوراً

<a href="mailto:example@example.com">راسلنا</a>

هذا الكود يقوم بإنشاء زر اسمه راسلنا وعند الضغط عليه يفتح برنامج outlook ليرسل رسالة
إلى الإيميل المذكور example@example.com
لتغييره فقط غير البريد و عنوان الزر
حيث أن الصفة mailto: هي التي جعلت الرابط يفهم أنه مخصص لإرسال بريد الكتروني

ملاحظة : يمكن وضع عنوان افتراضي للرسالة في الكود السابق فيصبح كما يلي:

<a href="mailto:example@example.com?subject=العنوان">راسلني</a>

استبدل كلمة العنوان بالنص الذي ترغب بظهوره كعنوان أساسي للرسالة
على فكرة الطريقة هذه لإرسال بريد الكتروني طريقة قديمة و متعفنة و الطريقة الأفضل هي بوضع
حقول يضع فيها المرسل رسالته و يضغط على زر اسمه ارسال فترسل الرسالة
و سنرى هذه الطريقة لاحقاً في دروس php

نكتفي بهذا القدر حتى لا نثقل عليكم و سأجعل الدروس بشكل عام قصيرة حتى يسهل متابعتها ان شاء الله انتظروني غداً أو بعد غد في الدرس القادم
أي استفسار نحن في الخدمة