Perfection or Vanity

Project: Terminated

Blog nie jest już dalej prowadzony ani aktualizowany. Mimo tego, wpisy i komentarze są dalej dostępne. Możesz przeczytać pożegnalny wpis albo przejść do archiwum.

Jak powszechnie wiadomo Internet Explorer w wersji na Windows, w odróżnieniu od swojego o wiele bardziej zaawansowanego technologicznie brata na platformę Mac, nie potrafi zwiększać bądź zmniejszać rozmiaru czcionki tekstu, jeśli jest on podany w pikselach bądź punktach. Inaczej - jednostkach nierelatywnych, nie uzależnionych od niczego. Podajesz po prostu rozmiar i dokładnie taki dostajesz.

Jednostki em, ex i % zależą od czynników wybiegających poza obiekt do którego się odnoszą. Em jest jednostką, z której wynika rozmiar w pikselach, na podstawie obiektu-rodzica. Jeśli standardowo body ma font-size: 100%, czyli przy 96dpi jest to 16px, to akapit w body określony rozmiarem czcionki 0.8em będzie miał 0.8em z tych 16px - około 12px. I tak dalej, jeśli w akapit włożymy inny element.

Ex to szerokość litery x danej czcionki. Bardzo przydatne, jeśli używamy czcionki o stałej szerokości znaku (Courier na przykład). Procenty to oczywiście część danych wymiarów, są najczęściej stosowane z jednostek relatywnych.

Piszę o tym, bo zaczynając zabawę ze stronami używałem tylko pikseli. Nie miałem nawet najmniejszego pojęcia, że można skalować tekst w przeglądarce, bo IE nie potrafił tego robić z pikselami. Do dziś nie potrafi i mu się to zarzuca jako błąd. Większym błędem jest z pewnością fakt, że aby przeskalować stronę napisaną w oparciu o em-y należy zadeklarować font-size dla body nalepiej jako 100%, nigdy w pikselach. Wracając jednak do głównego wątku - uważam, że powinna być jednostka, której nie da się skalować. Tą jednostką właśnie powinny być piksele. Jak ja mówię 200px, to ma być 200 i już. To ja robię stronę, to ja wiem co jest ok. A jak nie wiem, to się mnie:

  1. nie ogląda
  2. nie wynajmuje do projektów
  3. zgłasza prokuraturze (coś w stylu section 508) albo wszystkim osiołkom jakie powstały na planecie

Herezje prawie pewnie dla co niektórych, lecz zastanówmy się mocniej. Jeśli ustawiam, że w topie strony mam nagłówek o określonej pikselami wysokości fonta i odpowiedni padding, to kurczę trudno - tak chcę. Tekst główny można spokojnie ustawić na em-ach, pozwolić dzięki temu na swobodne zwiększanie rozmiaru. Dzęki temu autor strony wiedziałby na pewno, co musi udostępnić do zwiększania, z punktu widzenia dostępności, a co wręcz musi powstrzymać przed skalowaniem, aby strona się nie rozkleiła i aby elementy nie zaczęły nachodzić na siebie, powodując chaos i destrukcję na monitorze użytkownika!

Bo o to w gruncie rzeczy chodzi - skalowanie tekstu na pikselach i punktach (punkty dla druku są jednak głównie) powinno być jako dodatkowy ficzer przeglądarki, włączany na żądanie zmęczonego / starszego użytkownika, surfującego po zbyt dużej ilości stron napisanych bez jakiegokolwiek pojęcia o dostępności. Normalni webmasterzy powinni łączyć em-y i piksele, aby uzyskać zadowalający efekt, właśnie z naciskiem na skalowanie tekstu. Ale skalowanie tekstu relatywnego. Nigdy wartości ustawionych na sztywno!

Informacje i hiperłącza

Blog o projektowaniu zgodnych ze standardami stron internetowych.

Praktyczne przykłady, sztuczki CSS, sposoby obchodzenia błędów przeglądarek, lekki i nieinwazyjny JavaScript, użyteczny design, dostępność i skrypty użytkownika.

RSS

Informacje o wpisie

Napisał riddle 26 września 2005 o 05:26

Kategorie: CSS, Internet Explorer, Standardy sieciowe

Dodaj do:

Wpisy archiwalne

Archiwum miesięczne

Dzięki!

Dodaj bloga do Technorati Favorites Dodaj bloga do Del.icio.us Blog należy do sieci 10przykazań.com

  1. Tomasz 'Alpha' Topa 1 26 września 2005, 10:39

    Hm... A wiesz, że się zgodzę? Ostatnio też zacząłem zabawe z "em"ami. Też na początku potrzbena była zmiana sposobu myślenia - Muszę dokładnie pamiętać, które wcześniejsze elementy wpływały na wielkość fonta. Np. na początku dałem sobie 0.8em dla <li/ > i mnie zszokowało, że każda kolejna zagnieżdżona lista była mniejsza... Ale lektura dokumentacji szybko mnie oświeciła ;)

    Natomiast zgadzam się co do pewnych nieskalowalnych elementów. Podobnie jak u Ciebie, też mam nagłówek webloga w formie <h1 />. Co prawda na chwilę obecną tło jest jednolite, ale zakładając, że wstawię tam grafikę, zwiększenie wielkości nagłówka rozwali mi stronę "na dzień dobry". Rozumiem dostępność itp., ale moim zdaniem nagłówek webloga, który ZAWSZE zawiera tylko moje imię i nazwisko, nie jest najważniejszą częścią strony. I ustawienie domyślnej wielkości na jakies 25px zapewnia mi, że zobaczy to spora ilość użytkowników, natomiast Ci z ekstremalnymi rozdzielczościami, tudzież bardzo słabym wzrokiem nie stracą nic ważnego, ponieważ treść jest skalowalna.

    Z drugiej strony, odpal sobie stronę na małym wyświetlaczu (tudzież Shift+F11 w Operze) i widać zalety skalowania....

    Zaprawdę powiadam: ciężkie jest życie webdesignera...

  2. Już dawno temu powiedziałem, że bycie webdeveloperem to jak wróżenie z fusów

  3. tworzenie stron przestaje być głupim klikaniem w pajączku - to dla mnie dobry znak. :) wolę, żeby dobre strony robili ludzie, ktorzy przeczytali niejedną książkę, artykuł, etc. poza tym teraz, dzieki temu, ze przestawiamy się na nowe technologie, patrzymy na usability itd, łatwo mozna rozpoznac prawdziwego fachowca w tej dziedzinie.

  4. My tak, ale niestety, w wielu agencjach wciąż pokutuje przekonanie takie, jakie przedstawił kwedo (kilka notek niżej) - i jeden i drugi deweloper złoży stronę. Jednemu zajmie to 5 godzin i będzie się wyświetlało wszędzie, a drugiemu zajmie to 15 godzin i też będzie się wyświetlało wszędzie, ale dodatkowo niepełnosprawni będą mieli ułatwiony dostęp.

    Poza tym, na naszym rynku specjaliści się nie utrzymają, dopóki będą zarabiać 1500zł na rękę.

  5. Długi komentarz apropo tej notki znajduje się u mnie na joggu: http://reinmar.jogger.pl/comment.php?eid=152189
    Jak zawsze nieskładnie i trochę nie na temat, ale myślę, że głos w dyskusji jest :)

  6. Michał Fikus 6 26 września 2005, 23:05

    Dodam tylko, że pixele są w sumie relatywne :). Więc czegoś nie uwzględniłeś... ale chyba domyślisz się co mam na myśli :D

  7. No będą się czepiać jeden z drugim słowa. ;) Relatywne w znaczeniu takim jak ma em. Masz kontener, 0.8em to 0.8 wielkości fonta w kontenerze. A piksel zależy od ustawień ekranu, ok?

    Zostawmy te dwie rzeczy.

  8. Marcin Kulpa 8 20 lipca 2007, 16:50

    Jest na bardzo proste rozwiązanie. Wystarczy dla body dać text-size: 62.5%; Dopiero teraz pracować na em. Jeżeli wstawimy 1.2 em oznacza to czcionkę o wielkości 12px. Jeżeli damy 2em to będzie to 20px.

    Rozwiązanie może trochę dziwne ale pozwala użytkownikom IE 6 zmieniać wielkość czcionki.

  9. Co więcej IE nie skaluje też zdjęć parametrem max-width, max-height – jako jedyna przglądarka. :(

Dodaj komentarz

Do formatowania komentarzy używaj Textile (HTML nie działa). Szczególnie jeśli wklejasz większe fragmenty kodu. W razie niepewności użyj podglądu komentarza.

Wypowiedzi obraźliwe, infantylne oraz nie na temat będą moderowane – pisząc postaraj się zwiększyć wartość dyskusji.

Komentarze nie służą do wysyłania wiadomości albo informowania o błędach, itd. Chcesz coś mi napisać – skontaktuj się.