Power Speak
08-09-2003, 07:45 PM
مقدمة:
سوف نبدأ في التعرف على أساسيات تصميم المواقع .
ومن اهم الاساسيات التي يجب ان نتعلمها هي لغة الHTML وهي اللغة التي تكتب بها بعظم صفحات الانترنت والتي تقوم العديد من البرامج بكتابتها مباشرة بدون تدخل منا .
مثل الفرونت بيدج او الدريم ويفر .
إذن فما الحاجه إلى تعلمها ؟؟مادامت البرامج تكتبها ؟؟
الإجابة هى ان كل برنامج مهما كانت امكانياته به قصور في بعض النواحي كما ان معرفتنا بكيفيه كتابه الكود تجعلنا نتمكن من التعديل عليه والتغيير فيه وكذلك ادخال أكواد الجافا ابليت والجافا سكريبت وكذلك اكواد الفيجوال بيزك سكريبت.......وغيرها .
لذلك فسوف نبدأ بتعلم أساسيات هذه اللغه ........كما اتفقنا .
لغة الHTML :
يمكننا كتابة لغه الhtml في اي نوت باد عادي للويندوز وسيتم حفظ الصفحه بامتداد html او htm وهما الامتدادان اللذان يدلان على انها صفحة انترنت .
تحتوي الصفحه في الاساس على مايسمى بالTAG وهو الوسم باللغه العربيه وهو الشيء الذي سوف نكتب داخله .
وكل وسم يكون بين علامتي < > وكقاعده يجب اغلاق كل وسم هكذا</> ويكون الغلق بنفس ترتيب الفتح . ولكل قاعدة شواذ كما تعرفون ......لذا فإنه يوجد بعض الاوسمه التي لا تغلق وسوف نرها حينما نتعرض لها ان شاء الله .
فتحتوي الصفحه على الاوسمه الرئيسية التاليه :
<html>
<title> هنا نكتب عنوان الصفحه </title>
<head>
هنا نكتب بعض الاشياء التي سوف نراها لاحقا
</head>
<body>
هنا سوف يكون محتويات الصفحه
</body>
</html>
** إذن فملف Html يبدأ دائماً بالوسم <HTML> وينتهي بالوسم </HTML>.
** أما الوسم <HEAD> فيحدد بداية المقطع الذي يحتوي على المعلومات الخاصة بتعريف الصفحة. كالعنوان الظاهر على شريط عنوان المتصفح. وهذا العنوان بدوره يحتاج لأن يوضع بين الوسمين: <TITLE> … </TITLE> وبالطبع يجب كتابة الوسم </HEAD> لكي ننهي هذا المقطع .
**نأتي إلى الوسم <BODY> والذي يتم كتابة نصوص صفحة الويب ضمنه، بالإضافة إلى إدراج الصور والجداول وباقي محتويات الصفحة. وهو أيضاً يحتاج إلى وسم الإنهاء </BODY>
وكمثال مبدئي سوف نكتب كود بسيط جدا لصفحة بسيطه تحتوي على كلمه بوابةالعرب .
<html>
<title> بوابة العرب- حسام القاضي </title>
<head>
</head>
<body>
بوابة العرب
</body>
</html>
ونحفظ الملف باسم وليكن 1.htm
وعند الضغط على الصفحه سوف تكون النتيجة كما في الصورة التالية :
http://arabsgate.members.easyspace.com/1.gif
وقبل أن نستمر أريد أن أنبهك إلى بعض الملاحظات عند كتابة صفحات الويب:
• لا يوجد فرق بين كتابة الوسوم بالأحرف الإنجليزية الكبيرة UPPERCASE أو الأحرف الصغيرة lowercase. لذلك تستطيع الكتابة بأي شكل منهما أو حتى الكتابة بكليهما.
• إن المتصفحات لا تأخذ بعين الاعتبار الفراغات الزائدة أو إشارات نهاية الفقرات وبعبارة أخرى فإن باستطاعتك كتابة ملفك السابق بالشكل التالي:
<HTML><HEAD><TITLE> بسم الله الرحمن الرحيم </TITLE></HEAD><BODY>
حسام القاضي – بوابة العرب </BODY></HTML>
أو بالشكل التالي:
<HTML>
<HEAD>
<TITLE>
بسم
الله
الرحمن
الرحيم
</TITLE>
</HEAD>
<BODY>
حسام
القاضي
- بوابة
العرب
</BODY>
</HTML>
أو حتى بهذا الشكل:
<HTML> <HEAD> <TITLE>
بسم الله الرحمن الرحيم
</TITLE>
</HEAD>
<BODY>
حسام القاضي – بوابة العرب
</BODY>
</HTML>
وفي كل الحالات ستحصل على نفس النتيجة. وإذا كنت من تلك النوعية من الناس التي لا تصدق كل ما يقال… تستطيع أن تجرب ذلك بنفسك!!! هيا جرب.
لكن هذا لا يعني أن الفقرة المكونة مثلاً من عشرة أسطر ستمتد إلى عدة أمتار بعرض الشاشة. كلا بالطبع لأن المتصفح سيقوم بعمل التفاف تلقائي لها بحسب عرض الشاشة، مهما كان مقدار هذا العرض.
والآن قد تتساءل، إذن كيف يمكن التحكم بمقدار النص المكتوب في كل سطر وكيف يمكن تحديد نهاية الفقرة وبداية الفقرة التي تليها؟ سؤال وجيه!!! والإجابة عليه هي......
هذا ما سنراه في الدروس القادمة ان شاء الله .....
:D:D:D
تم تعديل الروابطلتنزيل الدرس بصيغه الوورد اضغط هنااا (http://www.arabsgate.com/edu-teachers/websites-building/1/1doc.zip)
لتنزيل الدرس بصيغه الببي دي اف إضغط هنااااا (http://www.arabsgate.com/edu-teachers/websites-building/1/1pdf.zip) [/B]
منقووول
سوف نبدأ في التعرف على أساسيات تصميم المواقع .
ومن اهم الاساسيات التي يجب ان نتعلمها هي لغة الHTML وهي اللغة التي تكتب بها بعظم صفحات الانترنت والتي تقوم العديد من البرامج بكتابتها مباشرة بدون تدخل منا .
مثل الفرونت بيدج او الدريم ويفر .
إذن فما الحاجه إلى تعلمها ؟؟مادامت البرامج تكتبها ؟؟
الإجابة هى ان كل برنامج مهما كانت امكانياته به قصور في بعض النواحي كما ان معرفتنا بكيفيه كتابه الكود تجعلنا نتمكن من التعديل عليه والتغيير فيه وكذلك ادخال أكواد الجافا ابليت والجافا سكريبت وكذلك اكواد الفيجوال بيزك سكريبت.......وغيرها .
لذلك فسوف نبدأ بتعلم أساسيات هذه اللغه ........كما اتفقنا .
لغة الHTML :
يمكننا كتابة لغه الhtml في اي نوت باد عادي للويندوز وسيتم حفظ الصفحه بامتداد html او htm وهما الامتدادان اللذان يدلان على انها صفحة انترنت .
تحتوي الصفحه في الاساس على مايسمى بالTAG وهو الوسم باللغه العربيه وهو الشيء الذي سوف نكتب داخله .
وكل وسم يكون بين علامتي < > وكقاعده يجب اغلاق كل وسم هكذا</> ويكون الغلق بنفس ترتيب الفتح . ولكل قاعدة شواذ كما تعرفون ......لذا فإنه يوجد بعض الاوسمه التي لا تغلق وسوف نرها حينما نتعرض لها ان شاء الله .
فتحتوي الصفحه على الاوسمه الرئيسية التاليه :
<html>
<title> هنا نكتب عنوان الصفحه </title>
<head>
هنا نكتب بعض الاشياء التي سوف نراها لاحقا
</head>
<body>
هنا سوف يكون محتويات الصفحه
</body>
</html>
** إذن فملف Html يبدأ دائماً بالوسم <HTML> وينتهي بالوسم </HTML>.
** أما الوسم <HEAD> فيحدد بداية المقطع الذي يحتوي على المعلومات الخاصة بتعريف الصفحة. كالعنوان الظاهر على شريط عنوان المتصفح. وهذا العنوان بدوره يحتاج لأن يوضع بين الوسمين: <TITLE> … </TITLE> وبالطبع يجب كتابة الوسم </HEAD> لكي ننهي هذا المقطع .
**نأتي إلى الوسم <BODY> والذي يتم كتابة نصوص صفحة الويب ضمنه، بالإضافة إلى إدراج الصور والجداول وباقي محتويات الصفحة. وهو أيضاً يحتاج إلى وسم الإنهاء </BODY>
وكمثال مبدئي سوف نكتب كود بسيط جدا لصفحة بسيطه تحتوي على كلمه بوابةالعرب .
<html>
<title> بوابة العرب- حسام القاضي </title>
<head>
</head>
<body>
بوابة العرب
</body>
</html>
ونحفظ الملف باسم وليكن 1.htm
وعند الضغط على الصفحه سوف تكون النتيجة كما في الصورة التالية :
http://arabsgate.members.easyspace.com/1.gif
وقبل أن نستمر أريد أن أنبهك إلى بعض الملاحظات عند كتابة صفحات الويب:
• لا يوجد فرق بين كتابة الوسوم بالأحرف الإنجليزية الكبيرة UPPERCASE أو الأحرف الصغيرة lowercase. لذلك تستطيع الكتابة بأي شكل منهما أو حتى الكتابة بكليهما.
• إن المتصفحات لا تأخذ بعين الاعتبار الفراغات الزائدة أو إشارات نهاية الفقرات وبعبارة أخرى فإن باستطاعتك كتابة ملفك السابق بالشكل التالي:
<HTML><HEAD><TITLE> بسم الله الرحمن الرحيم </TITLE></HEAD><BODY>
حسام القاضي – بوابة العرب </BODY></HTML>
أو بالشكل التالي:
<HTML>
<HEAD>
<TITLE>
بسم
الله
الرحمن
الرحيم
</TITLE>
</HEAD>
<BODY>
حسام
القاضي
- بوابة
العرب
</BODY>
</HTML>
أو حتى بهذا الشكل:
<HTML> <HEAD> <TITLE>
بسم الله الرحمن الرحيم
</TITLE>
</HEAD>
<BODY>
حسام القاضي – بوابة العرب
</BODY>
</HTML>
وفي كل الحالات ستحصل على نفس النتيجة. وإذا كنت من تلك النوعية من الناس التي لا تصدق كل ما يقال… تستطيع أن تجرب ذلك بنفسك!!! هيا جرب.
لكن هذا لا يعني أن الفقرة المكونة مثلاً من عشرة أسطر ستمتد إلى عدة أمتار بعرض الشاشة. كلا بالطبع لأن المتصفح سيقوم بعمل التفاف تلقائي لها بحسب عرض الشاشة، مهما كان مقدار هذا العرض.
والآن قد تتساءل، إذن كيف يمكن التحكم بمقدار النص المكتوب في كل سطر وكيف يمكن تحديد نهاية الفقرة وبداية الفقرة التي تليها؟ سؤال وجيه!!! والإجابة عليه هي......
هذا ما سنراه في الدروس القادمة ان شاء الله .....
:D:D:D
تم تعديل الروابطلتنزيل الدرس بصيغه الوورد اضغط هنااا (http://www.arabsgate.com/edu-teachers/websites-building/1/1doc.zip)
لتنزيل الدرس بصيغه الببي دي اف إضغط هنااااا (http://www.arabsgate.com/edu-teachers/websites-building/1/1pdf.zip) [/B]
منقووول