http://img89.imageshack.us/img89/6614/26906679no4.gif



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

http://img100.imageshack.us/img100/6411/34663596jj3.jpg



http://img149.imageshack.us/img149/3857/78761440rx2.jpg


http://img149.imageshack.us/img149/6384/28047939ua4.jpg

يتبع.......

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


2. قالب Personal بوووووووووبوووووووووبووووووووو وهو يستخدم في الإنشاء صفحة شخصية على الانترنت


3. قالب Project بوووووووووبوووووووووبووووووووو وهو يفيد في تتبع معدل التطور والتقدم الذي يتم إحرازه في المشروعات


4. قالب للارتباطات (نقطة المشاركة)SharePoint teem بوووووووووبوووووووووبووووووووو site


5. قالب One بوووووووووبوووووووووبووووووووو page وهو القالب الأساسي لمواقع الويب الجاهزة


6. قالب بوووووووووبوووووووووبووووووووو empty وهو موقع لا يحتوى على اى صفحات ونادرا ما يتم استخدام هذا النوع
ويمكن إتباع الخطوات الآتية في نشاء احد المواقع باستخدام احد القوالب السابقة :
http://img516.imageshack.us/img516/5646/10gi5.jpg
http://img212.imageshack.us/img212/3063/11bo3.jpg


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


ولكن أولاً لنتعرف على طريقة عرض محتويات الصفحة
http://img212.imageshack.us/img212/5120/91301825kx3.jpg
http://img408.imageshack.us/img408/9226/64720895wr8.jpg


http://img408.imageshack.us/img408/7515/38254764am1.jpg
http://img408.imageshack.us/img408/7790/50618695su9.jpg


http://img408.imageshack.us/img408/2593/76652712en4.jpg


وفيما يلي الخطوات اللازمة لإنشاء موقع ويب باستخدام إحدى أدوات المعالجة :
1. إثناء تشغيل البرنامج افتح قائمة ملف ثم اختر الأمر جديد ثم اختر صفحة أو ويب لإظهار لوحة مهام Task
3. يظهر مربع حوار بنفس الاسم اختر منه اسم المعالج الذي ترغب في استخدامه مثلا معالج للشركات.
http://img212.imageshack.us/img212/3063/11bo3.jpg


4. ادخل الاسم المحدد للمكان الذي سيتم حفظ موقع الويب الجديد فيه أو انقر على استعراض Browse لاختيار المكان من القائمة الخاصة بالمجلدات.
5. بعد تحديد مكان الحفظ انقر موافق OK في مربع الحوار بوووووووووبوووووووووبووووووووو Site Template ,فيتم إغلاق مربع الحوار ويقوم البرنامج باستدعاء المعالج الذي قمت باختياره
6. قم بإجابة الأسئلة التي يطرحها المعالج ثم انقر على زر Next لاستكمال العمل وبهذه الطريقة يتم الانتقال من مربع حوار إلى آخر خلال المعالج حيث يمكنك التراجع عن احد أو مجموعة من الخطوات والاختيارات بالنقر على زر التراجع Back , وعند الوصول إلى آخر مربع حوار في المعالج سيظهر زر Next في الوضع غير النشط .
http://img103.imageshack.us/img103/4356/12yk8.jpg
http://img266.imageshack.us/img266/2681/13ok5.jpg


http://img204.imageshack.us/img204/2051/14dd5.jpg


http://img249.imageshack.us/img249/5865/15jj1.jpg
http://img249.imageshack.us/img249/5721/16qv9.jpg
7.انقر الآن على زر الإنهاء Finish للخروج من المعالج والانتهاء من عملية إنشاء الموقع. ويقوم البرنامج عن طريق المعالج والاختيارات التي قمت بتحديدها من خلاله بإنشاء الموقع المطلوب والذي يظهر داخل إطار برنامج FrontPage .
يتبع......

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

http://img225.imageshack.us/img225/2547/18sk9.jpg

قم الآن بإنشاء صفحات الويب التالية من قائمة ملف fileثم جديد new ثم صفحة pageأو ويب بوووووووووبوووووووووبووووووووو واختر ويب فارغة empty بوووووووووبوووووووووبوووووووووواكتب اسم الموقع بعد كلمة ويب مثلاً computer ثم موافق ستظهر لك الشاشة التالية وبها اسم الموقع.
والآن قم بإنشاء صفحات الويب التالية:
· صفحة للعنوان وحفظها باسم index
· صفحة للمقدمة عن المادة باسم First
· صفحة لمكونات الحاسوب وحفظها باسم Hardware and Software
· صفحة لمختبر الحاسوب باسم Lab

http://img225.imageshack.us/img225/7205/19co7.jpg


http://img225.imageshack.us/img225/331/20gq3.jpg


* التعامل مع القوائم الموجود في البرنامج وسنمر عليها بسرعة لأنها معروفه للجميع
بعد أن أنشأت الصفحات السابقة يمكنك إضافة كائنات إليها كالنصوص والصور
وتنسيقها وتنسيق صفحتك بالصور والمخططات والإطارات بالتعرف على مكونات شريط القوائم الموجود في البرنامج...
كما يلي:
http://img80.imageshack.us/img80/5265/25kr8.jpg



http://img80.imageshack.us/img80/3522/24kl6.jpg


http://img80.imageshack.us/img80/7756/22ag9.jpg


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

http://img80.imageshack.us/img80/7890/27ce7.jpg

1-اختيارالزر..2-تنسيق خطالزر..3-إضافة صورةللزر بدل مربع النص..


http://img150.imageshack.us/img150/7149/28fc1.jpg

http://img228.imageshack.us/img228/2885/29uu4.jpg



http://img228.imageshack.us/img228/6529/30ws9.jpg


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


http://img228.imageshack.us/img228/3013/31ns3.jpg



http://img266.imageshack.us/img266/117/21lb4.jpg


http://img228.imageshack.us/img228/3339/32ip6.jpg


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

خطوات رائعه وموضوع اروع

تسلم

خطوات رائعه وموضوع اروع

تسلم
بارك الله فيك:36_3_11[1]:

ما شاء الله عليك أخي موضوع جميل جدا وشرح مبسط وبخطوات متسسلة وبسيطه بارك الله فيك وتشكر على الموضوع الجميل