07 آب, 2007
برنامج Dreamweaver MX 2004
من خلال بحثي واستشارتي لموقع قوقل عن البرامج التي تستخدم في تطوير صفحات الويب حصلت على برنامج Dreamweaver MX 2004 فأحببت أن أعطيكم شرح موجز عن واجهة هذا البرنامج الرائع وإليكم هذا الشرح الموجز:Dreamweaverبرنامج برنامج سهل الاستخدام وواجهته غنية بالأدوات التي يسهل الوصول إليها، واللوحات التي تعطيك تحكما أكبر، وهو من أفضل أدوات تحرير صفحات الويب التي تعمل بتقنية WYSIWYGلنتعرف على هذا البرنامج لا بد من نظرة سريعة على شاشة البدء وساحة العمل، ولا بد أيضا من التعرف على استخدام بعض الأدوات المهمة وهذه صورة لواجهة البرنامج. شريط الإدراج:
يحتوي هذا الشريط على مجموعة من الأزرار التي بها تستطيع إدراج العناصر إلى صفحتك كالصور والروابط والجداول وملفات الصوت وملفات فلاش وما إلى ذلك.
طبعا لن تجد كل هذه الأدوات أمامك الآن، فلو كانت كذلك ما استطعت استخدامها نتيجة تكديسها معا ، لكنها مرتبة بطريقة جميلة ومريحة، في شريط الإدراج تجد كلمة Common وبجانبها سهم صغير أضغط عليه واختر الخيار الثاني من القائمة المنسدلة وهو Layout، منه تستطيع إدراج الجداول Tables والطبقات Layers والإطارات Frames، أما في النسخة الأقدم من MX فتجد بدلا من القائمة المنسدلة مجموعة من الخيارات (ألسنة) مصفوفة في أعلى الشريط، طبعا ذكرت هذا كي لا يواجه مستخدمو النسخة الأقدم المشاكل.
شريط الأدوات:
ويحتوي على أزرار تساعدك على التنقل بين وضعيات العمل الثلاث: التصميم والشيفرة والإثنان معا.
التصميم:
يفترض الآن أنك في وضعية التصميم، إذا لم تكن كذلك اضغط على زر Design من شريط الأدوات.
الشيفرة: اضغط على زر Code للإنتقال إلى وضعية الشيفرة.
التصميم والشيفرة معا: اضغط على زر Split للإنتقال إلى هذا الوضعية.
أيضا يحتوي شريط الأدوات على أزرار أخرى تساعدك في إدارة موقعك.
مجموعة اللوحات:
في دريم ويفر تجد العديد من اللوحات التي تساعدك على معاينة موقعك وتغيير وتعديل المعلومات في صفحاته من خلال المحتوى.
اضغط على اسم اللوحة فقط لعرضها ومرة أخرى أيضا لإغلاقها.
نافذة العمل:
هذه هي الصفحة التي تعمل عليها والتي ستقوم بإخراجها في النهاية.
الخصائص:
كل عنصر في دريم ويفر له خصائص معينة، بمجرد الضغط عليه تتغير لوحة الخصائص حسب ما يناسب ذلك العنصر. عمل صفحة وحفظها
إن الموقع يتكون من عدة صفحات مترابطة، سنتعلم الآن كيفية عمل صفحة جديدة في دريم ويفر وحفظها.
1. من القائمة في أعلى البرنامج اختر File>New.
ومن النافذة New Document اختر HTML لاحظ الصورة:
2. اضغط ضغطا مزدوجا على الخيار HTML، أو اضغط Create.
3. في الصفحة التي ستفتح عندك أكتب أي نص يعجبك واختر له عنوان مناسب، أريد أن يظهر ما كتبت كالتالي:
4. بعد هذا النص اضغط Enter من على لوحة المفاتيح لعمل سطر جديد، ومن شريط الإدراج اضغط على Image، أيضا لإدراج صورة إذهب إلى قائمة Insert في أعلى البرنامج واختر Image.
ومن النافذة التي ستظهر لك أدخل إلى أي مجلد به صور (My Pictures مثلا) واختر الصورة التي تعجبك.
5. ظلل السطر الأول، ومن شريط الإدراج اختر Text بدلا من Common من الخيارات التي لديك.
ومن الأزرار التي تظهر لديك اضغط على H2، سيتغير حجم الخط.
6. أيضا ظلل السطر الثاني، ومن لوحة الخصائص بالأسفل غير نوع الخط Font إلى Tahoma، والحجم Size إلى 10 points.
طريقة اختيار نوع الخط Tahoma كالتالي:
من القائمة التي تظهر عند اختيار خط معين Font اختر Edit Font list، وأضف Tahoma كما في الصورة:
7. احفظ الصفحة التي قمت بعملها: File>Save، باسم index.htm داخل مجلد باسم myweb (سنستخدمه بعد ذلك).
8. أغلق الصفحة، ولا تغلق البرنامج:
9. افتح الصفحة File>open>index.htm من المجلد myweb.
10. ولتستعرض صفحتك في المستعرض اضغط على الزر Preview من شريط الأدوات، واختر البرنامج الذي تريد الإستعراض فيه (لدي IE).
ملاحظة: تستطيع عمل صفحة جديدة وحفظها وفتح الصفحات من خلال الشريط Standard، ولإظهار هذا الشريط إذهب إلى: View>Toolbars>Standard.
التنقل بين وضعيات العمل
تعلمنا كيف ننتقل بين الوضعيات الثلاث: التصميم، والشيفرة، والتصميم والشيفرة معا.
وضعية التصميم Design:
قمنا في الدرس الماضي بتحرير صفحة index.htm في وضعية التصميم.
وضعية الشيفرة Code:
انتقل إلى وضعية الشيفرة كما تعلمت سابقا.
افتح الصفحة index.htm التي قمت بعملها في الدرس الثاني.
غير الكود التالي:
<h2>text</h2>
إلى:
<h3>text</h3>
اضغط على زر Refresh.
إرجع إلى وضعية التصميم Design ولاحظ الإختلاف.
وضعية التصميم والشيفرة معا Split:
إذهب إلى القوائم في أعلى البرنامج:
File>Revert
سيسألك عما إذا كنت تريد إعادة الصفحة لما كانت عليه وتضييع ما قمت بتغييره.. أضغط Yes.
انتقل إلى وضعية التصميم والشيفرة معا Split كما تعلمت سابقا.
كرر الخطوات السابقة في وضعية الشيفرة. عمل موقع ويب في دريم ويفر
أخذنا شرحا سريعة على واجهة البرنامج، وفصلنا بعض الأشياء الضرورية، قمنا بعمل صفحة وعايناها في المستعرض.
لكن هل قمنا بعمل موقع؟ إلى الآن.. لا
موقع الوب في دريم ويفر عبارة عن مجلد نقوم بتعريفه في دريم ويفر وبذلك نستطيع إدارة موقعنا، والتحكم به يصبح سهلا.. كيف؟
إن موقع الوب في دريم ويفر يحتوي على جميع صفحات الموقع وغيرها من الوسائط والعناصر، كل هذا سيعرض في دريم ويفر مما يسهل عمليات الحذف وتغيير الأسماء والأماكن، هذا يسهل على دريم ويفر تجديد الروابط المكسورة.
أيضا يسهل ذلك معاينة وإدارة الملفات على السيرفر من خلال دريم ويفر.
1. لعمل موقع ويب في دريم ويفر اتبع الآتي:
Site>Manage Sites
2. من النافذة Manage Sites اضغط New، ومن القائمة المنسدلة اختر Site.
ملاحظة: في النسخة الأقدم من MX سيكون ذلك هكذا: Site>New Site
3. لديك في أعلى النافذة Site Definition لديك خياران Basic و Advanced سنختار هنا Basic.
4. في مربع الإسم أكتب اسم موقعك وسيكون عنوان موقعنا هنا My Web.
5. اضغط Next.
6. الآن سيسألك إذا ما كنت تريد استخدام لغة برمجة معينة في حالتنا طبعا لن نستخدم ذلك اختر No.
7. اضغط Next.
8. في هذه النافذة يعطيك خياران:
الأول: عمل الموقع محليا ثم رفعه إلى سيرفر
الثاني: عمل الموقع على السيرفر حالا
9. اختر الخيار الأول لأننا سنتعلم كيف نرفع الموقع لاحقا.
10. واختر أين ستضع مجلد الموقع، في حالتنا سنستخدم المجلد الذي قمنا بإنشاءه وهو myweb، وهذا عندي:
D:My Documentsmyweb
11. اضغط Next.
12. كيف تتصل بموقعك يعطيك خيارات:
None لا شيء.
FTP عن طريق بروتوكول FTP.
Local/Network إذا كنت تستخدم مجلد في شبكة أو على سيرفر في جهازك.
RDS إذا كنت تتصل بموقعك عن طريق RDS.
SourceSafe Database إذا كنت تتصل بموقعك عن طريق SourceSafe Database.
WebDAV إذا كنت تتصل بموقعك عن طريق WebDAV.
a. في حالتنا سنستخدم FTP (لمن لديه موقع يدعم الـFTP) وعليه يجب ملء البيانات التي سيطلبها البرنامج كما تعطيك ا
يحتوي هذا الشريط على مجموعة من الأزرار التي بها تستطيع إدراج العناصر إلى صفحتك كالصور والروابط والجداول وملفات الصوت وملفات فلاش وما إلى ذلك.
طبعا لن تجد كل هذه الأدوات أمامك الآن، فلو كانت كذلك ما استطعت استخدامها نتيجة تكديسها معا ، لكنها مرتبة بطريقة جميلة ومريحة، في شريط الإدراج تجد كلمة Common وبجانبها سهم صغير أضغط عليه واختر الخيار الثاني من القائمة المنسدلة وهو Layout، منه تستطيع إدراج الجداول Tables والطبقات Layers والإطارات Frames، أما في النسخة الأقدم من MX فتجد بدلا من القائمة المنسدلة مجموعة من الخيارات (ألسنة) مصفوفة في أعلى الشريط، طبعا ذكرت هذا كي لا يواجه مستخدمو النسخة الأقدم المشاكل.
شريط الأدوات:
ويحتوي على أزرار تساعدك على التنقل بين وضعيات العمل الثلاث: التصميم والشيفرة والإثنان معا.
التصميم:
يفترض الآن أنك في وضعية التصميم، إذا لم تكن كذلك اضغط على زر Design من شريط الأدوات.
الشيفرة: اضغط على زر Code للإنتقال إلى وضعية الشيفرة.
التصميم والشيفرة معا: اضغط على زر Split للإنتقال إلى هذا الوضعية.
أيضا يحتوي شريط الأدوات على أزرار أخرى تساعدك في إدارة موقعك.
مجموعة اللوحات:
في دريم ويفر تجد العديد من اللوحات التي تساعدك على معاينة موقعك وتغيير وتعديل المعلومات في صفحاته من خلال المحتوى.
اضغط على اسم اللوحة فقط لعرضها ومرة أخرى أيضا لإغلاقها.
نافذة العمل:
هذه هي الصفحة التي تعمل عليها والتي ستقوم بإخراجها في النهاية.
الخصائص:
كل عنصر في دريم ويفر له خصائص معينة، بمجرد الضغط عليه تتغير لوحة الخصائص حسب ما يناسب ذلك العنصر. عمل صفحة وحفظها
إن الموقع يتكون من عدة صفحات مترابطة، سنتعلم الآن كيفية عمل صفحة جديدة في دريم ويفر وحفظها.
1. من القائمة في أعلى البرنامج اختر File>New.
ومن النافذة New Document اختر HTML لاحظ الصورة:
2. اضغط ضغطا مزدوجا على الخيار HTML، أو اضغط Create.
3. في الصفحة التي ستفتح عندك أكتب أي نص يعجبك واختر له عنوان مناسب، أريد أن يظهر ما كتبت كالتالي:
4. بعد هذا النص اضغط Enter من على لوحة المفاتيح لعمل سطر جديد، ومن شريط الإدراج اضغط على Image، أيضا لإدراج صورة إذهب إلى قائمة Insert في أعلى البرنامج واختر Image.
ومن النافذة التي ستظهر لك أدخل إلى أي مجلد به صور (My Pictures مثلا) واختر الصورة التي تعجبك.
5. ظلل السطر الأول، ومن شريط الإدراج اختر Text بدلا من Common من الخيارات التي لديك.
ومن الأزرار التي تظهر لديك اضغط على H2، سيتغير حجم الخط.
6. أيضا ظلل السطر الثاني، ومن لوحة الخصائص بالأسفل غير نوع الخط Font إلى Tahoma، والحجم Size إلى 10 points.
طريقة اختيار نوع الخط Tahoma كالتالي:
من القائمة التي تظهر عند اختيار خط معين Font اختر Edit Font list، وأضف Tahoma كما في الصورة:
7. احفظ الصفحة التي قمت بعملها: File>Save، باسم index.htm داخل مجلد باسم myweb (سنستخدمه بعد ذلك).
8. أغلق الصفحة، ولا تغلق البرنامج:
9. افتح الصفحة File>open>index.htm من المجلد myweb.
10. ولتستعرض صفحتك في المستعرض اضغط على الزر Preview من شريط الأدوات، واختر البرنامج الذي تريد الإستعراض فيه (لدي IE).
ملاحظة: تستطيع عمل صفحة جديدة وحفظها وفتح الصفحات من خلال الشريط Standard، ولإظهار هذا الشريط إذهب إلى: View>Toolbars>Standard.
التنقل بين وضعيات العمل
تعلمنا كيف ننتقل بين الوضعيات الثلاث: التصميم، والشيفرة، والتصميم والشيفرة معا.
وضعية التصميم Design:
قمنا في الدرس الماضي بتحرير صفحة index.htm في وضعية التصميم.
وضعية الشيفرة Code:
انتقل إلى وضعية الشيفرة كما تعلمت سابقا.
افتح الصفحة index.htm التي قمت بعملها في الدرس الثاني.
غير الكود التالي:
<h2>text</h2>
إلى:
<h3>text</h3>
اضغط على زر Refresh.
إرجع إلى وضعية التصميم Design ولاحظ الإختلاف.
وضعية التصميم والشيفرة معا Split:
إذهب إلى القوائم في أعلى البرنامج:
File>Revert
سيسألك عما إذا كنت تريد إعادة الصفحة لما كانت عليه وتضييع ما قمت بتغييره.. أضغط Yes.
انتقل إلى وضعية التصميم والشيفرة معا Split كما تعلمت سابقا.
كرر الخطوات السابقة في وضعية الشيفرة. عمل موقع ويب في دريم ويفر
أخذنا شرحا سريعة على واجهة البرنامج، وفصلنا بعض الأشياء الضرورية، قمنا بعمل صفحة وعايناها في المستعرض.
لكن هل قمنا بعمل موقع؟ إلى الآن.. لا
موقع الوب في دريم ويفر عبارة عن مجلد نقوم بتعريفه في دريم ويفر وبذلك نستطيع إدارة موقعنا، والتحكم به يصبح سهلا.. كيف؟
إن موقع الوب في دريم ويفر يحتوي على جميع صفحات الموقع وغيرها من الوسائط والعناصر، كل هذا سيعرض في دريم ويفر مما يسهل عمليات الحذف وتغيير الأسماء والأماكن، هذا يسهل على دريم ويفر تجديد الروابط المكسورة.
أيضا يسهل ذلك معاينة وإدارة الملفات على السيرفر من خلال دريم ويفر.
1. لعمل موقع ويب في دريم ويفر اتبع الآتي:
Site>Manage Sites
2. من النافذة Manage Sites اضغط New، ومن القائمة المنسدلة اختر Site.
ملاحظة: في النسخة الأقدم من MX سيكون ذلك هكذا: Site>New Site
3. لديك في أعلى النافذة Site Definition لديك خياران Basic و Advanced سنختار هنا Basic.
4. في مربع الإسم أكتب اسم موقعك وسيكون عنوان موقعنا هنا My Web.
5. اضغط Next.
6. الآن سيسألك إذا ما كنت تريد استخدام لغة برمجة معينة في حالتنا طبعا لن نستخدم ذلك اختر No.
7. اضغط Next.
8. في هذه النافذة يعطيك خياران:
الأول: عمل الموقع محليا ثم رفعه إلى سيرفر
الثاني: عمل الموقع على السيرفر حالا
9. اختر الخيار الأول لأننا سنتعلم كيف نرفع الموقع لاحقا.
10. واختر أين ستضع مجلد الموقع، في حالتنا سنستخدم المجلد الذي قمنا بإنشاءه وهو myweb، وهذا عندي:
D:My Documentsmyweb
11. اضغط Next.
12. كيف تتصل بموقعك يعطيك خيارات:
None لا شيء.
FTP عن طريق بروتوكول FTP.
Local/Network إذا كنت تستخدم مجلد في شبكة أو على سيرفر في جهازك.
RDS إذا كنت تتصل بموقعك عن طريق RDS.
SourceSafe Database إذا كنت تتصل بموقعك عن طريق SourceSafe Database.
WebDAV إذا كنت تتصل بموقعك عن طريق WebDAV.
a. في حالتنا سنستخدم FTP (لمن لديه موقع يدعم الـFTP) وعليه يجب ملء البيانات التي سيطلبها البرنامج كما تعطيك ا
تعليقات
good job
Fatama
| 02/03/2008, 07:39
good job
Fatama
| 02/03/2008, 07:39
يسيبلار ىلال
رلا
| 10/03/2008, 18:21
لو امكن اعطاء مهارات متقدمة فهذه مجرد اساسيات
صفاء
| 22/05/2008, 08:53
انا عندي مشكله ومش عهارف اعمل فيها ايه أرجو أن أحصل علي حلها من فضلكم.
انا دلوقتي عملت صفحه Registration وجيت اربطها بقاعد البيانات sql server 2005بعد ما اربطهم ببعض يتحول الصفحه من لغه HTML الي لغه ASP.NET ولم اعمل F12 لكي اري ما الذي فعلته لم يشتغل معي الصفحه
فما هو الحل ؟؟؟؟؟؟
عاصم حسن
| 22/11/2008, 14:30
مش عارف
GOOD JOB
| 22/11/2008, 14:32
A service provided by Al Bawaba
good job