با عرضه نسخه های جدید مرورگر های گوناگون، کماکان مرورگر هایی وجود دارند که تمامی قابلیت های HTML٥ و CSS٣ را پشتیبانی نمی کنند، همچنین بسیاری از کاربران، هنوز از نسخه های قدیمی یک مرورگر استفاده می کنند؛ در همین راستا طراحان وب جهت نمایش قابلیت های جدید HTML٥ و CSS٣ ، باید راهکاری را جهت نمایش مناسب وب سایت خود در مرورگرهای قدیمی کاربران به کار بگیرند.Modernizr یک کتابخانه بر پایه جاوا اسکریپت است که مرورگر بازدید کنندگان را بررسی و مشخص می کند مروگر مورد نظر کدام دسته از ویژگی های HTML٥ و CSS٣ را پشتیبانی می کند و سپس کلاس های مشخصی را به تگ html صفحات اختصاص می دهد؛ در نتیجهمدرنایزر ابزار مناسبی برای طراحان جهت شرطی سازی نحوه نمایش صفحات بر اساس مرورگر های مختلف خواهد بود. با استفاده از کلاس های شرطی CSS میتوان نحوه نمایش المانها و تگها را بر اساس نوع مروگر بازدید کننده تنظیم نمود.
در حالت معمول و بدون استفاده از این ابزار، طراح وب سایت باید تمام مرورگرها را بشناسد و بداند که هر یک چه ویژگی‌هایی را پشتیبانی می‌کنند و بر اساس نوع مرورگر کد مربوط به آن را بنویسید؛ اما با استفاده از مدرنایزر تنها کافی است باپیروی از یک الگو خاص، برای هر ۲ حالت کد نوشت تا روی تمام مرورگرها به درستی نمایش داده شود.
چرا Modernizr؟
- عدم وابستگی به هیچ سیستمی حتی به jQuery
- عدم اضافه کردن افکتهای HTML٥ وCSS٣ به مرورگر کاربران
- بررسی ویژگیهای HTML٥ و CSS٣ مرورگر بازدیدکنندگان در چند هزارم ثانیه
نمایش ستون های چندگانه و تصویر سایه دار در مرورگر فایرفاکس:
عدم نمایش ستون های چندگانه و تصویر سایه دار در مرورگر اینترنت اکسپلورر:
استایل جایگزین به کمک Modernizr و نمایش در مرورگر اینترنت اکسپلورر (حتی نسخه های ٦ به پایین):
منبع : هاست ایران