przenośny css

W poprzednim poście zająłem się zagadnieniem przenośności. Dotyczy to również języka css, czyli popularnie mówiąc zgodności przeglądarek. W dawnych czasach (no, może nie tak dawnych), gdy królował Internet Explorer, tworzenie stron, które wyglądają tak samo na różnych przeglądarkach, było nie lada wyzwaniem. Do dziś można spotkać wiele przykładów jak sobie radzić z niekompatybilnością. Jednym z rozwiązań jest stosowanie różnych wersji programu w zależności od użytej przeglądarki. Albo wręcz zmuszanie użytkowników do stosowania tej jednej "właściwej". Ponieważ są to jednak rozwiązania niewygodne, czy to z punktu widzenia programisty (bo utrzymywanie różnych wersji programu jest kosztowne) czy też ograniczające swobodę użytkownika, to dużą popularność zyskały tzw. haków, które wykorzystując pewne błędy przeglądarki umożliwiały wprowadzanie wariantów w kodzie css. Poniżej przykład takiego haka.

* html .fieldpick{ /*IE6 and below CSS hack. Width must be set to 100% in order for opaque title bar to render*/
  z-index:-1;
}

Standard W3C

Problemy z niekompatybilnością przeglądarek częściowo skończyły się, gdy rynek wymusił stosowanie standardów. Przynajmniej tak się wszystkim wydawało. Opublikowany standard HTML4 jest powszechnie respektowany. Co z tego, gdy kolejna, nowa wersja jest jeszcze nie ukończona, a mimo to wszyscy chcą z niej korzystać. HTML5 będzie podlegać kodyfikacji jeszcze kilka lat, ale już wszystkie liczące się przeglądarki, a za nimi wiele twórców witryn stosuje nowe elementy języka. I znowu zaczyna się piekło niekompatybilności. Całe szczęście że wprowadzane jest w sposób bardziej cywilizowany. Można to przedstawić na przykładzie nowej własności dotyczącej zaokrąglonych ramek border-radius. Początkowo przeglądarki wprowadziły własną notację dodając własny przedrostek

-moz-border-radius: / dla Mozilli
-webkit-border-radius: / dla Safari i Chrome
-khtml-border-radius: / dla KHTML

Tym samym można w łatwy sposób dodać parametry dla poszczególnych przeglądarek, bowiem obce identyfikatory są całkowicie ignorowane, nawet jeżeli notacja oczekiwanych parametrów jest różna. To niestety jest koszt wprowadzania nowości zanim się ustabilizuje standard. Obecnie większość obsługuje standardowe znaczniki border-radius, natomiast w podobny sposób wprowadzane są nowe właściwości do języka css.

iPhone

Oprócz samego rozwoju języka i jego możliwości obecnie mamy do czynienia z bardzo szeroką paletą urządzeń stosowanych do przeglądania internetu. Te urządzenia unaoczniły że jest kilka parametrów, które winny być rozróżniane przy projektowaniu strony WWW. Jednym z nich jest rozmiar ekranu. Jeżeli strona jest zaprojektowana na wielkość 1024 piksele a oglądana na monitorze o szerokości 640 pikseli to pewnie nie będzie ładnie wyglądać. Natomiast smartfony posiadają rozdzielczość 480px i mniejszą, wtedy strona może się stać zupełnie nieczytelna. A przecież czasami wystarczy tylko kilka drobnych zmian w css. Tu z pomocą przychodzi tag @media. Poniżej przykład jak zmniejszyć rozmiar font, gdy ma być wyświetlany na ekranach niskiej rozdzielczości

@media screen and (max-width: 480px) {
  #main-nav a {
   font-size: 90%;
  }
}

Style domyślne

Tworząc kod, który ma być wyświetlany na różnych przeglądarkach należy uwzględniać domyślne wartości przyjęte dla poszczególnych własności. Dobrym zestawieniem jest ta strona. Aby uniknąć problemów należy zresetować , czy też ujednolicić te wartości. Można o tym przeczytać tutaj.

Native vs web application

Chciałbym się podzielić kilkoma spostrzeżeniami na temat aplikacji webowych. W szczególności chodzi o porównanie do aplikacji natywnych, czyli takich, które są uruchamiane bezpośrednio w systemie operacyjnym komputera. Jeszcze do nie dawna taki podział praktycznie nie istniał. Wszystkie programy kompilowane były do kodu maszynowego procesora i dopiero wtedy mogły być uruchomione na komputerze. Ponieważ poszczególne komputery różniły się procesorami i systemami operacyjnymi, tworzenie programów przenośnych, tzn. takich które można było uruchomić na różnych rodzinach komputerów stanowiło nie lada wyzwanie. Ponieważ komputer bez programu do niczego nie jest przydatny, te platformy na których istniały najlepsze programy miały więcej użytkowników i jednocześnie najwięcej programistów tworzyło nowe oprogramowanie. Stąd dominacja systemu Windows i procesora Intel w poprzedniej dekadzie.

Java

Mimo że komputery osobiste miały znaczną przewagę liczebną nad innymi, na świecie istniało więcej rodzajów komputerów, przeznaczonych do innych zadań. Jedną z technologi rozwiązujących przynajmniej część z problemów związanych z tworzeniem przenośnego oprogramowania jest Java, definiująca kod pośredni do którego można przekształcić każdy program napisany w języku Java oraz maszynę wirtualną, którą można było zaimplementować dla każdego komputera. Tym samym firma Sun, twórca Javy, stworzyła środowisko, dzięki któremu w stosunkowo prosty sposób można było tworzyć programy na różne systemy komputery. Nie tylko komputery osobiste, ale również mainframe czy też tzw. wbudowane (ang. emdedded). Ponieważ takie podejście dawało dobre rezultaty, również Microsoft opracował swoją platformę .Net korzystającą z analogicznych rozwiązań.

Android

Obecnie większość smartfonów posiada system operacyjny z wbudowaną maszyną wirtualną pozwalającą na uruchamianie programów zapisanych w kodzie pośrednim. Co więcej, ze względu na ograniczenia systemu operacyjnego, związanego z bezpieczeństwem niektórych danych zgromadzonych w telefonie, praktycznie nie jest możliwe uruchamianie programów w innej postaci, tzn zakodowanych bezpośrednio w kodzie maszynowym danego procesora. Stąd też wynika przesunięcie znaczenia kodu natywnego. Obecnie również programy zapisane w pseudokodzie, lecz gotowe do uruchomienia na telefonie określone są mianem natywnych. Szczególnie to widać przy klasyfikacji programów dla Androida, dla którego podstawowym podejściem jest programowanie na maszynę wirtualną Dalvik, większość narzędzi i przykładów zawartych w SDK tego dotyczy. I to te programy programy określa się mianem natywnych, mimo że jednocześnie udostępnione jest NDK - środowisko tworzenia aplikacji bezpośrednio w kodzie maszynowym (czyli na procesory ARM a od niedawna x86).

Java Script

Zupełnie inaczej przebiegał rozwój języka Java Script. Mimo znacznego podobieństwa nazwy do Java faktyczne podobieństwo jest niewielkie. Jedynie syntaktyka języka jest podobna, natomiast środowisko i sposób działania całkowicie różne. Język ten wyrósł wraz z rozwojem HTML, czyli języka opisu strony WWW. Stał się niezbędnym uzupełnieniem do statycznego HTML, umożliwiając bardziej zaawansowaną interakcję z widzem. Rozwój całości spowodował możliwość powstawania stron internetowych, których postrzeganie niczym się nie różniło od klasycznych programów komputerowych. Powstawały gry komputerowe oparte wyłącznie o środowisko przeglądarki, kamieniem milowym stało się opublikowanie gry Quake wyłącznie w kodzie HTML5.

Przenośność

W ciągu ostatnich kilku lat nastąpił gigantyczny rozrost Internetu, a tym samym zapotrzebowanie na aplikacje pracujące w tym środowisku. Aplikacje internetowe posiadają szereg zalet czyniących je niezastąpionymi w pewnych zastosowaniach. Nie do przecenienia jest możliwość pracy z dowolnego miejsca. Dla niektórych istotne jest zerowy koszt administracji programem na stacjach klientów. Obecnie jedną z największych zalet aplikacji webowych, która decyduje o ich tak szybkim rozwoju, jest przenośność. Jest to możliwość tworzenia programów działających na wielu różnych rodzinach komputerów. Póki podstawowym narzędziem pracy i zabawy były komputery z systemem operacyjnym Windows problem przenośności oprogramowania praktycznie nie istniał. Dopiero pojawienie się IPhone firmy Apple rozpoczęło nową erę: erę popularnych urządzeń, stanowiących w pewnym sensie substytut komputera, używanych na co dzień przez miliony osób. Pojawienie się kolejnych urządzeń z systemami IOS, Android, Bada, WebOS tylko wzmocniło ten proces. Obecnie na świecie sprzedaje się więcej smartfonów i tabletów niż komputerów osobistych z systemem Windows. Jednocześnie prognozy szacują stagnację na rynku PC przy dynamicznym wzroście pozostałych. Takie rozbicie platform spowodowało duże zapotrzebowanie na narzędzia i techniki programowania, które umożliwią twórcom dostarczania rozwiązań niezależnie od platformy docelowej.


Ciąg dalszy...