مرحبا بكم في مدونة خطوة نت حيث المعرفة والاستفادة

الخميس، 25 فبراير 2010

الأوسمة المستعملة لتنسيق النصوص بلغة HTML


أولاً: أوسمة خاصة بالتحكم بمقدار النص المكتوب بكل سطر :
1- الوسم br
يستخدم لتحديد نهاية السطر والبدء بسطر جديد وهو وسم مفرد أي ليس له وسم نهاية.
2- الوسم ";nbsp&"يستخدم للتحكم في الفراغات وهو اختصار للعبارة None Breakable Space ، أي إذا أردنا إدخال عدة فراغات بين نص وآخر فيجب كتابة هذا الوسم بنفس عدد الفراغات المطلوبة।


ثانياً: أوسمة خاصة بالخط:
1- الوسم Font: وهو يقوم بالتحكم بالخطوط باستخدام خصائص النوع واللون والحجم .
الخصائص التي تستخدم مع وسم الخط هي:
Face : تقوم هذه الخاصية بتحديد نوع الخط المطلوب ويمكن تحديد أكثر من نوع معاً، وفي هذه الحالة إذا لم يتواجد الخط المحدد أولا على جهاز الشخص الذي يتصفح الموقع يتم اعتماد الخط الثاني.

Color: تقوم هذه الخاصية بتحديد لون الخط وذلك بنفس مبادئ تحديد الألوان.

Size : تقوم هذه الخصية بتحديد حجم الخط حيث هناك سبعة أحجام لأي خط تستطيع المتصفحات التعرف عليها।
ويتم تحديد الحجم المطلوب بأسلوبين هما:
أ‌- الاسلوب المباشر: يتم في هذا الاسلوب اختيار الحجم الذي نريده مباشرة أي يتم كتابة رقم يتراوح ما بين 1 – 7

ب‌- الاسلوب النسبي: يتم في هذا لاسلوب كتابة الارقام من 1 إلى 6 مرفقة إما بإشارة (+) أو إشارة (-) ، حيث تمثل (+) درجات التكبير و (-) درجات التصغير للخط وذلك نسبة إلى الحجم الإفتراضي।


ملاحظة:
حتى في الاسلوب النسبي لا نستطيع الحصول على أكثر من سبعة أحجام للخطوط.

2- الوسم Basefont:يقوم هذا الوسم بتحديد نوع الخط وخصائصه بالنسبة للصفحة كلها ، أي إنه يقوم بتعريف نوع الخط الأساسي الذي سيستخدم في الصفحة من بدايتها إلى نهايتها ويحدد لونه وحجمه.
ملاحظات:
1- الوسم
وسم مفرد لا يحتاج إلى وسم نهاية لأنه يتعامل مع الصفحة ككل مع الإعدادات الأساسية لها وليس مع كلمة أو سطر أو فقرة.
2- يكتب هذا الوسم عادة في بداية الملف ويفضل مباشرة بعد وسم .
3- الخصائص المستخدمة معه هي نفس خصائص الوسم .
4- يمكن استخدام الخاصية Name معه بدلا من خاصية Face।


ثالثاً: أوسمة تمييز العناوين:
وهي وسوم خاصة تستخدم لتمييز العناوين في صفحات الانترنت وهيHn
حيث حرف n هو رقم بين 1-6 يمثل مستوى العنوان।

رابعاً: أوسمة التنسيقات والتأثيرات التي يمكن إضافتها إلى النصوص:



خامساُ: وسم نص الآلة الطابعة أو موحد المسافات
:
مثال توضيحي : إذا أخذنا الحرفين i,m وكتبنا كل منهما عشر مرات متتالية نلاحظ أن المساحة التي يشغلها الحرف m هي أضعاف المساحة التي شغلها الحرف i، أما عند استخدام الوسم المزدوج TT فإن المساحة التي يشغلها كلا الحرفين تصبح موحدة.

تمرين1:
قم بتصميم صفحة بلغة HTML تحتوي على النص التالي:
أذكار عظيمة الآجر والنفع
سبحان الله الحمد لله لا إله إلا الله الله أكبر
سبحان الله وبحمده سبحان الله العظيم
بسم الله ولا حول ولا قوة إلا بالله
أستغفر الله وأتوب إليه
المطلوب:
1. عنوان الصفحة "أذكار".
2. وضع كل ذكر في سطر منفصل.
3. وضع ثلاث فراغات بين الكلمات في أول ذكر.
4. نوع الخط لكامل المستند ARIAL اللون أزرق الحجم 4.
5. استخدام وسم لتمييز العنوان "أذكار عظيمة الآجر والنفع" على أن يكون الخط مسطراً (أي تحته خط).
6. تغيير الألوان والحجوم لكل ذكر على حدة.
7. استخدام وسوم التأثيرات الخط الغامق والخط المائل على بعض الأذكار.
8. حفظ المستند باسم "ADKAR.HTML"
الجواب:
انقر على الرابط التالي :
http://www.4shared.com/file/232889454/3f3b80fa/adkar.html







إنشاء الصفحات باستخدام لغة الترميز HTML

أولا: تعريف لغة الترميز HTML:
إنها اللغة المستخدمة لإنشاء صفحات الانترنت وهي اختصار ل HyperText Markup Language وهي ليست لغة برمجة بالمعنى والشكل المتعارف عليه للغات البرمجة الآخرى كلغة C فهي مثلا لا تحتوي على جمل التحكم والدوران، وعند الحاجة لاستخدام هذه الجمل يجب تضمين شفرات من لغات أخرى كـ GCI,JavaScript,Java ، كذلك فهي لا تحتاج إلى مترجم خاص Compiler।



س:علل: لا تحتاج لغة الترميز HTML إلى مترجم خاص أو نظام تشغيل معين.
ج: لأنه يتم تفسيرها وتنفيذ تعليماتها مباشرة من قبل متصفح الانترنت بغض النظر عن النظام المستخدم।

ثانيا: مفردات لغة الترميز:
تتكون مفردات لغة HTML من شفرات تسمى TAGS أي الوسوم، وهي تستخدم بشكل أزواج من اليسار إلى اليمين।
وهناك بعض الوسوم الخاصة التي تستخدم بصورة مفردة مثل وسم نهاية السطر
أو قد تستخدم بكلتا الحالتين مثل وسم الفقرة

ثالثاً: احتياجات لغة الترميز:
· برنامج لتحرير النصوص البسيطة ومعالجتها مثل برنامج المفكرة Notepad الموجود في نظام Windows.
· أحد برامج تصفح الانترنت مثل Netscape Navigator – MS Internet Explorer لمعاينة الصفحات التي يتم تصميمها।



ملاحظة:
يوجد العديد من البرامج التي تستخدم لإنشاء صفحات HTML حيث يقوم المستخدم من خلالها بكتابة الصفحات وتصميمها بما تحويه من نصوص ورسومات وجداول دون الحاجة لكتابة وسوم هذه اللغة ومن ثم يقوم البرنامج بتخليق الوسوم المناسبة تلقائيا وتحويل هذه الصفحات وحفظها بتنسيق HTML।



رابعا: كيفية تكوين ملف HTML:
تتكون ملفات HTML من قسمين هما:
المحتوى : وهو مايتم عرضه عن عند التصفح.
الوسوم :وھي الأجزاء التي تحدد كیف سیتم عرض المحتوى السابق، فھي تصف المحتوى من حيث التنسيق।



الوسوم الاساسية للغة HTML:



بنية ملف HTML:
ملاحظة:




  1. يتكون ملف HTML من جزئين رئيسين هما : الرأس HEAD، والجسم BODY।

  2. لا يوجد فرق بين كتابة الوسوم بالأحرف الانجليزية الكبيرة أو الصغيرة।

  3. المتصفحات لا تأخذ بعين الإعتبار الفراغات الزائدة أو إشارات نهاية الفقرة أي عند الضغط على مفتاح Enter

خامسا: خطوات إنشاء ملف بلغة الترميز

  • قم بفتح برنامج المفكرة واكتب مايلي:




  • قم بحفظ الملف بأي اسم تختاره على أن يكون الامتداد html أو htm









  • لمعاينة ما تم تصميمه نقوم بتشغيل متصفح الانترنت (MS Internet Explorer) الموجود رمزه على سطح المكتب









  • بعد فتح المتصفح اختر الأمر فتح Open من قائمة ملف File يظهر مربع حوار انقر استعراض Browse




  • حدد مسار الملف ثم انقر موافق OK














    1. مبادئ تصميم مواقع الانترنت


      أولا أنواع المواقع الالكترونية:
      يوجد نوعان من من المواقع وهما:
      1- مواقع ثابتة Static sites: وهي المواقع المصممة بلغة HTML وهي تتغير محتوياتها يدوياً وهي إلى الانقراض حالياً.
      2- المواقع المتحركة Dynamic sites: وهي المواقع المصممة بلغات البرمجة وهي التي تتغير محتوياتها اتوماتيكيا وحاليا معظم المواقع من هذا النمط।


      ثانياً أهداف إنشاء الموقع:
      من أهداف إنشاء الموقع الآتي:
      1- إيصال رسالة دعائية أو سياسية أو طبية أو دينية وغيرها يراها ملايين البشر في كافة أنحاء العالم من مختلف الاجناس والعقائد.
      2- تحسين صورة العمل فحتى أصغر الاعمال يمكن أن يكون لها حضور أمام أكبر الشركات عملاً.
      3- زيادة انتاجية العمل وذلك بوضع اجابات للأسئلة الشائعة والمتكررة عن العمل من ضمن الموقع.
      4- إنشاء رسالة إعلامية متجددة دائما وسهلة التحديث بدون الحاجة للأوراق أو حبر أو مطابع وغيرها.
      5- التكلفة المجدية للموقع فتكلفة متابعة الموقع وتحديثه وتعتبر قليلة نسبياً ويمكن تحملها مقارنة مع ما يدفع لوسائل الاعلان الاخرى.
      6- استعمال البريد الالكتروني بارسال رسالة لمائة زبون معا وبكلفة اقل من ارسال رسالة لزبون واحد بالبريد العادي.
      7- الترويج للعمل على مدار الساعة وعلى مدار السنة وفي جميع انحاء العالم حيث لا توجد وسيلة اعلامية اخرى تقدم هذا العرض وبهذه المرونة.
      8- تنفيذ الاعمال على الانترنت والبيع والشراء عبر بطاقات الائتمان حيث يمكنك شراء كتب وألبسة أو شراء تذاكر سفر للطائرة وغيرها.
      9- استلام المعلومات من مواقع أخرى لأعمال مشابهة والتزود بالجديد ومقارنة الاسعار والمواصفات بسهولة.
      10- ايجاد خدمة متواصلة على مدار 24 ساعة.


      ثالثاً مكونات الموقع:
      يتكون الموقع من :
      1- المساحة التخزينية: وهي المساحة التي يقوم المستخدم بحجزها لعرض ملفاته على الانترنت وهي مثل تحديد مساحة في القرص الصلب لتخزين الملفات والبيانات عليها.
      س: ما هي شركات الاستضافة؟
      ج: هي شركات تقوم بتأجير مساحات على الانترنت ليقوم المستخدم بوضع ملفاته عليها.

      2- نطاق الموقع وعنوانه: وهو الاسم الذي يتم كتابته في المتصفح ليذهب إليه مثل عنوان الصفحة الرئيسية لموقع الموسوعة العربية العالمية http://www.mawsoah.net/

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


      رابعأ خطة بناء الموقع
      1- تحديد الاهداف: هناك أهداف كثيرة لبناء المواقع منها ما هو تجاري أو اجتماعي أو تعليمي أو ثقافي فمن دون تحديد دقيق لاهداف الموقع ومن هو المقصود بهذا الموقع قد يتسبب ذلك بفشل الموقع.
      2- جمع المعلومات: قبل البدء بالتصميم يجب أن تكون كل أو أغلب المعلومات والمواد المراد نشرها جاهزة لكي تتمكن من اخراجها بالشكل المناسب.
      3- إخراج الصفحة الأولى: يعتمد نجاحالموقع بشكل كبير على حسن إخراج وتدبير الصفحة الأولى إذ يجب أن تحوي الصفحة الأولى اسم الموقع وبعض الروابط للصفحات الفرعية كما يجدر وضع عنوان البريد الالكتروني لمالك الموقع.
      4- تأليف الصفحات: لتصميم الصفحة الأولى وبقية الصفحات يمكنك الخيار بين استخدام أحد محررات الصفحات او استخدام لغة ترميز النصوص المترابطة(HTML) وبالنسبة لبرامج تحرير الصفحات فهي تشبه إلى حد كبير محررات النصوص بالإضافة إلى بعض الخواص الإضافية كتكوين رابطة لصفحة أو موقع آخر أو وضع خلفية إلى غيره من المؤثرات الخاصة بالمواقع.
      5- الاختبار: يجب على مصمم الموقع اختباره والتأكد من أن جميع الروابط بين النصوص صحيحة ودقيقة وكذلك تدقيق النصوص إملائياً.
      6- تشغيل الموقع: لتشغيل الموقع يجب نقل الصفحات إلى مزود الشبكة في الشبكة المحلية أو إلى الموقع (المساحة التخزينية) الذي قمت بحجزه عند أحد مستضيفي المواقع.
      7- تجديد الموقع: إن نشر الموقع وتركه كما عليه فترة طويلة قد يزهد الزوار فيه فلذلك لابد من تجديده والإضافة إليه وإجراء بعض التغييرات في الصفحة الرئيسية।


      س: ماذا نحتاج لتصميم المواقع؟
      1- دراية كافية وخلفية جيدة بلغة HTML.
      2- إجادة العمل على برامج تصميم المواقع خاصة FRONT PAGE.
      3- تعلم لغة برمجة خاصة بالمواقع وذلك لإنشاء موقع ديناميكي.

      محركات البحث

      محركات البحث Interner Search engines:

      تعريف محرك البحث: هو برنامج يتيح للمستخدمين خدمة العثور على مستندات مخزنة على شبكة الانترنت ، ويمكن الوصول إلى هذا البرنامج عبر برنامج تصفح الانترنت।



      أمثلة على محركات البحث:

      يوجد عدد كبير من محركات البحث التي تنتشر على شبكة الويب نذكر منها على سبيل المثال لا الحصر

      Google, Altavista, Lycos

      ويعد محرك البحث Google من أفضل محركات البحث حيث إنه يبحث في أكثر من 8 مليارات ونصف المليار من صفحات الانترنت।



      س: كيف تتم عملية البحث؟

      ج: تتم عملية البحث بكتابة كلمة أو عبارة في مربع البحث Search Box ثم الضغط على زر بحث حيث تظهر النتائج على شكل قائمة بعناوين المستندات التي توافق الطلب।



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

      الشبكة العنكبوتية العالمية

      تعريف شبكة الويب العالمية ( World Wide Web (WWW:
      ويطلق عليها أيضاً الشبكة العنكبوتية العالمية وهي عبارة عن مجموعة هائلة من وثائق النص المترابط HyperText التي ترتبط ببعضها على شبكة الانترنت ،وتسمح شبكة الويب لبرنامج مستعرض الويب (متصفح الويب) بنقل جميع أنواع المعلومات (نص،صوت ، صور، فيديو، ..) وعرضها على شاشة المستخدم।
      وحواسيب هذه الشبكة تستخدم ثلاث تقنيات حديثة هي:
      • النصوص الفائقة HyperText
      • بروتوكول لنقل النصوص الفائقة HyperText Transfer Protocol :HTTP
      • برامج التصفح Web Browser


      س: ما سبب تسمية شبكة الويب بالشبكة العنكبوتية؟
      ج: تم تسميتها بالشبكة العنكبوتية لانها تشبه نسيج العنكبوت التي تتكون من شبكة من الخيوط كل خط منها متصل بالآخر إما بصورة مباشرة أو غير مباشرة يمكن الوصول من أي نقطة منها إلى أي نقطة أخرى।

      تعريف متصفح الويب Web Browser:
      هو برنامج يستخدم للدخول إلى خادم الويب الذي يوضع اسمه في محدد موقع المصدر URLوإحضار طلبات المستخدم في الصيغة المناسبة، ومن أشهر المتصفحات MS Internet Explorer , Netscape Navigator .