كيف تصمم موقعك على الانترنت بكل سهوله

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

مكتبة البرامج http://members.xoom.com/alloshf/index.htm

بسم الله نبدأ درسنا الأول ..

الخطوة الأولى :- افتح مجلد جديد على الهارد دسك لديك على القسم C أو D وسمه MyWeb حيث سيكون موقعك بهذا المجلد ... ثم افتح داخل هذا المجلد مجلد آخر وسمه images انظر الشكل - 1 .. والغرض من تلك المجلدات هو وضع الصفحات والصور المطلوبه في الموقع مثل صور الأزرة أو صور المناظر الطبيعية أوما شابه ذلك .. وسنضع الصور بالمجلد images أما الصفحات فستكون بالمجلد MyWeb .. ليست هذه قاعدة ولكن هذا هو المتبع في تصميم المواقع .. كذلك هناك مجلد ثالث يمكنك وضعة فيما لو رغبت وهو مجلد Download والذي يوضع بداخلة الملفات الخاصة بالتنزيل .
<IMG SRC="http://allosh.atyab.com/images/front1.gif" border=0>

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

<IMG SRC="http://allosh.atyab.com/images/front4.gif" border=0>

الخطوة الثالثة :- افتح برنامج الفرنت بيج انظر الشكل 2 .. سيفتح البرنامج صفحة افتراضية ويسميها Untitled Normal Page قبل كل شيء يجب حفظ الصفحة بمجلد الصفحات MyWeb .. ولكن كيف ذلك حسنا انقر على قائمة File ثم اختر من القائمة المنسدلة Save as لتظهر لك الناافذة الموضحة في الشكل - A .. أنقر على As File ثم حدد المجلد الخاص بالصفحات MyWeb وأكتب اسم الصفحة index.htm يجب ان يكون امتداد الاسم htm أو html .. على العموم ليس ضروري أن تكتب الامتداد انت بنفسك اكتب الاسم فقط والبرنامج يضع الامتداد تلقائيا . بعد حفظ الصفحة ستعود ثانية لبرنامج الفرنت بيج كما في الشكل -2 ..

<IMG SRC="http://allosh.atyab.com/images/frontde.gif" border=0>

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

الخطوة الخامسة :- في هذه الخطوة سننشيء الصفحة الاولى .. طبعا لا تحذف الصفحة الأم او تغلقها فقط أنقر على زر انشاء صفحة جديدة لإنشاء صفحة .. ثم افعل كما فعلت في الخطوة الثالثة أي انقر على قائمة File ثم اختر من القائمة المنسدلة الأمر Save As وإحفظها بمجلد الصفحات MyWeb بإسم allosh.htm واكتب بمتن الصفحة الجملة التي على يمينك .... بعد كتابة الجملة انقر على زر الحفظ لحفظ المتغبرات ..

الخطوة السادسة :- كذلك في هذه الخطوة سننشيء صفحة وهي الصفحة الثانية .. لا تحذف او تغلق أيا من الصفحات السابقة سواء الصفحة الام أو الصفحة الأولى .. فقط أنقر على زر انشاء صفحة جديدة لإنشاء صفحة أخرى أو الصفحة الثانية في الموقع .. ثم افعل كما فعلت في الخطوات السابقة .. أي انقر على قائمة File ثم اختر من القائمة المنسدلة الأمر Save As وإحفظها بمجلد الصفحات MyWeb بإسم lastpage.htm واكتب بمتن الصفحة الجملة التي على يمينك .... بعد كتابة الجملة انقر على زر الحفظ لحفظ المتغيرات ..

الخطوة السابعة :- أنظر إلى الشكل المقابل والذي يوضح المخطط التقريبي لما فعلناه .. حيث تكون لديك عدد من الصفحات ومجلد الصور الذي يحتوي على الصور .. ألآن سنربط كلمة ( الصفحة الأولى ) الموجوده بمتن الصفحة الأم بالصفحة الأولى .. أي بمجرد أن ينقر الزائر على كلمة ( الصفحة الأولى ) المكتوبة بمتن الصفحة الأم سينتقل فعلا إلى الصفحة الأولى .. ..
<IMG SRC="http://allosh.atyab.com/images/front6.gif" border=0>

<IMG SRC="http://allosh.atyab.com/images/front7.gif" border=0>
الخطوة الثامنة :- أستعرض الصفحة الأم .. كيف ذلك أنقر على قائمة Window الموجود في شريط القوائم والمحاطة بالدائرة الحمراء انظر الشكل - 4 ثم انقر على الصفحة D:\MyWeb/index.htm لأستعراضها لأنها لا تزال موجودة ببرنامج الفرنت بيج .. حدد كلمة ( الصفحة الأولى ) ثم انقر على زر الربط التشعبي ستظهر لك نافذة Edit Hyperlink والمبينة بالشكل -4 اكتب بخانة URL اسم الصفحة الأولى اي allosh.htm وتأكد من صحة السبلنق كذلك الامتداد إذا كان الفرنت بيج لديك يجعل الامتداد html فيجب أن تكتب allosh.html بدل allosh.htm .. ثم انقر على OK .. بعد ذلك حدد كلمة ( الصفحة الثانية ) طبعا في نفس الصفحة الأم .. ثم انقر على زر الربط التشعبي وأكتب اسم الصفحة الثانية lastpage.htm كما فعلت مع الكلمة السابقة . وبهذا نكون انتهينا من الصفحة الأم ..

الخطوة التاسعة :- .. في هذه الخطوة أولا استعرض الصفحة الأولى .. كيف ذلك أنقر على قائمة Window الموجود في شريط القوائم والمحاطة بالدائرة الحمراء انظر الشكل - 4 ثم انقر على الصفحة D:\MyWeb/allosh.htm .. حدد كلمة ( الصفحة الثانية ) المكتوبة بمتن هذه الصفحة .. ثم انقر على زر الربط التشعبي وأكتب اسم الصفحة الثانية lastpage.htm ثم حدد كلمة ( الصفحة الرئيسة ) وأنقر على زر الربط التشعبي وأكتب اسم الصفحة الأم index.htm وبهذا نكون انتهينا من الصفحة الأولى والصفحة الأم .. طبعا ما يجب عمله في الصفحة الثانية لن يحتاج إلى شرح .. لأن الأمر اصبح مفهوم .. وسأقول فقط استعرض الصفحة الثانية وحدد الكلمة انقر على زر ..... إلخ ..

<IMG SRC="http://allosh.atyab.com/images/front9.gif" border=0>
الخطوة العاشرة :- الآن احفط كل المتغيرات بواسطة النقر على زر حفظ ثم صغر نافذة برنامج الفرنت بيج .. وانتقل الى سطح المكتب وافتح برنامج انترنت أكسبلورر Internet Explorer وكأنك تريد أن تتصفح الأنترنت ولكن طبعا بدون اتصال .. في البار الخاص بالعناوين اكتب عنوان موقعك انظر الرسم المقابل ... ثم اكبس مفتاح الادخال Enter .. سيعرض لك الاكسبلورر الصفحة الأم وكأنها في الأنترنت بالضبط .. انقر على كلمة الصفحة لأولى ستنتقل إلى الصفحة الأولى .. حاول أن تتنقل بين الصفحات لإستعراضها .. ثم اغلق الاكسبلورر ..... انتهى الدرس الأول ..

ملاحظة : استعنت باحد المواقع لوضع هذه الدروس يا رب تساعدكم http://www.sabborat.com/ubb/smile.gif

l]

دروس شيقة للغاية الى الامام afro

» كيف تصمم منتدي في 5 دقائق؟.