أحدث المواضيع

مرات مشاهدة الصفحة في الشهر الماضي

خبراتي فى لغات البرمجه

85% HTML
90% CSS
85% Web-Design

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *

الأربعاء، 24 فبراير 2016

الدرس (9) تعلم HTML : بعض الوسوم التي تضع في ال head - الجزء الاول -

 بسم الله الرحمن الرحيم

مرحباً بكم في شروحات لتعلم html اليوم سأعرفكم على بعض الوسوم التي تكون بين الوسمين 
<head></head>

إن هذين الوسمين كما بينت سابقاً يقع داخلهما الوسوم المسؤولة عن خصائص الموقع مثل العنوان الذي يظهر في رأس المتصفح عند فتح الموقع و الوصف الذي يظهر اسفل اسم الموقع في نتائج البحث عند البحث عنه في محرك البحث و التحكم في لغة صفحة الموقع ايضاً يضع بين هذي الوسمين و الكثير .
مثلاً عند فتح محرك البحث جوجل و إذا اردنا كتابة اسم موقع وبحثنا عنه فتظهر نتيجة البحث في الغالب بأن يوجد وصف للموقع تحت اسمه هكذا


و هذه الخاصية تكون مسؤول عنها وسم meta والذي تكون صيغته على شكل التالي
<meta name="description" content="هنا يوضع الوصف">
مثال توضيحي 

الوسم الثاني وهو لجعل الموقع يقبل اللغة العربية يعني اذا كتبت عبارة عربية في ال body من دون كتابة هذا الوسم فلن يظهر النص مفهوم
الوسم هو
<meta content=”text/html; charset=windows-1256″ http-equiv=”Content-Type” />
هذا الوسم يفضل ان يكون من أوائل الوسوم في ال head 
مثال على شرحنا اليوم 

في هذا الموضوع اخذنا جزء على الأشياء التي تكتب في ال head و ان شاء الله سنشرح الجزء الثاني في درس قادم
السلام عليكم و رحمة الله و بركاته
اقرأ تكملة الموضع

السبت، 20 فبراير 2016

الدرس (8) تعلم HTML : أضافة صورة إلى صفحة الويب

 بسم الله الرحمن الرحيم
في درس اليوم سنتاول موضع مهم في مجال تطوير المواقع حيث أنه شيء مفيد و اساسي في صفحات الويب 

نأتي الآن و نبدأ في شرح درسنا و الذي هو كيفية اضافة صورة على صفحة الويب 
الصورة عند اضافتها على صفحة الويب تستعمل وسم يوضع بين وسمين ال body 
<body></body>
الوسم هو كالتالية 
<img src="هنا يوضع رابط الصورة "/>
الرابط كيف نحضره شرحته في الدرس السابق ( الدرس (7) / تعلم HTML : تغيير خلفية صفحة الويب
يمكن ايضاً  وضع اسم صورة اذا كانت الصورة في نفس مكان حفظ ملف الصفحة التي نعمل عليها لكن نضيف على أسم الصورة نقطة (.) و نوع الصورة مثل الشكل التالي 

<img src="أسم الصورة.jpg "/>
بالنسبة لنوع الصورة نقوم بالضغط على الصورة بالزر الأيمن ثم نختار خصائص و بعدها تظهر كما في الصورة التالية







إلى هنا نكون قد انتهينا من درسنا اليوم
السلام عليكم و رحمة الله و بركاته
اقرأ تكملة الموضع

الخميس، 18 فبراير 2016

الدرس (7) تعلم HTML : تغيير خلفية صفحة الويب

 بسم الله الرحمن الرحيم
موضعنا اليوم هو كيفية تغيير خلفية الموقع كوضع صورة او جعلها على لون معين
أولاً نأتي إلى تلوين خلفية صفحة الموقع 
في البداية يجب ان نعرف ان كل ما يظهر على صفحة الموقع هو يكتب بين الوسمين 
<body></body>
فالوسم body هو المسؤول عن هيكل صفحة الويب و لتغيير خلفية الصفحة نكتب الكود المسؤول عن هذا الشيء في الوسم <body> على الشكل التالي 
<body bgcolor="blue">
مثال تطبيقي 

مكان كلمة blue نضع اسم لون او كود لون (كود اللون كيف نحضره شرحته في درس سابق من دروس html )
بعدما شرحنا عن تغيير لون الصفحة نأتي لشرح كيفية وضع صورة كخلفية صفحة الويب , الكود المسؤول عن الأمر ايضاً يوضع داخل الوسم <body>
الكود على هذا الشكل 
<body background="#" >
مكان الرمز # نضع رابط الصورة المراد وضعها كخلفية 
ورابط الصورة نجلبها كمثل الموضح في الصورة التالية 

اي نضغط بالزر الأيمن من الفأرة على الصورة في الصورة السابقة و نختار الخيار نسخ الارتباط او يمكن ان يكون رابط الصورة في المكان الذي نكتب فيه في العادة رابط موقع معين في المتصفح مثلاً www.osamaalmousa.me وهذا الرابط يكون احياناً عند فتح صورة في المتصفح 
وهكذا نكون انتهينا من درس تغيير خلفية صفحة الويب 
السلام عليكم و رحمة الله و بركاته
اقرأ تكملة الموضع

الثلاثاء، 16 فبراير 2016

الدرس (6) تعلم HTML : تطبيق اكثر من وسم على نص معين

  بسم الله الرحمن الرحيم
اليوم سوف نشرح امر مهم في لغة html الذي يعطيك امكانيات اكثر لتحرير النصوص



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

 المثال السابق كلمة text هي الكلمة المراد تطبيق الدرس عليها 
نأتي الآن إلى كيفية اضافة اكثر من وسم , كما لاحظنا مكتوب قبل text مجموعة وسوم والتي هي <b> لجعل الخط عريض , <u> لوضع خط تحت النص
<font color=red> لتغيير لون الخط مثل حالتي وضعت اللون الأحمر red 
اما بعد كلمة text يوجد
</font>
التي هي نهاية الوسم و هكذا على التوالي 
فالوسم الذي نبدئه قبل النص يكون نهايته في النهاية بعد النص مباشرة و على هذا المنوال نكتب باقي الوسوم
فمثلاً الوسم <u> في المثال السابق هو بعد الوسم <b> فنهايته بعد كلمة text يكون قبل نهاية الوسم 
</b>
ان شاء الله يكون الدرس مفهوم 
السلام عليكم و رحمة الله و بركاته


اقرأ تكملة الموضع

الاثنين، 15 فبراير 2016

الدرس (5) تعلم HTML : التعامل مع النصوص (الجزء الثالث)

 السلام عليكم و رحمة الله و بركاته 

الموضوع في هذا الدرس يتكلم عن ثلاث وسوم تخص النصوص تكملة للسلسلة تعلم html 
الوسم الأول هو <b> هذا الوسم يقوم بجعل الخط عريض كهذا المثال
لتطبيق العمل السابق نكتب النص بين الوسمين 
<b></b>
مثال تطبيقي 

الوسم الثاني هو <u> لوضع خط تحت النص 
لعمل هذا الشيء نضع النص بين الوسمين 
<u></u>


نأتي للوسم الثالث <i> يقوم هذا الوسم بجعل الخط مائل هكذا
لعمل هذا الشيء ايضاً نكتب النص بين الوسمين 
<i>text</i>
للتوضيح : كلمة text هي مثال للشرح وليست كود برمجي
نأتي الآن إلى اخر كود في هذا الدرس الذي هو 
<center>
هو يجعل النص في منتصف الصفحة ولجعل النص المقصود في منتصف الصفحة نكتب النص بين هذين الوسمين 
<center>text</center>
و بهكذا نكون قد انتهينا من هذا الدرس

في امان الله
اقرأ تكملة الموضع

الدرس (4) تعلم HTML : التعامل مع النصوص (الجزء الثاني )

 السلام عليكم و رحمة الله و بركاته
الموضوع اليوم هو تكملة لشرحنا السابق في التعامل مع النصوص في لغة HTML 
سنذكر بإذن الله بعض الوسوم في هذا الجانب 


نبدأ مع الوسم الخاص في تغيير نوع الخط وصيغته على الشكل التالي 
<font face="هنا يكتب اسم الخط">text</font>
في المكان المسؤول عن اسم الخط هنا يكتب نوع الخط الذي نريده ان يظهر فيه الكلام المقصود و هناك انواع اكثيرة من الخطوط مثلاً الخط arial وللبحث عن اسماء الخطوط نكتب في محرك البحث جوجل font face لتشاهد كثير من الصفحات تتحدث عن هذا الشأن , ونغير text إلى النص المراد تغيير نوع خطه
مثال على موضوعنا 


نأتي إلى الوسم الثاني في درسنا اليوم الذي هو التحكم في حجم الخط و صيغته على الشكل التالي 
<font size="هنا يكتب المقاس الذي نريده">text</font>
في مكان المقاس نضع رقم القياس على الشكل التالي 2px او 5px ...
فكلما زاذ الرقم كلما زاد حجم النص , ايضاً بدل كلمة text نضع النص المراد تغيير حجمه
مثال على شرحنا 

الأن نحفظ مشروعنا بعد ان كتبناه في المفكرة كما تعلمنا في الدرس الأول
وإلى اللقاء في درس جديد ان شاء الله

اقرأ تكملة الموضع

الأحد، 14 فبراير 2016

الدرس (3) تعلم HTML : التعامل مع النصوص (الجزء الأول )

  السلام عليكم و رحمة الله و بركاته
مرحباً بكم في درس جديد مع دروس تعلم لغة html و الذي سيكون كيفية التعامل مع النصوص , أي تنسيق الكلام الظاهر على صفحة الويب 
نبدأ على بركة الله , سنفتح أولاً المفكرة من الحاسوب بعد فتحها نكتب الاكواد الاساسية كما شرحنا في الدروس السابقة من دروس تعلم html ولتكن هذه هي الاكواد 

 

 <body> و </body> الآن سيكون عملنا ما داخل الوسمين
وما بين هذين الوسمين نكتب ما نريده ان يظهر على صفحة الويب
لنأخذ اول وسم من وسوم تنسيق النصوص والذي هو سماكة الخط 
فمثلاً عند كتابة نص معين ونريده ان يكون خطه عريض نكتب النص ما بين الوسمين
<h1> </h1> 
و كلما رفعنا في الرقم كلما قل ثخن الخط مثال 
<h2></h2>
<h3></h3>
و هكذا إلى الرقم ستة
نكتب مثال على الشكل التالي 

الوسم الثاني ما هو إلا لتغيير لون النص ويتكون الوسم من اجزاء 
<font color= red >هنا يكتب النص</font>
مكان كلمة red يكتب اسم اللون باللغة الأنجليزية او الكود الخاص به الذي يقرأه الحاسوب فمثلاً انا قد كتبت red أي اللون الأحمر والكود يكون على الشكل التالي 
#FF0000
بالنسبة لكود اللون الأحمر واي كود لأي لون يجب ان يبدأ ب # و بعده ستة من الحروف و الارقام
و لمعرفة اكواد الألوان اكتب في بحث google عبارة color code
وستظهر صفحات تشرح هذا الشيء 
الأن عندما نكتب اكثر من جملة في html  ستظهر الجمل على سطر واحد ولتفادي هذه 
<br/> المشكلة نكتب بعد كل جملة 
ليكون الشرح على الشكل التالي
و بهكذا نكون قد انتهينا من هذا الدرس 
و ان شاء الله نكون على موعد قريب مع درس جديد
اقرأ تكملة الموضع

الثلاثاء، 9 فبراير 2016

الدرس (2) تعلم HTML : اضافة عنوان لصفحة الويب

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

<meta content=”text/html; charset=windows-1256″ http-equiv=”Content-Type” />
 من اجل ان تدعم اللغة العربية في صفحة الويب

 <head> هنا هو ما بين الوسمين </head>  نكتب ما بين الوسمين
 <title> </title> هذان الوسمان
ليكون المرادعلى الشكل التالي
 عنوان الموقع و ليكون مثلاً مشروع  <title> </title>  بعد ذلك نكتب بين الوسمين 
وما بينهما على الشكل التالي <title> </titile>  يمكن كتابة الوسمين

الأن نحفظ المشروع كما المشروع السابق في الدرس (اساسيات لغة html اللغة المستخدمة في انشاء المواقع)
وتكون النتيجة على النحو التالي 
و بهذا نكون قد انتهينا من شرح اليوم
السلام عليكم و رحمة الله و بركاته

اقرأ تكملة الموضع

الأحد، 7 فبراير 2016

الدرس (1) اساسيات لغة HTML اللغة المستخدمة في انشاء المواقع

                                              السلام عليكم و رحمة الله و بركاته                                        

بدايةً ارحب بكم في الدرس الأول و أن شاء الله سأشرح فيه اساسيات كتابة اي موقع الكتروني .

عند انشاء اي موقع يجب كتابته بلغة برمجية اسمها html فمثلاً عندما تريد اظهار جملة معينة على صفحة ويب يجب ان يكون في البداية قد برمجت هذه الصفحة على لغة html و ليكون الشرح مفهوم سنفتح المفكرة الالكترونية و لفتحها ابحث عنها عند مكان البحث في حاسوبك الالكتروني , بعد فتحها سنبدأ كتابة اساسيات درسنا وهي هذه الاكواد :                                  

                                                                           
اولاً عندما تشاهد هذه الرموز يمكن ان يطرء على بالك لماذا هذه الكلمات محتواة بين هذان القوصان <  > السبب هو ان الكواد 
في لغة html تكتب بين هذان القوصان و الأكواد في المثال السابق يجب على كل صفحة ويب ان تحتوي في البداية على هذه الأكواد .

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

بعدها نضغط على حفظ بإسم ثم بعد ذلك نفعل كما في الصورة 

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

تطبيق موقع أسامة الموسى

كتاب : تعلم (html) من البداية حتى الإحتراف تأليف اسامة الموسى

Translate

للمتابعة على مواقع التواصل الاجتماعي

جميع الحقوق محفوظة © أسامة الموسى