في هذه التدوينة المرئية، سأقوم بشرح كيفية تقطيع الصورة خطوة بخطوة، إلى موقع متكامل باستخدام CSS وXHTML.
هذا الدرس مدته ساعة وربع الساعة تقريباً 1:16:00، وقد حرصت بما أستطيع على أن يكون سهلاً ومفهوماً، سواء للمبتدئين أو للمحترفين.
لدي ولع بالسيارات بدأ لمجرد أنني كنت أشعر بالملل، اشتريت مجلة سيارات في صباح يوم صيفي وقد كانت تحوي دليلاً لمعظم شركات السيارات ومنتجاتها، دخلت هذا العالم ولم أخرج ولا زلت أتابع أخبار السيارات، العجيب أنني لا أملك رخصة قيادة سيارة ولا أنوي شراء سيارة!
موقعنا اليوم هو موقع سيارات يسمى الخليج للسيارات، موقع متخصص يشارك فيه مجموعة كبيرة من هواة السيارات، القسم الأساسي في الموقع هو المنتدى، والصفحة الرئيسية واجهة تلخص آخر المحتويات وتقدم بعض الخصائص.
لأن تصميم المواقع من جهة تقنية بحتة قد يصيبنا بالملل -ولا يعطيني شخصياً ذلك الشعور بالرضى- سوف أغطي شيئاً من الجانب الإداري في مشاريع تصميم المواقع خلال الخطوات العملية التالية:
تطرأ فكرة إنشاء موقع على بال الكثيرين من مستخدمي الشبكة، وذلك لأسباب مختلفة، منها التجاري والشخصي. وأياً كان الدافع فلا بد من وجوده والتعرف عليه عن كثب لأنه المحرك الرئيسي للمشروع والمحدد لهدف الموقع. عليك أن تجيب نفسك على السؤال: ما الفائدة المرجوة لصاحب الموقع ولزوار الموقع؟ بحيث تكون الفائدة كافية للجميع للمضي قدماً في المشروع. مثلاً عندما فكرت في إنشاء هذه المدونة حرصت على أن يكون هناك مردود لوقتي ولوقت زوار المدونة، لذلك جعلت للمدونة تخصصاً واضحاً -تصميم المواقع- حتى يستفيد المصممون العرب مما أطرحه من أفكار وأستفيد من نقاشها معهم بالإضافة لتكوين معارف في هذه الأوساط.
اليوم نبدأ مع أحد المواقع العربية وهو شبكة البرامج العربية والمعربة وقد استئذنت من صاحبه أن أكتب عنه وتقبل ذلك بروح رياضية وهذا أمر طيب.
الموقع يقدم فائدة وهو متخصص في البرامج العربية والمعربة، لكنه يعاني أيضاً من التشتت سواء في التخصص أو التصميم، وهذه مشاكل أراها في الموقع:
لنبدأ! في كل سبت إن شاء الله سترون مقالة جديدة، لكنها لن تكون مقالات نظرية كما كانت عادتي بل عملية وفي الغالب تحوي صوراً وتوضيحات بدلاً من الكلمات فقط، واليوم سأتحدث عن المواقع المهرجة! وهي فئة من المواقع قد تكون متخصصة أو منوعة، قد تكون مفيدة أو سخيفة، لكنها كلها تشترك في أنها مصممة على شكل حفلة صاخبة مزعجة.
تصور معي أنك سمعت عن محاضرة لشخص ما تحترمه وتحب أن تستمع له، ذهبت إلى قاعة المحاضرة وجلست مع الناس وانتظرت، جاء المحاضر المحترم وبدأ حديثه الشيق، الكل يستمع بانتباه، والمحاضر يتحدث بتركيز وحماس من فوق خشبة المسرح، في منتصف المحاضرة دخل شخص ما من خلف المحاضر وهو يلبس ثياب المهرجين، الشعر أحمر والوجه ملون بالأبيض، وله أنف كبير ويلبس ملابس واسعة، ألوانها زاهية، وبدأ هذا المهرج في عمل حركات مضحكة من خلف المحاضر، أخبرني، هل ستركز على المحاضرة أم المهرج؟
هذا حال المواقع المهرجة، فهي قد تقدم الفائدة لكنها تضع عشرات المهرجين الذين يصرخون كلهم في وقت واحد: أنتبه لي!
تعتبر محركات القوالب من الضروريات لكل مبرمج ذكي حيث يتم فصل البرمجة عن التصميم بشكل كلي، وجميع المبتدئين في تعلم PHP يتعلمون البرمجة مع خلط أكواد التصميم، وأنا أعتقد أن هذا شيء اعتيادي جداً. مع الوقت يبدأ المتعلم في فصل برامجه عن التصميم، وهذا هو الوقت المناسب لاستخدام محركات القوالب.
بعد أن عرفنا أن الموقع يتكون من المحتوى والتصميم، سنناقش في هذه المقالة فكرة الفصل بين المحتوى والتصميم.
الفصل بين المحتوى والتصميم الذي نتحدث عنه هو من جهة المصمم -أو المطور- وليس من جهة زوار الموقع، كما قد يتبادر إلى الأذهان. حيث يكون هذا الفصل -تحديداً- بين هيكل الصفحة المتمثل في XHTML وطريقة عرض أو تقديم الصفحة المتمثل -بشكل أساسي- في CSS.
