Jeśli chcecie mnie wesprzeć to zapraszam do kupna mojego poradnika "Jakim jesteś Makiem?".

Nowy iPad powoduje, że internet staje się brzydki

· Wojtek Pietrusiewicz · 8 komentarzy

Nowy ekran w iPadzie o rozdzielczości 2048×1536 ma jeden ogromny mankament – powoduje, że wiele stron internetowych staje się po prostu brzydka ze względu na zastosowaną grafikę. Jest na to jednak w miarę proste rozwiązanie, chociaż tymczasowe.

@media

W przypadku Makowego ABC, nie chcąc obciążać limitu transferu osób wchodzących na stronę mobilnie, podniosłem rozdzielczość samego logo za pomocą następującego kodu w CSS:

@media only screen and (-webkit-device-pixel-ratio: 2)
{
.custom #header { background-image: url(http://link_do_logo_w_hi_res.png); }
}

Oryginalne logo ma rozdzielczość pionową 115px. Najpierw wrzuciłem drugą wersję z czterokrotnie wyższą liczbą pikseli (230px w pionie), ale nadal nie było za ładnie, więc zdecydowałem się na 460px.

Porównanie (100% cropy)

Oryginalne logo na iPadzie 3 na lekkim zbliżeniu:

Logo 2x na iPadzie 3 na lekkim zbliżeniu:

Logo 4x na iPadzie 3 na lekkim zbliżeniu:

Uff – teraz jest znacznie lepiej. Jak już wspominałem, nie będę na dzień dzisiejszy zmieniał innych grafik czy zdjęć ze względu na fakt, że wiele osób wchodzi na stronę z urządzeń mobilnych, co spowodowałoby znaczące zwiększenie transferu, szczególnie w przypadku zdjęć.

Więcej informacji na ten temat znajdziecie pod następującymi linkami:

Chcesz zwrócić mi na coś uwagę lub skomentować? Zapraszam na @morid1n lub na forum.