ما يجب أن يعرفه كل مبتدئ عن HTML: كيفية عمل HTML خطوة بخطوة

ما يجب أن يعرفه كل مبتدئ في HTML خطوة بخطوة
نوفمبر 11, 2023

HTML هيا لغة ترميز النصوص التشعبية تعد اللبنة الأساسية للويب. كيفية عمل HTML! هي تقوم بوصف و تعريف محتوى صفحة الويب. التقنيات الأخرى إلى جانب HTML تعمل عادةً على وصف مظهر صفحة الويب (CSS) أو تفاعلها مع المستخدم (الجافاسكربت). إنه رمز أساسي يتكون من نصوص ورموز بنيت عليها شبكة الويب العالمية بأكملها. إنه في الواقع بسيط نسبيًا للتعلم أيضًا!

الآن لدينا العديد من منصات النشر على الويب للاختيار من بينها ، مثل دكتورميجا وووردبريس ، والتي تجعل من السهل تصميم موقع ويب رائع بسهولة إلى حد ما وتجعلنا غير المبرمجين في العالم نبدو مثل معالجات تصميم الويب.

لكن خمن ماذا ؟! هذه القوالب المصممة مسبقًا في تلك الأنظمة الأساسية تتكون من HTML!

توفر الأنظمة الأساسية بشكل أساسي واجهة مستخدم (UI) لمطوري الويب غير لبناء صفحات ويب لطيفة دون الحاجة إلى معرفة الترميز. يقومون بإنشاء رمز HTML بناءً على الشكل الذي تريد أن تبدو عليه صفحتك.

هذا هو السبب في أنه لا يزال من المفيد الحصول على فهم أساسي كيفية عمل HTML.

حسنًا، كيف تعمل HTML؟

HTML هي لغة قياسية لبناء صفحات الويب وتتكون من نصوص وأرقام ورموز مألوفة مثل “=” و “#”. يتكون الرمز من العلامات والعناصر، والخصائص.

العلامات: تكون العلامات دائمًا في شكل أزواج ، ومحاطة بأقواس <> ، ويجب أن تكون صغيرة. العلامة الأولى هي علامة البداية </> والعلامة الثانية هي علامة النهاية . علامة النهاية لها الشرطة الأمامية. العلامات هي كود HTML قياسي يخبر المتصفح بالشكل الذي يجب أن يبدو عليه المحتوى الموجود بداخلها ، المسماة بالعناصر. <p>مثال عملي</p>

العناصر: العناصر – مثل عناوين الصفحات أو الصور – هي المحتوى الذي يتكون منه صفحة الويب. تخدم العلامات المختلفة وظائف مختلفة مثل إخبار المتصفح بأن كلمات معينة (عناصر) يجب أن تكون غامقة أو بخط حجم معين.

فيما يلي مثال على العلامة القياسية لإدراج الوسوم السميكة. <b></b>

لذا إذا أردت أن يظهر هذا النص بخط عريض في المتصفح – فأنا أعظم معالج HTML على الإطلاق –

أود أن أكتب – أنا أعظم معالج HTML على الإطلاق. وسيظهر هكذا في المتصفح:

أنا أعظم معالج HTML على الإطلاق

الخصائص: مثل العلامات ، ترتبط الخصائص بالعناصر. تتم إضافتها إلى العناصر كزوج من الاسم والقيمة بين قوسين ، وتتم إضافتها إلى عنصر قبل إغلاق علامة بدء العنصر.

إليك مثال على ذلك: <body bgcolor="red">

الخصائص هي أشياء مثل الروابط أو الألوان أو المحاذاة أو أوامر المحاذاة.

تتضمن بعض الأشياء الأساسية التي يجب معرفتها حول الخصائص ما يلي:

  • يمكن إضافة أي عدد من الخصائص إلى عنصر.
  • الخصائص تكون دائمًا بتنسيق .
  • الخصائص مفصولة بمسافات.
  • أسماء الخصائص دائمًا بأحرف صغيرة.
  • يجب أن تكون قيم الخصائص محاطة دائمًا بعلامات اقتباس مزدوجة (“).

أين يحدث التأثير

المتصفح هو ما يقرأ ويترجم كود HTML (العلامات والخصائص) إلى ما تراه على صفحة الويب (العناصر). تظهر العناصر فقط على جانب المتصفح. هذه هي الطريقة التي ترى بها صفحة ويب جميلة بالكامل تحتوي على صور وروابط ونصوص وألوان مختلفة وما إلى ذلك. تعتمد صفحة الويب بأكملها على كيفية كتابة هذه العلامات والخصائص والعناصر المختلفة والفردية.

تريد أن تعرف ما هو الشيء الرائع فى HTML؟

لا تحتاج إلى أي برنامج فاخر لكتابة HTML. يمكن كتابته في محرر نصوص بسيط. هناك ايضاً محررين محترفين لتحرير صفحات HTML ، لكن خمنوا ماذا ؟! لديك واحد على جهاز الكمبيوتر الخاص بك – NotePad مخصص للكمبيوتر الشخصي و TextEdit لأجهزة Mac. تتم كتابة الكود بشكل أساسي من اليسار إلى اليمين ، سطرًا بسطر.

العلامة الأولى التي تراها هي العلامة . تبدأ كل صفحة HTML بهذه العلامة. يخبر المتصفح أن هذا مستند HTML.
يبدأ المستند الفعلي بعلامة وفي الجزء السفلي تمامًا ، بعد كل العناصر الفعلية ، ترى علامة الإغلاق .
المحتوى الذي سيتم ملؤه على جانب المتصفح موجود بين علامتي <body> و </body>.

هذه العلامات الثلاث قياسية في كود html لصفحة ودائمًا ما تكون بهذا الترتيب.

يوجد سطرين بين علامات الجسم:

<h1/>عنواني الأول<h1> هو إخبار المتصفح بأنك تريد كتابة الكلمات “عنواني الأول” بحجم الخط H1 ، أو العنوان 1. هناك ستة علامات للعناوين (من <h1> إلى <h6>) تخبر المتصفح حجم الخط يجب أن يكون. H1 هو أكبر حجم للخط وسيظهر على النحو التالي:

عنواني الأول

ثم لديك <p/> فقرتي الأولى <p> تخبر علامات الفقرة المستعرض أن هذا عبارة عن كتلة فقرة من النص. لذلك في المتصفح ، سترى النص بالخط واللون العاديين:

فقرتي الأولى

إذا أردت أن تجعل النص “فقرتي الأولى”. تظهر بلون معين ، يمكنك إضافة سمة بين العلامة. سيقرأ الرمز:

<p><font color=”green”>فقرتي الأولي</font></p> وستظهر:

فقرتي الأولى

هذا شرح أساسي جدًا لكود HTML. كما تعلم ، تتكون صفحات الويب من عناصر مختلفة (مهم … .. عناصر) مثل الصور والعناوين والعناوين الفرعية والفقرات وما إلى ذلك ، وهناك العديد من العلامات القياسية المختلفة والخصائص المختلفة التي يمكنك استخدامها لإخبار المتصفح بالطريقة التي تريدها العناصر لتظهر.

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

إذا كنت مهتمًا بتعلم HTML، فإن موقع الويب دبليو ثري سكولز. إنه مجاني ويوفر دروسًا بسيطة خطوة بخطوة حول HTML حتى تتمكن من تعلم العلامات القياسية المختلفة وكيفية كتابة كود HTML بسيط.

هناك شيء قوي للغاية بشأن النظر إلى صفحة الويب وفهم التأثير الذي وراء الغلاف. لقد ناقشنا كيفية عمل HTML بعد تعلم HTML، قد تشعر أنك عظيم قليلاً!

اترك تعليقاً