Categories
CSS Работа

Сигурни начини за прехващане на Internet Explorer *

Въпреки че на Internet Explorer 6 главата беше отрязана (от Google, Facebook, WordPress, а и от самите Microsoft), тялото му продължава да се движи в агония и ще е трън в очите на разработчиците до края на годината. Но дори и когато “тялото” му бъде заровено и цветята (ако има изобщо опечалени) бъдат разнесени от вятъра, идва поредния проблем – с неговите по-големи братя. Последните години критиките бяха насочени предимно към 6-ицата, а липсите и пропуските в 7 и 8 останаха пренебрегнати.

И тъй като няма как с вълшебна пръчица да накараме големите корпорации да използват по-модерни браузъри (Google Chrome, Mozilla Firefox, Opera или Internet Explorer 9) ще трябва да се съобразяваме с потребителите. Защото в края на деня, най-важното е потребителят / клиентът да са доволни от продукта.

От друга страна не може да се съобразяваме вечно с по-слабите и да ги бутаме напред, защото така няма да се види края скоро. Единият от начините да се съчетаят модерното с корпоративното е прогресивното подобряване. (б.а. прогресивно подобряване е термин, който обединява редица технологии, с чиято помощ потребителите на по-модерни браузъри получават по-добър продукт, докато се запазва използваемостта за браузърите, които не поддържат нужните технологии). Ето защо белгийският колега Mathias Bynens е направил чудесен подбор на най-популярните и най-стабилните начини за таргетиране / прихващане на Internet Explorer в статия наречена “В защита на CSS хаковете – представяване на “безопасни” хакове“.

Аз предпочитам използването на отделени CSS правила за конкретната версия на Internet Explorer (conditional comments), но само при крайна нужда! Ако основният markup и css код са написани по стандартите, то остава малко до почти никаква допълнителна поддръжка. Имайте го това предвид!

Categories
Работа Статии

Cross browser тестове или как да изглеждаме еднакво навсякъде

При наличието на тооолкова много browser-а на разположение на разглезения потребител, за разработчиците става доста трудна задачата да направят максимален контингент от хора да виждат едно и също. Нека бъдем честни – не може да бъдат задоволени всички! Но когато злия мениджър дойде и каже “искам” какво ни остава на нас освен да “направим”.

Първо – трябва задължително да се пише по стандартите. Въпреки, че това изобщо не е гаранция, че ще успеем да накраме Internet Explorer и Firefox да заговорят на общ език, това ни дава по-голяма възможност да намерим решение на проблема с няколко търсения в Google. Ако всички пишем по наши или фирмени стандарти – оправия няма.

Второ – използвайте нулиращи CSS файлове. Помагат много! Тяхната цел е да премахнат всички свойства, които browser-ите задават по подразбиране. Дали отклонението при едни е 1 пиксел, а при други 2 – проблема си е проблем и ще си спестите много нерви, ако просто нулирате всичко. Може да ползвате нулиращия CSS скрипт на Yahoo , а също така и решението на Ерик Майер. Ползвал съм и двете, но съм повече доволен от предложението на Yahoo.

Трето – тестове, тестове и пак тестове. Не може да се провери всеки един браузер, който някой пиян студент е написал 5 минути преди крайния срок за предаване на дипломна работа, но поне трябва да се прегледат основните мастодонти. Не е държавна тайна кои са те – Internet Explorer 6, Internet Explorer 7, Internet Explorer 8, Firefox 3, Chrome, Safari, Opera и Netscape. Повече за това кой и до каква степен ни причинява нерви може да прочетете в Wikipedia и в страницата на Net Applications. Изброените от мен 8 browser-а заемат 98.65 процентен дял от пазара ( към моментан на писане на статията ). За всеки един от тях си има изградени методи и практики за обичайните им проблеми. Тук няма да се спирам на тяхното решение.

Как обаче да направим толкова много тестове? Ще ви разочеровам – има един начин и това е трудния начин. Инсталирате ги, подреждате ги в редичка и почвате да преглеждате всяка страница. И докато с Opera, Chrome, Safari и Firefox няма да срещнете проблем при инсталацията, то при Internet Explorer ( ха! ) ще се сблъскате с проблема, че не може да имате по-ниска версия едновременно. И тук пак има десетки програми, които ги комбинират, но от моя опит мога смело да заявя, че те … не стават! Най-доброто решение, което съм намерил аз е следното. Имам Internet Explorer 8, който има backward compatibility с Internet Explorer 7 ( с малки изключения ). Отделна от това съм си свалил Microsoft Virtual Machine с XP Mode и на него държа чисто копие на Internet Explorer 6.

Това обаче не е достатъчно. Ами MAC потребителите? Ами Linux потребителите? Освен, че има разлика между два различни браузъра, има разлика и между еднакви брандове, на различни операционни системи ( OMG!!! ). И затова има решение 🙂 Тъй като намирам инсталирането на допълнителни виртуални и не толкова виртуални машини, за да разбера как точно ще изглежда нещо на Konqueror, за напълни излишно, аз съм се спрял на няколко сайта, които вършат тази работа вместо мен ( Cheater ).

  1. Adobe Browser Lab
  2. Browsershots
  3. Browser Sandbox
  4. Browsrcamp – Mac OS X тестове

Повече техническа информация може да намерите при котките, които кодват.

Categories
Статии

Safari 3.1 and Google Chrome CSS Hack

Това е хакът, който работи само за Safari 3.1 и Google Chrome.

body:nth-of-type(1) p {
/* Parameters */
}

Categories
Работа

Safari 3 css hack

За един много завъртян CSS проект ми се наложи да потърся css hack само за Safari. И преди съм търсил, но винаги съм намирал такива, които вече не работят към текущата версия на Safari. Днес обаче докато търсех, забелязах, че датите на всичките статии/уроци, които намирам са доста стари ( 2005, 2006 година ). Тогава се сетих за статията, която четох в блога на ЕмуФилтрация по последен период в Google и с идеята, че това ще ми помогне реших да го използвам. И наистина още при първото търсене за “safari css hack” за последните 2 месеца попаднах на тази статия – http://themechanism.com/blog/2008/01/08/safari-css-hack-redux/

Самият хак е следният.

@media screen and (-webkit-min-device-pixel-ratio:0) {

// Тук пишете каквото искате да се вижда само под Safari и Opera 9;

}

Според автора на статията, този хак най-вероятно ще остане за вбъдеще понеже -webkit часта от него най-вероятно няма да бъде използвана от останалите конкуренти на Safari.