‏إظهار الرسائل ذات التسميات tags. إظهار كافة الرسائل
‏إظهار الرسائل ذات التسميات tags. إظهار كافة الرسائل

ما هي ال image و ازاي احط صوره في موقعي

ما هي ال image و ازاي احط صوره  في موقعي 

ما هي ال image و ازاي احط صوره  في موقعي

ما هي ال image و ازاي احط صوره  في موقعي 



انهرده  هنتكلم  عن  انك ازاي  تحط صوره  ف  موقعك  من  جهاز الكمبيوتر  بتاعك  او  من  علي النت  بكل  سصهوله  و  من  غير  اي  تعب  خالص  ركز  مايا  و  انشاء الله  هتتعلم ازاي  تحط  صوره في موقعك  بس  اهم  حاجه  تكون ماشي  معانا  بالترتيب  اللي  احنا  عاملينا و  لو  مقراتش الدروس اللي فاتت  يا  ريت تخش هنا  الاول
   علشان تعرف  احنا بنعمل ايه  بالظبط  علشان  تفهم  اللي احنا هنعمله  انهارده  
بسم الله في الاول كده زي ما حضرتك عارف ان  image يعني صوره 
و انت عايذ تحط صوره معينه في الموقع الخاص بيك صح 
تمام  علشان تحط صوره في موقعكلازم يكون في tag يعرف المتصفح ان دي صوره بابعاد معينه 
الtag ده اسمه <img> و ده بتحطه بعد ال body و ملوش وسم نهايه خالص انت دلوقتي هتقولي يعني انا بمجرد اني اكتب التاج ده 
كده الصوره بتاعتي هتظهر  اكيد طبعا الاجابه لا 
في خاصيه بنكتبها مع التاج ده علشان تظهر الصوره بتاعتنا و هتبقي علي الشكل ده 
<img src="url">
ال url مكان الصوره لو انت جايبها من علي النت اللي هو عنوان الصوره 
طب لو الصوره عندك انت علي الجهاز  هتجبها ازاي  و نفترض ان الصوره عندك علي الجهاز باسم img_chania
 هنجبها بنفس التاج 
نسيت اقولك حاجه مهمه لازم تكون الصوره  في نفس المجلد  بتاع الصفحه اللي انت حافظ  فيه ملف ال html بتاعنا علشان نعرف نستدعيها و تكون عارف امداد الصوره ايه و اللي ميعرف امدادت الصور هي كالتالي 
امتدادات الصور
امتدادات الصور


اللي هو ده<img src="img_chania.jpg">
و بيبقي معاها  صفات و منها alt و دي علشان لو الصوره محملتش علي متصفح او المتصفح اللي المستخدم بيستعمله قديم و مش مدعم خاصيه الصور بيظهر مكام الصوره وصف الصوره  و هتبقي علي الشكل ده  
<img src="img_chania.jpg"   alt="Flowers in Chania">
و هنشوف الكلام ده عملي كمان  شويه خليك متابع 


وفي الاخر  اتمني اني  اكون  وصلتلك  معلومه  اللي  انت كنت  بدور  عليها بشكل  حلو  و  عامي 

و اني  مكنش  طولت عليك في الكلام  و لو  في اي ملحوظه او تعديل او في حاجه غلط  قولتها يا 

 ريت تتواصل معانا بخصوصهاولو انت استفد من المعلومه  او الشرح  ده  ممكن  تعمل  شير 

للمدونه  او  علي الاقل  تعرف  صحابك  علي اللي  انت عرفته  باي طريقه  انت  عايذها  و شايفها  مناسبه ليك  

ما هي ال head

ما هي ال head


هنكلم انهارده علي

1-معني head


2-ايه استخدامها

3-ايه العناصر اللي بتبقي جواها 

4-ايه هي  ال title


5-بنستخدمها في ايه


  1-   معني كلمه head في العربي بتاعنا
هي راس زي ما حضرتك عارف  و هو هو نفس المعني اللي معانا انهاره ميختلفش عنه باي حاجه  خالص 
و الوسم ده بيبقي زي الراس بتاعتنا كده بالظبط بيبقي فيها معلومات عنا زي اسمك انت عندك كام سنه منين و معلومات كتير صح 
اهو الوسم ده زي دماغك بالظبط 
بيبقي فيه عنوان الصفحه او اسمها 
بيبقي فيها كلمات مفتاحيه
وصف للمحتوي او للموقع 
ايه الغه اللي الموقع يستخدمها و حاجات تانيه كتير 
فنطلع من كل ده بان 
(head) هي راس الصفحه التي يتم كتابة كل ما هو متعلق براس الصفحه و التي لا يستطيع المستخدم ان يطلع عليها ولا تظهر له نهائيا 
و بيبقي شكلها علي الوضع ده و ليها وسم نهايه 
<head></head>
2-بنستخدمها ليه 
علشان بيبقي فيها وسوم مهمه جدا ليك كمصمم مواقع و للمستخدم 
(ايه الوسوم اللي بتبقي فيها) 
دي بقي فيها وسوم كتير بس طبعا مش زي ال body 
3-ايه الوسوم اللي بتبقي فيها
<title>و دي خاصه بعنوان الصفحه </title>
<style>و دي عامله زي الcss مهندس الديكور بتاعنا </style>
كل انواع الميتا تاج 
تجربه عملي بقي 
افتح محرر النصوص اللي نزلته  من اول دي و لو مكنتش نزلته هتلاقيه هنا "تصميم المواقع "
فتحته 
اقفله و قوم يا راجل بلا تصميم مواقع بلا بتاع 
خد هنا بس رايح فين انت لما بتصدق ولا ايه 
افتح يا جدع انت كمان 
 حدد اللغه من فوق 
يلا اكتب معايا اول حاجه
HEAD
HEAD
4-ايه هي title 
معناه بالعربي عنوان و هي  فعلا بتبقي عنوان للوثيقه او لصفحه اللي انت هتعملها 
و مينفعش يبقي في اكتر من واحده بس في الوثيقه 
5-بنستخدمها في 
زي ما قولنا من شويه اننا بنستخدمها علشان ندي للصفحه اسم او عنوان علشان المستخجم يعرف هو داخل علي موقع ايه 

في النهايه هتلاقي فوق كلمه file اقف عليها هيظهرلك قايمه كبيره هتلاقي فيها save as اضغط عليها و احفظ الصفحه باي اسم انت عايذه بس يستحسن انك تحفظه بنفس الاسم اللي كتبته فوق 

بس اكتب الكلمه دي (.html)
و دي علشان تعرف الجهاز ان الوثيقه دي مكتوبه بلغة ال html 
و دي  صوره علشان نشوف احنا عملنا ايه  
طريقه حفظ ملف html
طريقه حفظ ملف html 

امسك لحد هنا بقي و بطل كتابه وقوم اشربلك كوبايه شاي و نرجع تاني 

وفي الاخر  اتمني اني  اكون  وصلتلك  معلومه  اللي  انت كنت  بدور  عليها بشكل  حلو  و  عامي و اني  مكنش  طولت عليك في 

الكلام  و لو  في اي ملحوظه او تعديل او في حاجه غلط  قولتها يا  ريت تتواصل معانا بخصوصهاولو انت استفد من المعلومه  او 

الشرح  ده  ممكن  تعمل  شير للمدونه  او  علي الاقل  تعرف  صحابك  علي اللي  انت عرفته  باي طريقه  انت  عايذها  و شايفها  مناسبه ليك 

يعني ايه الدوك طايب اتش تي ام ال

ال دوك طايب  اتش تي ام ال    <doctype html !>

انهارده هنتكلم عن

 ال <doctype html!>  

doctype html

<doctype html!>


1-معناها
2-ليه بنستخدمها 
3-تاريخها 

1-معني الدوكوك طايب و ليه بنستخدمها 
كلمه دوك طايب doctype هي اختصار ل "document declaration type" و اللي ترجمتها بالعربي "اننا بنعرف المتصفح بنوع الوثيقه او نوع اللغه اللي حضرتك هتقوم باستعمالها علشان تبني صفحات الويب  سواء كانت اللغه  دي  "html" ,"xhtml"
و لازم انها  تكون اول  حاجه  بتكتبها و بتكون في بدايه  الصفحه  فوق 
2- في الاول  كده  بس  لازم  نعرف  ان لغه html ليها  5  اصدارات لحد  دلوقتي و زي  ما  حضرتك  عارف  طبعا  ان  كلمه اصدار جديد من حاجه  قديمه يعني  حاجتين لائما شالوا حاجه او خاصيه في الشئ  ده او  ضافوا حاجه او خاصيه للشئ او ممكن يكونوا عملوا  الاتنين شالو و حطو  .
كانو زمان علشان  يكتبوا  صفحه بلغه html لازم انهم  يكتبوا  كود  طويل عريض علشان يعرفوا المتصفح بانهم  هيستخدموا الاصدار الرابع مثلا من اللغه و بيبقي طويل جدا كان  في منه اللي بيعرف المتصفح ان دي وثيقه فيها كل حاجه معاده الخطوط والاطارات
و كود تاني بيقول ان فيها كل حاجه بما فيهم الاطارات 
فكانت خايله حضرتك و كانوا بيتعبوا 
فمنظمه w3 العالميه ربنا يصلح  حالها قادر يا كريم  وفرت علينا جهد كبير و حفظ كتير و قالت انا هعملكم شكل جديد في الوسم ده  الي حضرتك هتستعمله دلوقتي 
<doctype html!> و فيها  كل حاجه خطوط و اطارات و ام علي و اللي انت عايذه  
و من يومها يا سيدي و احنا بنستخدمه علي وضعه كده من غير اي  جهد ولا حتي تعب و اظن انك لما تشوف كود زمان اللي كان لازم انك تكتبه زي ما قولنا علشان تعرف المتصفح دي وثيقه ايه و بتعمل ايه زي دي مثل 

1-HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

2-HTML 4.01 Transitional

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

                             3-HTML 4.01 Frameset

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

للي انت هتستعملها دي 

HTML 5

<DOCTYPE html!>


وفي الاخر  اتمني اني  اكون  وصلتلك  معلومه  اللي  انت كنت  بدور  عليها بشكل  حلو  و  عامي 

و اني  مكنش  طولت عليك في الكلام  و لو  في اي ملحوظه او تعديل او في حاجه غلط  قولتها يا 

 ريت تتواصل معانا بخصوصهاولو انت استفد من المعلومه  او الشرح  ده  ممكن  تعمل  شير 

للمدونه  او  علي الاقل  تعرف  صحابك  علي اللي  انت عرفته  باي طريقه  انت  عايذها  و شايفها  مناسبه ليك