تعلم لغة html من الصفر (1)

تعلم لغة html من الصفر (1)

0

تعلم لغة html من الصفر

تعلم لغة html من الصفر

أولي دورات ويب تايمز في تعليم لغات البرمجة ، اليوم أول مقال من دورة تعلم لغة html من الصفر وفي هذه الدورة سنقوم بشرح لغة HTML بطريقة بسيطة جدا للتعلم ، هذا الكورس مخصص للمبتدئين في مجال البرمجة ولمن لايعلم أنني حاصل علي شهادات معتمدة في مجال البرمجة ومجالات اخري مثل السيو والتدوين والتسويق ، لذلك قررت ان اقوم بنشر هذه الدورة للافادة وتبسيط أي شي معقد باذن الله وكلنا كنا مبتدئين في أي مجال عموما وشخصيا انا كل يوم اتعلم شي جديد سواء في البرمجة او في مجالات أخري ، مجال البرمجة يقاس حاليا بعملك الذي تقوم به من خلال تعلمك للغات البرمجة ، وسنقوم باذن الله بعد هذه الدورة بتقديم دورات اخري في CSS وجافا سكربت وPHP ولكن كل تركيزنا حاليا علي انتهاء دورة تعلم لغة html من الصفر

تعلم لغة HTML – بدائيات اللغة

تعلم لغة html من الصفر

في اولي دورات تعلم لغة html من الصفر سنشرح لكم بدائيات اللغة ، كلمة HTML مختصرة من Hypertext Markup Language ومعناها لغة ترميز النصوص التشعبية وهي لغة من لغات تصميم المواقع وأصبحت من اللغات الاساسية التي يجب تعلمها لانها من الاساسيات في تصميم المواقع مثل CSS تماما .

تبدأ أي صفحة HTML بكود <!DOCTYPE html> وهو يعرف ويحدد بأن هذه الصفحة بها أكواد HTML .

أسفله ستجد كود <head> الذي يكون به أكواد وصفية مثل أكواد الميتا تاج

وهي وظيفتها وصف محتوي الموقع <meta> مثل كود <title> الذي يكون به عنوان الموقع او عنوان الصفحة الرئيسية . وايضا في كود head تضع أكواد اخري مثل أكواد <link> الذي يقوم بوضع رابط خارجي سيتم ربطه بالصفحة وهذا سنشرحه قريبا وايضا يوجد كود <style>  الخاص بوضع أكواد CSS بداخله ، واكواد HTML تغلق برمز (/) مثل هذا الكود تماما

 

<head>
<title>عنوان الصفحة</title>
</head>

 

كما ترون في المثال الذي في الأعلي وهذه ايضا صورة توضع وتبسيط المعلومة أكثر

تعلم لغة html من الصفر

توجد اسفل HEAD وسم <body> وهو أساس الصفحة ويكتب فيه محتوي الصفحة . وبه في الصورة كود كتابة الفقرة ويرمز له بكود <P> ويمكنك وضع روابط في الصفحة عن طريق هذا الكود :-

 

 <a href="https://webtimes.best">هذا مثال لرابط</a>

 

كما تري الكود الخاص بالرابط <a href=”https://webtimes.best”>هذا مثال لرابط</a> .

واذا كنت تريد وضع صورة فتكون عن طريق اضافة كود <img > :-

 

 <img src="https://webtimes.best/wp-content/uploads/2020/09/%D9%88%D9%8A%D8%A8-%D8%AA%D8%A7%D9%8A%D9%85%D8%B2.png" alt="ويب تايمز" width="100" height="150">

 

في المثال السابق الوسم src يتم اضافة بعده رابط الصورة و رمز أو وسم alt يتم وضع به تعريف أو وصف للصورة وبعدهم يأتي ارتفاع وعرض الصورة وهذا شي اختياري يمكنك اضافتهم ويمكنك ازالتهم من الكود كما تشاء .

نأتي لمعلومة مهمة جدا وهي

الفرق بين ID و CLASS :-

ID هي تأتي باسم أو معرف واحد فقط ولايمكنك وضع نفس المعرف مرة أخري ، بمعني أنه اذا كان يوجد معرف ID باسم id=”myHeader” فلا يمكنك انشاء معرف ID باسم MyHeader مرة أخري .

أما CLass يجوز استخدامه لأكثر من عنصر ويفضل ان يكون اسمه يعبر عن محتوي مابداخله .

لكي تقوم بكتابة فقرات او نصوص كما قلنا استخدم وسم <P> ويمكنك معه ايضا استخدام وسم <br> لعمل مسافة بين النص ويمكنك استخدام وسم ;nbsp& لكي تقوم بعمل مسافة في نفس السطر . ولكي تجعل الخط سميك قم بوضع كود <strong> ويمكنك جعل الخط مائل باستخدام وسم <i></i>

عناصر العناوين 6 عناصر <h1>–<h6>: وهي مستويات الترويسات وبالطبع أعلي عنصر هو h1 وأقل عنصر أو أدني عنصر هو h6 .

نصيحة هامة ! :- تجنّب تخطي مستوى من مستويات الترويسات، وبمعني اخر ابدأ دائما من <h1> ثم استخدام <h2> وهكذا فيما بعد.

تعلم لغة html من الصفر

أنتهي الدرس الاول من دورة تعلم لغة html من الصفر  وسنقوم بوضع المزيد من الدروس في الايام القادمة باذن الله شكرا لزيارتك ويب تايمز قم بمشاركة الموضوع اذا افادك او قم بدعمنا من خلال كتابة تعليق تحفيزي لنا ولا تنسي الاطلاع علي شهاداتي واذا اردت الاستفسار عن أي شي لاتتردد في كتابته في تعليق وسنرد عليك فورا .

الدرس الثاني من تعلم لغة html من الصفر !

لمتابعي موقع ويب تايمز فقط
سنرسل لك كلمات رئيسية عالية الزيارة وعالية الربح CPC مجانا !
يمكنك إلغاء الاشتراك في أي وقت

اترك رد

لن يتم نشر عنوان بريدك الإلكتروني.

خمسة × 3 =