نبذة سريعة
سنقوم بهذا الدرس ببناء صفحة ويب بسيطة ، وتحتوي على العناصر الأساسية لأي صفحة إنترنت .
العناصر الأساسية لأي صفحة إنترنت
يوجد وسوم أساسية يجب كتابتها لأي صفحة إنترنت لا يمكن الإستغناء عنها ، وجدير بالذكر ، انه يمكن ان تكون عناصر الـ HTML متداخله
بمعنى أوضح يمكن كتابة الوسوم داخل بعضها ( وسم وبداخله وسم اخر )
<!DOCTYPE html>
<html>
<head>
<title>Learn HTML</title>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
هذا السطر يعنى أن الملف ( الوثيقة الحالية ) من نوع HTML و DOCTYPE هي إختصار لـ Document Type بمعنى نوع الملف .
وهنا يعني انك ستعمل على صفحة من نوع html
<html>
يمثل هذا الوسم العنصر الأساسي للصفحة أو يعرف بالعنصر الجذر ( Root Element ) والذي يشير لبدء مستند HTML
ولاحظ أن هذا العنصر هو أول عنصر في الصفحة وأخر عنصر ولا يوجد أي عنصر قبله أو بعده
ويمكن وضع فيه عنصر <head> وحيد فقط , وايضاََ عنصر <body> وحيد وداخل عنصر الـ <body> مجموعة من العناصر التي تريد لبناء صفحة الويب
وسم الإغلاق الخاص به هو </html>
<head>
كما قلنا مسبقاََ ممكن ان تكون الوسوم داخل بعضها ، هنا وسم الـ <head> هو أول الوسوم ( الأبناء ) التى تأتي مباشرة داخل وسم الـ <html>
ويحتوى على جميع المعلومات الخاصة بالصفحة مثل عنوانها وغيرها يتم كتابتها في داخل وسم الـ <head>
وسم الإغلاق الخاص به هو </head>
العناصر التي يمكن إستخدامها وان تكون داخل عنصر الـ <head>
- <title> </title>
- <link>
- <style> </style>
- <meta>
- <script></script>
- <noscript></noscript>
<title>
يتم استخدام هذا العنصر مرة واحدة في الصفحة فقط ، ويتم كتابته داخل وسم الـ <head> ويعمل هذا الوسم على عرض العنوان الخاص بهذه الصفحة ليظهر في علامة التبويب بالمتصفحات ، ومهم كتابته من أجل محركات البحث للتعرف على صفحتك ، والحد الأقصي لعدد الاحرف لهذا العنوان هو 60-70 ويجب ان يكون العنوان فريدا ومميز لكل صفحة ويب لديك.
كنا قلنا أنه يمكن كتابه وسوم متداخله في بعضها ، ولكن هنا في هذا العنصر لا يمكنك كتابة اي وسوم ولو قمت بذلك فسوف يتجاهلها ، يمكن ان يحتوي على نصوص فقط
وسم الإغلاق الخاص بهذا العنصر هو </title>
<body>
ويستخدم في بناء هيكلية وإنشاء الصفحة فبداخله يتم كتابه ما تريد من العناصر سواء أكانت عناووين أو فقرات ، صور ، جداول ، فيديوهات ، مقاطع صوتيه .. الخ ، جميع المحتويات التى تراها في الصفحة تكون بداخل هذا الوسم
هو يمثل جسم الصفحة ، وليس من المنطق أن يكون هناك أكثر من جسم ، يعنى ان هذا العنصر يكتب مرة واحدة فقط داخل الصفحة .
وسم الإغلاق الخاص بهذا العنصر هو </body>
كتابة جملة نصية
تعرفت بالأعلى انه في حال كنت تريد كتابة أي شىء بالصفحة يمكنك كتابته داخل وسم الـ <body> فلو قمنا بكتابة نص أي نص كان ، فليكن مثلا Hello HTML ويكون الملف كاملاََ بهذا الشكل .
<!DOCTYPE html>
<html>
<head>
<title>Learn HTML</title>
</head>
<body>
Hello HTML
</body>
</html>
في حال تم فتح هذا الملف على المتصفح سيظهر بهذا الشكل .