تطوير الويب باستخدام Dreamweaver

المرحلة الأولى في تطوير الويب هي مرحلة التخطيط وفيها تقوم بتحليل احتياجات الجمهور، والمتطلبات التقنية والتسويقية. يمكنك أيضًا جمع المعلومات الضرورية لتصميم موقع ويب ونشره والحصول على إجابة عن أسئلة مثل هذه:

• أي موفر خدمة ينبغي عليّ اختياره لاستضافة موقع الويب؟ هل لديّ وصول لتحميل الملفات إلى خادم النشر؟
• ما اسم النطاق المستخدم لموقع الويب؟
• في حالة ترحيل المواقع الحالية إلى Dreamweaver، ما الملفات والأصول المخزنة حاليًا؟ هل لديّ وصول للخادم حيث يتم تخزين هذه المعلومات؟
• في حالة الحاجة إلى موقع ويب ديناميكي، أي خادم يمكنني استخدامه لاختبار ما إذا كانت البيانات التي يتم استخدامها معروضة بشكل ديناميكي؟ هل أحصل على تفاصيل خادم تطبيق الويب التي أريد استخدامها لتحميل الملفات الديناميكية؟
• ما نوع الأصول المطلوبة لموقع الويب؟
• هل سيتم تصميم هذه الأصول من البداية؟ في حالة توفر الأصول بالفعل، هل لديّ وصول إليها؟
• ما التطبيقات التي أحتاج إلى استخدامها لتصميم الأصول؟
• هل أنا أخطط لإنشاء موقع ويب تفاعلي؟

على فرض أنك تفهم بوضوح مواقع الويب التي تريد تطويرها وطريقة ومكان تخزينها، واخترت Dreamweaver وCreative Cloud لعملية تطوير الويب، فعليك متابعة العمل إلى الخطوة التالية.

تحقق أن لديك جميع الأصول المطلوبة لموقع الويب الخاص بك. واجمعها وقم بتنظيمها معًا في مجلداتك المحلية أو في مكتبات Creative Cloud الخاصة بـ Adobe.

إنشاء مستند جديد في Dreamweaver باستخدام:

• مستند فارغ جديد،
• قوالب البدء الموضوعة في حزم مع Dreamweaver، أو 
• ملفات القالب (*.dwt) التي تم إنشاؤها بواسطة شخص آخر

استغرق دقائق قليلة للتعرف على مساحة عمل Dreamweaver. ابحث عن مساحة عمل مريحة لك، وعين نسق ألوان لها. أعد تنظيم مختلف اللوحات بطريقة تناسبك.

قم بإعداد موقعك في Dreamweaver. التعيين بخصوص إنشاء بنية مجلد مع ملفات وأصول. بعد تنظيم المعلومات الخاصة بك وتحديد بنية للموقع، يمكنك البدء في إنشائه. (راجع حول مواقع Dreamweaver.)

في هذه المرحلة، من الجيد أيضًا إعداد اتصالات بالخوادم البعيدة، وإعداد خوادم اختبار (إذا كان لديك محتوى ديناميكي). 

ابدأ كتابة التعليمات البرمجية لصفحات الويب الخاصة بك في طريقة عرض Code أو تصميمها في طريقة عرض Design / Live.

إذا كنت تنوي استخدام تركيبات Photoshop، يمكنك استخراجها في Dreamweaver والعمل عليها أيضًا. لمزيد من المعلومات حول العمل باستخدام تركيبات Photoshop، راجع الاستخراج في Dreamweaver.

يمكنك إضافة عناصر تصميم مثل النصوص، وصور التمرير، ومخططات الصور، والألوان، والأفلام، والصوت، وارتباطات HTML، والجداول، بالإضافة إلى المزيد.

حدد نمط مظهر صفحة الويب الخاصة بك باستخدام CSS. 

يمكنك العمل باستخدام CSS بطرق مختلفة في Dreamweaver:

• يمكنك تقديم التعليمات البرمجية إلى CSS. للحصول على معلومات حول ميزات كتابة التعليمات البرمجية في Dreamweaver's التي تساعدك في كتابة تعليمات CSS البرمجية الخاصة بك، راجع بيئة كتابة التعليمات البرمجية في Dreamweaver.
• إذا لم تكن على دراية كبيرة بإنشاء صفحات CSS، فيمكنك استخدام لوحة CSS Designer للمساعدة في إنشاء CSS الخاص بك. لمزيد من المعلومات، راجع تخطيط الصفحات باستخدام CSS Designer.
• إذا كنت تفضل العمل من خلال ملفات Sass وLess، فإن Dreamweaver يدعم هذا الخيار أيضًا، مما يتيح لك جلب ملفات Sass وLess في موقع Dreamweaver الخاص بك والعمل باستخدامها. ثم يقوم Dreamweaver بتحويلها برمجيًا تلقائيًا (أو يمكنك اختيار تحويلها برمجيًا يدويًا) ومشاهدة نتائج تغييرات CSS في الوقت الحقيقي. للحصول على معلومات حول استخدام ملفات Sass وLess مع Dreamweaver، راجع معالجات CSS الأولية.

إعداد تطبيق ويب لإنشاء محتوى ديناميكي.

تحتوي العديد من مواقع الويب على صفحات ديناميكية تتيح للزائرين عرض المعلومات المخزنة في قواعد البيانات، وعادةً ما تسمح لبعض الزائرين بإضافة معلومات جديدة وتحرير المعلومات الموجودة في قواعد البيانات. لإنشاء هذه الصفحات، يجب أولاً إعداد خادم ويب وخادم تطبيقات، وإنشاء موقع Dreamweaver أو تعديله، والاتصال بقاعدة بيانات. لمزيد من المعلومات، راجع المواقع الديناميكية والصفحات ونماذج الويب.

إنشاء صفحات ديناميكية.

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

يمكنك تعيين الصفحة الخاصة بك لعرض سجل واحد أو سجلات متعددة في المرة الواحدة، وعرض أكثر من صفحة سجلات، وإضافة ارتباطات خاصة للانتقال من صفحة سجلات إلى الصفحة التالية (والسابقة)، وإنشاء عدّادات سجلات لمساعدة المستخدمين على تعقب السجلات. لمزيد من المعلومات، راجع المواقع الديناميكية و الصفحات ونماذج الويب.

اختبار موقع الويب ومعاينته ونشره. 

أثناء إنشاء الصفحات، أنت بحاجة لمعاينتها لمشاهدة مواقع الويب التي تتقدم وفقا للتصميم. يمكنك كتابة التعليمات البرمجية في طريقة العرض Split والحفاظ على طريقتي عرض Code وLive جنبا لجنب.

تستطيع أيضًا معاينة صفحات الويب في الوقت الفعلي على المستعرض.

وإذا لم تكن بحاجة إلى تجربة معاينة مباشرة، فيمكنك استخدام المعاينة العادية في تجربة المستعرض.

في حالة تحديد الاتصالات بالخوادم البعيدة بالفعل، فلنشر مواقعك، أنت بحاجة لوضعها في الخادم البعيد لجعلها مباشرة.