Opinie o książce Mobile Web. Rusz głową! „Jeśli kiedykolwiek planowałeś zakup książki na temat tworzenia treści dla urządzeń mobilnych, która sprawdza się dla wielu przeglądarek i urządzeń od różnych producentów, możesz zaprzestać poszukiwań i kupić Mobile Web. Rusz głową! Jest to książka napisana przez nieprawdopodobnie bystrych ludzi, którzy mają wielkie doświadczenie z urządzeniami mobilnymi i nie poprzestają na jednej platformie, lecz pracują na wszystkich. Wielu twórców oprogramowania bezustannie zastanawia się, czy tworzyć programy od razu z myślą ourządzeniach mobilnych, czy pisać normalne aplikacje internetowe. Ta książka gładko przechodzi od tematów wprowadzających do zaawansowanych, dostarczając wszystkich informacji potrzebnych do tworzenia ekscytujących treści dla urządzeń mobilnych”. — Andrea Trasatti, lider projektu DeviceAtlas i współtwórca WURFL, biblioteki informacji omożliwościach urządzeń bezprzewodowych „Praktyczne wprowadzenie w chaotyczny świat współczesnego programowania dla urządzeń mobilnych, dające próbkę tego, jak możemy i jak powinniśmy podchodzić do nich jutro. Mobile Web. Rusz głową! skutecznie przedstawia praktyczne techniki, które czytelnik może natychmiast zastosować, i jednocześnie daje mnóstwo fundamentów oraz zasobów, na których mogą bazować doświadczeni programiści”. — Stephen Hay, projektant stron internetowych, programista, mówca i współzałożyciel konferencji Mobilism „Od samego początku nastawiona na praktykę książka Mobile Web. Rusz głową! jest znakomitym wprowadzeniem w wyzwania i perspektywy ujawniające się podczas eksplorowania nowych obszarów projektowania treści internetowych”. — Bryan i Stephanie Riegerowie, założyciele yiibu.com Opinie o innych książkach z serii Rusz głową! „Analiza i projektowanie obiektowe. Rusz głową! to odświeżające spojrzenie na projektowanie i analizę zorientowaną obiektowo. Tym, co odróżnia tę książkę od innych na rynku, jest nacisk na uczenie się. Autorzy sprawili, że temat ten stał się przystępny i dostępny dla praktyków”. — Ivar Jacobson, Ivar Jacobson Consulting „Właśnie skończyłem czytać książkę Analiza i projektowanie obiektowe. Rusz głową! i jestem zachwycony! Najbardziej podobało mi się położenie nacisku na to, dlaczego właściwie zajmujemy się projektowaniem zorientowanym obiektowo — żeby pisać świetne programy”. — Kyle Brown, naczelny inżynier IBM „Za zabawnymi ilustracjami i szalonymi czcionkami kryje się poważna, inteligentna, niezwykle starannie zaprojektowana prezentacja na temat projektowania i analizy zorientowanej obiektowo. Gdy czytałem tę książkę, czułem się, jakbym podglądał przy pracy doświadczonego projektanta, który dodatkowo wyjaśnia mi, co i dlaczego jest istotne na każdym kroku”. — Edward Sciore, adiunkt, Wydział Informatyki, Boston College „Head First Software Development. Edycja polska to świetna książka dla każdego, kto chce utrwalić swoje umiejętności programistyczne na sposób, który stale angażuje na wielu poziomach”. — Andy Hudson, Linux Format „Jeśli jesteś początkującym twórcą oprogramowania, Head First Software Development. Edycja polska od razu skieruje Cię na dobre tory. Jeśli zaś jesteś już doświadczonym programistą (czytaj: o długim stażu), nie rezygnuj z niej tak szybko...” — Thomas Duff, Duffbert’s Random Musings „W Java. Rusz głową! jest coś dla każdego. Wzrokowcy, kinestetycy — każdy czegoś się z tej książki nauczy. Dzięki pomocom wizualnym łatwiej jest zapamiętywać materiał, a tekst jest napisany bardzo przystępnie, co odróżnia tę książką od większości podręczników Javy... Java. Rusz głową! to bezcenna książka. Wyobrażam sobie, że książki z serii Rusz głową! można wykorzystać jako tekst obowiązkowy na zajęciach, czy to na uczelni wyższej, czy też na kursach dla dorosłych. Z pewnością będę w przyszłości sięgał do tej książki i polecał ją innym”. — Warren Kelly, Blogcritics.org, marzec 2006 „W przeciwieństwie do typowego stylu podręcznikowego Head First iPhone and iPad Development wnosi do nauczania programowania w iOS element humoru, a nawet sprawia, że uczenie się jest interesujące i przyjemne. Omówione są wszystkie kluczowe technologie, również z warstwy jądra, a także tematy tak istotne jak projektowanie interfejsu — treść książki jest mądrze dobrana i opracowana na najwyższym poziomie. Gdzie indziej będziesz mógł podsłuchać rozmowy przy kominku pomiędzy UIWebView a UITextField?!” — Sean Murphy, projektant i programista iOS Opinie o innych książkach z serii Rusz głową! „Kolejna zaleta drugiego wydania Java. Rusz głową! to fakt, że jej lektura zaostrza apetyt. Omówione pod koniec książki bardziej zaawansowane tematy, takie jak Swing i RMI, sprawiają, że nie możesz się doczekać zanurkowania w API i napisania takiego właśnie doskonałego programu na 100 000 linii kodu, który przyniesie Ci sławę i pieniądze. Jest tu też wiele materiału, a nawet wiedzy o dobrych praktykach, na temat połączeń sieciowych i wątków — co jest akurat moim słabym punktem. Tutaj, przyznam się, szczerze się uśmiałem, gdy autorzy użyli operatorki telefonicznej z lat 50. — tak, dobrze myślisz, to ta pani z trwałą na głowie, która ręcznie przepina kable — jako analogii dla portów TCP/IP... Naprawdę, powinieneś po prostu przejść się do księgarni i przejrzeć drugą edycję Java. Rusz głową!. Nawet jeśli już znasz Javę, na pewno nauczysz się czegoś nowego. A jeśli nie, to samo wertowanie tej książki to świetna zabawa”. — Robert Eckstein, Java.sun.com „Java. Rusz głową! nie wyróżnia się oczywiście zakresem poruszonych tematów, tylko stylem i nastawieniem autorów. Ta książka tak różni się od typowego podręcznika informatycznego lub poradnika technicznego, jak to tylko możliwe. Autorzy zamieścili w niej kreskówki, quizy i magnesy na lodówkę (tak, magnesy na lodówkę...). Tam, gdzie zwykle znalazłbyś przygotowane dla czytelnika ćwiczenia, tutaj masz się wcielić w kompilator i skompilować kod albo samemu złożyć segment kodu poprzez wypełnienie luk, albo... sam rozumiesz. Pierwsze wydanie tej książki polecaliśmy jako tekst wprowadzający dla osób rozpoczynających swoją przygodę z Javą i obiektami. Nowe wydanie nie rozczarowuje i jest udaną kontynuacją poprzedniego. Jeśli jesteś jedną z tych osób, które zasypiają nad tradycyjnym tekstem informatycznym, to przy tej książce pozostaniesz przytomny i gotów do nauki”. — TechBookReport.com „Head First Web Design. Edycja polska to Twoja przepustka do opanowania wszystkich tych złożonych tematów i zrozumienia, o co tak naprawdę chodzi w świecie projektowania stron internetowych. Jeśli nie przeszedłeś jeszcze inicjacji z czymś tak złożonym jak Dreamweaver, to ta książka będzie dla Ciebie świetnym sposobem na nauczenie się projektowania”. — Robert Pritchett, MacCompanion „Czy można naprawdę nauczyć się projektowania internetowego z książki? Head First Web Design. Edycja polska uczy projektowania przyjaznych dla użytkownika stron, od poznania wymagań klienta poczynając, przez ręcznie rysowane schematy stron, na gotowych stronach skutecznie funkcjonujących online kończąc. Tym, co odróżnia ten tekst od innych książek typu »jak stworzyć stronę internetową«, jest wykorzystanie przez autorów najnowszej wiedzy z zakresu nauk kognitywnych oraz technik nauczania i stworzenie bogatego wizualnie doświadczenia edukacyjnego zaprojektowanego zgodnie z tym, jak działa mózg i jak postępuje proces uczenia się. Efektem jest solidny tekst na temat podstaw projektowania internetowego, który powinien się znaleźć w każdej biblioteczce informatycznej i stać się kluczem do sukcesu”. — Diane C. Donovan, California Bookwatch: The Computer Shelf „Z pełnym przekonaniem polecam Head First Web Design. Edycja polska wszystkim moim kolegom programistom, którzy chcieliby zapoznać się z tą bardziej artystyczną częścią naszej pracy”. — Claron Twitchell, UJUG Inne książki z serii Rusz głową! Analiza i projektowanie obiektowe. Rusz głową! C#. Rusz głową! Excel. Rusz głową! Head First Ajax. Edycja polska Head First Algebra. Edycja polska Head First C Head First Design Patterns. Edycja polska Head First EJB. Edycja polska Head First HTML with CSS & XHTML. Edycja polska Head First JavaScript. Edycja polska Head First Object-Oriented Analysis and Design. Edycja polska Head First PHP & MySQL. Edycja polska Head First Ruby on Rails. Edycja polska Head First Servlets & JSP. Edycja polska. Wydanie II Head First Software Development. Edycja polska Head First Web Design. Edycja polska Head First. Fizyka. Edycja polska Head First. Sieci komputerowe. Edycja polska Head First. Statystyka. Edycja polska HTML5. Rusz głową! Java. Rusz głową! Wydanie II jQuery. Rusz głową! SQL. Rusz głową! Wzorce projektowe. Rusz głową! Cudownym kobietom należącym do mojej rodziny: siostrze Maggie, mamie Fran, cioci Catherine, teściowej Christie, a przede wszystkim świętej pamięci babci Pearl, której zapał i niezależność zainspirowały kolejne pokolenia. — Lyza Moim rodzicom, dzięki którym wiele lat temu rozpocząłem przygodę z Commodore 64. Ukochanej żonie, Danie, za jej wsparcie oraz nieprzebrane pokłady cierpliwości i wyrozumiałości, a także Katie i Danny’emu — tak, teraz mogę się z wami pobawić. — Jason Autorzy Lyza Jason Lyza Danger Gardner (@lyzadanger) jest programistką. W 2000 roku Jason Grigsby dostał swój pierwszy Tworzyła, psuła i hakowała w sieci od 1996 roku. telefon komórkowy. Od tego czasu obsesyjnie zajmuje Co ciekawe, Lyza urodziła się i wychowała w Portland go myśl, jak piękny byłby świat, gdyby wszyscy ludzie w stanie Oregon — mieście, w którym wszyscy chcą się mieli w kieszeniach urządzenia umożliwiające dostęp do znaleźć, ale z którego nikt nie wydaje się pochodzić. wszystkich informacji na świecie. W czasie, gdy poznała go Dana — jego przyszła żona — ściany jego mieszkania Lyza wcześnie poszła do college’u i dorobiła się były pokryte szalonymi marzeniami na temat mobilnego prawdziwie eklektycznej edukacji: licencjat z nauk świata. Do dziś Jason zastanawia się, jakim cudem Dana humanistycznych na Uniwersytecie Stanowym Portland, w końcu wyszła za niego za mąż. a następnie magisterka z informatyki na Uniwersytecie w Birmingham. Marzenia te zderzyły się niestety z rzeczywistością — WAP był po prostu fatalny. Jason pracował więc Lyza napisała masę aplikacji sieciowych (również po w branży sieciowej do 2007 roku, kiedy to iPhone pokazał stronie serwera), walczyła z podstępnymi systemami wszystkim, że nadszedł już czas. Jason połączył siły zarządzania treścią, optymalizowała strony pod kątem z trzema najbystrzejszymi osobami, jakie znał, i założył zastosowań mobilnych, pracowała z licznymi API Cloud Four. i poświęciła wiele uwagi bazom danych. Zafascynowana tym, jak technologie mobilne zmieniają świat, poświęca Od czasu, gdy współzałożył Cloud Four, miał przyjemność obecnie wiele czasu na zastanawianie się nad przyszłością pracować przy wielu fantastycznych projektach, m.in. technologii mobilnych i nie tylko. Obama iPhone App. Jest założycielem i prezesem Mobile Portland, organizacji non profit zajmującej się współpracą Od czasu założenia firmy Cloud Four zajmującej się ze społecznością mobilną w Portland w stanie Oregon. technologiami mobilnymi, mającej swoją siedzibę w Portland, Lyza dzielnie pokonuje niezbadane tereny Jason jest wziętym mówcą i konsultantem. Jest dziś Krainy Urządzeń, zgłębiając chaotyczny świat przeglądarek jeszcze bardziej nakręcony na technologie mobilne, i urządzeń mobilnych. W wolnych chwilach oddaje się niż był w 2000 roku (przepraszam, kochanie!). dziwacznym i anachronicznym zajęciom, między innymi Jason bloguje na http://cloudfour.com oraz na swojej wykonuje niebagatelne ilości fotografii. Jest właścicielką prywatnej stronie http://userfirstweb.com; jest też na domeny .com o czteroliterowej nazwie. Gdy już zgadniesz Twitterze jako @grigs. Wpadnij i się przywitaj! tę nazwę, możesz wpaść i złożyć jej wizytę. viii Spis treści Spis treści (skrócony) Wprowadzenie xxi 1. Wprowadzenie do mobilnych technologii webowych. Wrażliwe projekty, czyli Responsive Web Design 1 2. RWD na poważnie. Koncepcja Mobile First w podejściu Responsive Web Design 43 3. Oddzielna witryna mobilna. Stawiamy czoła niezupełnie sprzyjającym okolicznościom 91 4. Komu wsparcie, komu? Które urządzenia powinny być obsługiwane? 137 5. Bazy i klasy urządzeń. Zapoznaj się z grupą 151 6. Framework dla mobilnych aplikacji internetowych. Tartanator 217 7. Mobilne aplikacje w prawdziwym świecie. Wyjątkowe mobilne aplikacje internetowe 267 8. Tworzenie hybrydowych aplikacji mobilnych z PhoneGap. Ustrzel tartan! — w stronę natywności 313 9. Podejście „future friendly”. Odnajdywanie (jakiegoś) sensu w chaosie 357 A Ścinki. Sześć najważniejszych spraw (o których nie mówiliśmy) 373 B Postaw swój serwer. Gdzieś trzeba zacząć 387 C Instalowanie WURFL. Jak wywęszyć urządzenia? 397 D Instalowanie SDK i narzędzi dla Androida. Zadbaj o środowisko 403 Skorowidz 417 Spis treści (z prawdziwego zdarzenia) Wprowadzenie W Twój mózg kontra technologie mobilne. Starasz się czegoś nauczyć, a mózg robi Ci „przysługę”, za wszelką cenę odciągając Twoją uwagę od nauki. Myśli: „Lepiej wyjdź i zajmij się czymś ciekawszym — wypatruj krwiożerczych bestii albo sprawdź, czy kiedy podpalisz swoje BlackBerry Bold, włączy się alarm pożarowy”. Jak w takim razie oszukać mózg, by uznał, że Twoje życie zależy od znajomości technologii mobilnych? Dla kogo jest ta książka? xxii Wiemy, co sobie myślisz xxiii Wiemy też, co sobie myśli Twój mózg xxiii Metapoznanie — myślenie o myśleniu xxv Zespół korektorów merytorycznych xxx Podziękowania xxxi ix Spis treści Wprowadzenie do mobilnych technologii webowych Wrażliwe projekty, czyli Responsive Web Design 1 Witajcie! Jesteście gotowi na mobilne technologie webowe? Tworzenie witryn na urządzenia mobilne jest naprawdę ekscytujące. Wiele w tym uroku, emocji i momentów, w których chciałoby się wykrzyknąć: Eureka!. Ale z drugiej strony pełno tu tajemnic i trudności. Technologie mobilne rozwijają się w tak niewiarygodnym tempie, że cały czas jesteśmy trochę w tyle. Trzymaj się więc mocno! Naszą przygodę rozpoczynamy od ciekawego podejścia do tworzenia witryn internetowych, znanego jako Responsive Web Design (RWD). Dzięki niemu będziesz mógł sprawić, by strony wyglądały równie dobrze na wielu różnych urządzeniach mobilnych i, co ważne, przydadzą Ci się umiejętności, które już masz. Wszyscy jedziemy na tym samym wózku. Wskakujesz? 2 Coś niedobrego stało się w drodze do pubu 4 index.html Skoro przeglądarki w telefonach komórkowych są takie świetne... 5 ...to czy nie powinno to po prostu działać? 5 Wrażliwe projekty — Responsive Web Design 10 Różne arkusze stylów w różnych sytuacjach 12 styles.css Zapytania o media w CSS 13 Dotychczasowa struktura witryny pubu Pod Paradnym Morsem 15 Analiza dotychczasowego arkusza CSS 16 Co trzeba zmienić? 17 Szukamy stylów wymagających zmiany 18 Droga do stylów dostosowanych do urządzeń mobilnych 19 Co jest nie tak z układami o stałej szerokości? 26 Dlaczego płynne jest lepsze? 27 Wzór płynności 28 Ciąg dalszy przekształceń 29 Przełączanie kontekstu 31 Co się stało z tymi obrazami? 32 Płynne obrazy 33 Pamiętaj, by być wrażliwym 36 Oto strona w stylu RWD! 40 Podejście Responsive Web Design to również stan umysłu 41 x Spis treści RWD na poważnie Koncepcja Mobile First w podejściu Responsive Web Design 2 Oto śliczna mobilna witryna. Ale nie oceniaj jej tylko po pozorach. Pod tą piękną powłoką znajdziesz bowiem coś zupełnie innego. Być może wygląda jak mobilna witryna, ale to wciąż zwykła, desktopowa witryna, z tym że przebrana w mobilne ciuszki. Jeśli chcesz, żeby na urządzeniach mobilnych chodziła jak dobrze naoliwiona maszynka, musisz zastosować zasadę Mobile First. Jednak najpierw musimy przeprowadzić sekcję obecnej witryny, by odnaleźć ukrywający się w jej wnętrzu desktopowy szkielet. Następnie gruntownie posprzątamy i zaczniemy pracować na świeżo, zgodnie ze strategią stopniowego ulepszania, zaczynając od budowania podstawowych elementów, a kończąc na bogatej wersji desktopowej. Gdy skończymy, nasza strona będzie zoptymalizowana pod każdą możliwą rozdzielczość ekranu. (cid:3) (cid:14)(cid:22) (cid:11) (cid:13)(cid:26)(cid:17) Gdy właśnie zamierzałeś zacząć świętować swój sukces... 44 "(cid:8) (cid:3)(cid:30) (cid:2)(cid:3)(cid:4)(cid:5)(cid:6)(cid:7)(cid:8)(cid:9)(cid:3)(cid:10)(cid:11)(cid:8) Czy to naprawdę jest problem? Skąd to wiadomo? 45 !(cid:30)(cid:17) ekrany (telefony) (cid:7) Co zrobić, gdy nie śmiga? 47 (cid:24) (cid:7)(cid:31)(cid:26)(cid:17) Nie ma co się oszukiwać, to jest WIELKA strona 48 (cid:9) (cid:3)(cid:6)(cid:8) Dobrodziejstwa pliku HAR 49 (cid:7)(cid:4) (cid:25)(cid:8) Wytęż wzrok i znajdź zawalidrogę 51 (cid:14) (cid:12)(cid:3)(cid:10)(cid:11)(cid:8)(cid:11)(cid:13)(cid:4)(cid:3)(cid:14)(cid:15)(cid:8) (cid:3) (cid:13)(cid:4) (smartfony) Skąd pochodzi skrypt map Google’a? 53 (cid:11) (cid:11)(cid:8) (cid:3)(cid:4)(cid:6) Wygląda przyjaźnie, ale takie nie jest 55 (cid:9)(cid:17) (cid:6) Koncepcja Mobile First w podejściu Responsive Web Design 56 (cid:7) (cid:14)(cid:3)(cid:8)(cid:4) Na czym polega stopniowe ulepszanie? 57 (cid:11)(cid:8) (cid:29)(cid:30) Poprawiamy pływanie elementów 60 (cid:25)(cid:28) (cid:16)(cid:4)(cid:11)(cid:5)(cid:14)(cid:17)(cid:11)(cid:8)(cid:11)(cid:13)(cid:4)(cid:3)(cid:14)(cid:15)(cid:8) (cid:6) (cid:27)(cid:3) (tablet) Zapytania o media w technice Mobile First 61 (cid:11)(cid:8) (cid:14)(cid:17) Niespodzianka! W Internet Explorerze strona się rozsypała 62 (cid:3) (cid:6) (cid:20) (cid:23) Problemy z jednym atrybutem src 68 (cid:11) (cid:25)(cid:26) (cid:11)(cid:8) Powiększanie w znaczniku <meta> viewport 72 (cid:24) (cid:7) (cid:14)(cid:17) Czy powinno się umożliwiać skalowanie? 73 (cid:23) (cid:7) (cid:21)(cid:22) Z pomocą JavaScriptu przywracamy mapę 74 (cid:18)(cid:17)(cid:19)(cid:13)(cid:20)(cid:6)(cid:11)(cid:8)(cid:11)(cid:13)(cid:4)(cid:3)(cid:14)(cid:15)(cid:8) Budujemy pseudozapytanie o media w JavaScripcie 76 (komputery i telewizory) Wstawiamy skrypt na stronę 77 Ten widżet nie jest zgodny z RWD 79 Przenosimy atrybuty do CSS 80 Usuwamy atrybuty z JavaScriptu 81 Mapa znów zasłania treść strony 83 Niech prowadzi Cię zawartość strony 84 Wartości graniczne przybywają na ratunek 87 xi