ریسپانسیو چیست ؟ (RWD) responsive - طراحی سایت

 ریسپانسیو چیست ؟ (RWD)  responsive

ریسپانسیو چیست ؟ (RWD) responsive

RWD برای تعیین چگونگی ظاهر یک سایت از نقاط به اصطلاح breakpoint استفاده می کند: یک طرح در بالای نقطه شکست استفاده می شود و طرح دیگری در زیر آن نقطه شکست استفاده می شود. نقاط شکست معمولاً براساس عرض مرورگر است.

HTML یکسان برای همه دستگاه ها ارائه می شود ، با استفاده از CSS که طرح صفحه وب را تعیین می کند برای تغییر شکل صفحه. به جای ایجاد یک سایت جداگانه و پایگاه کد مربوطه برای مانیتورهای صفحه عریض ، دسکتاپ ، لپ تاپ ، تبلت و تلفن در هر اندازه ، یک پایگاه کد می تواند از کاربران با اندازه نمایش متفاوت متفاوت پشتیبانی کند.

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

RWD دارای مزایای بالقوه نسبت به توسعه سایت های جداگانه برای انواع مختلف دستگاه است. استفاده از یک پایگاه کد می تواند در مقایسه با توسعه 3 یا 4 سایت مجزا ، توسعه را سریعتر کرده و با گذشت زمان نگهداری را آسان تر کند ، زیرا یک مجموعه کد و محتوا به جای 3 یا 4 نیاز به ، به روزرسانی دارد. از نوع "ضد" از این جهت که می تواند از نقاط شکست جدید مورد نیاز در هر زمان پشتیبانی کند. اگر یک دستگاه 5 یا 15 اینچی در بازار بلند شود ، کد می تواند دستگاه های جدید را پشتیبانی کند. RWD طراحی را به دستگاه خاصی متصل نمی کند.

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

ایجاد تجربه های قابل استفاده

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

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

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

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

 

دیدگاه خود را بیان کنید

تمامی حقوق برای شرکت فناوری اطلاعات گیلاس خندان محفوظ است