دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل

<<<اليوم الثاني >>>

عمل صفحة وحفظها

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

1. من القائمة في أعلى البرنامج اختر File>New.

ومن النافذة New Document اختر HTML لاحظ الصورة:

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Newdoc

2. اضغط ضغطا مزدوجا على الخيار HTML، أو اضغط Create.

3. في الصفحة التي ستفتح عندك أكتب أي نص يعجبك واختر له عنوان مناسب، أريد أن يظهر ما كتبت كالتالي:

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Text

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Text

4.
بعد هذا النص اضغط Enter من على لوحة المفاتيح لعمل سطر جديد، ومن شريط
الإدراج اضغط على Image، أيضا لإدراج صورة إذهب إلى قائمة Insert في أعلى
البرنامج واختر Image.
ومن النافذة التي ستظهر لك أدخل إلى أي مجلد به صور (My Pictures مثلا) واختر الصورة التي تعجبك.

5. ظلل السطر الأول، ومن شريط الإدراج اختر Text بدلا من Common من الخيارات التي لديك.
ومن الأزرار التي تظهر لديك اضغط على H2، سيتغير حجم الخط.

6. أيضا ظلل السطر الثاني، ومن لوحة الخصائص بالأسفل غير نوع الخط Font إلى Tahoma، والحجم Size إلى 10 points.

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

من القائمة التي تظهر عند اختيار خط معين Font اختر Edit Font list، وأضف Tahoma كما في الصورة:

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Add

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Add

7. احفظ الصفحة التي قمت بعملها: File>Save، باسم index.htm داخل مجلد باسم myweb (سنستخدمه بعد ذلك).
8. أغلق الصفحة، ولا تغلق البرنامج:

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Close

9. افتح الصفحة File>open>index.htm من المجلد myweb.
10. ولتستعرض صفحتك في المستعرض اضغط على الزر Preview من شريط الأدوات، واختر البرنامج الذي تريد الإستعراض فيه (لدي IE).

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Preview

دورة Dreamweaver [اليوم الثاني]: عمل صفحة وحفظها + التنقل بين وضعيات العمل Preview

ملاحظة:
تستطيع عمل صفحة جديدة وحفظها وفتح الصفحات من خلال الشريط Standard،
ولإظهار هذا الشريط إذهب إلى: View>Toolbars>Standard.

التنقل بين وضعيات العمل

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

وضعية التصميم Design:

قمنا في الدرس الماضي بتحرير صفحة index.htm في وضعية التصميم.

وضعية الشيفرة Code:

انتقل إلى وضعية الشيفرة كما تعلمت سابقا.
افتح الصفحة index.htm التي قمت بعملها في الدرس الثاني.
غير الكود التالي:
<h2>text</h2>
إلى:
<h3>text</h3>
اضغط على زر Refresh.
إرجع إلى وضعية التصميم Design ولاحظ الإختلاف.

وضعية التصميم والشيفرة معا Split:

إذهب إلى القوائم في أعلى البرنامج:
File>Revert
سيسألك عما إذا كنت تريد إعادة الصفحة لما كانت عليه وتضييع ما قمت بتغييره.. أضغط Yes.
انتقل إلى وضعية التصميم والشيفرة معا Split كما تعلمت سابقا.
كرر الخطوات السابقة في وضعية الشيفرة.

انهينا اليوم من هذا الدرس اتمني ان اري تطبيقاتكم
مع تحياتي
Madridista

شكراااا