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

اليوم الأول

مقدمة عن الاكسبرشن ويب 3

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

الكسبرشن ويب أداة تهتم بثلاث نواحي رئيسية:

1. إنشاء مواقع تتماشى مع المعايير العالمية بسهولة
2. إنشاء مواقع غنية وفعالة وتواكب ما تحويه الانترنت حاليا من ميزات وسائط وحركة
3. دعم للتقنيات المختلفة والتي لايخلو منها أي موقع مثل لغات برمجة الويب المختلفة

قمت بعد ذلك بالتعريف ببيئة عمل الاكسبرشن ويب كما توضحه الصورة التالية:

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

قمت بعد ذلك باستعراض لوائح ونوافذ التصميم المختلفة التي تساعد المصمم في عمله دون الحاجة للرجوع للكود ما أمكن:

قام المتدربون بعدها باتباع تطبيق عملي أو مايسمى باللاب بحيث تمكنوا من استعراض ماسبق خلال ساعة من الوقت. أدركت من خلال هذه الساعة أن البعض واجهو صعوبات لفهم بعض التقنيات المستخدمة، ولكن كانت بداية جيدة لمعرفة المزيد وتطوير المعلومات. أحببت من خلال هذا اللاب أن أعطيهم بعض الخلفية في بعض المواضيع، ولمعرفة المزيد يمكنهم زيارة مواقع مثل www.w3schools.com والتي تفصل مبادئ تقنيات الانترنت المختلفة.

معاينة الموقع وتحليله

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

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

2. تحليل التوافقية مع المعايير: ينتشر بالإنترنت متصفحات متعددة وتدعم تقنيات مختلفة. ولتسهيل عمل المصمم، يجب عليه تحديد المعايير المختلفة التي سيقوم باتباعها في تصميم حتى يتم استعراض موقعه بشكل صحيح في جميع المتصفحات المتوفرة (مثل الانترنت إكسبلورر، الفايرفوكس، الكروم، وغيرها).

3. تحليل سمات الموقع والتأكد من خلوها من الأخطاء (السي إس إس) وكذلك إنشاء تقارير بالسمات المستخدمة في الموقع.

استعرضت كذلك طرق معاينة الموقع للتأكد من التصميم النهائي والتي تتشكل في التالي:

1. المعاينة العادية: وذلك بالضغط على إف12، حيث يقوم الإكسبرشن ويب باستعراض الموقع في المتصفح المفضل لديك (حيث يمكنك من الإختيار بين عدة إختيارات).

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

3. المعاينة السريعة: والتي تفتح نافذة خاصة لتمكن من معاينة موقعك (أو حتى مواقع أخرى) ومقارنة متصفحين مختلفين في آن واحد.

قام بعد ذلك المتدربون بتطبيق عملي على ماسبق خلال ساعة من الزمن.

إنشاء موقعك الأول

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

كان من المهم أن يقوم المتدربون بتطبيق عملي مطول على انشاء موقع من الصفر، وكان ذلك عن طريق اللاب الثاني الذي استخدمته من موقع مايكروسوفت إكسبرشن للمعلمين كما في الراط التالي: Microsoft Expression for Educators

كان هذا التطبيق العملي أساسي للإكسبرشن ويب ومن خلاله تمكن المتدربون من تطبيق خطوة بخطوة ماتعلموه خلال اليوم. لاشك أن البعض واجه بعض الصعوبات، ولكن الصعوبات والأخطاء هب الوسيلة للتعلم!

يجدر بي ذكر أن هذا التطبيق العملي يتكون من ثلاث أجزاء:

1. تصميم صور الموقع بالإكسبرشن ديزاين: وكان هذا اختياري لمن أراد أن يتعمل تصميم الصور

2. إنشاء الموقع: وهذا الجزء ضروري لكي يتكمن المتدرب من بناء موقع من الصفر ومعرفة سهولة ذلك والأدوات المتوفرة

3. إنشاء موقع متقدم: وهذا أيضاً اختياري ويتطرق لمواضيع أكثر، وكان واجب منزلي لمن أحب القيام به

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

اليوم الثاني

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

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

التعامل مع محتوى الوسائط

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

تطرقت بعد ذلك إلى تقنية "الدييب زووم" والتي تمكن انشاء مكون تفاعلى مبني على السيلفرلايت والذي يجمع مجموعة هائلة من الصور بدقات عالية، ثم تمكين المستخدم من التكبير والتصغير بسرعات عالية وتفاعلية.

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

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

تطوير مواقع البي إتش بي

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

تمكن المتدربون بعدها من التطبيق العملي والذي تضمن تحميل وتركيب مشغل البي إتش بي، وعمل صفحات بسيطة لاستخداماتها. بعض المتدربين واجهوا صعوبات لعدم وجود خلفية برمجية لديهم، ولكن طرق التعلم كثيرة ومتوفرة لمن أراد الخوض في هذا المجال مثل: www.w3schools.com و www.php.net

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

التطوير باستخدام الأي إس بي.نت

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

قام المتدربون بتطبيق عملي على استخدام تقنية الأي إس بي.نت وإنشاء صفحة تقرأ من ملف إكس إم إل وتعرض محتواه بشكل منسق وجميل. لتعلم الأي إس بي.نت يمكن للمتدرب البدء بوقع www.asp.net

نشر الموقع على الويب

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

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

انتهى اليوم الثاني بعدة أسئلة واستفسارات ونقاشات حول التصميم والتطوير. وتم التدريب بحمد من الله ومنة.

أرجو من جميع الذين حضروا التدريب ترك ملاحظاتهم هنا وعدم الحرج بذكر أي اقتراحاتهم يرونها في صالح التدريب في المستقبل.