Perfection or Vanity

Numeracja list uporządkowanych domyślnie jest automatyczna - po wpisaniu znaczników ol i li przeglądarka doda markery w postaci liczb. Jest to zachowanie wymuszone przez style przeglądarki - ustawiony odpowiednio list-style-type (decimal).

Jednak rozpoczęcie liczenia zaczyna się zawsze od 1 i postępuje o tyle samo w górę. Na kartce papieru bez przeszkód mogę zacząć listę od "4.", aby w Wordzie zmienić środkowy numer na 20 wystarczy parę klików. Czy da się to zrobić w HTML?

W erze Ajaksa otwieranie nowych okien za pomocą window.open() jest passé. Całkiem słusznie - po co rozpraszać użytkownika (i kazać mu czekać aż przeglądarka przetrawi rozkaz otwarcia okna), skoro przy pomocy prostego układu divów można zasłonić to co widzi na stronie warstwą overlay i na niej umieścić kolejną warstwę - okienko?

Tak działa sławny Lightbox otwierający obrazki albo Thickbox otwierający prawie wszystko. Tylko jest jedna rzecz, która mi się w tym nowym trendzie projektowania nie podoba - nadmierne wykorzystanie JavaScriptu. Nadmierne ponieważ 95% interfejsu potrzebnego do naszego efektu da się zbudować przy pomocy CSS.

Roger Johansson powiedział kiedyś tak:

Web professionals who refuse to update their skills and insist on using outdated methods can no longer be called web professionals.

(Profesjonaliści, którzy odmawiają uczenia się nowych rzeczy i upierają się przy używaniu przestarzałych metod nie mogą być już dłużej nazywani profesjonalistami - tłum. wł.)

Kiedyś budowaliśmy strony za pomocą tabel, teraz nadszedł czas na podzielenie dokumentu na sekcje i stworzenie z nich layoutu za pomocą CSS. Rozszerzając wypowiedź Johannsona - wszyscy, którzy projektują dalej na zagnieżdżonych tabelach w niedługim czasie albo przestawią się na CSS albo wypadną z obiegu.

Tabelowy layout jest niedopuszczalny, ale prosty w użyciu i bardzo przewidywalny. Webdesignerzy zaczynający pisać w CSS mają całkiem poważne problemy, ponieważ nowoczesne projektowanie opiera się na pozycjonowaniu treści zawartej w blokach. Ich rozmiary nie są sztywne (i w większości sztywne być nie powinny), dlatego nie można uzyskać równych kolumn. Nie można? Zaraz się przekonamy…

Wypuściłem nową wersję mojego kalkulatorka emów. Em Calculator to narzędzie przydatne do przeliczania wartości pikselowych (uzyskiwanych przykładowo z Photoshopa) na emy - jednostki zależne od wielkości tekstu. Emy do budowania całego designu moim zdaniem się nie nadają (chociaż taki layout jest całkiem całkiem), ale znakomicie poprawią wygląd elementów od tekstu zależnych.

Bardzo ładnym i subtelnym efektem używanym na stronach internetowych jest zaaplikowanie cienia tekstowi, w celu jego wyróżnienia bądź poprawienia kontrastu. Udało mi się przetestować kilka sposobów jego dodania. Każda metoda ma swoje plusy i minusy oraz różni się znacznie od pozostałych. Aby ujednolicić przykłady będziemy operować na zwyczajnym jednopikselowym cieniu rzucanym od góry z lewej.

W poprzednim poście opisałem expression() w teoretyczny sposób, skupiając się na składni, zasadach i ograniczeniach. Dzisiaj chciałbym pokazać jak niesamowicie przydatne są te małe kawałki kodu - na przykładzie poprawek paru najbardziej frustrujących błędów i braków implementacji CSS Explorera.