تم تعطيل الجافا سكربت. للحصول على تجربة أفضل، الرجاء تمكين الجافا سكربت في المتصفح الخاص بك قبل المتابعة.

الرد على الموضوع

الرسالة: [QUOTE="++menooo++, post: 38563, member: 1421"] [CENTER][CENTER][B][COLOR=red][FONT=Tahoma]تعلم استخدام إنترنت[/FONT][/COLOR][/B][FONT=Tahoma] [/FONT][FONT=Tahoma][/FONT][/CENTER] [CENTER][FONT=Tahoma][/FONT][/CENTER][/CENTER] [RIGHT][B][FONT=Tahoma]تأليف صفحات ويب[/FONT][/B][/RIGHT] [LEFT][RIGHT][B][FONT=Tahoma]الجزء الثاني[/FONT][/B][/RIGHT][/LEFT][RIGHT] [FONT=Tahoma]ركزنا في الحلقة السابقة على الخطوات الأولية لتأليف صفحة ويب، من خلال مثال إنشاء صفحة شخصية. واستخدمنا لذلك برنامج تحرير صفحات ويب [/FONT][FONT=Tahoma]Front Page Express[/FONT][FONT=Tahoma] المجاني، الذي تقدمه شركة مايكروسوفت مع رزمة المتصفح إنترنت إكسبلورر4، فبدأنا بإنشاء وتجريب الصفحة على القرص الصلب المحلي الموجود في الجهاز ذاته، بدون الاتصال بشبكة إنترنت. وتعلمنا كيف ننشئ قائمة رئيسية بمحتويات الصفحة، ونربط بين عناصر تلك القائمة ومحتويات الصفحة ذاتها، ثم ندرج في الصفحة ارتباطات بالمواقع المفضلة، وارتباطاً بعنوان البريد الإلكتروني. ولم ننس مظهر الصفحة والمؤثرات الأخرى، فرأينا كيف نعين خلفية رسومية وموسيقية لها، ونضيف إليها صورة أو مقطع فيديو. نظرنا أخيراً إلى نص لغة [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma]، الذي ولده محرر صفحات ويب [/FONT][FONT=Tahoma]Front Page Express[/FONT][FONT=Tahoma] خلال تأليفنا للصفحة، وذكرنا أنه يمكن تعديله مباشرة عند الحاجة. [/FONT] [B][FONT=Tahoma]إرسال الصفحة إلى مزود ويب[/FONT][/B] [FONT=Tahoma]قبل أن نتابع في تحسين وتطوير شكل الصفحة الشخصية ومحتوياتها، سنقدم مثالاً على كيفية حجز الدليل المجاني على مزود الجهة التي توفر خدمة استضافة الصفحات المجانية، ثم إرسال الصفحة إليه.[/FONT] [FONT=Tahoma]سنفترض أنك نفذت معظم الخطوات التي وردت في الجزء الأول المنشور في العدد السابق، فحصلت على ملف [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma]، باسم معين، وليكن [/FONT][FONT=Tahoma]myhomepg.htm[/FONT][FONT=Tahoma]، واستخدمت ملفاً باسم [/FONT][FONT=Tahoma]backgndpic.gif[/FONT][FONT=Tahoma] كصورة لأرضية الصفحة، وملف خلفية موسيقية باسم [/FONT][FONT=Tahoma]music.mid[/FONT][FONT=Tahoma]. كل ما عليك اختياره الآن، هو الجهة التي ستستضيف صفحتك.[/FONT] [FONT=Tahoma]أوردنا في العدد السابق لائحة بعناوين بعض المواقع التي توفر خدمة استضافة الصفحات المجانية. بادر بزيارة تلك المواقع، واطلع على الخدمات التي تقدمها، والشروط التي تضعها، ولاحظ سعة الدليل الذي توفره. ولاحظ أسلوب تعيين عناوين الصفحات المجانية، إذ أن بعضها طويل، أو يحتوي على أرقام كثيرة، مما يجعلها صعبة الإدخال لمن يريد زيارة صفحتك. تختلف أساليب حجز الصفحة المجانية (أي إنشاء دليل جديد على أقراص المزود البعيد) وإرسالها من جهة إلى أخرى، إلا أن معظم المواقع التي توفر ذلك تطلب أولاً ملء نموذج معلومات عن طالب الخدمة، ثم ترسل له كلمة سر، تمكنه من الدخول إلى أدوات إدارة وتحديث صفحته. اخترنا الموقع [/FONT][FONT=Tahoma]www.tripod.com[/FONT][FONT=Tahoma] كمثال، لنشرح عملياً كيفية حجز صفحة شخصية، وهو يوفر لكل عضو من أعضائه، سعة 11 ميجابايت للصفحة مجاناً. عضوية الموقع مجانية أيضاً، وكل ما يجب فعله للحصول عليها، هو الاتصال بإنترنت، والانتقال إلى الموقع [/FONT][FONT=Tahoma]www.tripod.com[/FONT][FONT=Tahoma]، والنقر في صفحته الرئيسية على زر [/FONT][FONT=Tahoma]Free Membership[/FONT][FONT=Tahoma]، ثم تعبئة الحقول المطلوبة، التي تتضمن طلب عنوان البريد الإلكتروني، والنقر على زر [/FONT][FONT=Tahoma]Join[/FONT][FONT=Tahoma]. إذا فعلت ذلك، ستتلقى رسالة في صندوق بريدك الإلكتروني، تتضمن كلمة السر، التي تسمح لك بالدخول إلى الموقع كعضو من أعضائه.[/FONT] [FONT=Tahoma]ملأت نموذج الاشتراك، واخترت اسم المستخدم [/FONT][FONT=Tahoma]Shahem[/FONT][FONT=Tahoma]، فأصبحت أحد أعضاء الموقع وأصبح عنوان الدليل الخاص بي كالتالي: [/FONT][FONT=Tahoma]http://members.tripod.com/~Shahem[/FONT][FONT=Tahoma]. فإذا فعلت مثلي، وأصبحت أحد أعضاء الموقع، فأهلاً بك أولاً! ثانياً، استخدم كلمة السر التي وصلت إلى عنوان بريدك الإلكتروني، للدخول إلى الموقع كأحد أعضائه، وذلك بالنقر على [/FONT][FONT=Tahoma]Members: log in[/FONT][FONT=Tahoma]، وإدخال المعلومات المطلوبة، فتجد أنه حجز لك دليلاً بسعة أحد عشر ميجابايت، وعنوانه [/FONT][FONT=Tahoma]http://members.tripod.com/~XXXX[/FONT][FONT=Tahoma]، حيث [/FONT][FONT=Tahoma]XXXX[/FONT][FONT=Tahoma] اسم المستخدم الذي اخترته. إذا كنت جاهزاً لإرسال الصفحة إلى موقعك، انقر [/FONT][FONT=Tahoma]Free[/FONT][FONT=Tahoma] [/FONT][FONT=Tahoma]Home Builder[/FONT][FONT=Tahoma]، فتنتقل إلى صفحة أدوات تأليف وإدارة الصفحات المجانية التي يوفرها الموقع. لا حاجة لاستخدام أدوات تأليف الموقع، لأنها تجبرك على البقاء متصلاً بالشبكة، خلال وقت التأليف. يضاف إلى ذلك أنك اخترت سابقاً محرر [/FONT][FONT=Tahoma]Express[/FONT][FONT=Tahoma] [/FONT][FONT=Tahoma]Frontpage[/FONT][FONT=Tahoma] لتأليف صفحتك، (أو بالواقع نحن من اختار ذلك!)، وهو يؤدي تلك المهمة بأسلوب أفضل. انقر على الارتباط [/FONT][FONT=Tahoma]homepage housekeeper[/FONT][FONT=Tahoma]، للانتقال إلى صفحة إرسال الملفات إلى المزود البعيد، والتي ستظهر لك أيضاً، عنوان صفحتك، ومعلومات عن السعة التي استخدمتها، والسعة المتبقية، ولائحة أسماء الملفات الموجودة في دليلك حالياً، والتي يفترض أن تكون فارغة أول مرة، لأنك لم ترسل أي ملف إلى المزود البعيد حتى الآن.[/FONT] [FONT=Tahoma]هل أنت مستعد للحظة المنتظرة؟ لحظة وصول صفحتك إلى إنترنت؟! اختر إذاً من لائحة [/FONT][FONT=Tahoma]Things you can access from the Homepage[/FONT][FONT=Tahoma] [/FONT][FONT=Tahoma]Housekeeper[/FONT][FONT=Tahoma]، الوظيفة [/FONT][FONT=Tahoma]Upload files[/FONT][FONT=Tahoma]، ثم انقر الزر [/FONT][FONT=Tahoma]go![/FONT][FONT=Tahoma]، وستنتقل إلى صفحة إرسال الملفات إلى المزود البعيد، التي تسمح بإرسال خمسة ملفات دفعة واحدة. [/FONT] [FONT=Tahoma]أدخل في المستطيل [/FONT][FONT=Tahoma]File1:[/FONT][FONT=Tahoma] اسم ملف الصفحة التي ألفتها (والتي افترض أن اسمها [/FONT][FONT=Tahoma]myhomepg.htm[/FONT][FONT=Tahoma])، مع مساره، أو اختره من القرص الصلب بالنقر على زر [/FONT][FONT=Tahoma]Browse[/FONT][FONT=Tahoma]، والانتقال إلى مجلده، ثم أدخل بالطريقة ذاتها، اسم ملف صورة الخلفية ([/FONT][FONT=Tahoma]backgndpic.gif[/FONT][FONT=Tahoma]) في المستطيل [/FONT][FONT=Tahoma]File[/FONT][FONT=Tahoma] 2:، واسم ملف الموسيقى ([/FONT][FONT=Tahoma]music.mid[/FONT][FONT=Tahoma]) في المستطيل [/FONT][FONT=Tahoma]File3:[/FONT][FONT=Tahoma]، وغيرها من الملفات التي استخدمتها في المستطيلات [/FONT][FONT=Tahoma]File 4:[/FONT][FONT=Tahoma]، و[/FONT][FONT=Tahoma]File 5:[/FONT][FONT=Tahoma].[/FONT] [FONT=Tahoma]انقر الزر [/FONT][FONT=Tahoma]Upload[/FONT][FONT=Tahoma]، وانتظر قليلاً إلى أن يتم إرسال ملف الصفحة والملفات الأخرى. لقد أصبحت صفحتك على الشبكة! تأكد من ذلك بتشغيل نسخة أخرى من المتصفح الذي تستخدمه، وإدخال عنوان صفحتك، ([/FONT][FONT=Tahoma]http://members.tripod.com/~XXXX/myhomepg.htm[/FONT][FONT=Tahoma]، مثلاً) لتجدها جزءاً من إنترنت. ماذا تنتظر! أسرع واتصل بأصدقائك وأخبرهم عنها![/FONT] [FONT=Tahoma]هل تلاحظ أن أرضية الصفحة أو بعض ملفات الصور، أو الخلفية الموسيقية لا تعمل عندما أصبحت صفحتك على المزود البعيد، بينما كانت تعمل بشكل جيد على قرصك المحلي؟ ماذا تفعل؟![/FONT] [FONT=Tahoma]تأكد أولاً من أنك أرسلت جميع ملفات الصور والصوت التي استخدمتها إلى المزود البعيد، وتأكد أن المسارات في خصائص ملفات الصور والصوت، في الصفحة لا تتضمن سوى أسماء الملفات ذاتها، (أي يكفي ذكر الاسم [/FONT][FONT=Tahoma]backgndpic.gif[/FONT][FONT=Tahoma]، مثلاً، في المستطيل ضمن لسان التبويب [/FONT][FONT=Tahoma]Background[/FONT][FONT=Tahoma]، في خصائص الصفحة)، إذ يجب أن تقع تلك الملفات في دليل ملف الصفحة ([/FONT][FONT=Tahoma]myhomepg.htm[/FONT][FONT=Tahoma]) ذاته على المزود البعيد، وإذا حدد له مسارات مختلفة (كالمسارات الموجودة على قرص الصلب)، فإنه سوف يحاول إرسال ملفات الصور والصوت الموجودة في صفحتك من أدلة غير موجودة عليه أصلاً. عدل مسارات ملفات الصور والصوت في ملف [/FONT][FONT=Tahoma]myhomepg.htm[/FONT][FONT=Tahoma] من صندوق حوار الخصائص لكل منها، باستخدام برنامج [/FONT][FONT=Tahoma]Frontpage Express[/FONT][FONT=Tahoma]، بحيث لا تحتوي إلا على أسماء الملفات ذاتها، ثم أرسل الملف [/FONT][FONT=Tahoma]myhomepg.htm[/FONT][FONT=Tahoma] إلى المزود البعيد مرة أخرى.[/FONT] [B][FONT=Tahoma]هل تكفي صفحة واحدة؟[/FONT][/B] [FONT=Tahoma]لابد أنك لاحظت أن معظم مواقع ويب لا تتألف من صفحة واحدة تحتوي على جميع المعلومات المتوفرة في الموقع، بل تبدأ بصفحة رئيسية ([/FONT][FONT=Tahoma]Homepage[/FONT][FONT=Tahoma])، يمكن التفرع منها إلى الصفحات الأخرى (شكل 1)، والهدف من ذلك تسريع تحميل الصفحة الرئيسية، لأن محتوياتها في هذه الحالة، تقتصر على فهرس أو قائمة بارتباطات للصفحات الأخرى. يسهّل بناء الموقع بهذا الأسلوب من عملية تحديث معلوماته، وهو أمر لا بديل له بالنسبة للمواقع الكبيرة. يعطى ملف الصفحة الرئيسية، عادة، الاسم [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]، أو [/FONT][FONT=Tahoma]default.htm[/FONT][FONT=Tahoma]، وهما اسما الملفين اللذين يبحث عنهما المزود البعيد، عندما يطلب منه الانتقال إلى دليل معين، بدون أن يذكر له اسم الملف الذي يطلب إرساله. فإذا أدخلنا، في حالة الموقع الذي أنشأناه، العنوان [/FONT][FONT=Tahoma]http://members.tripod.com/~Shahem[/FONT][FONT=Tahoma] فإن المزود البعيد سيحاول البحث عن ملف باسم [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]، داخل هذا الدليل ويرسل محتوياته للمتصفح. فإذا لم يجده، فإنه يرسل قائمة ارتباطات بأسماء الملفات المتوفرة في ذلك الدليل، لكن من الأفضل الاستفادة من تلقائية البحث وإرسال محتويات ملف [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma] (بالنسبة لمزودات يونيكس)، أو ملف [/FONT][FONT=Tahoma]defualt.htm[/FONT][FONT=Tahoma]، (بالنسبة لمزودات ويندوز إن.تي)، وإعفاء زائري الموقع من ضرورة كتابة اسم ملف الصفحة الرئيسية، بالشكل [/FONT][FONT=Tahoma]members.tripod.com/~Shahem/myhomepg.htm[/FONT][FONT=Tahoma]، إذ يكفي عندها إدخال [/FONT][FONT=Tahoma]members.tripod.com/~Shahem[/FONT][FONT=Tahoma].[/FONT] [FONT=Tahoma]لنبدأ بإعادة تنظيم الصفحة الشخصية بهذا الأسلوب، بحيث نجعل كل قسم من محتوياتها ضمن صفحة منفصلة. غير اسم الملف [/FONT][FONT=Tahoma]myhomepg.htm[/FONT][FONT=Tahoma] إلى [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma] على القرص الصلب، وشغل برنامج [/FONT][FONT=Tahoma]Frontpage Express[/FONT][FONT=Tahoma]، وحمله، ثم أنشئ ملفاً جديداً، باختيار [/FONT][FONT=Tahoma]File/New[/FONT][FONT=Tahoma]، من قائمة البرنامج، ثم اختيار النموذج [/FONT][FONT=Tahoma]Normal Page[/FONT][FONT=Tahoma] ثم [/FONT][FONT=Tahoma]OK[/FONT][FONT=Tahoma]. انقل محتويات القسم "سيرتي الذاتية" من الصفحة الرئيسية، إلى الصفحة الجديدة مستخدماً أوامر القص والنسخ من قائمة [/FONT][FONT=Tahoma]Edit[/FONT][FONT=Tahoma]، كما تفعل في برامج معالجة النصوص، ثم احفظ الصفحة الجديدة على القرص الصلب، باسم [/FONT][FONT=Tahoma]myvcpg.htm[/FONT][FONT=Tahoma] مثلاً، واحفظ التغييرات التي أجريتها على الملف [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]. كرر الأمر ذاته بالنسبة لبقية أقسام الصفحة الرئيسية، فيصبح لديك الملفان: [/FONT][FONT=Tahoma]myhobbypg.htm[/FONT][FONT=Tahoma] لصفحة الاهتمامات والهوايات، و[/FONT][FONT=Tahoma]myfavoritepg.htm[/FONT][FONT=Tahoma] للائحة الارتباطات، واترك الارتباط بعنوان بريدك الإلكتروني على الصفحة الرئيسية. لا تنس أن تعين عنوان صفحة ([/FONT][FONT=Tahoma]Title[/FONT][FONT=Tahoma]) مناسباً، لكل ملف [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] جديد أنشأته، وأن تغير تنسيق النصوص فيه، لكي يتناسب مع وضعه الجديد. اجعل العنوان "السيرة الذاتية" في ملف [/FONT][FONT=Tahoma]mycvpg.htm[/FONT][FONT=Tahoma]، في وسط السطر، مثلاً، وزد قياس خطه، واحذف العلامة المرجعية [/FONT][FONT=Tahoma]MyCV[/FONT][FONT=Tahoma] المرتبطة به، بالنقر بالزر الأيمن للماوس عليها، واختيار [/FONT][FONT=Tahoma]Bookmark Properties[/FONT][FONT=Tahoma]، وحذف كلمة [/FONT][FONT=Tahoma]MyCV[/FONT][FONT=Tahoma] من صندوق الحوار، ثم النقر على [/FONT][FONT=Tahoma]OK[/FONT][FONT=Tahoma]. يمكن اختيار أرضيات رسومية وخلفيات موسيقية للصفحات الفرعية تختلف عن أرضية وموسيقى الصفحة الرئيسية، ويتوفر على إنترنت عشرات المواقع التي توفر تلك الرسوميات والأصوات مجاناً. نورد بعض عناوين تلك المواقع في الجدول 1، لكن إذا لم تجد ضالتك فيها، يمكنك تصميم رسومياتك الخاصة، باستخدام أي من برامج الرسم المتوفرة، وحفظها بهيئة [/FONT][FONT=Tahoma]GIF[/FONT][FONT=Tahoma]، أو [/FONT][FONT=Tahoma]JPG[/FONT][FONT=Tahoma]، لكي تتمكن من استخدامها في تأليف صفحات ويب.[/FONT] [FONT=Tahoma]يجب تغيير الارتباطات الموجودة في قائمة المحتويات على الصفحة الرئيسية، لتشير إلى عناوين الصفحات، بدلاً من العلامات المرجعية التي كانت موجودة في الصفحة ذاتها. إليك مثال عن كيفية فعل ذلك لأحد الارتباطات:[/FONT] [FONT=Tahoma]انقر على الارتباط "السيرة الذاتية" بالزر الأيمن للماوس، واختر [/FONT][FONT=Tahoma]Hyperlink Properties[/FONT][FONT=Tahoma].[/FONT] [FONT=Tahoma]اختر عنوان الصفحة الرئيسية من لسان التبويب [/FONT][FONT=Tahoma]Open[/FONT][FONT=Tahoma] [/FONT][FONT=Tahoma]Pages[/FONT][FONT=Tahoma]، ومن قائمة [/FONT][FONT=Tahoma]Open Pages[/FONT][FONT=Tahoma].[/FONT] [FONT=Tahoma]انتقل إلى لسان التبويب [/FONT][FONT=Tahoma]World Wide Web[/FONT][FONT=Tahoma]، واختر نوع الارتباط [/FONT][FONT=Tahoma]Hyper Link Type[/FONT][FONT=Tahoma]، بحيث يكون [/FONT][FONT=Tahoma]http:[/FONT][FONT=Tahoma].[/FONT] [FONT=Tahoma]أدخل عنوان [/FONT][FONT=Tahoma]URL[/FONT][FONT=Tahoma]، بحيث يبدأ بعنوان موقعك، وينتهي باسم ملف السيرة الذاتية، بالشكل التالي [/FONT][FONT=Tahoma]http://members.tripod.com/~XXXX/mycvpg.htm[/FONT][FONT=Tahoma]، مثلاً، إذا كنت مشركاً في موقع [/FONT][FONT=Tahoma]tripod[/FONT][FONT=Tahoma]، حيث [/FONT][FONT=Tahoma]XXXX[/FONT][FONT=Tahoma]، تعبر عن اسم المستخدم الذي اخترته.[/FONT] [FONT=Tahoma]كرر الإجراء ذاته لبقية الارتباطات، بحيث يشير كل منها إلى الملف الذي يخصه. واحفظ هذه التغيرات التي أجريتها على ملف الصفحة الرئيسية [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]، ثم اتصل بإنترنت وأرسل ملفات الصفحات الجديدة [/FONT][FONT=Tahoma]mycvpg.htm[/FONT][FONT=Tahoma]، و[/FONT][FONT=Tahoma]myhobbypg.htm[/FONT][FONT=Tahoma]، و[/FONT][FONT=Tahoma]myfavoritepg.htm[/FONT][FONT=Tahoma]، إلى المزود البعيد، بالإضافة إلى الإصدارة الجديدة من ملف الصفحة الرئيسية [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]، وأية ملفات رسومية أو صوتية أخرى استخدمتها، واحذف ملف الصفحة الرئيسية القديم [/FONT][FONT=Tahoma]myhomepg.htm[/FONT][FONT=Tahoma] من المزود البعيد، (مستخدماً أمر الحذف من صفحة [/FONT][FONT=Tahoma]homepage housekeeper[/FONT][FONT=Tahoma]، إذا كنت قد اشتركت في موقع [/FONT][FONT=Tahoma]Tripod[/FONT][FONT=Tahoma]). تأكد أخيراً، من صحة عمل تلك الارتباطات، بزيارة موقعك والانتقال من الصفحة الرئيسية إلى كل من الصفحات الفرعية. ألا يبدو موقعك الآن، أكثر احترافاً؟![/FONT] [B][FONT=Tahoma]الأزرار [/FONT][/B] [FONT=Tahoma]لا يكفي أن يحتوي موقعك على المعلومات الصحيحة والمرتبة، إذ أن مظهره ورسومياته أمران مهمان أيضاً، فماذا يمكن أن تفعل لتحسن من مظهر موقعك؟ إليك بعض الاقتراحات: لماذا لا تحول القائمة الموجودة على الصفحة الرئيسية إلى قائمة أزرار بدلاً من قائمة نصية؟ وتضيف رسوميات متحركة إلى بعض الصفحات؟ وأزرار رجوع من الصفحات الفرعية إلى الصفحة الرئيسية؟ [/FONT] [FONT=Tahoma]هيا نفعل ذلك![/FONT] [FONT=Tahoma]لنبدأ بالأزرار.. معظم الأزرار التي تراها على صفحات ويب رسوم مرتبطة بصفحات أخرى، يضيف إليها مؤلفو الصفحات شيفرة برمجية بلغة [/FONT][FONT=Tahoma]CGI[/FONT][FONT=Tahoma] ([/FONT][FONT=Tahoma]Common Gateway Interface[/FONT][FONT=Tahoma])، أو [/FONT][FONT=Tahoma]_JavaScript[/FONT][FONT=Tahoma] لمحاكاة حركة ضغط الزر الفيزيائي، بالتبديل بين رسمين مختلفين للزر ذاته. ويوجد نوع آخر من الأزرار تحاكي حركة ضغط الزر أيضاً، والتي تعتمد على ما يسمى بريمجات جافا ([/FONT][FONT=Tahoma]Jave Applets[/FONT][FONT=Tahoma]). لكن، لن ندخل في تفاصيل كيفية برمجة الأزرار المتحركة، فتلك مسألة تحتاج لشرح منفصل، يمكن أن نقدمه في أعداد مقبلة، وسنكتفي حالياً بالأزرار الساكنة. يمكن تصميم الأزرار بالشكل الذي ترغبه، باستخدام أي من برامج الرسوميات المتوفرة، إلا أننا ننصحك بجلب الأزرار من أحد مواقع إنترنت الذي يوفرها مجاناً (انظر جدول 1)، وتعديلها بالشكل الذي ترغبه. [/FONT] [FONT=Tahoma]جلبنا من الموقع [/FONT][FONT=Tahoma]www.webwider.com/syzone/test/button1.shtml[/FONT][FONT=Tahoma] مجموعة من ملفات الأزرار، ثم أضفنا عليها الكلمات العربية لقائمة الصفحة الشخصية باستخدام برنامج تحرير الرسوميات [/FONT][FONT=Tahoma]Paint Shop[/FONT][FONT=Tahoma] [/FONT][FONT=Tahoma]Pro[/FONT][FONT=Tahoma]، (لا تحتاج عملية جلب ملف الزر، سوى النقر على صورته بالزر الأيمن للماوس، واختيار [/FONT][FONT=Tahoma]Save as Picture[/FONT][FONT=Tahoma]، في متصفح إنترنت إكسبلورر). سمينا الملفات [/FONT][FONT=Tahoma]bttn_mycv.gif[/FONT][FONT=Tahoma] لزر "السيرة الذاتية" و[/FONT][FONT=Tahoma]bttn_hobby.gif[/FONT][FONT=Tahoma] لزر "الهوايات"، و[/FONT][FONT=Tahoma]bttn_myfav.gif[/FONT][FONT=Tahoma]، لزر المواقع المفضلة.[/FONT] [FONT=Tahoma]فإذا فعلت ذلك أيضاً، افتح الملف [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]، ببرنامج [/FONT][FONT=Tahoma]Frontpage Express[/FONT][FONT=Tahoma]، واتبع الخطوات التالية لإضافة كل زر من الأزرار:[/FONT] [FONT=Tahoma]نفذ إجراء إدراج صورة، كما تعلمت سابقاً، اختر [/FONT][FONT=Tahoma]Insert/Image[/FONT][FONT=Tahoma]، ثم أدخل اسم ملف صورة الزر.[/FONT] [FONT=Tahoma]اختر خصائص صورة الزر بالنقر بالزر الأيمن للماوس، ثم اختر لسان التبويب [/FONT][FONT=Tahoma]General[/FONT][FONT=Tahoma].[/FONT] [FONT=Tahoma]أدخل في الإطار [/FONT][FONT=Tahoma]Default Hyperlink[/FONT][FONT=Tahoma]، وضمن الحقل [/FONT][FONT=Tahoma]Location[/FONT][FONT=Tahoma]، عنوان الصفحة التي ترغب بالانتقال إليها عند النقر على صورة الزر، ولا تنس أن تدخل [/FONT][FONT=Tahoma]http://[/FONT][FONT=Tahoma] أولاً. أدخلتُ العنوان التالي لارتباط زر صفحة السيرة الذاتية [/FONT][FONT=Tahoma]http://members.tripod.com/~Shahem/mycvpg.htm[/FONT][FONT=Tahoma]، [/FONT] [FONT=Tahoma]احذف الارتباطات النصية، ورتب الأزرار عمودياً أو أفقياً، حسب رغبتك، ثم احفظ التعديلات على ملف الصفحة الرئيسية [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]. [/FONT] [FONT=Tahoma]ماذا؟! هل أصبحت تعرف كيفية إضافة زر عودة من الصفحات الفرعية إلى الصفحة الرئيسية، وتريد أن تشرح لي ذلك؟ [/FONT] [FONT=Tahoma]موافق! [/FONT] [FONT=Tahoma]"سأجلب أولاً زر من أحد المواقع التي توفرها مجاناً، ثم سأستخدم أحد محررات الرسوميات، لأكتب عليه كلمة "الصفحة الرئيسية" وأحفظه بشكله الجديد. سأفتح كل ملف من ملفات الصفحات الفرعية وأضيف إليها ذلك الزر في موقع مناسب، في أسفل يسار الصفحة، مثلاً. ثم سأفتح خصائص صورة الزر في كل منها بالنقر بالزر الأيمن للماوس، واختار [/FONT][FONT=Tahoma]Image Propertise[/FONT][FONT=Tahoma]، (خصائص الصورة)، وأنتقل إلى لسان التبويب [/FONT][FONT=Tahoma]General[/FONT][FONT=Tahoma]، وأدخل عنوان الصفحة الرئيسية في الإطار [/FONT][FONT=Tahoma]Default Hyperlink[/FONT][FONT=Tahoma]، وضمن الحقل [/FONT][FONT=Tahoma]Location[/FONT][FONT=Tahoma]، بادئاً بـ [/FONT][FONT=Tahoma]http://[/FONT][FONT=Tahoma]:، ثم أحفظ هذه التعديلات في الملفات المعنية، أليس ذلك صحيحاً؟"[/FONT] [FONT=Tahoma]ممتاز! لقد قلت ما أريد قوله بالضبط![/FONT] [FONT=Tahoma]لكن، هل تعرف الأزرار التي تظهر رسوماً متحركة؟[/FONT] [FONT=Tahoma]لا بد أنك رأيت كثيراً من الرسوم المتحركة على صفحات ويب، وترغب أن تجعل صفحاتك أكثر حيوية بإضافة بعضها. سنقتصر في هذه الحلقة على أبسط أنواعها، وهي ملفات بهيئة [/FONT][FONT=Tahoma]GIF[/FONT][FONT=Tahoma]، تسمى [/FONT][FONT=Tahoma]Animated GIF[/FONT][FONT=Tahoma]، وتحتوي على مجموعة من الرسوم التي يمثل تتابعها حركة معينة. تدعم معظم المتصفحات الحالية هذا النوع من الملفات، ويكفي إدراجها في الصفحة لكي تظهر حركة معينة، ويمكن تعيين ارتباط لها بحيث يؤدي النقر عليها إلى الانتقال إلى الصفحة المطلوبة. سنستبدل ارتباط عنوان البريد الإلكتروني، بزر رسوم متحركة مرتبط بالعنوان ذاته، وذلك بالطريقة التالية:[/FONT] [FONT=Tahoma]انتقل إلى الموقع [/FONT][FONT=Tahoma]www.elated.com/toolbox/buttonkits[/FONT][FONT=Tahoma] واجلب أحد الرسوم المتحركة التي تمثل البريد الإلكتروني، بالنقر بالزر الأيمن للماوس على الرسم المتحرك واختيار [/FONT][FONT=Tahoma]Save As[/FONT][FONT=Tahoma] [/FONT][FONT=Tahoma]Picture[/FONT][FONT=Tahoma]، وحفظ الملف على القرص الصلب. [/FONT] [FONT=Tahoma]افتح ملف الصفحة الرئيسية [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]، وأدرج الصورة في اسفل الصفحة، ووسطها.[/FONT] [FONT=Tahoma]أدخل عنوان بريدك الإلكتروني في حقل [/FONT][FONT=Tahoma]Default[/FONT][FONT=Tahoma] [/FONT][FONT=Tahoma]Link[/FONT][FONT=Tahoma]، من خصائص الصورة، واسبقه بالعبارة [/FONT][FONT=Tahoma]mailto:[/FONT][FONT=Tahoma]، ثم احفظ التغييرات التي أجريتها.[/FONT] [FONT=Tahoma]يمكنك الآن تحميل ملف الصفحة الرئيسية ضمن المتصفح، لكي تشاهد الرسم المتحرك. [/FONT] [FONT=Tahoma]يمكن إضافة العديد من الصور المتحركة إلى صفحتك الرئيسية أو الصفحات الفرعية، لإضفاء جو من المرح، وهي متوفرة مجاناً في كثير من المواقع المذكورة في الجدول 1، لكن لا ننصحك بالإكثار منها في صفحتك، لأنها إذا استخدمت بإفراط تبطئ من سرعة تحميلها في المتصفح، وتصبح مزعجة للمستخدم.[/FONT] [FONT=Tahoma]إذ أردت أن تنشئ أو تعدل ملفات [/FONT][FONT=Tahoma]Animated GIF[/FONT][FONT=Tahoma]، يجب استخدام محررات رسوم خاصة بملفات [/FONT][FONT=Tahoma]GIF[/FONT][FONT=Tahoma] المتحركة، مثل [/FONT][FONT=Tahoma]GifShaker[/FONT][FONT=Tahoma] ([/FONT][FONT=Tahoma]www.imagelib.com/products/gifshkr.html[/FONT][FONT=Tahoma])، و[/FONT][FONT=Tahoma]Animated Screen 2.1[/FONT][FONT=Tahoma] ([/FONT][FONT=Tahoma]www.pysoft.com/downloads_fr.html[/FONT][FONT=Tahoma])، و[/FONT][FONT=Tahoma]Xara3D 2.1[/FONT][FONT=Tahoma] ([/FONT][FONT=Tahoma]www.xara.com/xara3d/download.htm[/FONT][FONT=Tahoma])، وغيرها مما يمكن أن تجده مصنفاً في الموقع [/FONT][FONT=Tahoma]www.cnet.com[/FONT][FONT=Tahoma]، أو [/FONT][FONT=Tahoma]www.zdnet.com[/FONT][FONT=Tahoma].[/FONT] [B][FONT=Tahoma]عدادات الزوار [/FONT][/B] [FONT=Tahoma]ربما لا يبدو أمراً لطيفاً، أن تقابل زوار منزلك بالقول: أنت الزائر رقم 50 منذ 1/1/1998، بدلاً من القول: أهلاً وسهلاً![/FONT] [FONT=Tahoma]لكن هذه العبارة أمر مألوف على صفحات ويب، وتوضع، عادة، على الصفحة الرئيسية للموقع بهدف إظهار مدى شعبيته (أو التفاخر بمدى شعبيته)، بالإضافة إلى أنها توفر لمدير الموقع وسيلة مباشرة لمعرفة عدد الزوار. لكن، لا يحتاج مديرو مواقع الجهات التي تملك أسماء نطاقات خاصة بها ([/FONT][FONT=Tahoma]domain name[/FONT][FONT=Tahoma]) لاستخدام عدادات الزوار هذه، إذ تتوفر لديهم أدوات أقوى توفر تحليلاً كاملاً لحالة الموقع، وتحدد عدد زواره بدون الحاجة لإظهار ذلك علناً. [/FONT] [FONT=Tahoma]تكتب معظم عدادات الزوار بلغة [/FONT][FONT=Tahoma]CGI[/FONT][FONT=Tahoma] ([/FONT][FONT=Tahoma]Common Gateway Interface[/FONT][FONT=Tahoma]) (راجع موضوع "التفاعل مع صفحات إنترنت باستخدام برامج واجهة البوابة العمومية"، المنشور في هذا العدد)، ويكتب بعضها الآخر بلغة جافا على شكل بريمجات جافا ([/FONT][FONT=Tahoma]Java Applets[/FONT][FONT=Tahoma])، ولن ندخل بالطبع، في تفاصيل برمجة العدادات، فهو خارج نطاق بحثنا، وكل ما يهمنا هو استخدام العدادات الجاهزة. سنستخدم عداداً بلغة [/FONT][FONT=Tahoma]CGI[/FONT][FONT=Tahoma]، ونترك الحديث عن عدادات برمجيات جافا للحلقة المقبلة. يختلف تنفيذ برامج [/FONT][FONT=Tahoma]CGI[/FONT][FONT=Tahoma] على المزود البعيد، عن طلب إرسال معلومات بلغة [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] الوصفية منه، ولا تسمح معظم المزودات البعيدة التي توفر المواقع المجانية بتشغيل برامج بلغة [/FONT][FONT=Tahoma]CGI[/FONT][FONT=Tahoma] خاصة بالمستخدم، لأنه أمر خطر على أمنها، ولأنه يتيح للمستخدم إمكانية التحكم بعملها، إلا أنه توجد مواقع توفر خدمة تنفيذ برنامج عدادات [/FONT][FONT=Tahoma]CGI[/FONT][FONT=Tahoma] على مزوداتها الخاصة، لعد زوار مواقع أخرى مجاناً. يتوفر في الموقع [/FONT][FONT=Tahoma]http://webcom.net/~klg/counters.html[/FONT][FONT=Tahoma]، والموقع [/FONT][FONT=Tahoma]http://webcom.net/~klg/counters.html[/FONT][FONT=Tahoma] عشرات الارتباطات المتعلقة بمواقع العدادات. ويختلف أسلوب استخدام كل منها، فبعضها يحتاج إلى إضافة بعض السطور بلغة [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] فقط، لتشغيل برنامج العداد، وأخرى يمكن نسخها ولصقها في الصفحة المعنية، ولا يمكن لذلك تقديم طريقة عامة تصلح لكل الجهات التي توفر تلك الخدمة. وسنكتفي بأن نورد مثالاً عن أحد العدادات المتوفرة مجاناً. اخترنا أن نستخدم العداد الذي يوفره الموقع [/FONT][FONT=Tahoma]http://counters.qpt.com[/FONT][FONT=Tahoma]، الذي يطلب منك تسجيل حسابك المجاني، بإدخال عنوان موقعك، وعنوان بريدك الإلكتروني، فيرسل إلى صندوق بريدك الإلكتروني رقم الحساب، وكلمة المرور، ومقطعاً من شيفرة [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] يجب أن تنسخها إلى الملف الذي ترغب أن تضع فيه العداد (وهو الملف [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma] في هذه الحالة). أظهرنا نص [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] لملف [/FONT][FONT=Tahoma]index.htm[/FONT][FONT=Tahoma]، باختيار [/FONT][FONT=Tahoma]View/HTML[/FONT][FONT=Tahoma] من قائمة برنامج [/FONT][FONT=Tahoma]Frontpage Express[/FONT][FONT=Tahoma]، ونسخنا مقطع شيفرة [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] من الرسالة الإلكترونية التي وصلتنا إلى نهاية شيفرة [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] لملف الصفحة الرئيسية، وقبل الواصفتين <[COLOR=purple]/[/COLOR][/FONT][COLOR=purple][FONT=Tahoma]body[/FONT][/COLOR][FONT=Tahoma]>، و<[COLOR=purple]/[/COLOR][/FONT][COLOR=purple][FONT=Tahoma]html[/FONT][/COLOR][FONT=Tahoma]>، أغلقنا نافذة تحرير [/FONT][FONT=Tahoma]HTML[/FONT][FONT=Tahoma] بالنقر على [/FONT][FONT=Tahoma]OK[/FONT][FONT=Tahoma]، فظهر العداد على الصفحة، فأزحناه ووسطناه في المكان المناسب. تسمح الجهة صاحبة الخدمة باختيار شكل العداد، وإعداده عبر طريقة خاصة بها مشروحة في الموقع.[/FONT] [FONT=Tahoma]بعد كل هذه التغييرات أصبحت الصفحة الرئيسية كما في الشكل 2، وربما تختلف عن الشكل الذي وصلت إليه في صفحتك. تذكر أنه يجب أن ترسل ملفات الصفحات والأزرار والرسوم المتحركة التي استخدمتهاإلى موقعك أيضاً، وأن تتأكد من أن "صحة" صفحتك على ما يرام بزيارتها وتجربة فعالياتها. [/FONT] [FONT=Tahoma]لا بد أن لديك كثيراً من التعديلات والتطويرات التي ترغب أن تنفذها على صفحتك بعد هذه المقالة، لذلك لا بد لي من أن أتركك تجرب كل شيء بنفسك، وإلى اللقاء في العدد المقبل. [/FONT] [FONT=Tahoma]جدول 1 (الأرضيات الرسومية، الأزرار، الصور المتحركة)[/FONT] [FONT=Tahoma][URL="http://www.ecn.bgu.edu/users/gas52r0/Jay"][COLOR=#003399]www.ecn.bgu.edu/users/gas52r0/Jay[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.mangus.com/"][COLOR=#003399]www.mangus.com[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.bellsnwhistles.com/"][COLOR=#003399]www.bellsnwhistles.com[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.ender-design.com/rg"][COLOR=#003399]www.ender-design.com/rg[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma]members.aol.com/dcreelma/imagesite[/FONT] [FONT=Tahoma][URL="http://www.netscape.com/assist/net_sites/bg/backgrounds.html"][COLOR=#003399]www.netscape.com/assist/net_sites/bg/backgrounds.html[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.chenowith.wasco.k12.or.us/tech/design/buttons.html"][COLOR=#003399]www.chenowith.wasco.k12.or.us/tech/design/buttons.html[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.innova.net/~goob/bits27.html"][COLOR=#003399]www.innova.net/~goob/bits27.html[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma]web.online-graphics.net[/FONT] [FONT=Tahoma][URL="http://www.free-graphics.com/"][COLOR=#003399]www.free-graphics.com[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.coolarchive.com/"][COLOR=#003399]www.coolarchive.com[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.silverpoint.com/leo/lia"][COLOR=#003399]www.silverpoint.com/leo/lia[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma][URL="http://www.animationzone.com/"][COLOR=#003399]www.animationzone.com[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma]www.fortunecity.com/boozers/dragon/28/[/FONT] [FONT=Tahoma]www.geocities.com/CollegePark/2883/[/FONT] [FONT=Tahoma][URL="http://dome.communitech.net/"][COLOR=#003399]http://dome.communitech.net[/COLOR][/URL][/FONT][FONT=Tahoma][/FONT] [FONT=Tahoma]www.webwider.com/syzone/[/FONT][/RIGHT] [CENTER][CENTER][FONT=Tahoma][/FONT][/CENTER][/CENTER] [RIGHT][FONT=Tahoma] [/FONT][/RIGHT] [/QUOTE]

التحقق