تحية طيبة إلى زوار المدونة و متابعي الدروس التعليمية.. لقد رأينا في كيف انشاء موقعك بلغة html و في هذا الدرس من
اساسيات لغة css و html سنبدأ بالتطبيق! وسوف نكتشف أساسيات صفحات ال HTML ونسجل صفحة الويب
الأولى!بطبيعة الحال، لا تتوقعوا انشاء صفحة استثنائية على شبكة الإنترنت
من الدرس الثاني ،
ولكن التحلي بالصبر... فإن كل شئ يأتي!
بدون إطالة هذا هو فهرس الدرس الثاني من القسم الأول :
1. إنشاء صفحة بواسطة محرر النصوص
2. العلامات والسمات الخاصة بها
3. البنية الأساسية لصفحة HTML5
1. إنشاء صفحة بواسطة محرر النصوص كما قلت لكم، سوف نستحدث موقعنا في محرر نص. و قد تطرقت في درس كيف تنشئ
موقعا الى مجموعة من المحررات .. في أعقاب هذه الدورة، سأعمل مع المفكرة Notepad++
وهذا رابط محرر ان لم يوجد عندكم
لتحميل اضغط هنا
ماذا نفعل الآن؟ ماذا نكتب على هذه الورقة الفارغة ؟
لنقم باختبار صغير. أدعوكم لكتابة ما يأتي في رأسكم مثلي في الشكل التالي.
اكتب ما تريد
الآن، لنسجل الملف .و الأمر في غاية البساطة: كما هو الحال في جميع
البرامج، لديك قائمة ملف ثم حفظ. يظهر مربع حوار يطلب منك مكان حفظ الملف
وتحت أي اسم. احفظه أينما تريد. و إعطه الاسم الذي تريد وبنتهي بالصيغة.
html ، على سبيل المثال test.html ، كما هو مبين في الشكل التالي.
أنصحكم بإنشاء مجلد جديد في المستندات وتضعون فيه ملفات موقعكم. عن نفسي أنا خلقت مجلد test حيث وضعت ملفي test.htm
الآن افتحوا مستكشف الملفات في المجلد حيث تم حفظ الصفحة الخاصة بكم. سترون الملف الذي أنشأتموه للتو
الرمز الذي يمثل ملف يعتمد على متصفح الويب الافتراضي هنا الرمز هو غوغل
كروم لأنه المتصفح الافتراضي عندي، ولكن الملف قد يكون لها رمز آخر لك. هنه
على سبيل المثال الرموز التي تظهر ادا كان المتصفح الأساسي هو فايرفوكس أو
إنترنت إكسبلورر.. الان انقروا نقرا مزدوجا فوق هذا الملف وسيتم فتح
المتصفح، الشكل التالي يعرض النص الذي كتبته
كما ترون لم يعمل بشكل جيد، عرض كل النص على نفس السطر رغم أننا قمنا بكتابة سطرين مختلفين من فماذا حدث ؟
في الواقع، لإنشاء صفحة على شبكة الإنترنت لا يكفي كتابة النص فقط كما
فعلنا. بل يجب بالإضافة إلى هذا النص، أن نكتب ما يسمى الوسوم « tag »، مما
سيعطي تعليمات لجهاز الكمبيوتر مثل "اذهب إلى سطر"، "اعرض صورة"، الخ.
2. الوسوم والسمات الخاصة بها أ. الوسوم تمتلئ صفحات HTML مع ما يسمى الوسوم. و هي غير مرئية على الشاشة لزوار
موقعكم، لكنها تسمح للكمبيوتر بفهم ما يعرضه. العلامات من السهل ايجادها
فهي محاطة ب "الاقتباس"، وهذا يعني الرمزين <و>، مثل هذا :
بماذا تفيد الوسوم ؟ انها تشير إلى طبيعة النص الذي تحيط به . أنها تعني،
على سبيل المثال: "هذا هو عنوان الصفحة"، "هذه هي الصورة"، "هذه هي الفقرة
من النص"، الخ.
هناك نوعان من الوسوم: الوسوم المزدوجة الوسوم المغلقة.
يتبع