واضح آرشیو وب فارسی:سایت ریسک: راه های دور زدن ie ! – دستورات شرطی برای اینترنت اکسپلورر o_real_love 10 ارديبهشت 1389, 01:24طراحان وب سایت برای تست وب سایت طراحی شده می بایست وب سایت را در مرورگرهای مختلفی تست کنند تا بازدید کنندگان در همه مرور گر ها طرح یکسانی ببینند چون نمایش متفاوت در مرورگرهای متفاوت برای یک طراح یک ضعف بزرگ محسوب می شود .مثلا فرض کنید شما به عنوان طراح وب سایت طرح خود را در مرورگر محبوب فایرفاکس تست می کنید وآپلود می کنید. همه چیز عالی به نظر می رسد ولی یک مشکل بزرگ ! سفارش دهنده وب سایت را در مرورگر اینترنت اکسپلورر نسخه ۶ باز می کند(وای همه چیز به هم ریخته!!) خوب راه حل چیست ؟ اول این که باید شرایطی فراهم آوریم تا بتوانیم وب سایت طراحی شده را در مرورگرهای مختلف خصوصا IE6 , IE5 تست کنیم . همیشه این رابه خاطر داشته باشید درست است که مرورگرهای firefox , opera,chrome جزء بهترین و روانترین مرورگرهای موجود میباشد ولی طبق آخرین آمارها با وجود IE8 هنوز هم اکثر کاربران اینترنت از IE5 ,IE6 استفاده میکنند و علاقه ای هم به آپدیت کردن مرورگرهای خود ندارند . پس وب سایت شما باید در همه مرور گرها درست نمایش یابد. همانطوری که گفتم که باید شرایطی فراهم آوریم تا بتوانیم وب سایت طراحی شده را در مرورگرهای مختلف تست کنیم . برای این کار باید باید نسخه های مختلف مرورگر را در کامپیوتر نصب داشته باشیم بعضی از مرور گر ها روی windows و بعضی مرورگر ها روی mac و بعضی روی Linux کار میکنند (firefox روی تمام سیستم عامل ها کار می کنند) پس باید سیستم عامل های متقاوتی هم داشته باشیم که به طور حتم کار جالبی نیست .راه بهتر این است که با یک برنامه بتوان از چند سیستم عامل در روی یک سیستم عامل به صورت مجازی استفاده کرد . مثل VirtualBox که آن را می توانید از آدرس دانلود کنید. نه به این صورت که چند سیستم عامل به صورت مجزا نصب شود، بلکه چند سیستم عامل در یک ویندوز بارگذاری شود و دقیقا به صورت مجازی! البته یک وب سایت هم موجود است که همه این کارها رو برای شما انجام بدهد ولی برای این کار از شما هزینه دریافت می کند. وب سایت میتواند وب سایت شما را در همه سیستم عامل ها و در همه مرورگرها تست کرده و نتیجه را به شما نمایش دهد .البته این وب سایت برای عکس گرفتن از نتیجه کار چند روزی رایگان می باشد و مثلا نحوه نمایش وب سایت شما را در Linux با مرورگر Firefox به صورت فایل .jpg نمایش می دهد. حتما به این سایت سری بزنید مطمئن باشید ارزشش را دارد. البته شاید شما هم مثل من جزء آن دسته از طراحانی هستید که زیاد تمایل ندارید طرح خود را در سیستم عامل های غیر از Windows تست کنید زیرا بالای ۹۵ درصد از مردم ایران از این سیستم عامل استفاده می کنند . پس کافی است مرورگرهای زیر را بر روی ویندوز نصب داشته باشیم : IE5 , IE6 , IE7 , FireFox , Opera , Chrome استاندارد های FireFox , Opera , Chrome بسیار شبیه به هم است ولی امان از IE5 , IE6 ! IE7 , IE8 بهتر از نسخه های قبل بوده و کارکردی تقریبا شبیه به نسخه های mozilla دارند و البته بازهم نه به خوبی آنها. یه مشکل داریم ! چطور میتونیم نسخه های مختلف IE را کنار هم در ویندوز نصب داشته باشیم؟ خوب بازهم سراغ اینترنت میریم و از این دوست عزیز مدد می جوییم : سایت برنامه ای در اختیار شما قرار می دهد تا این کار را انجام دهید. اگرچه این نسخه ها Stable نیستند ولی برای تست وب سایت طراحی شده مناسب می باشند . من بر روی کامپیوتر خودم , FireFox3 , Opera IE5 ,IE6 ,IE8 را نصب دارم. حالا همه این کارها رو انجام دادیم تا ببینیم تفاوت ها در نمایش روی مرورگرهای مختلف به چه صورت است .یعنی یک قدم به جلو . حداقل این است که میدانیم روی چه مرورگرهای وب سایت درست نمایش پیدا می کند و در چه مرورگرهای نمایشی دور از انتظار را داریم. البته طی تجربه دیده ام که مشکلات اکثرا روی IE6 و نسخه های پایین تر بروز می کند . پس از کشف مشکلات که روی IE بوجود می آید باید آنها را برطرف کنیم .برای این کار باید دستورات شرطی اینترنت اکسپلورر ( (internet explorer condition components استفاده کنیم تا بتوانیم نسخه مرورگرIE مورد نظر در دستگاه کاربر را تشخیص داده و نسبت به آن رفتار وب سایت را تعیین کنیم . دستورات شرطی اینترنت اکسپلورر می تواند ورژن ماشین هدف(نسخه مرورگر IE) رو تشخیص دهد و نسبت به آن رفتار خاصی داشته باشد .به طور مثال : برای این که بخواهیم یک لایه در مرکز عرض صفحه با مارجین برابر از کنار ها قرار بگیرد پس از تعیین عرض لایه از دستور margin:auto ; استفاده می کنیم اما در مرورگر IE5 لایه در مرکز قرار نمیگیرد! برای این که در این مرورگر هم در مرکز قرار بگیردباید از دستور text-align:center; در والد خودش استفاده کرد. پس باید یک فایل css جدا نوشت مختص IE5 مثلا به نام ie5style.css و در صفحه وب سایت تعیین کنیم که اگر مرورگر IE5 بود از این فایل ie5style.css استفاده کند. دستورات برای شناسایی نسخه ها IE: <!–[if IE ]> <link href=“iecss.css” rel=“stylesheet” type=“text/css”> <![endif]–> این دستور بیان میکند اگر نسخه مرورگر IE با هر ورژنی بود از فایل iecss.css برای فرمت بندی صفحه استفاده کند و در غیر این صورت از فرمت بندی که در صفحه تعیین میشود استفاده کند <!–[if IE 6 ]> <p>Only IE 6 will see this</p> <![endif]–> اگر IE6 بود دستورات بین تگ p را مشاهده می کند که میتواند لینک به یک فایل css باشد مثل بالا و یا در همان جا به صورت internal دستورات css را تعریف کرد و یا در آنجا از دستورات javascript استفاده کرد. <!–[if lt IE 7 ]> <p>Only less than IE 7 will see this</p> <![endif]–> اگر نسخه پایین تر از IE7 بود دستورات بین تگ p را مشاهده می کند <!–[if lte IE 7 ]> <p>Only less than or equal to IE 7 will see this</p> <![endif]–> اگر نسخه IE7 و پایین تر از IE7 بود دستورات بین تگ p را مشاهده می کند <!–[if gt IE 7 ]> <p>Only greater than IE 7 will see this</p> <![endif]–> اگر نسخه بالاتر تر از IE7 بود دستورات بین تگ p را مشاهده می کند <!–[if gte IE 7 ]> <p>Only greater than or equal to IE 7 will see this</p> <![endif]–> اگر نسخه IE7 وبالا تر از IE7 بود دستورات بین تگ p را مشاهده می کند . به همین ترتیب : <!–[if IE 5]> <p>This covers all versions of IE5 including IE5.5</p> <![endif]–> <!–[if !IE 6]> <p>IE7 or IE5 only</p> <![endif]–> <!–[if (IE 6)|(IE 7)]> <p>IE6 or IE7 only </p> <![endif]–> کپی رایت از :
این صفحه را در گوگل محبوب کنید
[ارسال شده از: سایت ریسک]
[مشاهده در: www.ri3k.eu]
[تعداد بازديد از اين مطلب: 1225]