نحوه فعال سازی و استفاده از حالت طراحی پاسخگو در Safari 9

01 از 06

فعال سازی و استفاده از حالت طراحی پاسخگو در Safari 9

© اسکات Orgera.

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

اگر شما یکی از بسیاری از برنامه نویسان است که از مک استفاده می کنند، ابزار ابزار توسعه دهنده Safari همیشه مفید است. با انتشار سافاری 9، گستردگی این قابلیت به طور قابل ملاحظه ای گسترش یافته است، عمدتا به دلیل طراحی Responsive Design_ که به شما امکان می دهد پیش نمایش نحوه عملکرد سایت خود را در قطعنامه های صفحه نمایش مختلف و همچنین بر روی iPad، iPhone و iPod touch ایجاد کنید.

این آموزش جزئیات نحوه فعال سازی حالت Responsive Design و همچنین نحوه استفاده از آن برای نیازهای توسعه شما را می دهد.

اول، مرورگر Safari خود را باز کنید.

02 از 06

تنظیمات صفری

© اسکات Orgera.

روی مرورگر Safari در منوی مرورگر، در بالای صفحه کلیک کنید. هنگامی که منوی کشویی ظاهر می شود، گزینه Preferences را در مثال بالا انتخاب کنید.

لطفا توجه داشته باشید که می توانید از میان میانبرهای صفحه کلید زیر استفاده کنید: COMMAND + COMMA (،)

03 از 06

نمایش منوی توسعه

© اسکات Orgera.

پنجره تنظیمات Safari در حال حاضر نمایش داده می شود، پنجره مرورگر شما را پوشانده است. اول، بر روی Advanced زده شده توسط دکمه دنده نشان داده شده و در گوشه بالا سمت راست پنجره قرار دارد.

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

04 از 06

حالت طراحی پاسخگو را وارد کنید

© اسکات Orgera.

گزینه ای جدید در حال حاضر در منوی Safari خود قرار دارد، در بالای صفحه نمایش داده شده با برچسب Develop شده است . روی این گزینه کلیک کنید. هنگامی که منوی کشویی ظاهر می شود، انتخاب حالت طراح Responsive _ را در مثال بالا وارد کنید.

لطفا توجه داشته باشید که می توانید از میان میانبرهای صفحه کلید زیر استفاده کنید: OPTION + COMMAND + R

05 از 06

حالت طراحی پاسخگو

© اسکات Orgera.

صفحه فعال وب باید در حالت طراحی پاسخگو نمایش داده شود، همانطور که در مثال بالا نشان داده شده است. با انتخاب یکی از دستگاه های iOS که از جمله آیفون 6 یا یکی از رزولوشن صفحه نمایش تعیین شده موجود در 800 × 600 می باشد، شما بلافاصله می توانید ببینید که چگونه صفحه بر روی آن دستگاه یا رزولوشن صفحه نمایش ارائه می شود.

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

06 از 06

توسعه منو: گزینه های دیگر

© اسکات Orgera.

علاوه بر حالت طراحی پاسخگو، منوی توسعه Safari 9 گزینه های بسیاری دیگر نیز ارائه می دهد که برخی از آنها در زیر آمده است.

خواندن مرتبط

اگر این آموزش مفید را پیدا کردید، مطمئن شوید که مراحل دیگر Safari 9 را مرور کنید.