hamzaaaaa
20-04-2011, 00:19
:006:
بسم الله الرحمن الرحيم
:taheyatayeba:
دورة تصميم المواقع من البداية حتى الإحتراف عبارة عن شرح مبسط لمفاهيم و لغات البرماجيات بصفة عامة بحيث تتواجد عدت لغات برمجية نذكر منها الآتي:
لغة:PHP
لغة:CSS
لغة:JAVA
و لغة :HTML (و هي اللغة اللي راح نستعملها كونها الأسهل و الأقل تعقيدا و هذا لا يعني أننا راح نستغني عن اللغات الأخرى تذكروا قولي الإحتراف في تصميم المواقع على ضمانتي إن شاء الله نتابع )
مستعملا فى الشرح البساطة حتى يستوعب المبتدا هذه اللغة الراقية و الرائعه فى تصميم المواقع وطرح الدروس راح يكون تباعا بدون مواعيد حسب سرعة تفاعلكم وسهولة او صعوبة الدرس
والرجاء منكم المتابعة الجيدة والاستفسار عن اى صعوبة فى الدرس
راجيا من الله ان اكون موفق فى الشرح وان تستفيدوا معى وتكونوا أحد أفضل المصممين العرب
إن شاء الله يارب.
مقدمة الدورة
هناك بعض المعلومات والمفاهيم التي لابد ان نفهمها جيدا ..
يجب ان يعلم كل متعمق في هذا الموضوع اولا ما معني كلمة server وكلمة browser...
دعوني ابدا من الوراء قليلا للتوضيح
ما هو مفهوم شبكة الانترنت بالمعني العلمي؟!
في البداية كانت الإنترنت عبارة عن شبكة بسيطة تربط بين أجهزة بعض الطلبة في احدي الجامعات الأمريكية بحيث يمكن لأحدهم رؤية ما علي جهاز الاخر وتصفحه بسهولة..
وكانت تقابلهم مشكلة...ماذا لو ان احدهم اراد تصفح جهاز صديقه ولكن كان جهاز صديقه مغلق في هذا الوقت؟!
كان لا يستطيع لانه لابد لتبادل المعلومات في الشبكات ان يتم التبادل بين جهازين مفتوحين..
..فما هو الحل في هذه المشكلة وما هو معني الانترنت الان؟!
للتغلب علي هذه المشكلة وبعد ان تطور استخدام الانترنت واتسع نطاقه بشكل كبير....
مثلا إذا كان عندي معلومات علي الجهازي و أود غيري يقدر يتصفحها ممكن احطها علي جهازي وفي حالة ما ذا كان جهازي مفتوح دائما يبقي أي جهاز متصل بجهازي يقدر يشوف هذه المعلومات...
ولكن ايضا ماذا لو وصل عدد متصفحين هذه المعلومة في نفس اللحظة الي 10000 مثلا او أي رقم كبير ...هل يتحمل جهازي البسيط بامكاناته المتواظعة كل هذا العدد من المتصفحين في نفس الوقت؟!
كل هذه المشاكل كان لابد لها من حل....
من هنا ظهرت كلمة ال server كحل لكل هذه المشاكل....فما معناها؟!
المعني الحرفي لكلمة server يعني خادم...."خادم الانترنت"
فهو عبارة عن اجهزة بامكانيات عالية تحتمل عدد كبير جدا من المتصفحين في نفس الوقت وتتحمل ان تظل تعمل دائما بلا انقطاع...
فانا لو كان عندي معلومات اقوم بوضعها علي هذا السيرفر بدلا من تركها علي جهازي فتحل كل المشاكل لسابق ذكرها بالاضافة الي ان هذا السيرفر متصل بكل الاجهزة في منطقته فتصبح كل هذه الاجهزة متصلة ببعضها البعض عن طريقه..
ففي كل منطقة يوجد سيرفرات خاصة بها تربط اجهزتها ببعض ويكون شبكة بينها
.....ولكن ماذا اذا اردت تحميل معلومات من علي سيرفر اخر؟!
ولذلك فان كل السيرفرات متصلة ببعضها البعض في شبكة كبيرة تعرف بشبكة الشبكات وهذا هو الانترنت
"شبكة الشبكات"
..
كيف نطلب معلومات من السيرفر او نستقبل منه معلومات؟؟؟
يوجد بكل جهاز برنامج متصفح للانترنت "browser” اشهرها وافضلها الانترنت اكسبلورر...فهو عبارة عن برنامج مجهز لارسال واستقبال بيانات من السيرفر.....
وهذا ما سندخل اليه ان شاء الله لمعرفة المزيد عنه....
دعونا لا نتعمق كثيراا ربما المفهوم و صل طيب راح نواصل التعاريف :rolleyes:
لغة Html
ما هي لغة ال html ؟!ولماذا نتعلمها؟!
..................
من أجل أن اوضح لكم معني لغة ال html اسمحولي اقول لكم مثال بسيط ..
لو انا أتكلم مع واحد من امريكا وأريد اقول له حاجة ليفعلها....
لو قلت له ذلك بالانجليزية سوف يفهما وينفذها...
و لو قلت له نفس الأمر بالعربية لن يفهمني
وفي نفس الوقت ممكن يكون هذا الشخص يعرف اكتر من لغة "الفرنسية مثلا" لو قلت له نفس الكلمة بالفرنسية يفهمها....ولاكن اساسه هو الانجليزية..
نفس الحال بالنسبة لل BROWSER..
اللي هو صفحة الانترنت اكسبلورر اللي فاتحة قدامك....هي في البداية تقتح بيضاء"فارغة"...
الكلام والمعلومات اللي فيها تظهر كيف؟؟؟
ذكرنا قبل الآن ان السيرفر يقوم بارسال المعلومات إلي جهازك فيستقبلها البراوزر(المتصفح)...
فبما ان الـ BROWSER هو اللي يستقبل المعلومات يبقي السيرفر لازم يبعث له هذه المعلومات باللغة اللتي هو يفهما من أجل أن تظهر أمامنا...لو بعثت له نفس الكلام باي اسلوب ثاني لن يفهمه
إن : Browser زيه زي اي انسان عنده لغات يفهمها ولو قلت له اي حاجة بهذه اللغات ينفذها فورا....ولاكن هو احسن من الانسان لأنه يفهم لغات كثيره...وأيضا لو قلت له اي حاجة وفهمها بينفذها مباشرة
اول وابسط لغة من اللغات اللتي يفهمها البراوزر هي لغة ال html ...
وهناك لغات اخري كثيرة اكثر تطور من ال html لاكن الاساس هو ال html مثل الإنجليزي بالنسبة للشخص الأمريكي...
ولا يوجد اي موقع يخلو من لغة ال html ..بالرغم من انها اقل اللغات تطورا...
وتوجد برامج حاليا تغني عن لغة ال html وبتقوم بكل وظائفها بصورة اسهل ومنها " FRONT PAGE ,DREAMWEAVER"....ولكن...
اللذي ينوي ياخد html ويتوقف يبقي احسن له يدرس هذه البرامج لانها اسهل منه...انما اللي يريد يحترف ويبقي فاهم هو يعمل ماذا اولا...وأيضا يريد يتقدم ويدرس لغات تانية بعد هذه ويكمل في الطريق لازم يعرف html الاول......
طيب الآن احنا قلنا ان السيرفر بيبعت المعلومات للاجهزة بهذه اللغة ...
نحن نشاهد المعلومات جاهزة وخلاص نتعب أنفسنا لماذا؟؟
وهذا لاننا نريد نصمم مواقع ..يعني نحن نعمل الصفحة ونحطها علي السيرفر يبقي لازم نحطها بهذه اللغة لان السيرفر لن يعمل اي حاجة غير انه راح يبعتها ..فلازم نكون حاطينها عليه بلغة يفهمها البراوزر لما يبعتها له....
قبل ما نبحر فى امواج HTML
الاول نعرف ما معني هذه الكلمة ولماذا سموها هكذا..
ليس معقول اول ماخترعوا اللغة قالوا نسميها html؟؟؟ …….أكيد يوجد سبب
html اختصار لهذه الجملة:
hyper text markup language
يعني لغة تقدر بيها تحط علي الانترنت texts بكميات كبيرة (hyper) لاكن هذا الاسم كان لانها في بداية اختراعها كانت فقط لوضع texts و ليس اكتر ..انما الآن تطورت كثيرا وممكن نحط texts وصور وفيديو واوديو وفلاشات وكل حاجة…
ولاكن لما تطورت اللغة الاسم متغيرش فضل كما هو……
نبدأ بقي نعرف كيف نعرف البراوزر(المتصفح) المعلومات بهذه اللغة …
إحنا قلنا ان هذه لغة البراوزر وهذا يترتب عليه إن أنا لو جيت علي أي فايل عندي علي الجهاز وعملت له rename وغيرت امتداده خليته .html يتحول البرنامج اللي يشغله الي الانترنت اكسبلورر…بمعني:
انا عندي فايل اسمه مثلا : hamzaaaaa.txt وعليه كلام مكتوب"بأي محرر كتابةمثل الـ notepad"
نعلم على الملف وكليك يمين
لو انا قلت له renomme وو غيرت اسمه hamzaaaaa.html راح تلاقي شكله تحول الي صفحة انترنت اكسبلورر واللي هيفتحه هو الانترنت اكسبلورر..
الان انا قلت له ان الكلام اللي عندك هنا مكتوب بلغة html فالجهاز هيحوله تلقائيا الي البرنامج اللذي يفهم هذه اللغة وهو يتعامل معاه..اذا وجده فعلا بهذه اللغة سوف يفهمه ..واذا و جده بلغة أخرى لن يفهم فيه أي شيء…
اقصد من الكلام اللذي مر ان اللذي نحن نعمله من أجل أن نكتب صفحة بالاتش تي ام (html) اللتي نفتح صفحة أي محرر كتابي مثل النوتباد مثلا ونكتب فيها الكلام اللذي نحن نريده باللغة اللي راح نتعلمها وبعدين نحول امتداده الي .html هيروح البراوزر فاتحه وقاريه….
ان شاء الله هذا الكلام يوضح اكتر فيما بعد أثناء تقديم الدروس التطبيقية…
هذه الجملة الأخيرة لي عليها تعليقين:
محررات الكتابة المتوفرة كتير وابسطها واسهلها هو ال notepad وهو اللذي راح نتسعمله..
التعليق الثاني انهم عملولنا حاجة بسيطة للتلخيص ..بدل متخلي الامتداد .html ممكن تخليه .htm ولاكن من غير حرف ال" l " هتقول ماذا بقي... عالم فارغ ..ماذا يعني هذا الحرف هو اللذي فارق معاهم كثيرا…
لا مش فارق معاهم ولا حاجة ممكن تقول اختصار للكتابة
خلاصة كل اللذي فات..
اقف في أي مكان فاضي في الشاشة واضغط كليك يمين..
واختار new واختارمنها text doccument …
أي خيارات -ملف جديد-و إختر المذكرة .
هيفتحلك صفحة تكتب فيها موضوعك..
كيف نقوم بكتابة الموضوع.؟؟؟؟
ناخد الآن نبذة بسيطة عن الشكل العام اللي بتكون عليه هذه اللغة …
هذه اللغة عبارة عن عدة اوامر كل امر ينفذ حاجة معينة…الآن تقلق وتقول انا أقعد احفظ اوامر وفقط؟؟؟..انت لن تحفظ أي حاجة انت فقط تكتب هذه الاوامر عندك في ورقة وكل متحب تعمل حاجة تنظر في هذه الورقة تشوف ايه الامر اللي بيعملها وتكتبه…
يعني مثلا لو انا بعمل موقع بسيط جدا فيه القليل من الكلام وصورة جنبه فقط…؟؟؟
راح أقول له الامر اللي بيفهمه اني هحط صورة؟؟؟؟…وبعدين احطها ..؟؟؟؟
من أجل أن تضع الكلام لست محتاج أي امر… يعني هو بيفهم أي حاجة مكتوبة علي انها كلام مالم يذكر غير ذلك..
يعني هو يترجم الكلام المكتوب وينقله في صفحة الموقع مثل ماهو مكتوب بالظبط كلام عادي…
لو وجد في طريقه امر بيقول له اعمل حاجة معينة خلاص يعملها ينقل الكلام المكتوب ويبدأ ينفد هذا الأمر؟ …
طيب الآ احنا نكتب له الكلام ونكتب له الاوامر…كيف يعرف ان هذا كلام عادي أريده يظهر أو هذا امر أضعه لتنفيذ شئ معين؟؟؟
للتفريق بين الكلام والاوامر بنحط الامر بين علامة اكبر من واصغر من <هنــــــــــــــــــا>
هو اول ميشوف العلامتين يعرف ان المكتوب في وسطهم امر راح ينفذه ….
..فيه حاجة أريد اقولها ولو موضحتش كثيرا الآن مش مشكلة…إن شاء الله لما نعرف أوامر هتوضح اكتر إن شاء الله…
انا لما اقول له امر واكتبه بين < > مثلا أقول له يغير لون الكلام ..يصيح لازم اقول له أين اخره…أما لو وضعتهاله هكذا سوف يغير لون الكلام في الصفحة كله لان انا مقلتلوش وقف ...
أقول له هكذا كيف؟؟؟
أكتب نفس الامر ولاكن بهذا الشكل.
</ >
هذا مثل علامة قف الموجودة فى اشارة المرور
يعني وضع العلامة / يفهم هو ان الكلام المكتوب بين الامر وإغلاقه علي انه صورة…
أكتب علامة اكبر من قبل العلامة / وبعدها اسم الامر وبعدها علامة اصغر من....
طيب المنظر العام للصفحة؟؟؟
احنا عرفنا ان توجد لغات كثيرة بيفهمها البراوزر يبقي اول حاجة لازم اعرفهاله ان انا أكتب بلغة ال html ..يبقي عندنا أمر بيتكتب في اول الصفحة بيعرفه ان انا بكتب html
هذا الامر صيغته :
<html>
طيب احنا لم نقل أي امر لازم يتقفل بعد ما ننتهي من كل اللي هنعمله بيه؟؟؟؟
يبقي هذا الامر بيتقفل أين؟؟؟؟؟؟
يتقفل اخر حاجة إنتهى في الصفحة بعد أن نكتب كل للي احنا نريده في النص بهذا الشكل :
<html>
…………….
…………….
</html> طيب بعد معرفته اني هكتب html نعرف بقي شكل صفحة ال html عموما الآن….
بتتقسم صفحة ال html الي جزئين
head و body
ال head نكتب فيه بعض الكلام لن يظهر في الصفحة مثل عنوان الصفحة مثلا و بعض الحاجات الأخرى و هكذا راح نعرفها في وقتها ان شاء الله
ال body نكتب فيه الكلام اللي يظهر في الصفحة …لازم اعرفها انا أكتب head ولا body كيف؟؟
الآن في امر بيفهمه هذا الكلام …وكل واحد منهم امره بنفس اسمه….
يعني لما احب اعرفه اني راح أكتب head الامر شكله كده:
<head>…………………</head> لما احب اعرفه اني راح أكتب body الامر شكله هكذا
<body>…………….</body> كفانا تعقيدا هذه المرة …
هيا اطلع:rolleyes: اقرا هذا الكلام مرة تانية بعد أن أخدت فكرة عنه..في المرة الثانية ان شاء الله تفهمه جيدا :rolleyes:….
الآن الملخص الشكل العام:
إتفتح صفحة notepad
وتكتب فيها
<html>
<head>……………………
.........
</head>
<body>………………
…………
</body>
</html> ان شاء الله المرة القادمة راح ناخد الاوامر اللي موجودة بين هذا الكلام ….
من أجل أن تجربوا اكتبوا نفس الشكل العام اللي انا كاتبه واكتبوا مبين ال body وإغلاقها أي كلام يعجبكم "بياناتك مثلا.جديث نبوي.آيات قرآنية, منتديات متليلي..."
وبعدها اقفل الصفحة وقوله save (حفظ) واطلع قوله renommer وغير امتدادها خليها .html وبعدها افتحها…
راح تلاقي الكلام اللي أنت كتبته ظهر والأوامر طبعا مش ظاهرة..هو فقط فهم منا ماذا يعمل …
وعلي فكرة راح تقابلكم مشكلة راح تجننكوا في الكلام اللي هيظهر مش هقول لكم الآن ماهي..راح اقول لكم في وقتها…خليها تجننكم شوية ههههههههههه.. هذ من أجل معرفة النتابعين و المطبقين للدروس اللي تواجهه المشكلة يضع المشكل ويرفع ملف تطبيقه :strongsad:
نحظر الآن ورقة وقلم ونرجع لاول الموضوع ونبدا نكتب كل كود يقابلنا ونكتب معناه
ونبدا نتذكر جيدا ونطبق اكتر من مرة .
و لو واجهتكم مشكلة ماذا سوف تفعلوووون؟؟؟؟
طبعا أنا هنا أخوكم : حمزة بوغرة.
هههههههههههههههه
أتمنى ذكر المصدر عند نقل الموضوع حفاظا لجهودي الموضوع كلفني ساعه من الطرح و التنظيم:tears:
ولاكن كل هذا ليس مشكلا و لا عائقا في تقديم المساعده للجميع
و أي استفسار أو مشكل أنا في الخدمة يا شباب…
:012::009:
يتبع.........................
بسم الله الرحمن الرحيم
:taheyatayeba:
دورة تصميم المواقع من البداية حتى الإحتراف عبارة عن شرح مبسط لمفاهيم و لغات البرماجيات بصفة عامة بحيث تتواجد عدت لغات برمجية نذكر منها الآتي:
لغة:PHP
لغة:CSS
لغة:JAVA
و لغة :HTML (و هي اللغة اللي راح نستعملها كونها الأسهل و الأقل تعقيدا و هذا لا يعني أننا راح نستغني عن اللغات الأخرى تذكروا قولي الإحتراف في تصميم المواقع على ضمانتي إن شاء الله نتابع )
مستعملا فى الشرح البساطة حتى يستوعب المبتدا هذه اللغة الراقية و الرائعه فى تصميم المواقع وطرح الدروس راح يكون تباعا بدون مواعيد حسب سرعة تفاعلكم وسهولة او صعوبة الدرس
والرجاء منكم المتابعة الجيدة والاستفسار عن اى صعوبة فى الدرس
راجيا من الله ان اكون موفق فى الشرح وان تستفيدوا معى وتكونوا أحد أفضل المصممين العرب
إن شاء الله يارب.
مقدمة الدورة
هناك بعض المعلومات والمفاهيم التي لابد ان نفهمها جيدا ..
يجب ان يعلم كل متعمق في هذا الموضوع اولا ما معني كلمة server وكلمة browser...
دعوني ابدا من الوراء قليلا للتوضيح
ما هو مفهوم شبكة الانترنت بالمعني العلمي؟!
في البداية كانت الإنترنت عبارة عن شبكة بسيطة تربط بين أجهزة بعض الطلبة في احدي الجامعات الأمريكية بحيث يمكن لأحدهم رؤية ما علي جهاز الاخر وتصفحه بسهولة..
وكانت تقابلهم مشكلة...ماذا لو ان احدهم اراد تصفح جهاز صديقه ولكن كان جهاز صديقه مغلق في هذا الوقت؟!
كان لا يستطيع لانه لابد لتبادل المعلومات في الشبكات ان يتم التبادل بين جهازين مفتوحين..
..فما هو الحل في هذه المشكلة وما هو معني الانترنت الان؟!
للتغلب علي هذه المشكلة وبعد ان تطور استخدام الانترنت واتسع نطاقه بشكل كبير....
مثلا إذا كان عندي معلومات علي الجهازي و أود غيري يقدر يتصفحها ممكن احطها علي جهازي وفي حالة ما ذا كان جهازي مفتوح دائما يبقي أي جهاز متصل بجهازي يقدر يشوف هذه المعلومات...
ولكن ايضا ماذا لو وصل عدد متصفحين هذه المعلومة في نفس اللحظة الي 10000 مثلا او أي رقم كبير ...هل يتحمل جهازي البسيط بامكاناته المتواظعة كل هذا العدد من المتصفحين في نفس الوقت؟!
كل هذه المشاكل كان لابد لها من حل....
من هنا ظهرت كلمة ال server كحل لكل هذه المشاكل....فما معناها؟!
المعني الحرفي لكلمة server يعني خادم...."خادم الانترنت"
فهو عبارة عن اجهزة بامكانيات عالية تحتمل عدد كبير جدا من المتصفحين في نفس الوقت وتتحمل ان تظل تعمل دائما بلا انقطاع...
فانا لو كان عندي معلومات اقوم بوضعها علي هذا السيرفر بدلا من تركها علي جهازي فتحل كل المشاكل لسابق ذكرها بالاضافة الي ان هذا السيرفر متصل بكل الاجهزة في منطقته فتصبح كل هذه الاجهزة متصلة ببعضها البعض عن طريقه..
ففي كل منطقة يوجد سيرفرات خاصة بها تربط اجهزتها ببعض ويكون شبكة بينها
.....ولكن ماذا اذا اردت تحميل معلومات من علي سيرفر اخر؟!
ولذلك فان كل السيرفرات متصلة ببعضها البعض في شبكة كبيرة تعرف بشبكة الشبكات وهذا هو الانترنت
"شبكة الشبكات"
..
كيف نطلب معلومات من السيرفر او نستقبل منه معلومات؟؟؟
يوجد بكل جهاز برنامج متصفح للانترنت "browser” اشهرها وافضلها الانترنت اكسبلورر...فهو عبارة عن برنامج مجهز لارسال واستقبال بيانات من السيرفر.....
وهذا ما سندخل اليه ان شاء الله لمعرفة المزيد عنه....
دعونا لا نتعمق كثيراا ربما المفهوم و صل طيب راح نواصل التعاريف :rolleyes:
لغة Html
ما هي لغة ال html ؟!ولماذا نتعلمها؟!
..................
من أجل أن اوضح لكم معني لغة ال html اسمحولي اقول لكم مثال بسيط ..
لو انا أتكلم مع واحد من امريكا وأريد اقول له حاجة ليفعلها....
لو قلت له ذلك بالانجليزية سوف يفهما وينفذها...
و لو قلت له نفس الأمر بالعربية لن يفهمني
وفي نفس الوقت ممكن يكون هذا الشخص يعرف اكتر من لغة "الفرنسية مثلا" لو قلت له نفس الكلمة بالفرنسية يفهمها....ولاكن اساسه هو الانجليزية..
نفس الحال بالنسبة لل BROWSER..
اللي هو صفحة الانترنت اكسبلورر اللي فاتحة قدامك....هي في البداية تقتح بيضاء"فارغة"...
الكلام والمعلومات اللي فيها تظهر كيف؟؟؟
ذكرنا قبل الآن ان السيرفر يقوم بارسال المعلومات إلي جهازك فيستقبلها البراوزر(المتصفح)...
فبما ان الـ BROWSER هو اللي يستقبل المعلومات يبقي السيرفر لازم يبعث له هذه المعلومات باللغة اللتي هو يفهما من أجل أن تظهر أمامنا...لو بعثت له نفس الكلام باي اسلوب ثاني لن يفهمه
إن : Browser زيه زي اي انسان عنده لغات يفهمها ولو قلت له اي حاجة بهذه اللغات ينفذها فورا....ولاكن هو احسن من الانسان لأنه يفهم لغات كثيره...وأيضا لو قلت له اي حاجة وفهمها بينفذها مباشرة
اول وابسط لغة من اللغات اللتي يفهمها البراوزر هي لغة ال html ...
وهناك لغات اخري كثيرة اكثر تطور من ال html لاكن الاساس هو ال html مثل الإنجليزي بالنسبة للشخص الأمريكي...
ولا يوجد اي موقع يخلو من لغة ال html ..بالرغم من انها اقل اللغات تطورا...
وتوجد برامج حاليا تغني عن لغة ال html وبتقوم بكل وظائفها بصورة اسهل ومنها " FRONT PAGE ,DREAMWEAVER"....ولكن...
اللذي ينوي ياخد html ويتوقف يبقي احسن له يدرس هذه البرامج لانها اسهل منه...انما اللي يريد يحترف ويبقي فاهم هو يعمل ماذا اولا...وأيضا يريد يتقدم ويدرس لغات تانية بعد هذه ويكمل في الطريق لازم يعرف html الاول......
طيب الآن احنا قلنا ان السيرفر بيبعت المعلومات للاجهزة بهذه اللغة ...
نحن نشاهد المعلومات جاهزة وخلاص نتعب أنفسنا لماذا؟؟
وهذا لاننا نريد نصمم مواقع ..يعني نحن نعمل الصفحة ونحطها علي السيرفر يبقي لازم نحطها بهذه اللغة لان السيرفر لن يعمل اي حاجة غير انه راح يبعتها ..فلازم نكون حاطينها عليه بلغة يفهمها البراوزر لما يبعتها له....
قبل ما نبحر فى امواج HTML
الاول نعرف ما معني هذه الكلمة ولماذا سموها هكذا..
ليس معقول اول ماخترعوا اللغة قالوا نسميها html؟؟؟ …….أكيد يوجد سبب
html اختصار لهذه الجملة:
hyper text markup language
يعني لغة تقدر بيها تحط علي الانترنت texts بكميات كبيرة (hyper) لاكن هذا الاسم كان لانها في بداية اختراعها كانت فقط لوضع texts و ليس اكتر ..انما الآن تطورت كثيرا وممكن نحط texts وصور وفيديو واوديو وفلاشات وكل حاجة…
ولاكن لما تطورت اللغة الاسم متغيرش فضل كما هو……
نبدأ بقي نعرف كيف نعرف البراوزر(المتصفح) المعلومات بهذه اللغة …
إحنا قلنا ان هذه لغة البراوزر وهذا يترتب عليه إن أنا لو جيت علي أي فايل عندي علي الجهاز وعملت له rename وغيرت امتداده خليته .html يتحول البرنامج اللي يشغله الي الانترنت اكسبلورر…بمعني:
انا عندي فايل اسمه مثلا : hamzaaaaa.txt وعليه كلام مكتوب"بأي محرر كتابةمثل الـ notepad"
نعلم على الملف وكليك يمين
لو انا قلت له renomme وو غيرت اسمه hamzaaaaa.html راح تلاقي شكله تحول الي صفحة انترنت اكسبلورر واللي هيفتحه هو الانترنت اكسبلورر..
الان انا قلت له ان الكلام اللي عندك هنا مكتوب بلغة html فالجهاز هيحوله تلقائيا الي البرنامج اللذي يفهم هذه اللغة وهو يتعامل معاه..اذا وجده فعلا بهذه اللغة سوف يفهمه ..واذا و جده بلغة أخرى لن يفهم فيه أي شيء…
اقصد من الكلام اللذي مر ان اللذي نحن نعمله من أجل أن نكتب صفحة بالاتش تي ام (html) اللتي نفتح صفحة أي محرر كتابي مثل النوتباد مثلا ونكتب فيها الكلام اللذي نحن نريده باللغة اللي راح نتعلمها وبعدين نحول امتداده الي .html هيروح البراوزر فاتحه وقاريه….
ان شاء الله هذا الكلام يوضح اكتر فيما بعد أثناء تقديم الدروس التطبيقية…
هذه الجملة الأخيرة لي عليها تعليقين:
محررات الكتابة المتوفرة كتير وابسطها واسهلها هو ال notepad وهو اللذي راح نتسعمله..
التعليق الثاني انهم عملولنا حاجة بسيطة للتلخيص ..بدل متخلي الامتداد .html ممكن تخليه .htm ولاكن من غير حرف ال" l " هتقول ماذا بقي... عالم فارغ ..ماذا يعني هذا الحرف هو اللذي فارق معاهم كثيرا…
لا مش فارق معاهم ولا حاجة ممكن تقول اختصار للكتابة
خلاصة كل اللذي فات..
اقف في أي مكان فاضي في الشاشة واضغط كليك يمين..
واختار new واختارمنها text doccument …
أي خيارات -ملف جديد-و إختر المذكرة .
هيفتحلك صفحة تكتب فيها موضوعك..
كيف نقوم بكتابة الموضوع.؟؟؟؟
ناخد الآن نبذة بسيطة عن الشكل العام اللي بتكون عليه هذه اللغة …
هذه اللغة عبارة عن عدة اوامر كل امر ينفذ حاجة معينة…الآن تقلق وتقول انا أقعد احفظ اوامر وفقط؟؟؟..انت لن تحفظ أي حاجة انت فقط تكتب هذه الاوامر عندك في ورقة وكل متحب تعمل حاجة تنظر في هذه الورقة تشوف ايه الامر اللي بيعملها وتكتبه…
يعني مثلا لو انا بعمل موقع بسيط جدا فيه القليل من الكلام وصورة جنبه فقط…؟؟؟
راح أقول له الامر اللي بيفهمه اني هحط صورة؟؟؟؟…وبعدين احطها ..؟؟؟؟
من أجل أن تضع الكلام لست محتاج أي امر… يعني هو بيفهم أي حاجة مكتوبة علي انها كلام مالم يذكر غير ذلك..
يعني هو يترجم الكلام المكتوب وينقله في صفحة الموقع مثل ماهو مكتوب بالظبط كلام عادي…
لو وجد في طريقه امر بيقول له اعمل حاجة معينة خلاص يعملها ينقل الكلام المكتوب ويبدأ ينفد هذا الأمر؟ …
طيب الآ احنا نكتب له الكلام ونكتب له الاوامر…كيف يعرف ان هذا كلام عادي أريده يظهر أو هذا امر أضعه لتنفيذ شئ معين؟؟؟
للتفريق بين الكلام والاوامر بنحط الامر بين علامة اكبر من واصغر من <هنــــــــــــــــــا>
هو اول ميشوف العلامتين يعرف ان المكتوب في وسطهم امر راح ينفذه ….
..فيه حاجة أريد اقولها ولو موضحتش كثيرا الآن مش مشكلة…إن شاء الله لما نعرف أوامر هتوضح اكتر إن شاء الله…
انا لما اقول له امر واكتبه بين < > مثلا أقول له يغير لون الكلام ..يصيح لازم اقول له أين اخره…أما لو وضعتهاله هكذا سوف يغير لون الكلام في الصفحة كله لان انا مقلتلوش وقف ...
أقول له هكذا كيف؟؟؟
أكتب نفس الامر ولاكن بهذا الشكل.
</ >
هذا مثل علامة قف الموجودة فى اشارة المرور
يعني وضع العلامة / يفهم هو ان الكلام المكتوب بين الامر وإغلاقه علي انه صورة…
أكتب علامة اكبر من قبل العلامة / وبعدها اسم الامر وبعدها علامة اصغر من....
طيب المنظر العام للصفحة؟؟؟
احنا عرفنا ان توجد لغات كثيرة بيفهمها البراوزر يبقي اول حاجة لازم اعرفهاله ان انا أكتب بلغة ال html ..يبقي عندنا أمر بيتكتب في اول الصفحة بيعرفه ان انا بكتب html
هذا الامر صيغته :
<html>
طيب احنا لم نقل أي امر لازم يتقفل بعد ما ننتهي من كل اللي هنعمله بيه؟؟؟؟
يبقي هذا الامر بيتقفل أين؟؟؟؟؟؟
يتقفل اخر حاجة إنتهى في الصفحة بعد أن نكتب كل للي احنا نريده في النص بهذا الشكل :
<html>
…………….
…………….
</html> طيب بعد معرفته اني هكتب html نعرف بقي شكل صفحة ال html عموما الآن….
بتتقسم صفحة ال html الي جزئين
head و body
ال head نكتب فيه بعض الكلام لن يظهر في الصفحة مثل عنوان الصفحة مثلا و بعض الحاجات الأخرى و هكذا راح نعرفها في وقتها ان شاء الله
ال body نكتب فيه الكلام اللي يظهر في الصفحة …لازم اعرفها انا أكتب head ولا body كيف؟؟
الآن في امر بيفهمه هذا الكلام …وكل واحد منهم امره بنفس اسمه….
يعني لما احب اعرفه اني راح أكتب head الامر شكله كده:
<head>…………………</head> لما احب اعرفه اني راح أكتب body الامر شكله هكذا
<body>…………….</body> كفانا تعقيدا هذه المرة …
هيا اطلع:rolleyes: اقرا هذا الكلام مرة تانية بعد أن أخدت فكرة عنه..في المرة الثانية ان شاء الله تفهمه جيدا :rolleyes:….
الآن الملخص الشكل العام:
إتفتح صفحة notepad
وتكتب فيها
<html>
<head>……………………
.........
</head>
<body>………………
…………
</body>
</html> ان شاء الله المرة القادمة راح ناخد الاوامر اللي موجودة بين هذا الكلام ….
من أجل أن تجربوا اكتبوا نفس الشكل العام اللي انا كاتبه واكتبوا مبين ال body وإغلاقها أي كلام يعجبكم "بياناتك مثلا.جديث نبوي.آيات قرآنية, منتديات متليلي..."
وبعدها اقفل الصفحة وقوله save (حفظ) واطلع قوله renommer وغير امتدادها خليها .html وبعدها افتحها…
راح تلاقي الكلام اللي أنت كتبته ظهر والأوامر طبعا مش ظاهرة..هو فقط فهم منا ماذا يعمل …
وعلي فكرة راح تقابلكم مشكلة راح تجننكوا في الكلام اللي هيظهر مش هقول لكم الآن ماهي..راح اقول لكم في وقتها…خليها تجننكم شوية ههههههههههه.. هذ من أجل معرفة النتابعين و المطبقين للدروس اللي تواجهه المشكلة يضع المشكل ويرفع ملف تطبيقه :strongsad:
نحظر الآن ورقة وقلم ونرجع لاول الموضوع ونبدا نكتب كل كود يقابلنا ونكتب معناه
ونبدا نتذكر جيدا ونطبق اكتر من مرة .
و لو واجهتكم مشكلة ماذا سوف تفعلوووون؟؟؟؟
طبعا أنا هنا أخوكم : حمزة بوغرة.
هههههههههههههههه
أتمنى ذكر المصدر عند نقل الموضوع حفاظا لجهودي الموضوع كلفني ساعه من الطرح و التنظيم:tears:
ولاكن كل هذا ليس مشكلا و لا عائقا في تقديم المساعده للجميع
و أي استفسار أو مشكل أنا في الخدمة يا شباب…
:012::009:
يتبع.........................