آریانیک

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

لازم است در ابتدا به این نکته اشاره کنم که عدم دسترسی همگان به امکانات ویژه ای که شما برای وب سایت مورد نظر ایجاد کرده اید؛ می تواند بسیاری از مخاطب های شما را دچار سردرگمی کند؛ چرا که برخی  از امکانات در تعدادی از مرورگر ها وجود دارند اما در باقی مرورگر ها نه و مخاطب هر بار با یک وب سایت متفاوت و با امکانات مختلفی روبرو می شود. در ادامه به پاسخ سوال Modernizr چیست؟ می پردازیم.

 modernizr چیست؟

modernizr یک کتابخانه کوچک بر پایه جاوا اسکریپت است که به ما توانایی کنترل و بررسی وضعیت وب سایت ما را در مرورگرهای مختلف می دهد؛ نسخه های مختلف مرورگر ها از سطوح مختلفی از html و css پشتیبانی می کنند و این وظیفه شماست که وب سایت را به گونه هماهنگ، با بیشتر نسخه های مرورگر های مختلف، طراحی کنید.

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

Modernizr چیست و چگونه کار می کند؟

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

درهنگام یافتن پاسخ Modernizr چیست؟ ممکن است به باور های غلطی برخورد کنید؛ در ادامه به بررسی این باور ها خواهیم پرداخت.

باور های غلط

چندین باور غلط درباره modernizr و کاربرد های آن در بین افراد رواج پیدا کرده است که به معرفی و بررسی هر کدام از آن ها می پردازیم.

مدرنیزر باعث ارتقای توانایی های مرورگر از html می شود!!

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

مدرنیزر نسخه css پشتیبانی شده توسط مرورگر کاربر را به روز می کند!!

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

مثالی از کاربرد modernizr

فرض کنیم که می خواهیم یک انیمیشن ویژه و یا یک ترنزیشن حرکتی خاص را به یکی از بخش های وب سایت اضافه کنیم؛ اما نمی دانیم که این ویژگی در کدام مرورگر ها و از چه نسخه ای به بعد پشتیبانی می شود؛ برای استفاده از modernizer باید این کتابخانه را به head صفحه خود اضافه کنیم. اکنون با ویژگی های این کتاب خانه می توانیم دست به بررسی پشتیبانی مرورگر های مختلف بزنیم. Modernizr کلاس هایی را به تگ های اچ تی ام ال اضافه می کند تا توانایی اجرای آن ها توسط مرورگر مورد نظر حفظ شود. به این صورت می توانیم آن انیمیشن خاص را در بیش تر مرورگر ها مشاهده کنیم.

توصیه آخر

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

نتیجه گیری

در این مقاله سعی شد که به پاسخ modernizr چیست و چگونه کار می کند؛ پاسخ داده شود. Modernizr به عنوان یک ابزار برای طراحی ریسپانسیو شناخته می شود؛ یک کتاب خانه که بر پایه جاوا اسکریپت قرار دارد و مرورگر های مختلف را از منظر پشتیبانی از سطوح مختلف اچ تی ام ال(html) و سی اس اس(css) بررسی می کند؛ شما با استفاده از این ابزار می توانید کد هایی را به صورت هماهنگ با نسخه های مختلفی از مرورگر ها که از یک ویژگی خاص پشتیبانی نمی کنند؛ بنویسد و آن ها را به همان شکل به اجرا دربیاورید.

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