10 نکته طلایی در طراحی سایت واکنش گرا

این تاپیک 0 پاسخ و 1 مشارکت کننده دارد . آخرین آپدیت توسط :  اوسیوند ،‏ 11 ماه پیش .

این تاپیک تاکنون 294 بازدید داشته است .

نویسنده پست
چهار شنبه ، 6 ژانویه 2016     10:33 ق.ظ #


اوسیوند

Subscriber
14 پست30 تاپیک

10 نکته طلایی در طراحی سایت واکنش گرا
طراحی سایت واکنشگرا امروزه بعنوان یک اصل مهم در برنامه نویسی و طراحی سایت بشمار میرود تا بتواند بصورت مطلوبی در اسکرین های کوچک تر قابل نمایش باشد. در این مقاله نکات کلیدی و مهم را در طراحی سایت واکنش گرا یا رسپانسیو آموزش خواهیم داد.

اگر با طراحی سایت واکنش گرا آشنا نیستید به بلاگ آموزش طراحی سایت واکنش گرا مراجعه نمایید.

1) اولین و مهمترین اصل در بوت استرپ یا واکنش گرایی حل کردن مساله و برطرف کردن چالش های آن بر روی کاغذ می باشد. اگر شما بتوانید از نظر منطقی بر روی کاغذ پیاده سازی کنید در طراحی سایت کار دشواری پیش رو نخواهید داشت.

2) دومین قدم استفاده از نرم افزار هایی میباشد که بشما اجازه ی نمونه سازی و مدل سازی به شما خواهد داد تا بتوانید بسادگی مدیا کوئری های خود را ایجاد کنید از این نرم افزار ها میتوان به adobe Dreamweaver اشاره کرد.

3) سومین گام تدوین استراژی برای موبایل میباشد. شما در ابتدای طراحی میبایستی اسکرین موبایل را برای خود در نظر بگیرید و سپس اقدام به ایجاد سایر سایز های صفحه نمایش کنید زیرا هر چقدر فضا بیشتر باشد راحتی کار نیز افزایش می یابد بنابراین از سخت به ساده حرکت کنید.

4) قدم مهم بعدی دوری کردن از منو یا نویگیشن میباشد. اگر آیتم های شما از سه عد تجاوز نمیکند سعی کنید آنها را بصورت عمودی طراحی کنید و اگر تعدادآنها بیشتر است توسط یک آیکن که بعد از کلیک بروی آن باز میشود بصورت کم جا طراحی کنید.

5) سعی کنید مخاطبان خود را درک کنید . اگر از باتن ها و یا کادر هایی جهت نوشتن متن استفاده میکنید سعی کنید سایز آنها برای انگشتان دست کاربر متناسب باشد و موقع استفاده بمشکل نخورد.

6) برای استفاده از تمام نرم افزار های طراحی سایت آماده باشید.اگر شما بخواهید وبسایتی را ایجاد کنید که طراحی آن ساده باشد نظیر (وردپرس) کار سختی پیش رو نخواهید داشت و میتوانیذ آنرا با تمپلیت هایی نظیر Moboom طراحی نمایید . اما بعضی طراحی های دیگر دارای پیچیدگی های خاصی هستند که باید برای هر صفحه نمایش بصورت جداگانه طراحی شوند. برای طراحی این وبسایت ها از نرم افزار هایی نظیر visual studio و یا dreamweaver میتوان استفاده کرد.

7) تصاویر یکی از حساس ترین موضوعات سایت های واکنش گرا میباشد. سعی کنید از عکس های بهینه سازی شده برای سایت خود استفاده کنید. این امر سبب میشود هنگام تغییر سایز مشکل مقیاس و پهنای تصاویر کاهش یابد. برای این کار تصاویر خود را فرمت ها ی مقابل ذخیره سازی کنید :JPEG, GIF و PNG-8 و از فرمت PNG خود داری نمایید.

8) هشدار در مورد بروز رسانی (آپدیت) سایت. اگر سایت شما حاوی یک محصول و خدمات هست مشکلی در طراحی سایت ندارید .اما قرار باشد با بروز رسانی سایت سایز و تعداد المان های محصولات و یا خدمات تغییر کند مطمئن شوید که پس از طراحی واکنش گرایی آن دچار مشکل نمیشود.

9) تا آنجا که امکان دارد از متن در سایز های موبایل استفاده نکنید. استفاده از متن های بلند باعث طولانی شدن محتوا و اسکرول زیاد میشود. در صورت نیاز از متون کوتاه استفاده کنید.

10) از گوگل در طراحی خود کمک بگیرید . شما میتوانید با مراجعه به آدرس زیر :

https://googlewebmastercentral.blogspot.co.uk/2013/08/making-smartphone-sites-load-fast.html

پیشنهاد های گوگل را در طراحی سایت واکنش گرای خود بکار ببرید تا سرعت بارگذاری سایت شما در موبایل ها و اسمارت فون ها به بالاترین حد ممکن برسد.

در طراحی سایت واکنش گرا عملکرد مهمترین بخش کار میباشد. در هر مرحله از طراحی سعی کنید تمام المان های تا ان لحظه ساخته شده را امتحان کنید و از صحت اجرای صحیح آنها مطمئن شوید ودر صورت عملکرد نا صحیح آنها امکان رفع آنها بسادگی باشد.

شما میتوانید آموزش طراحی سایت واکنش گرا را به صورت ویدئویی مشاهده کنید.

4  تشکر
پست 1 تا 1 (از مجموع 1 پست)

برای پاسخ دادن به این تاپیک باید وارد سایت شوید .