تعلم HTML وأساسياته (الجزء الثاتي)

تعلم لغة HTML وأساسيات اللغة بكل بساطة وسنحاول تبسيط أي شي معقد

السلام عليكم في الجزء الأول من تعلم أساسيات HTML , كان الموضوع حاز علي مشاهدات مقبولة لذلك قمنا بعمل جزء ثاني للغة HTML , في الجزء الاول قمنا بشرح تكوين الصفحة في HTLM اليوم سنتعرف علي بعض المفاهيم الخاصة باللغة .

أسفل الكود <Head>

وسم Head هو الوسم الخاص برأس الصفحة وأسفله تأتي أكواد الميتا , والميتا كما قلنا في مقال سابق أن لها استخدامات اساسية وأهم استخدام هوانه يقوم بوصف محتوى الموقع بدقة ، والميتا تاج لابد من ان يوصف الموقع والمحتوي بدقة وايجاز , وايضا لعرض الكلمات الرئيسية المستهدفة .
ومثال هذا الكود
<meta charset="utf-8"
هذا الكود هو الترميز العالمي وبيفسر الشفرة البرمجية ويدعم اللغة العربية والانجليزية بدون اي مشاكل وبدون هذا الكود ستصبح اللغة العربية علي شكل رموز غريبة
واسفله تضع أكواد الميتا تاج لوصف المحتوي ومدونين بلوجر هذه أحدث اكواد الميتا تاج لمدونة بلوجر 2020 .
من أهم الأكواد التي تضع أسفل الوسم Head هو title وهو لوصف عنوان الموقع مثل هذا الكود تماما

code-box<title> مستر عربكو | Mr.Arabko</title>

هذا الكود لوصف عنوان الموقع وتوجد أكواد ميتا اخري مثل كود

code-box<meta name="description" content=" ....">

هذا الكود لوصف محتوي الموقع .
وأيضا من الاكواد التي تضع أسفل وسم Head هو وسم Link هو عبارة عن source أو مصدر من الخارج وتم وضعه لربطه بالموقع مثل اكواد الخطوط الموجودة في جوجل , هذه الخطوط عبارة عن مصدر خارجي لربط خط معين بالموقع لاستخدامه

~~<link href="https://fonts.googleapis.com/css2?family=Tajawal" rel="stylesheet code-box">~~

هذه كود خط من خطوط جوجل
ومثال اخر أكواد المكاتب مثل مكتبة بوتستراب او مكتبة UIKIT الذي تم شرحهم مسبقا هم أيضا عبارة عن مصادر واكواد لاضافات خارجية ويتم ربطها بالصفحة او بالموقع .
وسم Head يكون بهذا الترتيب

<head>
<meta charset="utf-8"
<meta name="description" content=" ....">
<link href="https://fonts.googleapis.com/css2?family=Tajawal" rel="stylesheet"/>
</head>

كما ترون في المثال في الأعلي أكواد الميتا أول ثم أكواد link أسفلها هذا الترتيب الصحيح

مابداخل الكود <body>

الكود body هو جسم الصفحة والذي يوجد به المحتوي ونضع به اكواد Class و ID
Class يجب اختيار اسم سيكون معبرعن محتوي ال Class
ID هو اسم المعرف ولا يجوز أستخدامه أكثر من مرة
وبالنسبة لمدونين بلوجر في هذا الوسم تضع اكواد seciton و widget ويكون لل widget معرف Id وعند تكرار اسم المعرف تظهر مشاكل لذلك يجب ان يكون اسم المعرفات كلها مختلفة عن بعضها .
وفي درس سابق عن الفرق بين ال Section&Widget في بلوجر شرحنا ان ال section القسم الرئيسي و ال widget هي الاضافات مابداخله , اي ان ال سيكشن هو الفصل او الاساس وال widget هي مابداخله من اشياء واضافات , مثال علي ذلك , نريد ان نضع فوتر في القالب , الفوتر هو السكشن (section) ومابداخل الفوتر هو widget وهذا المثال سيوضح لك

<b:section class='footer' id='footer' showaddelement='yes'>
هنا توضع الاضافات ال widget
</b:section>

هذا مثال بسيط جدا واظن انك فهمت ال section بشكل جيد ,اذن ماهي ال widget ؟
هي الاضافات الموجودة في التخطيط مثل الارشيف والمشاركات الشائعة واضافة المتابعة عبر البريد مثال علي ذلك هذه الاكواد
اذا اردت وضع الارشيف ضع هذا الكود <b:widget id='BlogArchive1' locked='false' title='الأرشيف' type='BlogArchive'></b:widget>

نتمني ان يكون الموضوع مفيد لك، ان واجهتك اي مشكلة في هذا الموضوع او مشكلة عامة في موقعك قم بكتابتها في صفحة الاستشارة المجانية او في اي موضوع وسيقوم بالرد عليك من احد فريق الموقع او مني , او اذا كنت تريد شرح معين عن أي شي في بلوجر او SEO لاتتردد في كتابته في التعليقات

https://ilde.upf.edu/v/64k6

مستر عربكو | Mr.Arabko

القائمة الرئيسية

الصفحات

تعلم HTML وأساسياته (الجزء الثاتي)