امروزه خیلی از طراح‌های رابط کاربری وب که علاقه به استفاده از ترفندهای نو توی طرح‌هاشون دارند با مشکلی روبرو هستند که هنوز راه حل جامع و کاملاً تضمینی واسش پیدا نشده. این مشکل برمیگرده به عدم انطباق مرورگرهای متفاوت با ویژگی‌های جدیدی که طراحان ازشون استفاده میکنند. حتی این مسئله نه فقط به انواع مرورگرهای وب ختم نمیشه، بلکه کار رو به ورژن های مختلف یک مرورگر هم میرسونه. اگر کمی شفاف‌تر صحبت کنم باید اینطور بگم که خیلی از امثال من دوست دارن توی طرح‌ها از html5 و css3 استفاده کنند، اما بعضی مرورگرها از بعضی ویژگی‌ها پشتیبانی نمیکنند. این باعث میشه یک طرح با کدهای یکسان توی مرورگرهای مختلف و حتی ورژن‌های مختلف به صورت یکسان نمایش پیدا نکنه. با این اوصاف راه حل چیست؟ استفاده از ویژگی‌های قدیمی؟ خیر.

عده‌ای توسعه دهنده‌ها کتابخانه ای با استفاده از زبان جاوااسکریپت نوشتند به نام Modernizr که به ما طراحان این امکان رو میده تا بدونیم کدوم مرورگر از کدوم ویژگی های اچ‌تی‌ام‌ال و سی‌اس‌اس پشتیبانی میکنه و از کدوم‌ها پشتیبانی نمیکنه. به این ترتیب طراح برای هر دو حال کد متناسب رو مینویسه و خیالش جمع هست که اگر مرورگرِ کاربر از ویژگی مورد نظرش پشتیبانی نمیکرد یه کد جایگزین برای پایداری اینترفیس اجرا میشه؛ همین و بس. اما متأسفانه من توی چندتا از مقاله های فارسی که سعی داشتند توضیح و یا تعریفی از این کتابخانه داشته باشند دیدم این حس رو به خواننده منتقل میکنند که با استفاده از Modernizr، مرورگر میتونه html5 و css3 رو پشتیبانی کنه یا قابلیت‌های مورد نیاز رو توی مرورگر شبیه سازی کنه که مطلقاً اینطور نیست. حتی یه جا خوندم این کتابخانه از جی‌کوئری استفاده میکنه در حالی اصلاً اینطور نیست. کار این کتابخونه فقط اینه که مشخص کنه فلان مرورگر از فلان ویژگی پشتیبانی میکنه یا نه. این منه طراح هستم که میگم اگر مرورگر از خاصیت انیمیشن در سی‌اس‌اس پشتیبانی نمیکنه، پس اون انیمیشن رو با جی‌کوئری شبیه سازی میکنم و در غیر این صورت هم از خاصیت انیمیشن به صورت معمول در سی‌اس‌اس استفاده میکنم. همین مسئله باعث میشه اینطور برداشت شه که Modernizr با جی‌کوئری کار میکنه یا امکاناتی رو به مرورگر اضافه میکنه در حالی که اینطور نیست. به عنوان یه مثال دیگه در مواقعی که مرورگر از خاصیت placeholder در اچ‌تی‌ام‌ال پشتیبانی نمیکنه، من از کتابخانه placeholder.js بهره میبرم. بحث کتابخانه‌هایی که باعث میشن مرورگرها خاصیت‌هایی که پشتیبانی نمیکنند رو شبیه سازی کنند اساساً فرق میکنه.

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

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