عناصر مورد توجه در طراحی سایت ریسپانسیو

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

محتوای انعطاف پذیر

چیدمان محتوا در یک وب سایت واکنش گرا باید بسته به نوع دستگاهی که در حال بازدید سایت است، تفییر شکل دهد و به نحو دیگری چیده شود. این تغییرات باید در  css اعمال شوند و می تواند روی سایز فونت ، هدر ، نوار کناری و عکس های موجود در صفحه تاثیر بگذارد. برای مثال ستون ها در یک سایت در یک دستگاه با صفحه نمایش کوچک تر شکسته شده و به جای کنار هم قرار گرفتن در زیر یکدیگر قرار می گیرند. طراح سایت در طراحی وب سایت باید مشخص کنید که می خواهید این عناصر در صفحه نماش های متفاوت به چه نحو در کنار یکدیگر قرار بگیرند.

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

متن و تصاویر 

برای طراحی سایت واکنش گرا باید متون و تصاویر در صفحه با توجه به صفحه نمایش قابل تغییر باشند. آیکون ها و تصاویر و سایز فونت ها باید در صفحه نمایش کوچک، بسته به فضای موجود در صفحه نمایش کوچک تر شده و در صفحه نمایش های بزرگ تر به همان نسبت بزرگ تر شوند .

منو های سایت

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

شباهت نسخه دسکتاپ و موبایل سایت 

نسخه دسکتاپ و موبایل از یک وب سایت باید مشابه یکدیگر باشند به نحوی که زمانی که کاربر بخواهد از دستگاهی بغیر از دستگاهی که قبلا از آن برای بازدید از وب سایت شما استفاده کند؛ خواه یک کامپیوتر خواه موبایل بوده باشد ، با بازدید از سایت با المان های آن آشنا باشد وخود آن را آشنا بیابد .در غیر این صورت عدم تشابه این نسخه به یکریگر موجب سر در گمی کاربر میشود

فرم های سایت

یکی از معمول ترین فرم های موجود در وب سایت، فرم تماس با ما است. تگ های input  قابلیت اتطباق با دستگاههای موبایل را دارند اما لارم است که در مورد تگ های radio  و  چک باکس و غیره این انعطاف پذیری را اعمال کنیم و از انطباق فرم های وب سایت با دستکگاههای مختلف اطمینان حاصل کنیم

منبع: طراحی سایت آسان