هرم إحتراف تصميم المواقع

[رضا]

السلام عليكم ..

كنت أتحدث مع أحدهم قبل فترة حول تصميم المواقع و إحترافيات هذا الفن و كنا قد تطرقنا في الموضوع إلى نظرة عامة لمصممي المواقع و الذين حصرهم محدثي حول أحد هؤلاء الأربعة :
- إما مصمم لا يفقه لا بالتصميم الفني ولا بالبرمجة !! ..
- أو مصمم لديه خبرة بالتصميم الفني لكن تنقصه المعرفة بالبرمجة !! ..
- أو مصمم لديه خبرة بالبرمجة لكن ليس له خبرة بتاتاً في مجال التصميم الفني !! ..
- أو مصمم وهبه الله معرفة بالبرمجة و بالتصميم الفني و هذا لعله سعيد الحظ من بينهم !! ..

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

و بشكل عام و من خلال معرفتي البسيطة بتصميم المواقع أحببت أن أكتب هذا الموضوع و المتعلق بالأسس و العوامل التي من شأنها - حسب رأيي الشخصي - أن تكون بإذن الله من أسباب إنشاء الموقع الإحترافي ..

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

[رضا]

* التصميم الفني Graphics :
هذا عامل أساسي يجب أن يتعلمه كل راغب بتصميم المواقع .. لأنه يمكن تشبيه التصميم الفني بالثوب الذي تلبسه .. فقد تلبس ثوباً ناصعاً مرتباً .. و قد تلبس ثوباً بالياً غير مكوي .. في كلا الحالتين سوف يكون الثوب على جسمك لكن إما تظهر بشكل جميل أو بشكل غير لائق .. و كذا المواقع .. في كلا الحالتين ستعرض مواد موقعك و لكن ستحتاج لتعلم التصميم الفني لكي يظهر موقعك بأفضل صورة ..
و المقصود بالتصميم الفني هو القدرة على تحرير الصور و التعديل عليها و عمل التأثيرات عليها .. و يستخدم غالباً في ذلك برنامجين هم أشهر برنامجين بهذا المجال ( الفوتوشوب و البينت شوب ) و كل مازادت معرفتك بهذا الفن و هذا المجال زادت إحترافية موقعك .. وما أقصده بنظرياً و عملياً .. أن تكون لديك المعرفة بإختيار الألوان و الذوق الفني و حسن ترتيب النصوص و الأشكال و الصور و عملياً أي بالتعامل مع أدوات البرنامج و مؤثراته و خلافه .. خصوصاً و أن تصميم جرافيكس الموقع و صوره له خصائص و أسس يجب تعلمها ..
و أنصح كل راغب بإحتراف تصميم المواقع أن يعكف بداية على تعلم برامج التصميم الفني إلى أن يرى في نفسه القدرة على إخراج أي موقع بأفضل صورة ..
طبعاً مما يذكر في خصائص التصميم الفني الخاص بالمواقع أن يتحلى بقياسات معروفة ولا يكون بقياسات عجيبة .. كذلك أن يكون تصميماً مفتوحاً بقدر الإمكان و المقصود بهذا أن يفتح بشكل طبيعي على جميع مقاسات الشاشات بكل سلاسة .. كما يكون المساحة الحرة للنص أكبر من مساحة الصور و التصميم الفني .. و أن يحاول المصمم فيه أن يكون محتوياً على ألوان مريحة للعين ولا تكون صاخبة زيادة عن اللزوم .. كما من المهم جداً أن تكون الصور بدقة جيدة لا تظهر بشكل مشوه .. و لمن يعلل وضع الصور بدقة ضعيفة حتى تفتح بشكل سريع أقول له أنه الحمدلله أن الإتصالات تطورت الآن و ما كانت عليه سرعة الإنترنت قبل خمس سنوات أصبحت الآن ربما من المنقرضات .. نسبة كبيرة من المتصفحين يعملون على ADSL و من بقي على Dial Up زادت سرعته عالغالب .. لكن بشكل عام حاول أن لا يزيد جرافيكس موقعك كله من أيقونات و صور و إطارات عن حجم ( 100 - 150 كيلوبايت بالكثير ) حتى لا يثقل تحميله ..

[رضا]

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

[رضا]

* التعامل مع البرمجيات Scripts :
لا شك أن الأساسين السابقين كفيلين طالما إحترفتهما أن تبني موقعاً رائعاً يغبطك عليه الكثيرون .. و لكن ستحتاج يوماً ما خصوصاً في ظل هذه الأيام التي أحدثت مجرى جديد في بناء المواقع و هو ما يسمى بالديناميكية أو ما قد نطلق عليه المواقع التفاعلية .. و هي التي تتفاعل مع الزائر إما بإرسال معلومات أو إدخالها أو القيام بأوامر معينة من شأنها إعطاء معلومات محددة و مطلوبة .. أو حتى في تسهيل عملية الإضافة و التعديل و الإزالة على أجزاء موقعك ..
ولعل من بدايات إستعمال هذا الأساس تلك الخدمات المجانية التي تقدمها بعض المواقع مثل سجل الزوار و العداد و غيرها .. و كان وقتها ليس لزاماً عليك سوى وضع كود معين كفيل بربط موقعك بتلك الخدمة ..
لكن تطور الحال الآن و أصبحت تلك البرمجيات تحت يدك تستعملها كيف شئت ..
و قد لا يتطلب الأمر تعلم برمجة هذه البرمجيات بالتحديد .. و لكن لعل الوصول إلى مرحلة يمكن فيها التعامل مع هذه البرمجيات و تطويعها حسب الحاجة المطلوبة و القدرة على تشكيلها و تحريرها و الإضافة عليها هو مقياس جيد ينبأ بالإكتفاء نوعاً ما بهذا التعلم ..
طبعاً هذه البرمجيات متوفرة بلغات برمجة متعددة مثل PHP و ASP و Perl و غيرها و قد تحتار بداية بماذا تستخدم بموقعك و لكن لعل برمجيات الـ PHP هي الأكثر إنتشاراً الآن خصوصاً مع وجود برمجيات قوية بهذه اللغة مثل برنامج المنتدى VB و غيره ..
كنصيحة مبدئية لعلك تحاول بداية تعريب تلك البرمجيات الجاهزة ثم الإنتقال لمرحلة التعديل شكلياً إما عن طريق القوالب أو التمبلتات أو الثيمات ثم إلى التطوير برمحياً إلى أن تتقن بنهاية الأمر بإذن الله التعامل مع هذه البرمجيات ..
فقد تستطيع بناء برنامج خاص بك مكون من عدة برمجيات قمت بتطويرها و تشكيلها حسب رغبتك ..
و كما ذكرت سابقاً ليس لزاماً أن تتعلم البرمجة كلغة بل يكفي الوصول لمرحلة معينة في التعامل مع هذه السكربتات ..
ولا يتوقف الأمر عند القدرة على تغيير ألوان البرنامج أو جداوله أو إضافة صور بل إلى أن تتقن تطويع البرنامج لمرادك .. و ليس الهدف سرقة البرنامج أو حقوقه .. بل الإستفادة ..
كما هو الآن العلب المعدنية يتم تجميعها لإعادة تصنيعها .. فأنت تستطيع تطويع أو إعادة تطوير دليل مواقع مثلاً إلى برنامج فتاوى !! .. أو مكتبة برامج إلى برنامج صوتيات !! .. و منتدى إلى برنامج مقالات !! .. و هكذا !! ..
و بنهاية الأمر بالتأكيد ستتعلم كيفية جعل صفحاتك عبارة عن صفحات ديناميكية تحتوي على برمجيات وظفتها أو بنيتها لكي تفيدك و تلك مرحلة جيدة يحتاج لها الكثيرين !! ..

..

[Fahad Al-Zayed]

مقال شامل لعله امتداد لموضوع طرحه احد الاخوان هنا

يتميز مقالك اخي الكريم باسداء النصائح والخطوات الفعلية لكل مصمم

تحياتي لك

[Al7zen]

موضوع رائع جدا واذا كان ماعندك مانع بنقله عندي بالمجلة لتعم الفائدة

مع اطيب تحياتي لك اخي العزيز

[WaLeeD]

كما تعودت منك استاذي الكبير رضا مقالات رائعه


موضوع رائع وصياغه اروع ونصائح الله يجزاك عليها الخير كله

بس عندي سؤال كيف ازيد من ذوقي الفني


شاكر ومقدر جهدك استاذ رضا

....

[DubaiServ.Net]

شكراً لك اخي الكريم على المقالة الحلوة ...

وانا اعرف شخص وهم من فئة

أو مصمم وهبه الله معرفة بالبرمجة و بالتصميم الفني و هذا لعله سعيد الحظ من بينهم !!

وهو صاحب موقع ملهم http://molhem.com

تحياتي

[EISA AHMED]

اهلا اخوي كلامك صحيح بس في شئ نسيته اخوي

وهو الفكره والابداع

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

موقع لصاحب محترف

تحياتي لك

[رضا]

السلام عليكم ..

alzayed أشكرك أخي على تعقيبك ..

Al7zen خذ راحتك لي الشرف ..

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

DubaiServ.Net الله يوفقه و ينفع به ..

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

[EISA AHMED]

ههه تسلم على تلعليق الحلو..

[palnour]

سلام عليكم
دائماً تتحفنا بمقالات شيقة و رائعة و مفيدة و هدفها الاول الرقي برواد سوالف الي احتراف تصميم المواقع
جزاك الله كل خير يا طيب ..

[سردال]

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

أذكر بهذا الموقع:
www.csszengarden.com

صفحة واحدة بعدة تصاميم (أكثر من 40 تصميم) أنظروا إلى الأفكار والتصاميم واقتبسوا منها بعض الأفكار، مارسوا السرقة التعليمية

[رضا]

palnour و إياك أخي الحبيب ..

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