إنشاء أول صفحة ويب بواسطة الـ HTML

نبذة سريعة

سنقوم بهذا الدرس ببناء صفحة ويب بسيطة ، وتحتوي على العناصر الأساسية لأي صفحة إنترنت .

 

العناصر الأساسية لأي صفحة إنترنت

يوجد وسوم أساسية يجب كتابتها لأي صفحة إنترنت لا يمكن الإستغناء عنها ، وجدير بالذكر ، انه يمكن ان تكون عناصر الـ 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>

 

في حال تم فتح هذا الملف على المتصفح سيظهر بهذا الشكل .

HelloHtml