هر سایتی باید با روش ریسپانسیو طراحی شود. برای این که در مسیر درستی در این زمینه قرار بگیرید، باید به آزمایش کردن منظم توسط ابزارهای تست و بررسی ریسپانسیو بودن طراحی وب سایت بپردازید که اطمینان حاصل می کند که وب سایت تان در تمامی مرورگر ها در هر اندازه صفحه نمایشی به خوبی دیده می شود.
هر سایت مدرنی نیاز به استفاده از یک روش طراحی ریسپانسیو دارد. این امر نیازمند تلاش بیشتر است و مطمئنا نتیجه نهایی ارزشمند خواهد بود.
من ضرورتا پیشنهاد می کنم که ایده های تان را با ابزارهای تست طراحی سایت ریسپانسیو آزمایش کنید تا مشاهده نمایید که وب سایت تان در هر سطحی چگونه نمایش داده می شود.
این ابزارهای رایگانی که در این مقاله طراحی سایت برای شما معرفی می کنیم اولین انتخاب های این ایجانب برای تست طراحی سایت ارزان ریسپانسیو می باشد، زیرا بسیار برای استفاده آسان می باشند. تمامی این ابزارها از اندازه صفحه نمایش های مختلفی پشتیبانی می کنند و از این رو می توانید از این که طرح بندی های سایت تان در گوشی های هوشمند همراه و دسک تاپ ها به چه ترتیب نمایان می شود، حس خوبی را به دست آورید.
1.XRESPOND
THE XRESPOND خود را "آزمایشگاه مجازی ابزارها" می نامد و من معتقد می باشم که بهترین عبارت برای این ابزار می باشد.
با کمک این سایت شما می توانید پیش نمایشی از این که سایت تان در ابزارهای مختلف به چه شکل دیده می شود، مشاهده نمایید. این سایت به صورت سبک های افقی طویل، جایی که شما مجبور می باشید تا اسکرول کرده و فرمت های کامل سایت را بیینید، کار می کند و عملی می شود.
برچسب و لیبلی که در بالای هر صفحه وجود دارد به شما می گوید که اندازه واقعی چیست و چه ابزارهایی می توانند با آن مطابقت یابند. علاوه بر منو های بالا-پایین، در این جا حوزه انتخابی وسیعی از گوشی های هوشمند همراه، تبلت ها و لب تاپ ها به منظور تست و بررسی ابزارهای بخصوصی وجود دارد.
حتی اگر بخواهید تا مشاهده کنید که چگونه سایت تان در مانیتور های مشخصی دیده می شود، این منو بالا-پایین می تواند عرض و ارتفاع تنظیم شده شما را نیز ساپورت کند. XRESPOND یک ابزار عالی تست و بررسی برای طراحی ریسپانسیو می باشد و سبک انواع مختلف ابزارهای گوناگون را پشتیبانی می نماید.
-
RESPONSINATOR
یک اپلیکیشن مشابه ای که می توانید از آن نیز لذت ببرید، RESPONSINATOR می باشد.
به جای استفاده از نوار اسکرول افقی، این سایت پیش نمایشی از هر ابزار را در ستون های عمودی لیست می کند. به این روش شما می توانید در میان انواع ابزارها اسکرول کنید و پیش نمایشی از سایت خود را در هر کدام، مشاهده نمایید.
ابزارها شامل آیفون ها و ANDROID NEXUS رایج می باشند و پیش نمایش های تمام افقی و عمودی نیز همراه دارند. شما هم چنین می توانید پیش نمایش هایی از ابزارهای آی پد را نیز به صورت افقی و عمودی تماشا کنید.
دیگر ویژگی این ابزار می تواند تغییر بین HTTP و HTTPS باشد. RESPONSINATOR دو نوع پیش نمایش سایت را بسته به URL که وارد می کنید، ارائه می دارد. این ابزار به صورت اتوماتیک با هر سایتی که در حال مشاهده پیش نمایش آن می باشید، مطابقت می یابد تا از خطرات SSL جلوگیری به عمل آید.
3.RESPONSIVE DESIGN CHECKER
اگر یک وب سایت واقعا ریسپانسیو باشد، باز هم نیاز دارد تا به سرعت مورد تست و بررسی قرار بگیرد؟ سعی کنید تا از RESPONSIVE DESIGN CHECKER استفاده کنید که مخصوص اندازه صفحه نمایش های تنظیم شده و ویژه ای ساخته شده است.
زمانی که یک بار URL را در این ابزار وارد کنید، روی تمامی فضای تست و بررسی ریسپانسیو بودن طراحی سایت کنترل کامل دارید. شما می توانید ارتفاع و عرض صفحه نمایش را به گونه ای که می خواهید تغییر دهید و اگر از یک ابزار ASPECT RATIO استفاده می کنید، می توانید از این ابزار برای مطابقت دادن نسبت های مشخص صفحه نمایش ها بهره ببرید.
در نوار کناری این ابزار شما اندازه های از پیش مشخص شده ای را برای صفحه نمایش ابزارهای رایج مشاهده می کنید، مانند NEXUS TABLET، KINDLES، و حتی گوشی های همراه جدید مانند GOOGLE PIXEL.
این سایت هم چنین از اندازه صفحه نمایش های بزرگ یا مانیتورهای دسک تاپ تا 24 اینچ عرض نیز پشتیبانی می کند. خیلی جالب است بدانید که این اندازه بزرگ به خوبی در مانیتورهای کوچک عملی می شوند، زیرا پنل پیش نمایش بر اساس نسبت ها، تغییر اندازه می یابد و عرض پیکسلی کلی تغییر نمی کند.
از این رو اگر شما با تست مانیتور های 1920PX در صفحه نمایش های MACSBOOK مشکل دارید، این ابزار می تواند بسیار برای شما ارزشمند باشد.
4.GOOGLEMOBILE TEST
گوگل سرشار از ابزارهای عالی برای وب مستر ها است و MOBILE-FRIENDLY TEST تنها یکی از مثال های این ابزارها می باشد.
این ابزار تست واقعا پیش نمایشی را برای شما مهیا نمی کند و به شما دریافتن اشکالات در رابط های کاربری سایت کمکی نمی نماید. در عوض این ابزار یک ابزار مخصوص گوشی های همراه برای مشخص کردن دقیق مسائل و مشکلات در سایت های گوشی های همراه تان می باشد.
زمانی که یک بار تست ها اجرا شوند، شما متوجه می شوید که طراحی سایت تان در گوشی ها همراه کاربرپسندانه می باشد یا خیر. این مورد برای طراحان اندکی جامع و کلی است، اما گوگل توصیه هایی را بر اساس مشکلات و عوامل موجود در صفحه ارائه می دارد که به بهبود هر چه بیشتر طراحی سایت در گوشی های همراه شما کمک می نماید.
این ابزار را به عنوان یک ابزار قابل اعتماد و ارزشمند برای تست طراحی وب سایت در گوشی های همراه برای خود ذخیره کنید. این ابزار یک منبع کامل برای تست ریسپانسیو بودن طراحی سایت نمی باشد، اما مکان عالی برای جمع آوری اطلاعات است و در شرکتی که شاید در زمینه وب سایت ها بسیار معتبر و توانا می باشد، ساخته شده است.
-
ابزار تست ریسپانسیو طراحی MATT KERSLEY
طراح و برنامه نویس MATT KERSLEY، ابزار رایگان تست و بررسی خود را برای طرح بندی های ریسپانسیو موجود در طراحی سایت ها منتشر کرد. این مورد ساده تر از ابزارهای مشابه می باشد و حاشیه های زیادی را در بر ندارد.
در عوض، این ابزار یک وب سایت ساده است که پیش نمایش هایی را در 5 عرض یکنواخت ارائه می دارد: 240px, 320px, 480px, 768px, 1024px.
پنل های پیش نمایش این ابزار از نوار های اسکرولی استفاده می کنند، از این رو می توانید در میان محتواها بدون هیچ زحمتی حرکت کنید. در هر صورت شما نمی توانید روی هر لینکی کلیک کرده و یا در میان صفحات دیگر در این پنل ها جستجو کنید، بنابراین این ابزار واقعا برای صفحات انفرادی و تکی در وب سایت ها عالی و کاربردی محسوب می شود.
اما برای یک ابزار ساده که این کارها را انجام می دهد، این امر بسیار عالی است و یکی از معدود ابزارهای تستی به حساب می آید که به صورت پیش فرض عرض 240PX را پشتیبانی می نماید.
-
AM I RESPONSIVE?
اگر شما به دنبال یک ابزار بدون نقص و بسیار صحیح می باشید، این ابزار را به احتمال زیاد انتخاب نمی کنید.
در عوض وب سایت AM I RESPINSIVE? برای بررسی های سریع و پیش نمایش هایی در انواع ابزارهای رایج و محدود کار می کند.
شما به سادگی URL را وارد می کنید و این ابزار در 4 ابزار رایج، پیش نمایشی از طراحی سایت تان را در معرض نمایش می گذارد: گوشی هوشمند همراه، تبلت، لپ تاپ و دسک تاپ. شما نمی توانید در این جا تغییراتی را ایجاد کنید، بلکه تنها می توانید به سایت ها در نسبت های مختلف نگاه بی اندازید.
اما این ابزار برای گرفتن اسکرین شات هایی از طراحی وب سایت تان برای نمایش چگونگی کارکرد آن در ابزارهای مختلف بسیار عالی می باشد. این ابزار برای سنجش و اندازه گیری بسیار عالی است و به خوبی در مرورگر های تان اجرا می شود.
به علاوه این ابزار به شما اجازه می دهد تا آدرس های محلی را بسازید، از این رو قادر خواهید بود تا پروژه های خود را که در کامپیوتر تان نیز ساخته اید را به تست و بررسی بنشانید.
-
DESIGNMODO RESPONSIVE TESE.
یکی دیگر از ابزارهایی که دوست دارم RESPONSIVE WE DESIGN TESTER می باشد که توسط DESIGNMODO ساخته شده است و این ابزار رایگان هم چنین به شما امکان می دهد تا پیش نمایش طراحی وب سایت خود را در مرورگرها بر اساس عرض های مشخص بنگرید.
اما یک ویژگی اضافه در این ابزار تنطیمات صفحه بر اساس شبکه ها می باشد. می توانید صفحه های سایت تان را بر اساس نقطه های پیکسلی بررسی کنید.
در کنار عرض ابزارهای از پیش تعیین شده، شما می تواند هم چنین پنل پیش نمایش را به هر عرض صفحه نمایشی که می خواهید تست کنید، درگ نمایید. اگر شما نیاز دارید تا اندازه ای را به صورت دستی وارد کنید، این ابزار دارای بخش های ورودی و مشخص برای وارد نمودن دستی عرض و ارتفاع صفحه نمایش مورد نظرتان می باشد.
اما وجود آیکون ابزار در گوشه راست در بالا به شما این امکان را می دهد تا از ده ها اندازه صفحه نمایش های رایج، یکی را انتحاب نمایید و همین امر موجب شده تا این ابزار برای بررسی و تست هر وسیله ای که تصور می کنید، مناسب باشد.
