Mobile_Web_Rusz_glowa_mobweb.pdf

(3414 KB) Pobierz
Tytuł oryginału: Head First Mobile Web
Tłumaczenie: Aleksander Lamża
ISBN: 978-83-246-4864-1
© 2013
Helion S.A.
Authorized Polish translation of the English edition of
Head First Mobile Web, 1
st
Edition
9781449302665 © 2012 Cloud Floor, Inc.
This translation is published and sold by permission of O’Reilly Media, Inc.,
which owns or controls all rights to publish and sell the same.
All rights reserved. No part of this book may be reproduced or transmitted in any form
or by any means, electronic or mechanical, including photocopying, recording or by
any information storage retrieval system, without permission from the Publisher.
Wszelkie prawa zastrzeżone. Nieautoryzowane rozpowszechnianie całości lub fragmentu
niniejszej publikacji w jakiejkolwiek postaci jest zabronione. Wykonywanie kopii
metodą kserograficzną, fotograficzną, a także kopiowanie książki na nośniku filmowym,
magnetycznym lub innym powoduje naruszenie praw autorskich niniejszej publikacji.
Wszystkie znaki występujące w tekście są zastrzeżonymi znakami firmowymi
bądź towarowymi ich właścicieli.
Autor oraz Wydawnictwo HELION dołożyli wszelkich starań, by zawarte w tej książce
informacje były kompletne i rzetelne. Nie biorą jednak żadnej odpowiedzialności ani za ich
wykorzystanie, ani za związane z tym ewentualne naruszenie praw patentowych lub autorskich.
Autor oraz Wydawnictwo HELION nie ponoszą również żadnej odpowiedzialności za ewentualne
szkody wynikłe z wykorzystania informacji zawartych w książce.
Wydawnictwo HELION
ul. Kościuszki 1c, 44-100 GLIWICE
tel. 32 231 22 19, 32 230 98 63
e-mail:
helion@helion.pl
WWW:
http://helion.pl
(księgarnia internetowa, katalog książek)
Drogi Czytelniku!
Jeżeli chcesz ocenić tę książkę, zajrzyj pod adres
http://helion.pl/user/opinie/mobweb
Możesz tam wpisać swoje uwagi, spostrzeżenia, recenzję.
•
Kup książkę
•
Poleć książkę
•
Oceń książkę
•
Księgarnia internetowa
•
Lubię to! » Nasza społeczność
Printed in Poland.
Spis
treści
Spis treści (skrócony)
Wprowadzenie
1.
2.
3.
4.
5.
6.
7.
8.
9.
A
B
C
D
Wprowadzenie do mobilnych technologii webowych.
Wrażliwe projekty,
czyli Responsive Web Design
RWD na poważnie.
Koncepcja Mobile First w podejściu Responsive Web Design
Oddzielna witryna mobilna.
Stawiamy czoła niezupełnie sprzyjającym okolicznościom
Komu wsparcie, komu?
Które urządzenia powinny być obsługiwane?
Bazy i klasy urządzeń.
Zapoznaj się z grupą
Framework dla mobilnych aplikacji internetowych.
Tartanator
Mobilne aplikacje w prawdziwym świecie.
Wyjątkowe mobilne aplikacje internetowe
Tworzenie hybrydowych aplikacji mobilnych z PhoneGap.
Ustrzel tartan!
— w stronę natywności
Podejście „future friendly”.
Odnajdywanie (jakiegoś) sensu w chaosie
Dodatek Ścinki.
Sześć najważniejszych spraw (o których nie mówiliśmy)
Dodatek Postaw swój serwer.
Gdzieś trzeba zacząć
Dodatek Instalowanie WURFL.
Jak wywęszyć urządzenia?
Dodatek Instalowanie SDK i narzędzi dla Androida.
Zadbaj o środowisko
Skorowidz
xxi
1
43
91
137
151
217
267
313
357
373
387
397
403
417
W
Spis treści (z prawdziwego zdarzenia)
Wprowadzenie
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?
Wiemy, co sobie myślisz
Wiemy też, co sobie myśli Twój mózg
Metapoznanie — myślenie o myśleniu
Zespół korektorów merytorycznych
Podziękowania
xxii
xxiii
xxiii
xxv
xxx
xxxi
ix
Kup książkę
Poleć książkę
Spis
treści
1
index.html
styles.css
Wprowadzenie do mobilnych technologii webowych
Wrażliwe projekty, czyli Responsive Web Design
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?
Coś niedobrego stało się w drodze do pubu
Skoro przeglądarki w telefonach komórkowych są takie świetne...
...to czy nie powinno to po prostu działać?
Wrażliwe projekty — Responsive Web Design
Różne arkusze stylów w różnych sytuacjach
Zapytania o media w CSS
Dotychczasowa struktura witryny pubu Pod Paradnym Morsem
Analiza dotychczasowego arkusza CSS
Co trzeba zmienić?
Szukamy stylów wymagających zmiany
Droga do stylów dostosowanych do urządzeń mobilnych
Co jest nie tak z układami o stałej szerokości?
Dlaczego płynne jest lepsze?
Wzór płynności
Ciąg dalszy przekształceń
Przełączanie kontekstu
Co się stało z tymi obrazami?
Płynne obrazy
Pamiętaj, by być wrażliwym
Oto strona w stylu RWD!
Podejście Responsive Web Design to również stan umysłu
2
4
5
6
10
12
13
15
16
17
18
19
26
27
28
29
31
32
33
36
40
41
x
Kup książkę
Poleć książkę
Spis
treści
2
Stopniowe ulepszanie bazujące na rozmiarze ekranu oraz możliwościach klienta
Bardzo małe
ekrany (telefony)
Małe ekrany
(smartfony)
RWD na poważnie
Koncepcja Mobile First w podejściu Responsive Web Design
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.
Gdy właśnie zamierzałeś zacząć świętować swój sukces...
Czy to naprawdę jest problem? Skąd to wiadomo?
Co zrobić, gdy nie śmiga?
Nie ma co się oszukiwać, to jest WIELKA strona
Dobrodziejstwa pliku HAR
Wytęż wzrok i znajdź zawalidrogę
Skąd pochodzi skrypt map Google’a
Wygląda przyjaźnie, ale takie nie jest
Koncepcja Mobile First w podejściu Responsive Web Design
Na czym polega stopniowe ulepszanie?
Średnie ekrany
(tablet)
44
45
47
48
49
51
53
55
56
57
60
61
62
68
72
73
74
76
77
79
80
81
83
84
87
Poprawiamy pływanie elementów
Zapytania o media w technice Mobile First
Niespodzianka! W Internet Explorerze strona się rozsypała
Problemy z jednym atrybutem src
Powiększanie w znaczniku <meta> viewport
Czy powinno się umożliwiać skalowanie?
Z pomocą JavaScriptu przywracamy mapę
Większe ekrany
(komputery
i telewizory)
Budujemy pseudozapytanie o media w JavaScripcie
Wstawiamy skrypt na stronę
Ten widżet nie jest zgodny z RWD
Przenosimy atrybuty do CSS
Usuwamy atrybuty z JavaScriptu
Mapa znów zasłania treść strony
Niech prowadzi Cię zawartość strony
Wartości graniczne przybywają na ratunek
xi
Kup książkę
Poleć książkę

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika:

Zgłoś jeśli naruszono regulamin