[دورة] برمجة html للمبتدئين

شغب نت · #1 (**permalink**) Mon-Dec-2008, 11:40 PM

السلام عليكم ,,,

هذا اول موضوع لي في منتداكم الرائع تصميم نت الذي يبشر بخير في القريب باذن الله و حبيت انه يكون مميز فقررت وضع دورة HTML مبسطة جدا جدا جدا

لن اطيل عليكم سادخل في الدورة بسرعة و متطلبات الدورة هي:-

1) برنامج الفرونت بيج (و هو موجود في حزمة الاوفس و انا استخدم الفرونت بيج 2003)
اذا ما عندك حمله من هنا

انتظروا الدرس الاول باذن الله و شكرا

التعديل الأخير تم بواسطة شغب نت ; Thu-Dec-2008 الساعة 04:18 AM.

شغب نت · #2 (**permalink**) Tue-Dec-2008, 12:10 AM

السلام عليكم ,,,

اليوم نبدا في اول درس على بركة الله

لن اقول لكم تاريخ هذه اللغة العتيقة و لا فيما تستخدم و لا ما ذا تعني كلمة HTML و هي اختصار لماذا؟
لان هذا سوف يصعب عليكم الامور و في النهاية مالفائدة من ذلك و اعتقد ان معظم الاخوه يعرفون معلومات كافية عن هذه اللغة ... هدفنا من الدورة هو تعليم البرمجة فقط

الكود البرمجي الاساسي:-
سنقوم خلال تعلمنا لهذه اللغة باستخدام كود برمجي موحد في جميع صفحاتنا ... بل هذا هو الكود الاساسي لجميع صفحات HTML

تفضولوا هذا هو الكود و سنقوم بشرحه الان

كود بلغة HTML:

<html dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
</head>
<body>
</body>
</html>

سنقوم الان بشرح الكود السابق

كود:

<html dir="rtl">

طبعا في لغة HTML هناك وسوم سنتعلمها و اول وسم سنتعلمه هو وسم <HTML> و كما ترون بالكود اننا لم نضع كود <HTML> فقط ... بل قمنا بوضع عبارة dir="rtl" و معنى dir انه امر بموضع الكتابة في الصفحة و rtl اختصار لـ Right To Left اي من اليمين الى اليسار
اي اننا نريد الكتابة من اليمين الى اليسار ... و لو اردنا الكتابة من اليسار لليمين فالامر سهل جدا

فقط نقوم باستبدال "rtl" بـ "ltr" ... سهل صح

طبعا في لغة HTML عندما نفتح وسم علينا باغلاقه و كما تلاحظون في المثال السابق فتحنا وسم <HTML> علينا باغلاقه ... و طريقة اغلاقه هي اضافة علامة / قبل الوسم

و بما ان كود <HTML> هو كود بداية صفحة HTML فسنقوم في نهاية الصفحة باضافة الكود التالي كما هو واضح في كود الصفحة الاساسي

كود:

 
</HTML>

الا هنا نصل و باذن الله نكمل الدورة المبسطة و نكمل شرح الكود الاساسي

التعديل الأخير تم بواسطة شغب نت ; Tue-Dec-2008 الساعة 12:28 AM.

محمد عمارة · #3 (**permalink**) Tue-Dec-2008, 12:53 AM

جزاكم الله خيرا ننتظر المزيد من المشاركات

__________________

دعم فني و تصميم
musamym@yahoo.com
mosamim@live.com

شغب نت · #4 (**permalink**) Tue-Dec-2008, 04:32 PM

نكمل درسنا على بركة الله ...

الحين تعلمنا اول وسم في لغة HTML و تعلمنا ان كل وسم لازم نغلقه و تعلمنا طريقة اغلاق الوسوم

اليوم رح ندرس وسم جديد و مهم و هو وسم <head> و هو وسم يستعمل عادتا لاضافة فواكه للصفحة و يستخدم في الترميز و اكواد Meta التي سنشرحها لاحقا باذن الله

كود:

 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
</head>

نلاحظ اننا وضعها وسم <head> كامل مع محتوياته ... طبعا محتواه اساسي لكل صفحة

كود:

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

هذا اول كود في وسم <head> و هو من اكواد Meta التي سنقوم بشرحها لاحقا ... ع العموم وضيفة هذا الكود هو ترميز windows-1252 اللغة العربية

كود:

<title></title>

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

مثلا عندي الصفحة ابغى اسميها "تصميم نت" نقوم بوضع عبارة "تصميم نت" بين فتح وسم <title> و وسم اغلاقه و هو <title/> ... و هذا الكود للتوضيح

كود:

<title>تصميم نت</title>

الا هنا نكون وصلنا الى نهاية في درسنا و انشاء الله نكمل الدورة باذن الله و شكرا

التعديل الأخير تم بواسطة شغب نت ; Thu-Dec-2008 الساعة 04:20 AM.

شغب نت · #5 (**permalink**) Thu-Dec-2008, 04:11 AM

نكمل اليوم درسنا و اللي الصراحة اضعه بكل خجل لانه سهل جدا جدا جدا

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

كود:

 
<body>
</body>

كذا نكون انتهينا من شرح الكود الاساسي ... انتظروا بداية الدروس الفعليه ... لا تخافوا لان HTML كلها وسوم سهلة

و هذا تذكير مهم جدا بالنسبة للي يتعلم HTML او اي لغة برمجة مواقع حفظ الاكواد ليس هو الطريق الصحيح لتعلم البرمجة ... التطبيق المستمر هو الذي يعلمك حاول ان تقوم بكتابة الاكواد مجددا لا ان تنسخها او تحفظها فالحفظ امر مجهد كثيرا ... رح تحفظها مع الزمن يالغالي

يوسف الحمود · #6 (**permalink**) Fri-Dec-2008, 02:27 PM

أسعدك الله أخي الحبيب

دروس رائعة وتمنيت أن يكون كل درس في موضوع مستقل .

شكرا لك .

__________________

يمكن للزوار المشاركة بدون تسجيل في المنتدى المخصص للزوار

كما يمكنهم تحميل ما يريدون بدون تسجيل أيضا

www.tsmem.net

...

جهبذ · #7 (**permalink**) Sun-Dec-2008, 08:56 AM

السلام عليكم
سعيد جدا بوجودي بينكم
ثانيا بالرغم من ان الموضوع لازال سهل كما قلت ولكن اشيد بطريقتك واسلوبك الجميل

وان شاء الله نستفيد جميعا
وانا متحمس ليس لـ html بل للجافا سكربت ايضا
دمت بود

محمد عمارة · #8 (**permalink**) Thu-Jan-2009, 12:24 PM

ننتظر باقي الدروس أخي الحبيب

__________________

دعم فني و تصميم
musamym@yahoo.com
mosamim@live.com

هتاف الحرية · #9 (**permalink**) Thu-Feb-2009, 02:41 AM

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

يوسف الحمود · #10 (**permalink**) Thu-Feb-2009, 09:58 AM

اقتباس:

المشاركة الأصلية كتبت بواسطة هتاف الحرية

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

ضع الكود الذي وضعته في المفكرة .
ولا تنسى أن تكتب تعريف اللغة في بداية الملف ونهايته .

__________________

يمكن للزوار المشاركة بدون تسجيل في المنتدى المخصص للزوار

كما يمكنهم تحميل ما يريدون بدون تسجيل أيضا

www.tsmem.net

...

أدوات الموضوع
مشاهدة صفحة طباعة الموضوع أرسل هذا الموضوع إلى صديق
انواع عرض الموضوع
العرض العادي الانتقال إلى العرض المتطور الانتقال إلى العرض الشجري

الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1)