المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : دورة تصميم المواقع ببرنامج Adobe Dreamweaver CS4 الدرس مفصل 2



romaissa
11-01-2013, بتوقيت غرينيتش 02:51 PM
http://www.dzbatna.com/images/icons/iconrote.gif ط¯ظˆط±ط© طھطµظ…ظٹظ… ط§ظ„ظ…ظˆط§ظ‚ط¹ ط¨ط¨ط±ظ†ط§ظ…ط¬ Adobe Dreamweaver CS4 ط§ظ„ط¯ط±ط³ 2 (http://www.dzbatna.com/t1278904/)





http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/1.gif
نكمل مسيرتنا في دروس تصميم المواقع بواسطة برنامج Adobe.Dreamweaver.CS4
الدرس مفصل الثاني
وسوف يكون درس مفصلنا عن واجهة interface البرنامج والتعامل مع خصائص الصفحة
تحذير:

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

طبعا لقد تأخرت في تنزيل هذا الدرس مفصل ولكن الظروف هي التي لم تسمح بذلك
فنرجو أن تعذرونا
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/2.gif
بسم الله
بأسفل كل صورة شرح طريقة للصورة
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif
عند تشغيل البرنامج سوف تفتح نافذة
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/1.gif

1- فتح الصفحات المحفوظة مسبقا
2- إنشاء صفحة جديدة بإحدى اللغات التي يدعمها البرنامج وهي
HTML
COLDFUSION
PHP
ASP VBSCRIPT
XSLT
CSS
JAVASCRIPT
XML
فنختار HTML وجميع دروسنا سوف تكون على هذه اللغة
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/2.gif

1- قوائم البرنامج
2- إختصار للأرقام 6 و 7 و 8 إظهار كود code الصفحة أو تقسيم الصفحة قسمان : الكود code و العرض أو عرض الصفحة
3- إختصارات للـ ADOBE
4- معالج لإنشاء موقع جديد
5- صفحات الموقع كما هو ظاهر في الصورة يوجد لدينا صفحتان UNTITLED-2 و UNTITLED-1
6- إظهار كود code الصفحة
7- تقسيم الصفحة قسمان : الكود code و العرض
8- عرض الصفحة
9- إستعراض الصفحة لمشاهدتها كأنها صفحة أنترنت اكسبلولر
10- إستعراض الكود code
11- عنوان الصفحة
12- تراجعات
13- إستعراض الصفحة في أحد المتصفحات مثل : أنترنت إكسبلولر و فاير فوكس
14- عرض المساطر أو الشبكة .. إلخ
15- بصرية لمشاهدة بعض الخصائص .. لن نتطرق لها
16- تصنيف الأدوات
17- الأدوات المدرجة تحت تصنيف COMMON
18- واجهة interface الصفحة
19- خيارات الصفحة للغة HTML
20- خيارات الصفحة للغة CSS
21- أنماط للخط والحجم جاهزة
22- أرتباط وذلك عند إدراج صورة أو نص تستطيع تحديد رابط له عند الضغط عليه يشتغل الرابط
23- جعل النص عريض
24- جعل النص مائل
25- ترقيم نقطي
26- ترقيم رقمي
27- ترك هامش لليسار عمله مثل عمل زر TAB من لوحة المفاتيح
28- ترك هامش لليمين عمله مثل عمل زر TAB من لوحة المفاتيح
29- التعديل على خصائص الصفحة
30- مؤشر السهم
31- مؤشر اليد
32- المكبر للتكبير أو التصغير
33- مشاهدة الصفحة بنسبة 100% يمكنك التغيرر


http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif

الأن سوف نشرح طريقة خصائص الصفحة
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/3.gif

أختر خصائص الصفحة
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/4.gif


1- خط الصفحة والأفضل الإختيار كما بالصورة
2- جعل الخط عريض
3- جعل الخط مائل
4- حجم الخط
5- لون الخط
6- لون الخلفية
7- خلفية الصفحة
8- تكرار الخلفية
ويوجد أربع إختيارات
repeat تكرار الخلفية
no-repeat عدم التكرار
repeat-x التكرار بشكل أفقي
repeat-y التكرار بشكل رأسي
9- ترك هامش من جهة اليسار
10- ترك هامش من جهة الأعلى
11- ترك هامش من جهة اليمين
12- ترك هامش من جهة الأسفل
13- خصائص الصفحة للـ css
14- خصائص الصفحة للـ HTML
15- الروابط
16- رأس الصفحة
17- عنوان الصفحة وترميزها
18- تعقب الصورة
19- التعليمات
20- تأكيد الإختيارات
21- إلغاء الأمر
22- تطبيق لمشاهدة التغيرات

http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/5.gif





1- خلفية للصفة
2- لون الخلفية
3- لون النص
4- لون الروابط
5- لون الروابط التي تمت زيارتها
6- لون الروابط النشطة
7- ترك هامش من جهة اليسار
8- ترك هامش من جهة الأعلى
9- ترك هامش للعرض
10- ترك هامش للأرتفاع

http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/6.gif


1- الخطوط الخاصة بالصفحة والأفظل إختيار كما هو موجود بالصورة
2- جعل الخط عريض
3- جعل الخط مائل
4- حجم الخط
5- لون الروابط
6- لون الروابط التي تمت زيارتها
7- لون تجديد الروابط
8- لون الروابط النشطة
9- التشديد على الأستايل style

http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/10.gif


1- الخطوط الخاصة برأس الصفحة ( الهيدر header ) والأفظل إختيار كما هو موجود بالصورة
2- جعل الخط عريض
3- جعل الخط مائل
4- حجم رأس الصفحة 1
5- لون رأس الصفحة 1
6- حجم رأس الصفحة 2
7- لون رأس الصفحة 2
8- حجم رأس الصفحة 3
9- لون رأس الصفحة 3
10- حجم رأس الصفحة 4
11- لون رأس الصفحة 4
12- حجم رأس الصفحة 5
13- لون رأس الصفحة 5
14- حجم رأس الصفحة 6
15- لون رأس الصفحة 6

http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/2/8.gif


1- عنوان الصفحة
2- ترميز الصفحة يمكنك إختيار بين التراميز المختلفة مثل utf-8 و windows والأفظل إختيار كما بالصورة






http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/3.gif

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


كود code:
C:\Documents and Settings\!!!!!!!\
حيث !!!!!! هو الحساب المستخدم على الحاسب


ومن ثم من أعلى المجلد إذهب إلى خيارات (tools)
خيارات المجلد (folder options)
من نافذة خيارات المجلد (folder options)
إذهب إلى عرض
وأنزل قليلا وأختر إظهار الملفات والمجلدات المخفية
ومن ثم موافق
http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/1/16.gif


عندها يظهر مجلد مخفي جديد أسمه Application Data
شغله وبالداخل تجد مجلد أسمه adobe شغله



http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/1/18.gif


تجد مجلد إسمه Dreamweaver CS4 قم بحذفه


http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/1/19.gif


شغل ملف اللغة وأظغط على زر تثبيت setup

http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/d.png (http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/Program/en_us.exe)


http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/6.gif


في الأخير حبيت أقولكم
أني لا أسمح بحذف الحقوق على الصور أو نسب الشرح طريقة إلى غير المنتدى forum
يمكن نقل الموضوع إلى أي منتدى بشرط ذكر المصدر
المصدر
دورة تصميم المواقع ببرنامج Adobe Dreamweaver CS4 الدرس مفصل 2 (http://dawaaljoroh.com/vb/f77/19147/)



مع العلم أن الشرح طريقة من إجتهادي الخاص
ولا تنسوا تابعو الدرس مفصل القادم من دورة تصميم المواقع ببرنامج Adobe Dreamweaver CS4



http://dawaaljoroh.com/dros/Adobe.Dreamweaver.CS4/foasel/5.gif

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى