سلسلة كيف ( 4 ) : كيف يكون تصميم موقعك متقناً ؟!!

[رضا]

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

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

# النقاط الفنية المهمة لتصميم موقع على الإنترنت /

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

2- بناء صورة تخيلية لتصميم موقعك ( كروكي ) : نعم .. فكما يقوم المهندسون المعماريون بعمل رسم مبدئي للمنشأة التي يريدون بنائها فأنت كذلك بحاجة لرسم تخيلي لموقعك و لو كان ذلك داخل عقلك !! ..
التخيل يشمل كيفية عمل صفحة موقعك الرئيسية و الصفحات الداخلية بداية من كيفية عرضها و نهاية بماذا يدرج فيها من معلومات .. كذلك يشمل التخيل كيفية عرضك لمحتويات موقعك و ترتيب أقسامه و مداخله ..

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

4- إختيار نوع موقعك : نعم .. هناك نوعين من المواقع أو التصاميم .. نوع ( ستاتيكي ) و نوع ( ديناميكي ) .. فالإستاتيكي أو ما يعرف بالنوع البسيط و هو غالباً يعتمد على مجموعة من صفحات الهتمل التي تحمل بين طياتها معلومات موقعك .. بينما الديناميكي أو ما يعرف بالتفاعلي هو ما يستخدم فيه برمجيات مختلفة تسهل من عملية تبادل المعلومات مع الزائر و التفاعل معه ضمن نواحي كثيرة و ستحتاج فيه لمعرفة بكيفية التعامل مع لغات برمجة المواقع مثل php و asp و غيرها ..
كون موقعك مجرد موقع تعريفي سيغنيك عن التصميم الديناميكي .. بينما لو كان موقعاً دائم التحديث مثلاً أو لشركة كبيرة فغالباً ستحتاج له ..

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

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

7- تجنب الأخطاء الشائعة بتصميم الموقع و أذكر منها :
- عدم تصميم الموقع بقياس متمدد الحجم .. فكثير من المواقع التي كنت أراها جميلة حينما حولت الشاشة لمقاس 17 بوصة و دقة 1280 × 1024 ظهرت هذه المواقع سيئة الترتيب .. و صحيح أن دقة 800 × 600 هي الأكثر إنتشاراً عالمياً لكن تظل الحاجة ماسة لعملك تصميم ذو نظام متمدد و يمكن الإستفادة من الصور التي تكررها بجانب بعضها يظهرها كصورة واحدة أو إستخدام الجداول في ذلك ..
- الإكثار من الألوان بموقعك .. فذلك قد يزعج عين الزائر فكثير تلك المواقع التي ترى كل سطر فيها بلون و تستغرب كيف راق لصاحب الموقع أن يجعل عنوان صفحته بلون مضيء مثل الفسفوري ..
- الإكثار من الصور الثابتة أو المتحركة مما قد يسبب ثقل في تحميل الصفحة و يتبع ذلك عروض الفلاش الكبيرة التي توضع دائماً بالصفحات الأولى من المواقع مما يؤدي لهروب الزائر مباشرة ..
- الإكثار من أكواد الجافا سكربت مما قد يؤدي إلى وجود أخطاء بالعرض في المتصفح ..

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

سلسلة كيف ( 1 ) : كيف تبني موقعاً فاشلاً ؟!!

سلسلة كيف ( 3 ) : كيف تبني موقعاً ناجحاً - بإذن الله - ؟!!

و شكراً لكم ..

[php master]

السلام عليكم ورحمة الله وبركاته

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

وتحياتى لك بالتوفيق

[msu]

الله يعطيك العافيه يارضا بس ياليت تعيد شرح تصميم الموقع باطارات

وش علاقته بالبحث

ياليت تفيدني وجزاك الله خير

[ahmed100]

جزاك الله خير أخي رضا..

وننتظر من المزيد..

أخوك:
أحمد الكثيري

[سردال]

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

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


سؤال غريب: تصور أن هناك موقعاً متفوق من ناحية المحتويات، وتصميمه ليس جميلاً ولكنه ليس قبيحاً في نفس الوقت، هل تعتقدون أن الزوار وبسبب "المظهر فقط" سيتركون الموقع ولن يعودوا إليه؟ وإذا سألتهم عن السبب سيقولون: تصميمه غير جميل، لا نريد زيارة مواقع ليس فيها مؤثرات فنية؟ هل تعتقدون أن هذا سبباً لنفور الزوار من الموقع؟

[أبو الوليد]

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

[shra3]

بارك الله فيك أخي رضا على هذه النصائح المفيده

[Alhams.com]

الله يعطيك العافيه أخوي رضا

فعلاً سلسلة رائعه ..


ما تقصر

[هوست دبي]

أشكر الأساتذة و الإخوان الأفاضل على هذا الطرح المفيد و الهادف لهذا الموضوع المهم

طيب أنا عندي مشكلة .. و ياريت تساعدوني في حلها ..

مثلاً الحين أنا يوم أبغي أصمم موقعي ..

طبعاً أول شيء أسويه آخذ القلم و الورقة و أرسم شكل الموقع بشكل مبدئي و بعد ذلك أبدأ بالتطبيق العملي

لكن ..
و بعد أن أنتهي من التصميم تجيني فكرة ثانية و شكل ثاني للموقع فأقوم و أغير التصميم مرة ثانية ..

يعني تخيلوا عندي موقع حالياً قاعد أصممه ، و كل ما أعمل نموذج تجيني فكرة ثانية و أسير أغير

مب عارف من كثرة ما تجيني الأفكار أمل ..

ما أدري عندكم حل لهذي المشكلة ( النفسية )

تحياتي لكم

[fayz]

كلامك رائع وجميل
والله يوقفك على حرصك الدائم بنا

[جمال2]

الله يعطيك العافية اخوي رضا ..
هذا كتاب مو سلسلة المفروض
يصير على شكل كتاب

الله يوفقك ومواضيعك جداً
موفقة ..

[Mr.Muslem]

جزاك الله ألف خيرو لكن عندي ملاحظة :
لشهرة موقعك : قم بعمل فكره جديدة لم يسبقك بها أحد من قبل

[EISA AHMED]

اهلا اخوي رضا دووووم مبدع وبالتوفيق لك اخوي

واتمنى استمرار هذه الحلقات من مواضيع ((كيف))

[palnour]

جزاك اللــه كـل خير

[محمود المسعودي]

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

اعتقد ان المصمم يجب ان يمتلك حس فني قبل كل شىء ، يجب ان يمتلك الموهبة اللازمة