تعلم تصميم موقعك الخاص بستخدام فرونت بيج2003

[mbn]

تصميم المواقع باستخدام مايكروسوفت فرونت بيج 2003

سلسلة حلقات للمبتدئين الحلقة الأولى

يعد برنامج مايكروسوفت فرونت بيج واحداً من أشهر البرامج وأسهلها للمستخدمين تعلماً وتطبيقاً في مجال تصميم المواقع. ويسرنا في مجلة العالم الرقمي بدئاً من هذا اللقاء البدء في شرح البرنامج عبر دروس تنتهي بكم إلى تصميم مواقعكم الخاصة بشكل احترافي ان شاء الله.

قبل البدء في تشغيل البرنامج والتعامل مع مكونات برنامج مايكروسوفت فرونت بيج 2003 هناك بعض ثلاث نقاط ينبغي التطرق لها قبل البدء في تصميم الموقع وهي المحتوى والأصالة والتحديث.

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

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

التحديث المستمر للمحتويات من الضروري المحافظة على أصالة الموضوعات وإجراء التحديث المستمر لها لان التحديث يعني الحياة وعكس ذلك هو الموت. أن الانترنت اسم ارتبط بكل ما هو جديد أي أنها Live Medium وبالتالي من الضروري الحفاظ على ثقة الزوار عبر التحديث المستمر لمحتويات الموقع.

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

لا شك أن لكل موقع هدفه من هنا يجب التأكد من معرفة نوع الجمهور الذي تخاطبه من خلال الموقع. على سبيل المثال، هل الموقع الخاص بك مخصص للعملاء أم للموظفين أم للطلاب أم للأصدقاء أم للعائلة؟

وإذا كنت تريد إنشاء موقع للشركة التي تعمل بها فتأكد أن الهدف محدد وشامل ليس من قبلك بل من قبل إدارة الشركة. وبعد الفراغ من ذلك، لا بد أن يرى رئيسك نتائج عملك، أي أن يعود ذلك على الشركة بالنفع المادي أو توفير عدد معين من ساعات العمل.

حاول أن يكون هدفك بسيطًا. فيكفي أن يكون من جملتين أو فقرة قصيرة. إذا كان الهدف طويلاً، فسيعطي انطباعًا بأن على المستخدم عمل الكثير والذي قد يصرفه عن الموقع قم بزيارة هذا الموقع www. webpagesthatsuck. com يهدف هذا الموقع إلى مساعدة الناس في تصميم مواقع مفيدة ولكن بأسلوب مختلف نوعاً ما حيث يقوم هذا الموقع بعرض المواقع السيئة من حيث التصميم والمحتوى. وذلك بعرض وتحليل الأخطاء التي وقعت فيها تلك المواقع حتى يتم تفاديها من قبل الزوار.

البدء في تصميم موقع

إنشاء صفحة ويب جديدة لبدء العمل في البرنامج قم بتشغيل برنامج مايكروسوفت فرونت بيج 2003 من خلال ابدأ ثم برامج ثم مايكروسوفت فرونت بيج 2003. تظهر أمامك شاشة البرنامج.

سوف نبدأ العمل عن طريق بناء موقع باستخدام برنامج مايكروسوفت فرونت بيج 2003 والذي يشمل إنشاء مجلد الذي يتم حفظ كافة ملفات الموقع به، إضافة إلى إنشاء العديد من الصفحات داخل هذا الموقع.

من قائمة ملف، اختر جديد. ترى ظهور شاشة جزء المهام أمامك على يسر الشاشة. في جزء المهام جديد، تحت صفحة جديدة، قم بأي مما يلي:

لإنشاء صفحة ويب من صفحة فارغة، اختر صفحة فارغة

لإنشاء صفحة ويب من قالب ويب ديناميكي قمت بإنشائه، من صفحة موجودة، حدد موقع القالب ثم إنشاء جديد.

لإنشاء صفحة ويب من قالب مضمن في مايكروسوفت فرونت بيج 2003 ثم قوالب صفحة أخرى، ثم علامة التبويب الخاصة بنوع القالب الذي تريده، ثم انقر فوق القالب

سوف نختار قوالب موقع ويب ونختار التبويب عام ثم نختار منه موقع ويب ذو صفحة واحدة.

ضمن خيارات حدد موضع موقع الويب الجديد ويقصد به المكان الذي سيتم به تخزين ملفات الموقع. اضغط على مفتاح استعراض ليتم اختيار المكان الموضع.

بعد تحديد اسم الموقع ومكان الحفظ ثم الضغط على موافق ترى أن برنامج مايكروسوفت فرونت بيج 2003 قد قام بعرض ثلاثة عناصر هي مجلد خاص Private ومجلد الصور images وصفحة البداية وتحمل الاسم Index. htm.

قم بالضغط على قائمة عرض ثم التنقل .Navigation ترى أن الموقع لا يحتوي سوى صفحة واحدة هي صفحة البداية وتحمل الاسم Index. htm

اختر إدراج ثم تنقل من نوع اختر أشرطة الارتباط ثم اختيار نوع الشريط اختر شريط بالارتباطات المخصصة. ثم اضغط التالي:

تظهر شاشة نمط الشريط اختر منها ما يناسبك نقترح عليك التنقل بين المحتويات لترى تشكلية كبيرة من الأنماط حيث مختلف الأشكال والألوان. اضغط التالي بعد ذلك.

تظهر الشاشة الأخيرة وهي تحديد الاتجاه هل هو أفقي أم عمودي. اختر أفقي. ثم انهاء.

هنا تظهر شاشة خصائص شريط الارتباطات وهنا فقط قم بتحديد الصفحة الرئيسية والصفحة الأصل. ثم موافق. ترى ظهور خط في أعلى الصفحة يسمى شريط الارتباطات.

الخطوة التالية سوف نقوم بإضافة أربع صفحات إلى الموقع قيد التشييد.

قم بالضغط على قائمة عرض ثم التنقل Navigation. ترى أن الموقع لا يحتوي سوى صفحة واحدة هي صفحة البداية وتحمل الاسم Index. htm.

الآن قم بالضغط على زر الفأرة الأيمن ثم من القائمة المختصرة اختر جديد ثم صفحة. كرر هذه الخطوة أربع مرات حتى تضيف كافة الصفحات المطلوبة.

قم بتغير مسميات الصفحات وذلك على النحو التالي:

* خواطر شعرية

* مواقعي المفضلة

* السيرة الذاتية

* عن الموقع

وذلك عن طريق الضغط على كل صفحة بالزر الأيمن ثم اختيار إعادة تسمية لكل صفحة.

بعد ذلك بعرض الموقع في برنامج الاستعراض عن طريق ملف ثم المعانية في المستعرض.

حفظ صفحة ويب تلقائياً قبل معاينتها في المستعرض.

اختر ملف ثم معاينة في المستعرض، ثم تحرير قائمة المستعرض.

انقر فوق خانة الاختيار حفظ الصفحة تلقائياً قبل معاينتها.

حفظ نسخة من صفحة

ويب احتياطياً

* اختر ملف، انقر فوق حفظ باسم.

* حدد ملف النظام حيث تريد حفظ الصفحة

* في المربع اسم الملف، اكتب اسم الصفحة.

* ثم حفظ.

ويجب التأكد من حفظ العمل الذي قمنا بعمله سوياً حتى نتمكن من إكمال العمل في الموقع قيد التشييد في اللقاء القادم إن شاء الله.

الحلقة الثانية

في اللقاء السابق قمنا بتصميم موقع شخصي يحتوي على خمس صفحات وهي صفحة البداية والصفحات التالية:

* خواطر شعرية.

* مواقعي المفضلة.

* السيرة الذاتية.

* عن الموقع.

واليوم نواصل الحديث عن خطوات استكمال الموقع الخاص بنا باستخدام مايكروسوفت فرونت بيج 2003.

في البداية سنقوم بإعادة تسمية الموقع عن طريق الخطوات التالية:

من أدوات، ثم إعدادات الموقع.

نختار علامة التبويب عام.

في المربع اسم صفحة ويب، اكتب الاسم الجديد لموقع ويب وليكن (اسمك).

وإذا لم يكن عمل الدرس السابق متوفراً فيمكن الانطلاق مرة أخرى وبسرعة إلى جزء المهام، حيث يوفر جزء المهام طريقتين لإنشاء الموقع، وهما:

يمكنك النقر فوق الارتباط موقع ويب وهو ذو صفحة واحدة. سيؤدي ذلك إلى إنشاء موقع بصفحة رئيسية فارغة جاهزة لبدء العمل فيها.

يمكنك النقر فوق الارتباط قوالب موقع ويب أخرى، سيساعدك هذا في إنشاء موقع يتضمن صفحات معدة مسبقاً وصوراً وسمات تصميماً.

الخطوة التالية هي تحديد مكان الموقع المستند، هذه خطوة مهمة، وما تفعله يعتمد على اختيار موقع يستند إلى ملقم أو إلى قرص.

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

C:\My Documents\My Web Sites\MyWebSite.

عند فتح موقع والضغط على علامة التبويب موقع ويب يتم عرض أزرار طريقة العرض موقع ويب في الأسفل. كما ترى في الصورة رقم 1.

المجلدات

وفي هذا العرض يتم تحديد طريقة العرض مجلدات، تسمح لك طريقة العرض برؤية الملفات والمجلدات التي تكون موقع ويب الذي تم إنشاؤه باستخدام مايكروسوفت فرونت بيج 2003م، كما تبدو في المستعرض Explorer ويمكنك إضافة ملفات ونقلها وإعادة تسميتها وفتحها وحذفها من هذا الموضع.

موقع ويب البعيد

تستخدم طريقة العرض موقع ويب البعيد لنشر الموقع الخاص بك، بعد تحديد مكان موقع النشر، ستبدو طريقة العرض كما هي معروضة أمامك هنا عند اختيار عرض في المستعرض Explorer.

وستظهر النسخة المحلية للموقع على اليمين.

ويظهر الموقع البعيد على اليسار، وهي مفيدة في عملية نشر الموقع إلى ملقم ويب البعيد، كما أنها تساعد أيضاً في عمل نسخة احتياطية للموقع الخاص بك من خلال نشره من ملقم ويب على قرص محلي.

عرض تقارير

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

تقرير الملفات غير المرتبطة

يعرض هذا تقريراً عن الملفات غير المرتبطة بعد البحث عن أية ملفات في موقع ويب والتي ليس لها ارتباطات تشير إليها، على سبيل المثال فقد تكون أضفت صفحة جديدة أو ملفاً إلى الموقع مؤخراً، ولكنك نسيت أن توفر الارتباط حتى يمكنك الوصول إليه.

تقرير الصفحات البطيئة: يعرض هذا تقريراً عن الملفات البطيئة عن طريق البحث عن الصفحات التي ستأخذ وقتاً طويلاً في عرضها في المستعرض Explorer من قبل المستخدمين وتحميلها والاطلاع عليها.

تقرير الارتباطات التشعبية المقطوعة:

يعرض هذا تقريراً عن الارتباطات التي لا تعمل ويبحث هذا التقرير عن الارتباطات التي لا تعمل.

للعمل على ملف مفرد

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

عندما يتم فتح الصفحة يتم الوصول إلى طرق العرض المذكورة من خلال أزرار في الأسفل. لاحظ أنه عندما تكون لديك صفحة مفتوحة في طريقة العرض (الصفحة)، لا تتوافر طرق عرض موقع ويب الأخرى في الأسفل. (بالرغم من أن هذه الطرق لاتزال متوفرة في القائمة عرض أو في علامة التبويب موقع ويب عند الرغبة في التبديل بينها).

طريقة عرض التصميم

تسمح لك طريقة العرض هذه بتصميم تخطيط الصفحة، أو إدخال نص، أو إدراج صور أو ارتباطات تشعبية، وغير ذلك وأنت تراها أمامك.

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

إضافة شعار للموقع

في طريقة عرض الصفحة قم بوضع نقطة الإدراج في المكان الذي تريد إضافة شعار الصفحة فيه، ثم اختر إدراج، انقر فوق شعار صفحة.

ترى ظهور صفحة إدراج الشعار والذي يمكن أن يكون نصاً أو صورة.

في مربع الحوار خصائص شعار الصفحة، اختر (نص).

ثم في المربع نص شعار الصفحة، اكتب النص الذي تريد عرضه في شعار الصفحة، ثم موافق.

ثم بواسطة زر الفارة الأيمن اضغط على شعار الصفحة، ثم اختر خط ثم اختار الخصائص التي تريدها.

عرض نص شعار الصفحة كصورة

* لاستخدام صورة كشعار للصفحة يجب أن تستخدم الصفحة سمة والسمة كما سيتم شرحها لاحقا يمكن أن يتم اختيارها من خلال تنسيق ثم سمة.

* السمة هي مجموعة متكاملة من عناصر التصميم وأنظمة الألوان ويمكن تطبيقها على صفحات المواقع لإعطائها شكلاً احترافياً وإضفاء مظهر جميل ومتناسق على الصفحات.

* يمكنك تطبيق سمة على صفحة واحدة أو أكثر أو على موقع ويب بالكامل. إذا قمت بتطبيق سمة على كافة الصفحات ستصبح هذه السمة هي السمة الافتراضية للموقع. وذلك حتى تتمكن من عرض الصورة بعد اختيار السمة. وتطبيقها عن طريق:

* من قائمة تنسيق، انقر فوق سمة.

* في جزء المهام سمة، اختار السمة التي تريدها. ثم حدد طريقة التطبيق.

* في مربع الحوار خصائص شعار الصفحة، انقر فوق صورة.

* في المربع نص شعار الصفحة، اكتب النص الذي تريد عرضه في شعار الصفحة، ثم انقر فوق موافق.

إضافة رسم من ملف

من إدراج، ثم صورة، ثم من ملف.

حدد موقع الملف الذي تريد إضافته، ثم إدراج.

إضافة قصاصات فنية من Clip Organizer:

من إدراج، ثم صورة، ثم قصاصات فنية.

في جزء المهام قصاصات فنية، في المربع البحث عن، اكتب كلمة أو عبارة تصف القصاصة التي تريدها.

إذا أردت وضع حد للبحث عن مجموعة معينة من القصاصات الفنية أو نوع ملف، قم بما يلي:

* من القائمة البحث في، قم بإلغاء تحديد خانات الاختيار المجاورة للمجموعات التي لا تريد البحث فيها.

* من القائمة يجب أن تكون النتائج، حدد أنواع الملفات التي تريدها

الدرس الثالث

كما هو معروف للكثيرين عندما نخطط لعمل موقع فإننا سنحتاج إلى أدوات لتطوير الموقع وهذا ما يتم شرحه من خلال دروس تعلم تصميم المواقع باستخدام مايكروسوفت فرونت بيج 2003، وأرجو أن نوفق في الطرح وتقديم ما يجعلكم قادرين على تصميم مواقع خاصة بشكل احترافي.

تنسيق النصوص والفقرات

إضافة إلى أدوات التطوير سوف يحتاج الموقع الى مساحة تخزينية لنشر الموقع إليها بعد الانتهاء من تصميمه. حيث عندما نقوم بنشر الموقع فإننا في الحقيقة نقوم بنسخ كافة الملفات والمجلدات التي يتألف منها الموقع الى تلك المساحة المجانية. والهدف من نشر الموقع كما هو معلوم هو أن نجعل الزوار قادرين على الوصول إليه والاستفادة من خدماته. من هنا ومن خلال هذه الدروس ستتم الإشارة، إن شاء الله، الى الكثير من المواقع التي تقدم لكم المساحة المجانية الكافية ليتم نسخ الملفات إليها.

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

يمكن تغيير الخط والحجم والأسلوب واللون والتباعد والوضع العمودي للنص، وإضافة تأثيرات مثل التسطير إضافة الى التباعد والمسافة البادئة، وإضافة تعدادات نقطية ورقمية، وتعيين المحاذاة وغير ذلك بمجرد تحديد النص ومن ثم اختيار الرمز المناسب للعملية المطلوبة من شريط أدوات التنسيق.

في حالة عدم ظهور شريط أدوات التنسيق يمكن إظهاره باتباع الخطوات التالية:

من خلال زر الفأرة الأيمن يمكن الضغط فوق أي شريط أدوات، ثم اختيار شريط أدوات التنسيق.

إذا لم تشاهد شريط أدوات التنسيق في القائمة المختصرة، اختر تخصيصا، ثم فوق علامة التبويب أشرطة الأدوات، ثم فوق شريط الأدوات المطلوب في القائمة أشرطة الأدوات.

لنبدأ العمل في الموقع السابق ولكن هذه المرة في صفحة جديدة نقوم بإضافتها باتباع الخطوات التالية:

من قائمة ملف، اختر جديد.

ترى ظهور شاشة جزء المهام أمامك على يسر الشاشة في جزء المهام جديد، تحت صفحة جديدة، اختر إنشاء صفحة ويب من صفحة فارغة، اختر صفحة فارغة. صورة (1).

تتضمن الخصائص التي يمكن تنسيقها في النص الموضح في الصور الآتي:

الخط وحجمه حيث يمكن إجراء عملية التنسيق في النص والتي تشمل المائل والتسطير والغامق إضافة الى موضع النص واللون.

وضع النص من حيث التباعد بين الأسطر في الفقرة وحدود حول النص.

مسافة بادئة قبل السطر والفقرة والقوائم الرقمية أو النقطية أو متعددة المستويات.

تظليل سطر أو فقرة بأكملها.

كل ذلك متاح بمجرد تحديد العناصر المطلوبة ومن ثم تحديد طبيعة التنسيق المطلوبة.

لا تختلف طرق تحديد أي مقدار من النص سواء كان كلمة او عدة كلمات او فقرة او صفحة كاملة في برنامج مايكروسوفت فرونت بيج 2003 عن أي برنامج من برامج الأوفيس أي لتحديد أي مقدار من النص قم بالسحب فوق النص. ولتحديد كلمة مثلا تتم عن طريق النقر المزدوج فوق الكلمة.

ولتحديد سطر كاملا من نص تتم عن طريق الإشارة إلى يسار السطر حتى يتغير المؤشر إلى سهم يشير إلى اليمين، ثم القيام بالنقر.

ولتحديد فقرة بالكامل قم بالإشارة إلى يسار الفقرة حتى يتغير المؤشر إلى سهم يشير إلى اليمين، ثم انقر نقراً مزدوجاً.

أو انقر نقراً ثلاثياً في أي مكان في الفقرة. ولتحديد عدة فقرات قم بالإشارة إلى يسار الفقرات حتى يتغير المؤشر إلى سهم يشير إلى اليمين، ثم انقر نقراً مزدوجاً وقم بالسحب للأعلى وللأسفل.

مع ضرورة التأكد أن طريقة العرض الصفحة في وضع تصميم.

كما يمكن أيضا إجراء عمليات التنسيق عبر القوائم المختصرة وذلك من خلال تحدد النص المطلوب تنسيقه، ثم بواسطة زر الفأرة الأيمن، ثم اختيار طبيعة التنسيق فمثلا لتغير الخط نختار خطاً من القائمة المختصرة.

ثم اختيار علامة التبويب الخط.

ثم تحديد الخصائص المطلوبة ثم موافق.

مع ضرورة التأكد أن طريقة عرض الصفحة في وضع تصميم.

يمكن التراجع عن تنسيق تم تطبيقه على نص معين:

مع ضرورة التأكد أن طريقة العرض الصفحة في وضع تصميم.

حدد النص الذي تريد إزالة التنسيق منه.

من القائمة تنسيق، اختر إزالة التنسيق.

يمكن إجراء تعيين محاذاة للفقرة وذلك بعد تحديدها ومن ثم من خلال شريط أدوات التنسيق، يمكن إجراء محاذاة لليسار او توسيط او محاذاة لليمين او ضبط.

كما يمكن تمييز نص عن طريق تحديد الحرف أو الكلمة أو النص الذي تريد تمييزه بلون معين ثم من شريط أدوات التنسيق اختيار السهم الخاص بلون التمييز، ثم حدد اللون الذي تريده لترى أن البرنامج قد قام بعمل المطلوب.

يمكن أيضا تظليل نص بلون عن طريق تحديد النص الذي تريد تظليله بلون.

ثم نختار تنسيقا من شريط الأوامر ثم حدود وتظليل ثم اختيار علامة التبويب تظليل ثم تعيين لون خلفية للنص المحدد عن طريق اختيار لون في المربع لون الخلفية.

كذلك تعيين لون للنص المحدد عن طريق تحديد لون في المربع لون المقدمة.

يمكن إنشاء قائمة نقطية عن طريق الضغط على تنسيق، ثم تعداد نقطي وتعداد رقمي ثم علامة التبويب تعداد نقطي عادي، وانقر فوق التعدادات النقطية المراد استخدامها، ثم انقر فوق موافق.

اكتب النص إلى جانب التعداد النقطي، ثم اضغط ENTER.

وهكذا حتى تنتهي من النص المطلوب وضعه في تعداد نقطي.

وبنفس الطريقة يمكن إنشاء قائمة رقمية عن الضغط على تنسيق، ثم تعداد نقطي وتعداد رقمي ثم علامة التبويب تعداد نقطي عادي، واختر التعدادات الرقمية الذي يحتوي على نمط الأرقام أو الأحرف المراد استخدامها، ثم فوق موافق.

اكتب النص إلى جانب التعداد النقطي، ثم اضغط ENTER.

لإنهاء القائمة، اضغط ENTER مرة أخرى.

يمكن إنشاء قائمة نقطية باستخدام صور عن طريق الضغط على تنسيق، ثم تعداد نقطي وتعداد رقمي ثم علامة التبويب صور نقطية، ثم انقر فوق تحديد الصورة.

حدد موقع ملف الصور الذي تريد استخدامه كتعداد نقطي وانقر فوقه، وانقر فوق فتح، ثم انقر فوق موافق.

ثم اكتب النص إلى جانب التعداد النقطي، ثم اضغط ENTER.

لتعيين تباعد الأسطر حدد فقرة واحدة أو أكثر من قائمة التنسيق، انقر فوق فقرة.

تحت تباعد، عين الخصائص التي تريدها.

الدرس الرابع

كما هو معروف للكثيرين عندما نخطط لعمل موقع فإننا سنحتاج إلى أدوات لتطوير الموقع وهذا ما يتم شرحه من خلال دروس تعلم تصميم المواقع باستخدام مايكروسوفت فرونت بيج 2003، وأرجو أن نوفق في الطرح وتقديم ما يجعلكم قادرين على تصميم مواقع خاصة بشكل احترافي.

استخدام الرسومات والأصوات

لا شك إن الصورة تساوي ألف كلمة، وبرنامج مايكروسوفت فرونت بيج 2003 يوفر لكم الكثير من الإمكانيات لجعل صفحات مواقعكم الشخصية تبدو أكثر احترافية من خلال استخدام الكائنات الرسومية.. والمقصود بالكائنات الرسومية تلك الكائنات الفنية والتي يمكن أن تكون أعمالاً فنية أو صور أو WordArt.. علماً بأنه لا توجد أي قيود على الأماكن التي يمكن أن تستخدم بها تلك الرسومات، حيث يمكن أن تكون شعاراً في أعلى الصفحة الرئيسية Home Page أو خلفية في كل صفحة من صفحات الموقع.. كما يمكن أن تكون الرسومات أيضاً مفيدة لعناصر مثل أزرار التنقل، والنقاط الفعالة، ومخططات الصور.

في البداية هناك معلومات أساسية ينبغي معرفتها قبل البدء في التعامل مع هذا الكائنات الرسومية، وذلك لأن الهدف من إضافتها يجب أن يكون وسيلة لتجميل الموقع وليس غاية استعراضية، من هنا في حالة عدم التأكد من الاستخدام التنسيق الصحيح والحجم الصحيح يمكن أن تتحول علمية تصفح موقعك الى كابوس لدى الزوار وتنتهي بخروجهم من الموقع!!.

يجب أن تحدد كيفية تنسيق ملف الرسومات مع ضرورة البعد عن الملفات ذات الأحجام الضخمة جداً بشكل يحول دون تحميله بسرعة، لذا فإن أول شيء يجب عمله هو تقليل حجم الملف عن طريق ضغطه.. توجد العديد من أشكال التنسيق لملفات الرسومات نذكر منها:

ملفات الرسومات GIF

تنسيق ملف رسومي الملحق (gif) يستخدم لعرض الرسومات بالألوان المفهرسة.. ويعتمد 256 لوناً على الأكثر ويستخدم نظاماً للضغط دون فقدان، بمعنى أنه لا تفقد بيانات من الصورة عند ضغط الملف وبالتالي تقليل حجمه. وهذا هو الهدف من حسن اختيار التنسيق المناسب والذي سوف يؤثر حتماً في عملية تصفح الموقع.

الاستخدام الأمثل للرسومات في تنسيق GIF هو عند استخدامها مع صور تحتوي على ألوان مختلفة أقل، مثل الرسومات الخطية وصور الأبيض والأسود. إحدى ميزات ضغط تنسيق GIF هو أنه يمكنك جعله متشابكاً لتحسين أداء المستعرض عند التحميل.. يظهر تنسيق GIF المتشابك في البداية بدقة ضعيفة ثم تتحسن الدقة إلى أن تظهر الصورة بأكملها.. يسمح ذلك للمشاهد بالتعرف على الشكل الذي يبدو عليه الرسم في أثناء انتظار ظهوره.. هناك جانب آخر مفيد للرسومات بتنسيق GIF هو أنه يمكنك جعل خلفية GIF شفافة، بحيث يمكنك مشاهدة لون خلفية إطار المستعرض الموجود به.

ملفات الرسومات JPEG

تنسيق ملف رسومي الملحق (jpg) معتمد من قبل العديد من برامج استعراض شبكة الإنترنت المطوّرة من أجل ضغط الصور الفوتوغرافية وتخزينها.. ويُفضّل استخدامه في الصور ذات الألوان المتعددة، مثل الصور الفوتوغرافية الممسوحة ضوئياً.. يتم استخدام تنسيق JPEGبشكل شائع في الرسومات الفوتوغرافية الواقعية التي تحتوي على آلاف أو ملايين الألوان.. تعد رسومات JPEG مفيدة لأنه يمكنك التحكم في ضغط ملف بتغيير مستوى جودة الرسم. كلما انخفض مستوى الجودة زادت إمكانية ضغط الملف، وبالتالي يقل حجم الملف وهذا هو الهدف من حسن اختيار التنسيق المناسب والذي سوف يؤثر حتماً في عملية تصفح الموقع.

تتيح الرسومات بتنسيق JPEG مستوى كبيراً من الضغط لا يسمح به بديله GIF، كما يسمح بتمكين أوقات تحميل أسرع للرسومات الضخمة.. على الرغم من ذلك، يمكن للمستعرض تحميل رسم بتنسيق JPEG فقط، من الصف العلوي حتى الصف السفلي.

ملفات الرسومات PNG

تنسيق ملف رسومي معتمد من قبل بعض برامج استعراض شبكة الإنترنت. ويعتمد PNG شفافية متغيرة للصور ويتحكم بسطوع الصورة على أجهزة كمبيوتر مختلفة.. يعد تنسيق PNG هو التنسيق البديل ل GIF و JPEG والذي يدعم شفافية الرسومات التي تحتوي على الآلاف والملايين من الألوان.. لا يمكن لبعض برامج الاستعراض عرض الرسومات بتنسيق PNG بدون كائنات إضافية خاصة.

* فيما يلي أنواع تنسيقات PNG التي يمكنك الاختيار من بينها:

يعد تنسيق PNG8 مشابهاً لتنسيق GIF إلا أنه يقدم أفضل دعم للألوان 8بت.. كما يقوم بضغط مناطق الألوان المتصلة بكفاءة مع الاحتفاظ بأدق التفاصيل مثل رسم الخطوط، أو الشعارات، أو الرسومات التوضيحية التي تتفق مع النوع.. هذا التنسيق ليس شائعاً ولا تدعمه كافة برامج الاستعراض.

يعد كذلك تنسيق PNG24 مشابهاً لتنسيق GIF ويدعم الألوان 24بت.. مثل تنسيق JPEG، يحتفظ تنسيق PNG24 بنطاق واسع وتنويعات متعددة في السطوع والتدرج الموجود في الصور.. ومثل تنسيقي GIF و PNG8، يحتفظ تنسيق PNG24 بأدق التفاصيل، مثل رسم الخطوط، أو الشعارات، أو الرسومات التوضيحية التي تتفق مع هذا النوع.. هذا التنسيق ليس شائعاً ولا تدعمه كافة برامج الاستعراض.

أنواع أخرى من تنسيقات الملفات

يمكنك أيضاً إضافة رسومات في تنسيقات الملفات التالية:

BMP تنسيق الصورة النقطية الأصلي في بيئة صورة مكونة من سلسلة من النقاط الصغيرة وتدعم الصور حتى 24 بت.

WMF تنسيق Microsoft Windows Metafile. ويدعم بيانات الصور النقطية والبيانات الموجهة.

إضافة صورة كخلفية للصفحة

بواسطة زر الفأرة الأيمن اضغط فوق الصفحة ثم اختر خصائص الصفحة من القائمة المختصرة.. ثم علامة التبويب تنسيق.

حدد خانة الاختيار صورة الخلفية، ثم استعراض.

حدد الملف الذي يحتوي صورة الخلفية التي تريدها ثم اختر الصورة بالضغط عليها ثم فتح.

إضافة عناوين من معرض وورد WordArt

يعد WordArt معرضاً للكثير من النصوص التي يمكن إضافتها إلى أي صفحة من صفحات الموقع.. ويمكن عمل ذلك باتباع الخطوات التالية:

قم بعرض شريط أدوات WordArt.. وذلك بالضغط على زر الفأرة الأيمن على أي شريط أدوات ثم قم بالضغط على WordArt .

بعد ظهور الشريط اختر إدراج WordArt .

ترى ظهور المعرض اختر النمط WordArt المناسب.

في مربع الحوار تحرير نص WordArt، اكتب النص الذي تريده.

إضافة ملف وسائط متعددة

أو صورة

اختر إدراج ثم صورة، ثم اختر قصاصة فنية.

في أعلى جزء المهام اختر انتقال ليتم البحث عن ملفات الوسائط.

في حالة معرفة موضع الملف يمكن الانتقال إليه مباشرة.

في حالة التعرف على اسم الملف يمكن الضغط عليه لتتم عملية إضافته مباشرة إلى صفحة الموقع.

إضافة الصوت

يمكن إضافة صوت إلى الموقع من خلال الخطوات التالية:

بواسطة زر الفأرة الأيمن يتم الضغط على الصفحة، ثم اختيار خصائص الصفحة من القائمة المختصرة.

من علامة التبويب عام، تحت صوت في الخلفية، حدد موقع ملف الصوت الذي تريده ثم اختر فتح.

لتشغيل الصوت باستمرار، حدد خانة الاختيار على الدوام.. ولتشغيل الصوت لعدد محدد من المرات، قم بإلغاء تحديد خانة الاختيار على الدوام، ثم حدد أو اكتب عدد المرات الذي تريد تشغيل الصوت في مربع التكرار.

الدرس الخامس

كما هو معروف للكثيرين عندما نخطط لعمل موقع فإننا سنحتاج إلى أدوات لتطوير الموقع وهذا ما يتم شرحه من خلال دروس تعلم تصميم المواقع باستخدام مايكروسوفت فرونت بيج 2003، وأرجو أن نوفق في الطرح وتقديم ما يجعلكم قادرين على تصميم مواقع خاصة بشكل احترافي.

استخدام الرسومات والصور

تغيير تنسيق ملف الصور

تطرق الحديث في الدرس السابق (الرابع) الى موضوع تحديد تنسيق ملف الرسومات كما تم التأكيد على ضرورة البعد عن الملفات ذات الأحجام الضخمة جداً كما تطرق الحديث إلى أشكال التنسيق لملفات الرسومات.

وفي بداية هذا الدرس نتطرق الى موضوع تغيير رسم إلى تنسيق مختلف وذلك استنادا الى الحاجة التي تدعو الى مثل ذلك. وتتم عملية تغيير التنسيق باتباع الخطوات التالية:

بواسطة زر الفأرة الأيمن فوق الرسم، ثم اختر تغيير نوع ملف الصورة من القائمة المختصرة. اختر تنسيق الملف الذي تريده.

حيث تتوافر الخيارات:

ملفات الرسومات GIF

ملفات الرسومات JPEG

ملفات الرسومات PNG

ثم تحت إعدادات، حدد الخيارات التي تريدها.

ثم الضغط على موافق لتتم عملية تغيير التنسيق الخاص بالصورة.

تحديد موضع الصورة (المحاذاة)

بواسطة وضع زر الفأرة الأيمن فوق الرسم ثم اختر خصائص الصورة من القائمة المختصرة.

اختر علامة التبويب المظهر، ثم قم بعمل أي مما يلي:

تحت نمط الالتفاف، اختر نمط الالتفاف وانقر فوق الخيار الذي تريده. حيث تتوافر خيارات ثلاثة بلا ويسار ويمين. وبمجرد اختيار نمط الالتفاف يتم التغيير إليه حول النص.

وللتخطيط، في مربع المحاذاة، اختر فوق أحد الخيارات لتحديد كيفية محاذاة الرسم في الصفحة.

وتحت التخطيط، في المربع ذي العنوان (تباعد أفقي) اكتب رقماً بالبكسل أو حدد عدد البكسل ليحدد المسافة التي تريدها على جانبي الرسم الأيمن والأيسر.

وتحت التخطيط، في المربع ذي العنوان (تباعد عمودي) اكتب رقماً بالبكسل أو حدد عدد البكسل الذي تريده في أعلى الرسم أو أدناه.

ولتغيير حجم الرسم وتحت المربع ذي العنوان (الحجم) حدد خانة الاختيار لتحديد الحجم.

في المربعين الارتفاع والعرض، اكتب القيم التي تريدها أو حددها بالبكسل أو بالنسبة المئوية.

لتحديد ما إذا كنت تريد ضبط نسبة العرض إلى الارتفاع في الرسم بعد تغيير حجمه، حدد خانة الاختيار المحافظة على نسبة العرض إلى الارتفاع أو قم بإلغاء تحديدها.

لإعادة تشكيل الرسم وفقاً لحجمه الجديد، في الركن السفلي الأيمن من الرسم، اختر فوق إجراءات الصورة، ثم حدد إعادة تشكيل الصورة لتطابق الحجم.

إضافة نص بدلاً من الصورة

يمكن أن يظهر النص بدلاً من الصور بناء على المستعرض، أو أثناء عملية التحميل أو عندما يتعذر العثور عليه، أو عندما يقوم زائر الموقع بتحريك المؤشر فوق الصور. ولوضع نص في أي من هذه الحالات اتبع الخطوات التالية:

بواسطة المفتاح الأيمن للفأرة حدد فوق الرسم ثم اختر خصائص الصورة من القائمة المختصرة.

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

تحديد نسخة للصورة

منخفضة الدقة

بواسطة المفتاح الأيمن للفأرة فوق الصورة ثم اختر خصائص الصورة من القائمة المختصرة.

اختر علامة التبويب عام ثم تحت تمثيل بديل، في المربع دقة أقل، اكتب اسم الملف للصورة المنخفضة الدقة، أو اختر استعراضا لتحديد موقع الملف على إحدى وسائط التخزين.

إنشاء نسخة مصغرة تلقائياً

يمكن إنشاء نسخة أخرى من الصورة الموجودة في الموقع بحيث تكون الصورة الظاهرة على صفحات الموقع صغيرة قابلة للتكثير بمجرد الضغط عليها بزر الفأرة.

اختر الصورة ثم اضغط بواسطة الزر الأيسر للفأرة.

في شريط الأدوات صور، اختر فوق رمز تصغير تلقائي، او عن طريق:

زر الفأرة الأيمن فوق الصورة ثم اختر (صورة مصغرة تلقائية).

حيث يتم إنشاء نسخة من الملف قابلة للتكبير الى الوضع الطبيعي بمجرد الضغط عليها.

تغيير لون الظل

حدد الصورة التي ترغب في إضافة ظل لها.

على شريط الأدوات رسم، اختر فوق نمط الظل، ثم فوق إعدادات الظل.

على أدوات إعدادات الظل، اختر فوق السهم بجانب لون الظل.

لإعادة لون الظل إلى اللون الافتراضي، اختر تلقائي.

لتغيير اللون إلى لون موجود في نظام الألوان، اختر فوق أحد الألوان ضمن تلقائي.

لتغيير اللون إلى لون غير موجود في نظام الألوان، اختر ألوان إضافية للظل.

اختر اللون المطلوب في التبويب قياسي، أو اختر علامة التبويب مخصص لمزج اللون الخاص بك، ثم اختر موافق.

تغيير لون تأثير ثلاثي الأبعاد

حدد الكائن الرسومي الذي تريد تغييره.

على شريط الأدوات رسم، اختر فوق نمط ثلاثي الأبعاد، ثم إعدادات ثلاثية الأبعاد.

على شريط الأدوات إعدادات ثلاثية الأبعاد، اختر السهم إلى جانب لون ثلاثي الأبعاد.

نفّذ أحد الإجراءات التالية:

لإعادة لون ثلاثي الأبعاد إلى اللون الافتراضي، اختر تلقائي.

لتغيير اللون إلى لون موجود في نظام الألوان، اختر أحد الألوان ضمن تلقائي.

لتغيير اللون إلى لون غير موجود في نظام الألوان، اختر ألوانا ثلاثية الأبعاد إضافية.

اختر اللون الذي تريده في التبويب قياسي، أو اختر علامة التبويب مخصص لمزج اللون الخاص بك، ثم موافق.

إضافة تأثير حفر أو زخرفة

إلى شكل أو إزالته منه

يمكن إضافة تأثير حفر او زخرفة الى شكل عن طريق الخطوات التالية:

حدد الشكل التلقائي الذي تريد إضافة تأثير إليه.

على شريط الأدوات رسم، اختر فوق نمط الظل.

لإضافة تأثير زخرفة، اختر فوق نمط الظل 17

لإضافة تأثير حفر، اختر فوق نمط الظل 18

لإزالة تأثير، اختر فوق بلا ظل.

إضافة الأزرار التبادلية

يمكن إضافة الأزرار التبادلية عن طريق الخطوات التالية:

تحديد الموضع المراد إدراج زر التبديل به. ثم اختيار الأمر إدراج، ثم زر تبادلي.

من علامة التبويب زر، في القائمة أزرار، اختر نمط الزر.

وبداخل المربع (النص) اكتب النص الذي تريد ظهوره على الزر.

بجوار المربع (الارتباط) اختر استعراض. او حدد موقع الملف أو URL مثل عنوان مجلة العالم الرقمي http://www.aljazirah.com.sa/digimag ثم موافق.

قم بحفظ الملف ثم معاينة في المستعرض.

تعيين الخصائص للأزرار التبادلية

بواسطة زر الماوس الأيمن فوق الزر التبادلي الذي تريد تعيين الخصائص له، ثم اختر خصائص الزر من القائمة المختصرة.

من علامة التبويب الخط، حدد خصائص الخط التي تريدها.

من علامة التبويب الصورة، حدد الصورة المطلوبة للزر.

الخلفية من علامة التبويب الصورة

قم بأي مما يلي:

لتطابق خلفية الزر مع صفحة ويب ذات خلفية متواصلة، اختر جعل الزر صورة بتنسيق JPEG واستخدم لون الخلفية هذا، واختر السهم الموجود على القائمة، ثم اختر اللون الذي يطابق صفحة ويب.

لتطابق خلفية الزر لصفحة ويب ذات خلفيات متنوعة، اختر جعل الزر صورة بتنسيق GIF واستخدام خلفية شفافة.

تعيين الحجم من علامة التبويب الصورة، لتعيين ارتفاع الزر وعرضه، من المربعين الارتفاع والعرض، اكتب القيم التي تريدها بالبكسل أو حددها.

للاحتفاظ بنسبة عرض الزر إلى ارتفاعه، حدد خانة الاختيار المحافظة على التناسب.

الدرس السادس

التعامل مع معرض للصور الفوتوغرافية

كما هو معروف للكثيرين عندما نخطط لعمل موقع فإننا سنحتاج إلى أدوات لتطوير الموقع وهذا ما يتم شرحه من خلال دروس تعلم تصميم المواقع باستخدام مايكروسوفت فرونت بيج 2003، وأرجو أن نوفق في الطرح وتقديم ما يجعلكم قادرين على تصميم مواقع خاصة بشكل احترافي.

ربط الطابع الزمني بالموقع

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

حدد الموضع حيث تريد إضافة الشاشة الاسمية، أو اكتب نصاً ثم حدده.

اختر إدراج ثمWeb Component.

تحت نوع المكون، حدد فوق تأثيرات حيوية.

تحت اختيار تأثير، اختر شاشة اسمية.

عين الخصائص التي تريدها للشاشة الاسمية.

يمكن تغير خصائص النص أو الشاشة الاسمية عن طريق زر الفأرة الأيمن فوق الشاشة الاسمية التي ترغب في تعيين خصائص لها، ثم اختر خصائص الشاشة الاسمية من القائمة المختصرة.عين الخصائص التي تريدها. وكذلك الحذف يمكن اختيار الشاشة الاسمية بواسطة الفأرة ثم الضغط على مفتاح حذفDELETE.

إضافة نموذج بحث

يمكن أن يضاف نموج للبحث وذلك ليقدم خدمة للزوار للبحث عن المعلومات كما تفعل الكثير من أدوات البحث المعروفة وذلك باتباع الخطوات التالية:

حدد الموضع حيث تريد إضافة نموج للبحث ثم اختر إدراج ثم Web Component.

اختر البحث عن الويب ثم نوع البحث (ويب الحالي) ثم موافق.

إضافة صفحة خاصة بالبحث

يمكن أن يضاف صفحة منفصلة للبحث وذلك لتقدم خدمة للزوار للبحث عن المعلومات كما تفعل الكثير من أدوات البحث المعروف وذلك باتباع الخطوات التالية :

من ملف اختر جديد. ترى ظهور شاشة جزء المهام جديد ثم تحت صفحة جديدة ثم قوالب صفحة أخرى.

ثم اختر صفحة بحث عن طريق الضغط عليها.

قم بتغيير الصفحة لتناسب متطلباتك من حيث الإعدادات والعناصر التي تريدها.

إضافة عداد دخول

يقوم عداد الدخول بتسجيل عدد الزيارات التي تمت إلى الصفحة وعرض هذا العدد.

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

حدد الموضع الذي ترغب وضع عداد الدخول (الزوار) ثم

من القائمة إدراج، انقر فوق Web Component. ثم تحت نوع المكون، اختر عداد دخول.

قم بأحد الإجراءات التالية:

اختيار نمط عداد موجود

تحت اختيار نمط العداد، اختر أحد أنماط العدادات. ثم موافق

لتعيين العداد إلى رقم معين، حدد المربع إعادة تعيين العداد إلى، ثم اكتب الرقم.

إضافة معارض الصور

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

يوفر برنامج مايكروسوفت فرونت بيج 2003 أربعة تخطيطات مختلفة يمكنك استخدامها لترتيب الرسومات.

إضافة معرض للصور الفوتوغرافية

يمكن إضافة معرض للصور الفوتوغرافية عن طريق اتباع الخطوات التالية:

حدد الموضع على إحدى صفحات الموقع الذي ترغب وضع معرض صور فوتوغرافية به ثم اختر إدراج ثم اختر Web Component.

في الجزء الأيمن اختر معرض الصور الفوتوغرافية. من القائمة اختيار خيار معرض الصور حدد التخطيط الذي تريده. ثم إنهاء.

لإضافة صورة إلى معرض الصور اختر إضافة.

إضافة صورة من ملف

اختر صور من ملفات. ثم حدد موقع الملف الذي تريد إضافته ثم فتح. لتتم عملية إضافة ذلك الملف الى ملفات المعرض.

يمكن تحديد أكثر من رسم، اضغط مع الاستمرار في الضغط علىCTRL وحدد الرسومات التي تريدها.

لإعادة ترتيب الصور، حدد اسم الصورة، ثم اضغط فوق تحريك لأعلى أو تحريك لأسفل.

تعيير حجم التصغير

في معرض صور

حدد المعرض بواسطة الزر الأيمن للفأرة ثم من القائمة المختصرة اختر خصائص معرض الصور، ثم علامة التبويب صور

اختر الصورة التي تريد تغيير حجمها.

تحت حجم المصغر، حدد عرضا وارتفاعا جديدين بالبكسل.

إزالة صورة من معرض الصور

حدد المعرض بواسطة الزر الأيمن للفأرة ثم من القائمة المختصرة اختر خصائص معرض الصور، ثم علامة التبويب صور. ثم حدد الصورة، ثم إزالة.

إضافة ملف فيديو

حدد الموضع على إحدى صفحات الموقع والذي ترغب وضع إدراج ملف فيديو به ثم اختر إدراج، ثم صورة، ثم ملف فيديو.

حدد موقع ملف الفيديو بالضغط عليه ثم اختر فتح.

تطبيق سمة جديدة على الصفحة الحالية بعد أن أضفنا الكثير من العناصر الى الصفحة التي تم إنشاؤها

في هذا الدرس دعنا نقوم بالعودة الى درس سابق ونحاول أن نتذكر كيفية تطبيق سمة من السمات الجاهزة في برنامج مايكروسوفت فرونت بيج 2003 وذلك باتباع الخطوات التالية:

اختر تنسيق ثم سمة. ترى ظهور كافة السمات الجاهزة وهي عبارة عن تصاميم تم إعدادها من قبل الفريق الذي طور نظام مايكروسوفت فرونت بيج 2003. في جزء المهام سمة.

اختر السمة التي تريدها.

ربط الطابع الزمني بالموقع

كما سبق القول إن التحديث المستمر للمحتويات يعطي الزوار انطباعا بأن محتويات الموقع تستحق التصديق والاعتماد عليها. وربط الزمن مع محتويات الموقع هي إحدى الوسائل التي تساعد الزوار على ان الموقع دائم التحديث. من المعروف أن الطابع الزمني في البرنامج يعرض تلقائيا وقت إنشاء الصفحة وآخر التغييرات التي أجريت عليها أو تاريخ حدوث ذلك أو كليهما. على سبيل المثال، يسمح الطابع الزمني لزائري الموقع بمعرفة ما إذا كانت المعلومات الموجودة في الموقع قد تم تغييرها منذ آخر زيارة لهم أم لا.

وتتم عملية الربط بين الزمن والمحتوى عن طريق إضافة عناصر الزمن الى محتويات الموقع وجعل عمليات التحديث لتلك المحتويات يتم تلقائيا وذلك عن طريق الخطوات التالية:

اختر إدراج ثم اضغط فوق التاريخ والوقت.

من الشاشة الخاصة بالوقت والتاريخ حدد نوع الطابع الزمني المراد عرضه.

حدد تنسيقاً للتاريخ وآخر للوقت مع ملاحظة أن البرنامج يعتمد على نظام النوافذ ويتيح إمكانية استخدام التاريخ الهجري أو التاريخ الميلادي.

حفظ العمل

في كل مرة تقوم بها بالعمل نؤكد على ضرورة إجراء عمليات الحفظ وذلك عن طريق

اختر ملف، انقر فوق حفظ باسم.

حدد ملف النظام حيث تريد حفظ الصفحة.

في المربع اسم الملف، اكتب اسم الصفحة.

ثم حفظ.

حفظ العمل تلقائياً

يمكن جعل البرنامج يقوم بعملية الحفظ التلقائي للعمل عن طريق الخطوات التالية:

من ملف ثم معاينة في المستعرض، ثم تحرير قائمة المستعرض.

حدد خانة الاختيار حفظ الصفحة تلقائياً قبل معاينتها.

الدرس السابع

كما هو معروف للكثيرين عندما نخطط لعمل موقع فإننا سنحتاج إلى أدوات لتطوير الموقع وهذا ما يتم شرحه من خلال دروس تعلم تصميم المواقع باستخدام مايكروسوفت فرونت بيج 2003، وأرجو أن نوفق في الطرح وتقديم ما يجعلكم قادرين على تصميم مواقع خاصة بشكل احترافي.

تشكل الجداول في برنامج مايكروسوفت فرونت بيج 2003 عنصراً مهماً من عناصر تصميم الموقع بشكل احترافي وذلك لكونها توفر مرونة في التحكم في كل جزء من أجزاء الشاشة.

حيث لا يكمن أن تزور موقعا من المواقع المشهورة عالميا ولم يستخدم القائمون على تلك المواقع الجداول كجزء هام وضروري في تصميم تلك المواقع.

التعامل مع الجداول

تتكون الجداول من صفوف وأعمدة والتي تنشئ منها الخلايا التي يمكن إدراج نص أو رسومات فيها، كما يمكن إجراء كافة أنواع التخصيصات في الجداول بطرق مختلفة لتصبح أكثر جاذبية وأكثر سهولة في القراءة.

كما يمكن ومن خلال العمل مع الصفوف والأعمدة إنشاء المزيد من الخلايا في الجدول عن طريق تقسيم الخلية إلى خليتين أو أكثر، كما يمكنك دمج خلايا مجاورة في خلية واحدة، بمجرد أن يكون لديك كافة الصفوف والأعمدة التي تحتاجها في الجدول، يمكنك تعيين ارتفاع الصفوف وعرض الأعمدة كما تريد، يمكنك تحديد ارتفاع الصفوف وعرض الأعمدة لتكون نسبة من الحجم الكلي للجدول أو حجماً محدداً بالبكسل أو تعيين كافة الصفوف والأعمدة ليتم التباعد بينها بشكل منتظم.

إضافة جدول

حتى نتمكن من الاستفادة من الجداول في الموقع الذي نقوم بتصميمه بواسطة برنامج مايكروسوفت فرونت بيج 2003 يجب في البداية إضافة جدول إلى الصفحة الرئيسية وذلك باتباع الخطوات التالية:

قم بوضع مؤشر او نقطة الإدراج حيث تريد إدراج الجدول، ثم من قائمة الأوامر اختر جدول ثم إدراج، ثم جدول، تظهر أمامك شاشة تطالب بتحديد الخصائص التي تريدها.

حدد الحجم من حيث عدد الأعمدة والصفوف علما بأن هناك حدا أعلى لعدد الأعمدة هو 25 وكذلك عدد الصفوف.

تعيين خصائص الخلفية

يمكن تعيين خصائص الخلفية في الجدول عن طريق الضغط بالزر الأيمن للفأرة فوق الجدول، ثم اختيار خصائص الجدول من القائمة المختصرة.

تحت الخلفية، تعيين لون الخلفية.

من القائمة اختر اللون ثم حدد لوناً لخلفية الجدول.

بعد إنشاء الجدول نقوم بتحديد المحتويات الواجب وضعها في الجدول مثلا ويتم ذلك عن طريق تحديد محتويات كل خلية حيث يمكن وضع نصوص أو رسومات أو صور حسب الحاجة وتصبح العناصر المضافة داخل كل خلية من خلايا الجدول قابلة للتعامل معها تصغير وتكبيرة بعد تحديدها.

تعيين صورة الخلفية

حدد خانة الاختيار لاستخدام صورة الخلفية.

حدد موقع الملف الذي تريده وانقر فوقه، ثم انقر فوق فتح.

تعيين مواصفات الحد

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

طرق تحديد عناصر الجدول

ضغط فوق أي جزء من الجدول.

من قائمة الأوامر اختر جدولا ثم تحديد، ثم اختر واحدا من الخيارات التالية:

تحديد جدول لتحديد الجدول.

تحديد خلية لتحديد خلية معينة.

تحديد عمود لتحديد عمود.

تحديد صف لتحديد صف معين.

لتحديد خلايا متعددة، حدد الخلية الأولى كما هو موضح في الإجراء أعلاه، واضغط المفتاح CTRL، وانقر فوق كل خلية إضافية تريد تحديدها.

نسخ المحتوى ولصقه

يمكن نسخ المحتوى من خلية إلى خلايا في صفوف أو أعمدة متجاورة في الجدول عن طريق القص واللصق أو عن طريق السحب والإفلات أو عن طريق أمر التعبئة وتحديد الاتجاه على سبيل المثال.

نقوم بتحديد خلية بها محتوى معين نصا كان ام صورة مع الخلايا الأخرى الفارغة والمراد تعبئتها بنفس المحتوى ثم نختار جدولا ثم تعبئتة ثم نحدد الاتجاه المراد تعبئته.

التحكم في تخطيط النص

أو الجدول

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

انقسام خلايا في جدول أو دمجها

يمكن إجراء عملية تقسيم خلية إلى أعمدة أو صفوف وذلك عن طريق الخطوات التالية:

بواسطة زر الفارة الأيمن فوق الخلية التي تريد تقسيمها، ثم اختر تقسيم الخلايا من القائمة المختصرة.

اختر انقسام إلى أعمدة أو انقسام إلى صفوف.

في الحقل عدد الأعمدة أو عدد الصفوف، اكتب عدد الأعمدة أو الصفوف التي ترغب في تطبيق انقسام الخلايا عليها.

جعل الصفوف والأعمدة متساوية الارتفاع والعرض

إذا كان لديك جدول يحتوي على صفوف وأعمدة مختلفة في الارتفاع والعرض، يمكنك تحديد الصفوف و الأعمدة وجعلها ذات ارتفاع وعرض واحد.

جعل الصفوف متساوية الارتفاع

قم بوضع نقطة الإدراج في عمود يحتوي على صفوف غير متساوية.

من قائمة الأوامر اختر جدولا ثم تحديد ثم عمود.

من شريط الأدوات جداول، اختر توزيع الصفوف بالتساوي.

جعل الأعمدة متساوية العرض

قم بوضع نقطة الإدراج في عمود يحتوي على صفوف غير متساوية.

من قائمة الأوامر اختر جدول ثم تحديد ثم عمود.

من شريط الأدوات جداول، اختر توزيع الأعمدة بالتساوي.

تغيير حجم خلية

قم بوضع نقطة الإدراج في الخلية.

بواسطة زر الفارة الأيمن فوق الخلية فوق خصائص الخلية من القائمة المختصرة.

لتحديد العرض، حدد خانة الاختيار تحديد العرض او الارتفاع.

تغيير حجم صف

قم بوضع نقطة الإدراج في أي خلية في الصف الذي تريد تغيير حجمه.

قائمة الأوامر اختر جدول ثم تحديد ثم صف.

من خلال زر الفأرة الأيمن فوق الصف، ثم اختر خصائص الخلية من القائمة المختصرة.

لتحديد العرض، حدد خانة الاختيار تحديد العرض، أو لتحديد الارتفاع، حدد خانة الاختيار تحديد الارتفاع، اكتب القيم.

تغيير حجم عمود

قم بوضع نقطة الإدراج في خلية موجودة في العمود الذي تريد تغيير حجمه.

قائمة الأوامر اختر جدول ثم تحديد ثم عمود.

من خلال زر الفأرة الأيمن اختر العمود ثم اختر خصائص الخلية من القائمة المختصرة.

لتحديد العرض أو الارتفاع، حدد خانة الاختيار ثم اكتب القيم المطلوبة.

تعيين رؤوس جدول

يمكن إبراز خلايا معينة في الجدول كالصف أو العمود الأول مثلا كما يمكن أيضا تنسيق الخلايا كرؤوس للجدول، حيث تظهر رؤوس الجدول بشكل افتراضي بالتنسيق الغامق.

عن طريق الخطوات التالية:

من قائمة الأوامر اختر جدول ثم تحديد، ثم حدد الخلية، أو الصف، أو العمود الذي تريد تعيينه كرأس للجدول.

بواسطة زر الماوس الأيمن فوق التحديد، ثم خصائص الخلية من القائمة المختصرة.

تحت تخطيط، حدد خانة الاختيار خلية الرأس.

الدرس الثامن

كما هو معروف للكثيرين عندما نخطط لعمل موقع فإننا سنحتاج إلى أدوات لتطوير الموقع وهذا ما يتم شرحه من خلال دروس تعلم تصميم المواقع باستخدام مايكروسوفت فرونت بيج 2003، وأرجو أن نوفق في الطرح وتقديم ما يجعلكم قادرين على تصميم مواقع خاصة بشكل احترافي.

الدرس الثامن استخدام النماذج لتجميع بيانات الزوار عندما نقوم بزيارة بعض المواقع ونرغب في التفاعل مع تلك المواقع عادة ما يتم ذلك عن طريق النماذج، في هذا الدرس سوف نركز على كيفية الاستفادة من النماذج وخطوات إنشائها وطرق حفظ المعلومات المرسلة. في برنامج مايكروسوفت فرونت بيج 2003.

في البداية جيب علينا تحديد نوعية المعلومات التي نرغب في الحصول عليها من قبل المستخدم، وبعد ذلك نقوم بتحديد حقول النموذج المزمع إنشاؤه، ثم أي الحقول الواجب وضعها في النموذج، ثم تعيين قواعد التحقق من صحة البيانات أو خطوات التحقق من صحة الإدخال (التحقق من الصحة) وهي القواعد التي تساعد على القيام بملء النموذج بشكل صحيح.

لنفترض أن النموذج الذي سنقوم بانشائه يحتوي على حقول خاصة بتسجيل الزوار في الموقع وان الحقول المطلوبة هي:

*اسم المستخدم

*كلمة مرور

* ادخل كلمة المرور مرة أخرى

* ادخل عنوان بريد إلكتروني

* ثم زر أمر للتسجيل وآخر للمسح

إنشاء نموذج

* حدد الموضع الذي ترغب في وضع النموذج به، ثم اختر إدراج ثم نموذج، ثم حدد الحقول التي تريد إضافتها إلى النموذج. وهي في هذه الحالة كما تم تحديده في سابقا.

* عند إدراج نموذج، يقوم برنامج مايكروسوفت فرونت بيج 2003 بإدراج جزء مستطيل محاط بخط متقطع يحتوي على زري أمر إرسال أو إعادة تعيين.

في هذا الجزء المستطيل، يمكنك إضافة نصوص أو حقول نماذج، مثل مربعات النص وأزرار الخيار وخانات الاختيار والمربعات المنسدلة وأزرار الضغط. وسنقوم الآن بتحديد المطلوب في النموذج الذي سبق لنا تحديد محتوياته من الحقول.

* قم بكتابة اسم مستخدم كنص عادي ثم اختر إدراج ثم نموذج ثم مربع نص أسفل النص.

*كرر نفس الخطوات السابقة بالنسبة لكلمة مرور: بكتابة النص ثم إدراج مربع نص.

* ثم ادخل كلمة المرور مرة أخرى.

* ادخل عنوان بريد إلكتروني.

* أخير ثم بالضغط المزدوج على زر الأمر إرسال لتظهر أمامك شاشة خصائص زر الأمر. حيث نقوم بتغير التسمية على زري الأمر وهما تسجيل وإعادة تعيين.

وضع ثم زر أمر للتسجيل وآخر للمسح. التحقق من صحة المعلومات المسجلة.

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

يمكنك أيضاً طلب عدد محدد من الأحرف حتى لا يقوم أحد زوار الموقع بحذف رقم أو حرف بطريق الخطأ. وتتم عملية وضع قواعد التحقق من صحة البيانات المدخلة عن طريق الضغط بزر الفأرة الأيمن على مربع النص ثم اختيار خصائص حقل النموذج لتظهر شاشة خصائص مربع النص.

* تحديد الخصائص المطلوبة حيث يتم تحديد القيمة الأولية او الافتراضية.

* تحديد العرض بالحروف. والترتيب ويقصد به الترتيب في إدخال البيانات وتوقف المفتاح Tab.

* في حقل كلمة المرور يتم وضع

* بدلا من إظهار الحروف النصية المدخلة من قبل المستخدم.

* تحديد الاتجاه من اليمين لليسار للعربية والعكس للغات الأخرى او عدم تحديد الاتجاه.

* زر الأمر تحقق يتيح للمصمم تحديد نوع البيانات المدخلة أي تحديد هل المطلوب حروف أم أرقام او تاريخ.

كما يتم تحديد التنسيق وتحديد هل هو مطلوب أم لا.

* التحقق من صحة زر خيار: يمكن أيضا طلب إجراء تحديد من مجموعة أزرار خيار.

على سبيل المثال، إذا كان النموذج يحتوي على زري خيار، (نعم) و(لا)، وحاول أحد زوار الموقع إرسال النموذج دون إجراء تحديد، يتم عرض رسالة. معالجة المعلومات التي قمت بتجميعها من النموذج.

* بعد إعداد قواعد إدخال البيانات، تحتاج إلى تحديد كيفية معالجة نتائج النموذج.

بعد أن يرسل زائر الموقع النموذج يجب تجميع البيانات التي قام بإدخالها حتى تتم علمية الاستفادة منها.

عندما يقوم أحد زوار الموقع بإرسال نموذج في المستعرض، يتم إرسال كل قيمة من قيم حقول النموذج إلى معالج النموذج.

وهو عبارة عن برنامج موجود على ملقم يبدأ في العمل عند قيام أحد زوار الموقع بإرسال نموذج.

حفظ النتائج إلى قاعدة بيانات في كل مرة يرسل زائر موقع نموذج، يحفظ مايكروسوفت فرونت بيج 2003 المعلومات إلى قاعدة بيانات.

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

* حفظ النتائج إلى ملف نص أو ملف HTML أو ملفXML: في كل مرة يرسل زائر الموقع النموذج بعد تعبئته بالطريقة الصحيحة يقوم مايكروسوفت فرونت بيج 2003 بإرفاق النتائج إلى ملف.

بعد ذلك، يمكنك فتح الملف وعرض النتائج. وذلك عن طريق الخطوات التالية :

* بزر الفأرة الأيمن اضغط على النموذج ثم من القائمة المختصرة اختر خصائص النموذج.

* تظهر شاشة خصائص النموذج والتي تحتوي على مكان تخزين النتائج ويحب هنا تحديد اسم الملف.

إرسال النتائج بالبريد الإلكتروني في حالة تحديد هذا الخيار يتم في كل مرة يرسل زائر موقع النموذج بعد ملئه بالطريقة الصحيحة إرسال رسالة بالبريد الإلكتروني تحتوي على نتائج هذا النموذج، وذلك على العنوان الذي تم تحديده في مرحلة التصميم.

* وذلك عن طريق الخطوات التالية:

* بزر الفأرة الأيمن اضغط على النموذج تم من القائمة المختصرة اختر خصائص النموذج.

* تظهر شاشة خصائص النموذج والتي تحتوي على مكان تخزين النتائج ويحب هنا تحديد عنوان البريد الالكتروني.

* يمكن أيضا تحديد حقول معينة من النموذج وليس كافة الحقول وذلك عن طريق زر الفأرة الأيمن فوق النموذج، ثم انقر فوق خصائص النموذج من القائمة المختصرة.

* ثم خيارات، ثم انقر فوق علامة التبويب الحقول المحفوظة.

* يتم سرد أسماء كافة حقول النموذج في القائمة حقول النموذج المراد حفظها.

قم بإجراء أو أكثر من الإجراءات التالية:

* حدد أي حقل لا تريد حفظه في نتائج النموذج، ثم اضغط DELETE.

* لحفظ تاريخ إرسال النموذج ووقته مع نتائج النموذج، حدد تنسيقين من القائمتين تنسيق التاريخ وتنسيق الوقت.

* تحت المعلومات الإضافية المراد حفظها، حدد أي معلومات إضافية تريد حفظها مع نتائج النموذج.

الدرس التاسع

كما سبق القول تهتم المواقع اليوم بالشكل على حساب المضمون ، أي أنك أمام مواقع خالية المحتوى حيث إذا تم طرح سؤال عن أفضل المواقع تجدنا لا نجد الكثير ، وهذا عائد إلى عدم الاهتمام بالمحتوى والتركيز على الشكل. تشير الكثير من الدراسات حول المواقع أن الزوار يترددون على المواقع وذلك بسبب ما تحتويه من معلومات مفيدة لهم.

استخدام وحدات الماكرو HTML

النقطة الثانية التي تعد على درجة كبيرة من الأهمية ألا وهي الأصالة ويقصد به أصالة الموضوعات المطروحة أي أن تكون المعلومات هنا غير مسروقة. إن الملاحظ للكثير من المواقع العربية يرى وبكل أسف أنها تحتوي على معلومات غير موثقة ، وعلى العكس من ذلك مسروقة من مواقع أخرى ثم يدعي أصحاب الموقع إنها ملك لهم عبر عبارات حقوق الطبع محفوظة!

التحديث المستمر للمحتويات من الضروري المحافظة على أصالة الموضوعات وإجراء التحديث المستمر لها ؛لأن التحديث يعني الحياة وعكس ذلك هو الموت.

إن الإنترنت اسم ارتبط بكل ما هو جديد أي أنها Live Medium وبالتالي من الضروري الحفاظ على ثقة الزوار عبر التحديث المستمر لمحتويات الموقع.

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

لا شك أن لكل موقع هدفه ، من هنا يجب التأكد من معرفة نوع الجمهور الذي تخاطبه من خلال الموقع. على سبيل المثال، هل الموقع الخاص بك مخصص للعملاء أم للموظفين أم للطلاب أم للأصدقاء أم للعائلة؟

وإذا كنت تريد إنشاء موقع للشركة التي تعمل بها فتأكد أن الهدف محدد وشامل ليس من قبلك بل من قبل إدارة الشركة. وبعد الفراغ من ذلك، لا بد أن يرى رئيسك نتائج عملك، أي أن يعود ذلك على الشركة بالنفع المادي أو توفير عدد معين من ساعات العمل.

حاول أن يكون هدفك بسيطًا. فيكفي أن يكون من جملتين أو فقرة قصيرة. إذا كان الهدف طويلاً، فسيعطي انطباعًا بأن على المستخدم عمل الكثير الذي قد يصرفه عن الموقع.

وحدات الماكرو

إذا كنت تقوم بمهمة بشكل متكرر في مايكروسوفت فرونت بيج 2003، يمكنك تنفيذ المهمة تلقائياً من خلال وحدات الماكرو. تعد وحدات الماكرو سلسلة من الأوامر والوظائف التي تم تخزينها في وحدة نمطية في لغة البرمجة الفيجول بيسك Microsoft Visual Basic التي يمكن تشغيلها كلما رغبت في القيام بالمهمة.

يمكن استخدام وحدات الماكرو لإنشاء صفحات جديدة وتطبيق قوالب عليها. ونسخ خطوط وتغير ألوان وإدراج.. الخ. وفي مايكروسوفت فرونت بيج 2003 يستخدم برنامج Visual Basic Editor الأدوات التي تتم عمل وحدات الماكرو بها. و هو عبارة عن برنامج تم تصميمه لجعل عمليتي الكتابة والتحرير للتعليمات البرمجية للماكرو سهلة على المبتدئين، ولتوفير المزيد من (المساعدة).

مع ضرورة التأكيد انك لست بحاجة إلى معرفة كيفية برمجة لغة Visual Basic أو استخدامها لإنشاء ماكرو. باستخدام

Visual Basic Editor.

بعد إنشاء ماكرو، يمكنك تشغيله بواسطة اختياره من قائمة في مربع الحوار ماكرو. لتشغيل الماكرو كلما قمت بالنقر فوق زر معين، يمكنك تعيين الماكرو إلى زر شريط أدوات.

إنشاء ماكرو

يمكن عمل وحدة ماكرو جديدة باتباع الخطوات التالية:

اختر أدوات ثم أشر إلى ماكرو، ثم اضغط فوق وحدات ماكرو. تظهر شاشة تطلب إدخال اسم الماكرو ثم اضغط فوق إنشاء.

مع ملاحظة إن اسم الماكرو لا يمكن أن يحتوي أسماء وحدات الماكرو على مسافات أو علامات تنقيط، إلا أنه يمكنك استخدام الشرطات السفلية.

في شاشة Visual Basic Editor: بيئة تكتب فيها تعليمات Visual Basic for Applications البرمجية وبرامجه الجزئية الجديدة أو تحرر الموجودة منها. اكتب التعليمة البرمجية الخاصة بك أو انسخها في إطار الوحدة النمطية.

إذا أردت استخدام الماكرو من إطار الوحدة النمطية، اضغط على F5. عندما تقوم بالانتهاء من إنشاء الماكرو، انقر فوق الإغلاق والرجوع إلى مايكروسوفت فرونت بيج 2003 من القائمة ملف.

تحرير ماكرو

اختر أدوات ثم اشر إلى ماكرو، ثم اضغط فوق وحدات ماكرو ثم اختر فوق وحدات ماكرو. حدد الماكرو، ثم تحرير.

تشغيل ماكرو

اختر أدوات ثم اشر إلى ماكرو، ثم اضغط فوق وحدات ماكرو ثم اختر فوق وحدات ماكرو. حدد الماكرو ثم انقر فوق تشغيل.

تصحيح ماكرو

اختر أدوات ثم اشر إلى ماكرو، ثم اضغط فوق وحدات ماكرو ثم اختر فوق وحدات ماكرو. حدد الماكرو ثم انقر فوق دخول.

استخدام HTML

كما هو معلوم لكم إن لغة التوصيف النص التشعبي (HTML) لغة قياسية لإنشاء الصفحات على شبكة الإنترنت. تستخدم HTML إشارات معينة تسمى العلامات، والتي تشير إلى الطريقة التي يجب استخدامها لعرض عناصر الصفحة مثل النص والرسومات.

يمكنك كتابة تعليمات البرمجية للغة ال HTML باستخدام الأدوات المتوفرة في طرق العرض تعليمات برمجية أو التصميم. عند كتابة صفحة ويب في طريقة العرض تصميم، يمكن عرض علامات HTML التي تشير إلى علامات البدء ل HML وعلامات الانتهاء أو إخفاؤها.

كتابة أوامر HTML

يوفر مايكروسوفت فرونت بيج 2003 العديد من المزايا التي تساعدك في تحرير HTML بشكل أكثر سهولة. حيث خاصية التحسس الذكي التي تزود بقائمة من الاختيارات المتوفرة عند إضافة العلامات أو السمات. كما يتيح لك محدد العلامات السريع تحديد العلامات بأكملها، أو محتويات العلامات، دون الحاجة إلى التبديل إلى طريقة العرض تعليمات برمجية. تتوفر كافة أوامر التحرير القياسية لتحرير التعليمات البرمجية. يساعد ترقيم الأسطر في تحديد موقع السطور الخاصة بتعليمات برمجية محددة والانتقال بينها.

لاحظ أن برنامج مايكروسوفت فرونت بيج 2003 يقوم تلقائيا بكتابة الأوامر بلغة لغة التوصيف النص التشعبي (HTML) أي أنه عند عمل تغير عن طريق واجهة التطبيق في صفحة من صفحات الموقع يقوم البرنامج. على سبيل المثال عندس تغير لون الخط لعنوان أو حجمه fontsize:14. 0pt من خلال واجهة التطبيق يقوم البرنامج بكتابة الأوامر المطلوبة ويمكن مشاهدة ذلك عن طريق العرض في تعليمات في البرمجة.

* جريدة الجزيرة title*

والذي يقوم بكتابة جريدة الجزيرة كعنوان للموقع على شريط التطبيق.

الدرس العاشر

إصلاح الارتباطات التشعبية المعطلة ونشر الموقع

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

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

ما هي الفائدة التي يجنيها الزائرون للمواقع عندما يتعرفون على أقسام الشركة أو المؤسسة وفروعها وإنها تستخدم استراتيجيات إدارية حديثه؟

كما هو معلوم سلفا بأن هناك نوعين من الارتباطات التشعبية:

الارتباطات الداخلية وهي التي تشير إلى صفحات داخل الموقع الخاص بنا على سبيل المثال، Default. htm أو AboutUs. htm.

والارتباطات الخارجية وهي التي تشير إلى مواقع خارج الموقع الخاص بنا على سبيل المثال: موقع جريدة الجزيرة أو أي موقع آخر!

يوفر برنامج مايكروسوفت فرونت بيج 2003 تقريرا يساعد على معرفة الارتباطات التشعبية المعطلة، وبالتالي إصلاحها.. وعند قراءة التقرير ستكون الارتباطات الداخلية التي تنتقل إلى صفحات مفقودة أو بها أخطاء إملائية بالحالة معطلة!

عند الضغط على الارتباط المعطل، يمكن اصلاحه إما بكتابة الاسم الصحيح للملف أو عن طريق الاستعراض إلى المواقع الصحيحة.

أما الارتباطات الخارجية فستكون بالحالة غير معروفة، وبالتالي عند تشغيل تقرير الارتباطات التشعبية المعطلة، سيسألك مايكروسوفت فرونت بيج 2003عما إذا كنت تريد التحقق من الارتباطات التشعبية الخارجية أم لا؛ وذلك لضمان أن الارتباطات الخارجية تشير إلى مواقع صالحة ومتاحة على الويب. في حالة الرغبة في فحص هذه الارتباطات يجب اختيار (نعم)، وبالتالي يجب التأكد أن الاتصال بالأنترنت الخاص بك متاح!

في كثير من الأحيان لا يحدث أي شيء عندما يقوم المستخدم بالضغط فوق الارتباطات التشعبية، وهذا قد يحدث عندما يكون النص الذي تعتقد أنه ارتباط تشعبي ليس ارتباطاً تشعبياً ولكنه فقط يبدو كالارتباط التشعبي!

للتأكد من أن النص ارتباط تشعبي، اتبع الخطوات التالية

*حدد النص، ثم اختر إدراج ثم ارتباط تشعبي.

*في المربع العنوان، تأكد من وجود URL صالح!

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

من المحتمل أن يكون العنوان الصحيح والموقع كان يعمل في السابق الا انه قد تم نقل الارتباط الى موقع آخر أو تم قفل الموقع تماما.

من المحتمل ألا يكون لديك حق الوصول إلى الوجهة لسبب عدم توفر الاتصال بالإنترنت.

من المحتمل أن تكون هناك مشكلة فنية أخرى.

قبل نشر الموقع يرجى التأكد من خلوه من الأخطاء التي تقع فيها الكثير من المواقع، حيث من الملاحظ على الكثير من المواقع المتوفرة حاليا على شبكة الإنترنت، والتي تعود للشركات والمؤسسات الخاصة أنها لا تحتوي على قسم خاص يوضح الهدف من بناء تلك المواقع (Statement of Purpose) وإن وجد ذلك القسم فإنه يستخدم لغة غير مفهومة عبر استخدام لغة وجمل عامة تحجب الكثير من الأهداف من بناء تلك المواقع، وبالتالي تجعلها مواقع عديمة الفائدة. على الرغم من الاهتمام الكبير بموضوع الشكل وإدخال عناصر كثيرة واستخدام برمجيات متقدمة، إلا أن تلك المواقع لا تحقق الأهداف التي من اجلها أنشئت .

عندما تقوم بنشر موقعك على شبكة الانترنت فإنك في الحقيقة لا تقوم بأكثر من نسخ كافة الملفات والمجلدات التي يتألف منها الموقع من موقع من جهازك الى مصدر واحد، إلى وجهة معينة، الى المساحة التخزينية على الشبكة في مايكروسوفت فرونت بيج 2003، تقوم بنشر الموقع عندما تتأكد من خلوه من كافة الأخطاء وفي هذه الحالة يصبح القرار بان نجعله متاحا للزوار.

يستخدم برتوكول نقل الملفات وذلك أثناء عملية نسخ ملفات من أحد المواقع على شبكة الإنترنت، عموما ال FTP هو أحد بروتوكولات TCP/IP ، وهو برنامج يحوي العديد من الأدوات القوية التي تتيح للمستخدم إمكانية نقل الملفات من حاسب يسمى المضيف(Host ) على شبكة الانترنت لحاسبك. ويجب على المستخدم لهذا البروتوكول أو برنامج عمل log in لكي يتمكن من إكمال عملية نقل الملفات، في البداية لنقم بتجريب نشر الموقع الى مجلد نقوم بإنشائه لغرض الاختبار وذلك وفقا للخطوات التالية:

*اختر ملف ثم نشر موقع

*من الشاشة الخاصة باختيار نوع وطريقة النشر اختر نظام الملفات ثم استعراض

*حدد المجلد الذي سيتم نشر الموقع عليه.

*ثم اختر موافق

تعيين خصائص الموقع:

*اختر عرض، ثم موقع ويب البعيد.

*أعلى إطار المستند، اختر خصائص موقع ويب البعيد.

*من علامة التبويب موقع ويب البعيد، تحت نوع ملقم ويب البعيد، اختر نظام الملفات.

*وضع علامة للملفات التي لا ترغب في نشرها.

*من الجزء الأيمن ويب المحلي، وبواسطة زر الماوس الأيمن اختر كل ملف لا تريد نشره، ثم اختر عدم النشر من القائمة المختصرة.

نشر ملفات ومجلدات إلى نظام ملفات تحت الجزء موقع ويب البعيد، تحت نشر كافة الصفحات التي تم تغييرها، اختر من محلي إلى بعيد.

*ثم اختر نشر موقع ويب.

*إذا قمت بإيقاف نشر قيد التقدم، ستبقى الملفات التي تم نشرها بالفعل على موقع ويب البعيد.

من ميزات مايكروسوفت فرونت بيج 2003 الدعم لكل من FTP وWebDAV حيث يمكن أن تقوم بنشر الموقع بتقنية FTP أو WebDAV. حيث يمكنك تعيين معلمات اتصالFTP وWebDAV في مربع الحوار Remote Web Site Propertie

عندما تقوم بنشر الملفات والمجلدات إلى ملقم يدعم FTP أو WebDAV، يجب أن تعلم اسم الملف والمسار بالإضافة إلى اسم المستخدم وكلمة المرور. هناك بعض العمليات التي لن يمكنك أداءها على ملقم يستند إلىFTP أو ملقم يستند إلى WebDAV، بما في ذلك إنشاء تقارير تحليل الاستخدام واستخدام عداد الدخول، ومعالجات نماذج معينة، وصفحات ويب فرعية متداخلة، وأشرطة الارتباط المخصصة. للحصول على قائمة كاملة بمكونات FrontPage التي تكون غير متوفرة لك عند قيامك بالنشر إلى ملقم يستند إلى FTP أو ملقم يستند إلى WebDAV، انظر المكونات التي تتطلب FrontPage 2002 Server Extensions.

إجراءات نشر موقع ويب إلى

ملقم FTP أو webdav

*تعيين موقع ويب بعيد.

*من القائمة عرض، اختر Remote Web Site.

*أعلى إطار المستند، اختر Remote Web Site Properties.

*تحت Remote Web server type، اختر نوع ملقم ويب الذي تريد نشر موقع ويب الخاص بك عليه.

*من خلال مربع Remote Web site location، اختر استعراض.

*حدد موقع ويب البعيد الذي تريده، ثم فتح.

الدرس الحادي عشر

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

من هنا نقترح أن تكون المواقع ذات طبيعة مختلفة من حيث الشكل وتركز على تقديم الخدمات بدلا من استعراض إمكانيات البرامج. كما نقترح أن تكون المواقع سهلة الاستخدام دون أدنى تدريب.

إجراء التعديلات بعد نشر الموقع وإضافة ملفات الفلاش

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

تقليل وقت تحميل إلى الموقع

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

يؤدي تغيير حجم الرسم إلى تغيير قيم السمات لعلامات (HTML) التي تبين لمستعرض الانترنت كيفية عرض الرسم؛ أما ملف الرسم الفعلي فلا يتغير. إذا قمت فقط بتغيير حجم الرسم، سيتم عرضه في جزء صغير على شاشة الزائر للموقع. لتقليل حجم ملف الرسم ووقت تحميله، يجب إعادة تشكيل الرسم بعد تغيير حجمه. حيث يؤدي إعادة تشكيل الرسم إلى تغيير حجمه بالبكسل ليطابق حجم العرض الحالي.

عند إعادة تشكيل الرسم بعد تغيير حجمه، يتم تقليل حجم الملف ليطابق الحجم الأصغر.

كما يكمن التحكم في جودة لملفات JPEG وذلك عن طريق تقليل إعداد الجودة، مما سيزيد ضغط الملف ويقل حجمه. كذلك يحب تقليل الدقة الخاصة برسم عالي الدقة، عن طريق عمل نسخة احتياطية من الرسم وإجراء التعديلات لتقليل الدقة بعد فتحه. عندئذ يمكنك إعادة إدراج الرسم في صفحات الموقع بتنسيق الدقة المنخفضة.

كما يمكن إنشاء نسخ منخفضة الدقة من الرسومات والصور المدرجة عن طريق فتح الملف في برنامج تحرير رسومات والقيام بتقليل عمق الألوان (عدد الألوان) في الرسم. كلما قلت الألوان التي تقوم بتحديدها للنسخة منخفضة الدقة من الرسم، ازدادت سرعة عرضه في مستعرض ويب. لأن الرسم منخفض الدقة يقصد منه أن يحل محل الرسم عالي الدقة يجب عدم تغيير ارتفاع الرسم أو عرضه. ثم قم بتحديد البرنامج لعرض هذه النسخة منخفضة الدقة من الرسم أثناء تحميل النسخة الأصلية. وهذا الإجراء يتيح لزوار الموقع مشاهدة شيء ما أثناء تحميل الصفحة. هناك طريقة مشهورة جداً وهي التصغير وهي عبارة عن نسخة صغيرة من الرسم الذي يتم تحميله بسرعة. يمكن أن يحدد زوار الموقع ما إذا كانوا يرغبون في تحميل النسخة كاملة الحجم من الرسم أم لا. استخدم ميزة التصغير التلقائي التي تقوم تلقائياً بإنشاء صورة مصغرة بها ارتباط تشعبي. بالرسم الأصلي الأكبر حجماً. أخيراً، بعض المواقع تستخدم طريقة عرض نص بديل ALT وهو عبارة عن النص يتم عرضه على شاشة الزائرة أثناء تحميل الصور للمستخدمين او الذين أوقفوا تشغيل الرسومات.

إضافة محتويات ملفFlash

إلى صفحات الموقع

يمكن إدراج ملف العرض فلاش إلى محتويات أي صفحة من صفحات الموقع وذلك عن طريق اتباع الخطوات التالية:

اختر إدراج ثم صورة ثم فيلم بتنسيق Flash.

حدد موقع ملف Macromedia Flash ثم اختر إدراج.

ثم اختر معاينة لعرض محتويات الصفحة بعد إضافة ملف الفلاش إليها.

يمكن كذلك إضافة ملف Flash عن طريق سحب ملف إلى صفحة الموقع المطلوبة من قائمة المجلدات في مايكروسوفت فرونت بيج 2003 أو Microsoft Windows Explorer.

يمكن أيضا الارتباط إلى ملف Flash بواسطة إضافة ارتباط تشعبي في أي صفحة من صفحات الموقع.

مع ضرورة أن يكون لدى زائري الموقع Macromedia Flash Player مثبتاً في جهازه وإلا فمن الضروري عمل رابط إلى موقع الجلب المجاني لكي يتمكن من جلب البرنامج ان لم يكن متوفرا في جهازه.

يمكن حذف ملف Flash بتحديد الملف ثم اضغط DELETE.

إضافة ملف فيديو

يمكن إضافة ملف فيديو مباشرة في صفحات موقعك بحيث يتم تحميله تلقائياً عندما يقوم زائر الموقع بفتح الصفحة.

كما يمكن كذلك إضافة ارتباط إلى موقع ملف الفيديو وبالتالي يصبح متاحاً للزوار لجلب هذا الملف. ويمكن لزوار الموقع تقرير ما إذا كانوا يريدون تحميل هذا الملف أم لا.

كما يمكنك أيضاً استخدام مايكروسوفت فرونت بيج 2003 لتعيين الخيارات لتشغيل الفيديو. على سبيل المثال، يمكنك تشغيل ملف الفيديو بمجرد أن يقوم زائر الموقع بفتح الصفحة، وتكرار الملف بشكل مستمر، كما يمكن تعيين أن يتم تشغيل الملف فقط عندما يقوم الزائر بوضع مؤشر الفأرة فوق أحد العناصر المتاحة في شاشة الموقع.

بعض التنسيقات العامة لملفات الفيديو التي يمكنك تضمينها أو الارتباط إليها:

ملفات فيديو وملفات صوتية التي تستخدم في Microsoft Windows Media Player وتحمل ملفات هذا التنسيق الامتداد (avi)

ملفات يستخدم مع Windows Media Player.

يمكن أن يحتوي هذا التنسيق على الملفات المرئية، والبرامج النصية، عناصر تحكم ActiveX، ومستندات HTML. ملفات فيديو وملفات صوتية التي تستخدم في Microsoft Windows Media Player. وتحمل ملفات هذا التنسيق الامتداد (*.asf)

ملفات متواصل يستخدم مع RealNetworks RealAudio Player. يوفر هذا التنسيق أمثلية أداء للاتصالات متوسطة السرعة وبطيئة السرعة.

وتحمل ملفات هذا التنسيق الامتداد(ram;*ra.*)

مجموعة من التنسيقات القياسية المستخدمة لترميز المعلومات المرئية والصوتية مثل الأفلام، وملفات الفيديو، والموسيقى الموجودة بتنسيق مضغوط رقمي.

عادة ما تكون ملفات MPEG ذات تنسيق أصغر من تنسيق ملفات الفيديو، إلا أنها بنفس الجودة. وتحمل ملفات هذا التنسيق الامتداد *.(mpeg).

في نظام تشغيل Apple Macintosh ويتم استخدامها بواسطة معظم تطبيقات Macintosh التي تتضمن ملفات الفيديو والحركة.

يمكن للأجهزة التي تعمل على نظام Microsoft Windows تشغيل الملفات بتنسيق QuickTime، إلا أنها تتطلب كائنا إضافيا خاصا ب QuickTime. وتحمل ملفات هذا التنسيق الامتداد(mov;*.qt.*) لذا من الضروري إضافة الأدوات والبرامج اللازمة لتشغيل هذه الملفات أو كحد أدنى عمل روابط تشعبية للمواقع التي توفر تلك البرامج مجاناً.

الدرس الثاني عشر

مواضيع متقدمة

في هذا الدرس سوف نتطرق إلى المواضيع المتقدمة والتي لها علاقة بالوظائف الإضافية من برامج مكملة ووسائط متعددة والتي تقوم بزيادة إمكانيات مايكروسوفت فرونت بيج 2003 عبر إضافة أوامر مخصصة وميزات خاصة. مع ضرورة عدم الخلط بين الوظائف الإضافية والكائنات الإضافية. حيث إن الأداة الإضافية هي مجموعة من الوحدات النمطية للبرامج المدمجة في برامج استعراض ويب لتوفير نطاق من الإمكانيات التبادلية وإمكانيات تعدد الوسائط. مع ضرورة ملاحظة أن الوظائف الإضافية والبرامج المكملة تستهلك الكثير من ذاكرة الحاسب وتؤثر على فاعلية البرنامج لذا ومن أجل الحفاظ على الذاكرة وزيادة السرعة من الأفضل إلغاء تحميل برامج الوظائف الإضافية التي لا تستخدمها. عندما تقوم بإلغاء تحميل وظيفة إضافية، فسيتم إزالة الميزات والأوامر الخاصة بها من مايكروسوفت فرونت بيج 2003، إلا أن ملف الوظيفة الإضافية نفسه يبقى على الجهاز لتسهيل إعادة التحميل.

إضافة وظيفة إضافية أو إزالتها

* من القائمة أدوات، اختر وظائف إضافية.

قم بعمل أي مما يلي:

* إضافة وظيفة إضافية في المربع وظائف إضافية متوفرة، حدد خانة الاختيار الموجودة بجوار الوظيفة الإضافية التي تريدها، ثم اختر موافق.

* إذا لم تظهر الوظيفة الإضافية التي تريدها في المربع وظائف إضافية متوفرة، اختر إضافة، وحدد موقع الملف الخاص بالوظيفة الإضافية وانقر فوقه، ثم اختر موافق.

إزالة وظيفة إضافية

* إذا أردت إزالة الوظيفة الإضافية من الذاكرة والاحتفاظ بها في القائمة وظائف إضافية متوفرة، قم بإلغاء تحديد خانة الاختيار الموجودة بجانب الوظيفة الإضافية.

* إذا أردت إزالة الوظيفة الإضافية من الذاكرة ومن قائمة وظائف إضافية متوفرة، اختر الوظيفة الإضافية، ثم اختر إزالة.

في المرة القادمة التي تقوم فيها ببدء تشغيل FrontPage ، سيتم إزالة الوظيفة الإضافية.^

مع ملاحظة أن هذا الإجراء لا يقوم هنا بإزالة الوظيفة الإضافية من القرص الثابت.

لإزالتها من القرص الثابت، يجب إلغاء تثبيت الوظيفة الإضافية.

استخدام معالج واجهة قاعدة

البيانات مع ASP. NET

* Active Server Page أو كما تسمى صفحات الملقم النشطة هي عبارة عن تقنية برمجة نصية من قبل الملقم، ُتستخدم لإنشاء تطبيقات ديناميكية وفعالة لإنشاء صفحات ويب.

وملف ASP عبارة عن صفحة HTML تحتوي برامج نصية يتم معالجتها بواسطة ملقم الصفحات قبل إرسالها إلى برنامج استعراض.

وتستخدم هذه التقنية بكثرة في المواقع النشطة والتي تسمح للزوار بالمساهمة بما يروق لهم مثل المنتديات التي كثرت وأصبحت تشكل جذباً للكثير من الشباب. حيث يتم الت

[الحدادي]

تسلم عزيزي على الدروس

بس لو دعمتها بالصور كان افضل

[mbn]

بحاول في وقت الفرغ

[اا الفاروق اا]

السلام عليكم

أهلا بك MBN

مشكور على الموضوع

وجارى القراءة

[دلوعه بس معذوره]

في اللقاء السابق قمنا بتصميم موقع شخصي يحتوي على خمس صفحات وهي صفحة البداية والصفحات التالية:

* خواطر شعرية.

* مواقعي المفضلة.

* السيرة الذاتية.

* عن الموقع.

__________________________________

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

لاني توي جديده ومحتاجه هالصفحات وين الاقيهم

* خواطر شعرية.

* مواقعي المفضلة.

* السيرة الذاتية.

* عن الموقع.

وشاكره لكم

[المحسن]

الدروس جميعها ملطوشة من موقع جريدة الجزيرة .. وكان المفروض أن يشار إلى المصدر .. وليس مصادرة جهد الآخرين بهذه الطريقة

[البراءة]

شكرا خيوو..

لكن المشكله ان فرونت بيج بالانكلينزي مو بالعربي..

لو بالعربي بكون اسهل لي..