بسم الله الرحمن الرحيم
في هذه الدورة سنتعلم:
- المكونات الرئيسية لصفحة HTML
- استخدام HTML لبناء صفحات الانترنت
- إضافة الصور إلى صفحة الانترنت
- تشكيل واستخدام الروابط بين الصفحات
- تشكيل الجداول ذات الأعمدة والأسطر الت تحتوي على البيانات
- تشكيل القوائم
- تشكيل ما يسمى ب FORM وهو العنصر المسؤول عن استلام البيانات التي يدخلها المستخدم
الدرس الأول: ماهي لغة HTML ؟ لنبدأ معاً
ما هي لغة ال HTML ؟يشير الاختصار HTML إلى عبارة HyperText Markup Language أو لغة الترميز المتشعبة، وهذه اللغة هي اللغة المستخدمة ف تصميم جميع صفحات الويب. تكتب ملفات HTML على صورة ملفات نصوص بسيطة ) Plain Text ( وتأخذ الامتداد: .html وهي غير مرتبطة بنظام تشغيل معين، حيث تعمل على متصفحات الانترنت ك Internet Explorer أو Mozilla Firefox ، وهي لغة وصفية سهلة جدا وذات قدرات عالية وميزات فريدة وقوية، كما أنها ذات قواعد سهلة ومعروفة.
تتكون ملفات HTML من قسمين :
المحتوى: وهو ما يتم عرضه على المتصفح.
الوسوم: وهي الأجزاء التي تحدد كيفية العرض، وبمعنى أخر، فهي تصف المحتوى من حيث التنسيق.
فمثلاً:
<p>My name is Kamel</p>
تمثل كل من <p> و </p> وسم البداية والنهاية و يمثل النص My name is Kamel المحتوى. أما النتيجة التي ستظهر على المستعرض فستكون الجملة: My name is Kamel فقط.وسنرى الآن مزيدا من الوسوم وتوضيحا لمهمة كلٍ منها :
وسم البداية <HTML> وسم النهاية < /HTML>
مهمته يستخدم لتعريف المتصفح بأن هذه الصفحة مشكلة باستخدام لغة HTML ويوضع هذا الوسم في أول المستند ووسم النهاية الخاص به يوضع في نهاية المستند كما سيوضح لاحقا.
وسم البداية <HEAD> وسم النهاية < /HEAD>
مهمته يحتوي على المعلومات الإضافية الخاصة بالمستند مثل عنوان الصفحة والكلمات المفتاحية فيها وغيرها من الأمور الخاصة بالصفحة والتي لا تعتبر من ضمن المحتوى.
وسم البداية <TITLE> وسم النهاية < /TITLE>
مهمته وهو يمثل الجملة التي توضع أعلى الصفحة (أي اسم الصفحة في المتصفح) ويكتب عاد ة ضمن ال HEAD .
وسم البداية <BODY> وسم النهاية < /BODY>
مهمته وهو عبارة عن المحتوى الذي يراه المستخدم.
سنقوم الآن بإنشاء صفحة
يوجد العديد من الطرق لإنشاء الصفحات وسأذكر أهم طريقتين :
الطريقة الأولى :
باستخدام محرر النصوص العادي (Notepad) حيث نقوم بإنشاء ملف جديد وعند حفظه نقوم بوضع الامتداد .htmlوعند النقر عليه سيفتح تلقائيا باستخدام مستعرض الانترنت الافتراض المستخدم، أما عند الحاجة للعودة إلى المحرر لتعديل الصفحة، فسنقوم بالنقر يمينيا على الملف، ومن ثم فتح باستخدام ونختار محرر النصوص.
الطريقة الثانية :
بنفس الطريقة الأولى ولكن باستخدام برنامج بسيط يدعى ++Notepad والذي يقوم بتلوين النص ليساعدك في العثور على الأخطاء (وهي شائعة جدا ).
لنأخذ تطبيقا عمليا :
<HTML>
<HEAD>
<TITLE>
My first page < /TITLE>
</HEAD>
<BODY>
Hello my name is Ibrahim and this is my first webpage.
</BODY>
</HTML>
انتبه الى هذه الملاحظات :
قد تنسى أن تضع علامة الترقيم / في وسم النهاية.قد تنسى أن تضع وسم النهاية بعد كتابة المحتوى.
ملف - HTML يجب أن يبدأ دائما بالوسم <HTML> و ينته بالوسم </HTML> .
لا داع لأن تأخذ بعين الاعتبار حالة الأحرف (كبيرة او صغيرة ، لأن لغة - HTML لا تراع حالة الأحرف.
لغة - HTML لا تراع المسافات البيضاء، وتعتبرها جميعها مسافة واحدة، فلا داع للتدقيق على ذلك.
الوسم الذي نبدأ به هو الوسم الذي ننته به ولايجوز تداخل الوسوم، والصحيح أن تكون كما في الصورة :
سنكتف بهذا القدر في هذا الدرس، وستكون مهمتك الآن:
إنشاء صفحة يكون عنوانها باسمك، و يستطيع أن يرى فيها المستخدم الجملة: Hello World, here I'm coming.
ولا أنصحك باستخدام النسخ واللصق، فلن تنجح في كتابة صفحاتك إلا إذا قمت بتجربة ذلك بيدك حتى تتمرن عليها.
إرسال الوظائف:
ضع ملف الكود و الصور في ملجد ثم اضغطه باستخدام برنامج Winrar واحفظ الملف باسمك الكامل ثم ارسله الى الايميل التالي: اضغط هنا
او يمكنك نسخ الايميل من هنا "k-alhumsi@hotmail.com" ولصقه في المتصفح الخاص بك
الشهادة تعطى فقط للاشخاص الذين أتموا الوظائف بغض النظر اذا فيها أخطاء ام لا
هذه الدورة من اعداد المهندس ابراهيم تامر
Tags:
دورة HTML