السلام عليكم ورحمة الله وبركاته ...
اليوم ان شاء الله سوف اتكلم عن كيفية تصميم موقع بمواصفات مواقع الويب Web2.0
سوف اتكلم عن النقاط التالية ::
- البساطة
- اعمده اقل
- الهيدر منفصل
- الخلفيات والاشياء الجريئة
- القوائم العرضية
- الجراءه في الشعار (البساطة)
- نص اكبر
- مقدمات بنصوص اكبر
- قوة الالوان
- التدرجات
- ايقونات
- بالونات
-| البساطة
لما كل هذه التصاميم معقدة , ولماذا كل هذه التصاميم المحشوه بالصور ؟ . هناك استثناءات لذلك
تصميم الشبكه هو أسهل من أي وقت مضى ، وهذا شيء جيد
وهذا لا يعني ان كل المواقع يجب ان تكون ضئيلة، بل ان علينا ان نستخدم القليل من الملامح و ماهو ضروري لتحقيق ما انت بحاجة الى تحقيقه.
كيف تتم البساطة ؟
ازالة عناصر غير ضروريه ، دون التضحيه عالية.
تجريب الحلول البديله التي تحقق نفس النتيجة اكثر بساطة.
![]()
انظر الى عدد المواد في هذا الموقع !! انظر الى الخلفية !! الى الشعار !! ووو !
لماذا هذه الزحمه ؟
-| اعمده اقل
عندما تقوم بتصميم موقع فيه اعمده اقل يكون اقل بساطة ولو قمت بتصميم موقع بدون اعمدة لكان اكثر بساطة
![]()
انظر الى هذا الموقع , يحتوي على عمود واحد : انه اكثر بساطة .
![]()
وانظر الى هذا الموقع ايضا , يحتوي على عمودين فقط ولكن لو تلاحظ ان الموقع اول يتمتع ببساطة اكثر
![]()
اخيرا .. انظر الى هذا الموقع .. يمكن العديد من الاعمدة فتراه غير منظم ولا يتمتع بالبساطة
ولكن !! عندما تستخدم عمود او عمودين لا يغير شي في مضمون الموقع كالوصلات والاخبار و....
-| الهيدر منفصل
عندما تقوم بتصميم موقع فحاول فصل الهيدر مع القائمة بصفوف جرئية
![]()
![]()
![]()
لاحظو معي هذه المواقع .. الهيدر (العنوان مع الشعار) في صف واحد ولا يحتوي على صور او ما شابه في الصف او الخلفية ..
وفي الصف الثاني توجد القائمة وبنفس الطريقة (سوف اتكلم عن القائمة لاحقا)
-| الخلفيات والاشياء الجريئة
الخلفية ::
عندما تصمم موقعا لا تنسى الخلفية المميزه
![]()
![]()
لاحظوا معي الموقع الاول كيف قام بتصميم خلفية بسيطة مع رسومات سوداء وعند تحريك السكروول لا تتحرك الخلفية
وفي الموقع الثاني قام بتصميم خلفية بتدرجات تتوافق مع التصميم الداخلي للموقع .
ولكن عند وضعك للون الابيض في الخلفية يقلل من دقة واحترافية التصميم كالتصماميم التالية
![]()
![]()
-| القوائم
عند التصميم الهيدر لابد من تصميم القوائم اسفله لتكون اكثر احترافية
كيفية الوصول الى الاحتراف في تصميم القوائم ؟
= ان تكون القائمة عكس جهة الشعار او اذا كان الشعار في الوسط فتكون القائمة اسفل الشعار مباشره
= تغيير لون الصف الخاص بالهيدر عن الصف الخاص بالقائمة , ليس ضروريا التغيير الكامل في اللون ولكن يمكنك استخدام الاحترافية في التدرجات .
= التفريق بين الصورة او الكتابة الخاصة بالوصلة عند تقريب الماوس (الفأره) عليها وبين الوضع العادي
![]()
![]()
![]()
![]()
وايضا في الصف الذي فيه القائمة يمكنك وضع فيه مستطيل البحث في الموقع فهو ايضا من احد ضروريات الويب 2.0