انتساب

دروس HTML-CSS - 2 ديسمبر، 2020

مقدمة في أساسيات HTML للتعرف علي الاساسيات الهامة

مقدمة في أساسيات HTML للتعرف علي الاساسيات الهامة

ما هو ملف الـ HTML؟

HTML هي اختصار لمجموعة كلمات Hyper Text Markup Language وهى تعنى لغة النصوص الفائقة ذات العلامة ، وقد سميت تلك النصوص بهذا الأسم لإختلافها عن النصوص العادية فهى تمتاز عادة بأن تحتها خط و دائما ما تقودنا الى مكان ما على الانترنت و ما أن تقترب من هذه النصوص بالفأرة حتى نجد شكل المشيرة قد تغير ، و إذا قمنا بالضغط على الزر الأيمن للفأرة يتم نقلنا إلى موقع أخر على الإنترنت .

لذا فالنصوص الفائقة ذات العلامة تحمل بداخلها أكثر من مجرد نص لذا سميت بالنصوص الفائقة ذات العلامة التى تتميز عن النصوص العادية.

و هناك بعض الخصائص التي تميز ملفات الـ HTML نذكر منها.

* ملفات الـ HTML هي ملفات نصية تحتوى على رموز الوسوم الصغيرة.
* رموز الوسوم تخبر المتصفح بكيفية عرض صفحة الويب.
* ملفات الـ HTML يجب أن تأخذ الامتداد HTM أو HTML.
* يمكن تحرير ملفات الـ HTML باستخدام أي محرر نصوص بسيط مثل الـ Notepad.

تحرير أول ملفاتك بلغة الـ HTML

إذا كنت تستخدم نظام Windows فابدأ بتشغيل الـ Notepad ، إما إذا كنت تستخدم نظام Mac فيمكنك أن تبدأ SimpleText الآن.

في أي نظام تشغيل أخر، ابدأ TextEdit وغير التفضيلات التالية: حدد (في نافذة التفضيلات) “Plaintext” بدلاً من “Rich text” ثم حدد “Ignore rich text commands in HTML files”. وهذا الأمر هام للغاية، إذا لم تفعل ذلك، فلن يعمل كود الـ HTML.

قم بنسخ النص التالي في محرر النصوص الذي تستخدمه.

<html>
<head>
<title>عنوان الصفحة</title>
</head>
<body>
هذه هي أول صفحة نقوم بتصميمها. <b>ما رأيكم هل نجحنا ؟</b>
</body>
</html>

الآن قم بحفظ هذا الملف باسم ” index.html ” ، ثم قم بتشغيل متصفحك ، و من قائمة ملف أختر الأمر ” فتح ” و من مربع الحوار أختر الأمر “Browse” أو استعرض و ابحث عن الملف index.html الذي قمت بتحريره الآن قم باختياره ثم قم بالضغط على زر فتح أو ” Open ” … الآن يمكنك مشاهدة عنوان الملف في مربع الحوار اضغط ok سوف يقوم المتصفح بعرض الصفحة الآن … ماذا ترى ؟

شرح المثال

من خلال المثال السابق نجد مجموعة من وسوم HTML سوف نقوم بشرحها الآن حيث نجد أن ملف HTML يجب أن يبدأ بالوسم فهذا الوسم يخبر المتصفح هذا هو بداية ملف HTML ، كما يجب أن ينتهي الملف بالوسمو هذا الوسم يخبر المتصفح بأن هذه هي نهاية ملف HTML.
أي أن جميع ملفات HTML يجب أن يكون لها بداية و نهاية ، البداية تكون من خلال الوسمو النهاية تكون من خلال الوسم.
و ملفات الـ HTML يمكن تقسيمها إلى جزئين رئيسيين هما الـ head أو ما يسمي برأس الملف و جزء الـ body أو ما يسمى بجسم الملف.

رأس الملف الـ head

الجزء المحصور بين الوسمينويسمى رأس الصفحة ، و النص الموجود بين هذين الوسمين هو عبارة عن معلومات رأس الصفحة ، و تلك المعلومات لا يتم عرضها داخل نافذة المتصفح.
أما النص الموجود بين الوسمينهو عبارة عن عنوان الصفحة ، هذا العنوان يتم عرضه عنوان المتصفح ” هو الشريط الافقي الموجود أعلى شاشة المتصفح “.

جسم الملف الـ body

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

امتداد ملفات الـ HTML

عند حفظ ملفات HTML يجب أن تقوم باستخدام الامتداد .htm أو الامتداد .html ، في الماضي كنا مضطرين لاستخدام الامتداد .htm فقط نظراً لأن البرامج كانت لا تسمح إلا بثلاث حروف فقط كامتداد للملفات.
و لكن مع الإصدارات الحديثة للبرمجيات فمن الأفضل أن نستخدم الامتداد .html

ملاحظات على محررات لغة الـHTML:

يمكنك تحرير ملفات HTML باستخدام محرر WYSIWYG (ما تراه هو ما تحصل عليه) مثل FrontPage، أو Claris Home Page أو Adobe PageMill بدلاً من كتابة وسوم التمييز في ملف نص عادي.
لكن إذا كنت تريد أن تصبح مطور ويب محترف، ننصحك بشدة أن تستخدم محرر نص عادي لتتعلم بدايات الـ HTML.

الرئيسية
المنتدى
تطوير المواقع
الشارات