طراحي سايت به صورت ريسپانسيو به استاندارد جديد طراحي سايت تبديل گرديده است. شركتهاي زيادي اين چالش را پذيرفته اند و راه هايي براي انجام اين طراحي خاص ابداع كرده اند، يا در تلاشند كه به اين پلت فرم دست يابند. در اين مقاله به نكاتي اشاره خواهد شد كه به پروسه طراحي سايت ريسپانسيو كمك كرده و آن را موثرتر مي‌سازد.
مانند هميشه طرح ريزي در اولويت اول قرار دارد. به محض اينكه بتوانيد چالشهاي طراحي خود را روي كاغذ حل كنيد، آماده طراحي سايت خود ميباشيد.
-
استفاده از نرم افزارهاي نمونه سازي
يك چنين برنامه اي Adobe Edge Reflow مي باشد كه به شما امكان استفاده از كوئري هاي واسط، تنظيم نقطه شكست breakpoints درون برنامه و طراحي چارچوب منطبق با دسكتاپ، تبلت و گوشي همراه را ميدهد. بعد از آن شما ميتوانيد CSS ها را در برنامه اي نظير دريم ويور يا ويرايشگرهاي ديگر HTML كپي كرده و طراحي خود را بهبود ببخشيد.
-
در نظر گرفتن استراتژي موبايل – اول (اولويت طراحي مطابق با گوشي همراه)
اين حالت براي زماني است كه ابتدا سايت موبايلي خود را ميسازيد و بعد آن را در مقياس تبلت و دسكتاپ در مي آوريد. يكي از نگراني هاي عمده در هر سه حالت، لوگو و يا متن تبليغاتي ميباشد. اگر متن در يك گوشي همراه به راحتي قابل خواندن باشد پس بالتبع نبايد مشكلي براي تبلت يا دسكتاپ داشته باشيد.
-
دوري كردن از حالت جهت يابي و نويگيشن
اگر سايت شما فقط دو سه تا منوي جهت يابي دارد، ميتوانيد آنها را روي يك منو قرار دهيد. اما اگر تعداد منوها زياد است، بهتر است يك آيكون طراحي كنيد كه منوها به صورت افتادني در آن قرار گيرند. ميتوانيد از استايلهاي منوي آيكني موجود در سايت GoMobi استفاده كنيد.
-
در ابتدا نماي كلي از سايت خود توليد كنيد
بعضي طراحان قبل از هرگونه كدنويسي چارچوب كاملي از سايت را در ابتدا ايجاد ميكنند. اين كار اطمينان از ديدگاه و احساس مشتري را ايجاد ميكند. زماني كه چارچوب سايتهاي منطبق با موبايل در حال طراحي است، يكي از مهمترين مسائل اين است كه دكمه ها را به اندازه كافي بزرگ درست كنيم كه قابل ضربه زدن توسط انگشت باشد. مسئله ديگر اين است كه طراحي را ساده و در عين حال كاربردي انجام دهيم. بعضي طراحان تمايل زيادي به پرداختن به جزئيات موبايلي دارند كه ممكن است منجر به مشكلات طراحي و كارايي سايت شود. بنابراين تا ميتوان بايد كار را ساده انجام داد.
-
براي استفاده از برنامه هاي نرم افزاري بي شمار آماده باشيد
بسياري از كاربران استفاده از يك تمپليت وردپرس را كافي ميدانند اما اگر قصد داريد يك طراحي پيچيده انجام دهيد، ممكن است به استفاده از برنامه هاي سفارشي نياز پيدا كنيد و حتي هر سايت را شخصا برنامه نويسي كنيد.
زماني كه در حال توليد طرح بندي هاي ريسپانسيو هستيد، عكسهاي بهينه شده براي هر طرح بندي قرار دهيد. اين كار مشكلات سنجشي و پهناي باندي را كاهش ميدهد. از فايلهايي با پسوند JPEG و يا GIF و يا PNG-8 استفاده كنيد. به هيچ وجه از PNG استفاده نكنيد چون ميتواند اندازه فايلهاي شما را 5 تا 10 بار بزرگتر كند.
-
اندازه گيري دقيقي براي عكسها به كار گيريد
اندازه ها را معمولا 500 در 350 پيكسل و 100 ppi گرفته و ابعاد عكس را با آن تطبيق دهيد. اين كار مقياس گذاري را مرتفع كرده و رزولوشن و كيفيت عكسها را نيز حفظ ميكند. در غير اينصورت ممكن است مشكلات رنگ و رزولوشن براي عكسها ايجاد گردد.
محصولات مرتبط :
مقالات مرتبط :