Responsywne_strony_WWW_Technologia_na_start_reswww.pdf

(1226 KB) Pobierz
Tytuł oryginału: Jump Start Responsive Web Design
Tłumaczenie: Piotr Rajca
ISBN: 978-83-246-9237-8
© 2014 Helion S.A.
Authorized Polish translation of the English edition of Jump Start Responsive Web Design,
ISBN 9780987332165 © 2013 SitePoint Pty. Ltd.
This translation is published and sold by permission of O’Reilly Media, Inc.,
which owns or controls all rights 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 bierze jednak żadnej odpowiedzialności ani za ich wykorzystanie,
ani za związane z tym ewentualne naruszenie praw patentowych lub autorskich. Wydawnictwo
HELION nie ponosi 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)
Pliki z przykładami omawianymi w książce można znaleźć pod adresem:
ftp://ftp.helion.pl/przyklady/reswww.zip
Drogi Czytelniku!
Jeżeli chcesz ocenić tę książkę, zajrzyj pod adres
http://helion.pl/user/opinie/reswww
Możesz tam wpisać swoje uwagi, spostrzeżenia, recenzję.
Printed in Poland.
•
Kup książkę
•
Poleć książkę
•
Oceń książkę
•
Księgarnia internetowa
•
Lubię to! » Nasza społeczność
Spis tre ci
Wst p .................................................................................... 9
Kto powinien si gn po t ksi k ............................................................... 9
Zastosowane konwencje ............................................................................... 9
Przyk adowe kody .................................................................................... 9
Wskazówki, uwagi i ostrze enia ............................................................ 10
Materia y uzupe niaj ce ............................................................................... 11
Podzi kowania ............................................................................................ 12
Rozdzia 1.
Zapewnianie responsywno ci ............................................. 13
Napisz raz i uruchom ................................................................................... 14
Filary projektowania responsywnych stron WWW ....................................... 16
Dostosuj lub zacznij od nowa ...................................................................... 21
Sami stanowimy przyk ad ............................................................................ 21
Okre lanie struktury zawarto ci/bloków ................................................. 24
Upraszczanie stylów CSS ........................................................................ 25
Zmiany w semantyce kodu ..................................................................... 26
Przedstawienie projektowania z my l o urz dzeniach mobilnych ............... 28
W potrzebie dobry b dzie dowolny obszar prezentacyjny ............................ 30
Reagowanie na metodologi RWD .............................................................. 32
Rozdzia 2.
P ynne siatki ....................................................................... 33
Rola p ynnych siatek .................................................................................... 34
Tworzenie w asnego rozwi zania ................................................................ 38
P ynna typografia .................................................................................. 39
Ujawnianie domy lnych wielko ci czcionek ............................................ 41
Wykorzystanie jednostek wzgl dnych w uk adach stron ......................... 43
Samodzielne tworzenie p ynnej siatki ..................................................... 46
Dodawanie z otej proporcji .................................................................... 47
Gotowe systemy siatek .......................................................................... 50
Zastosowanie systemu Bootstrap ................................................................. 58
Rozwi zania responsywne ........................................................................... 65
Rozdzia 3.
Obrazy adaptacyjne ............................................................ 67
Adaptacyjne arkusze stylów CSS .................................................................. 68
Obrazy adaptacyjne obs ugiwane skryptowo ............................................... 70
Adaptacyjne rozwi zanie w j zyku HTML5 .................................................. 72
W3C wybiera atrybut srcset ................................................................... 74
Brakuj cy element picture ...................................................................... 78
Adaptacja przyk adowej strony .................................................................... 79
Zrozumie sytuacj ...................................................................................... 83
Kup książkę
Poleć książkę
6
Responsywne strony WWW
Rozdzia 4.
Zrozumie zapytania medialne ........................................... 85
Poznawanie mo liwo ci zapyta medialnych ............................................... 87
Obs uga cech ......................................................................................... 90
Zapytania medialne w dzia aniu .................................................................. 92
Dodawanie punktów granicznych ........................................................ 100
Sprosta zadaniu ....................................................................................... 106
Rozdzia 5.
Responsywna tre
........................................................... 107
Strukturyzacja nas wyzwoli ........................................................................ 109
Struktura dokumentu ........................................................................... 109
Metadane ............................................................................................ 112
Tre ci wspomagaj ce ........................................................................... 115
Techniczne sposoby tworzenia responsywnych tre ci ................................. 116
Usuwanie tre ci o nieodpowiednim kontek cie .................................... 116
Dynamiczne wczytywanie na podstawie kontekstu .............................. 117
Wra enia zale ne od platform ................................................................... 119
Decyzje dotycz ce domeny .................................................................. 120
Trasowanie przegl darek ..................................................................... 121
Trasowanie szablonów ........................................................................ 123
Okre lanie, jak daleko mo na si posun ................................................. 124
Dostosowanie ........................................................................................... 126
Rozdzia 6.
Responsywny szablon ....................................................... 129
Tworzenie prostego szablonu strony WWW ............................................... 130
Gotowe szablony ....................................................................................... 130
HTML5 Boilerplate ............................................................................... 131
Bootstrap ............................................................................................. 132
Foundation .......................................................................................... 132
Skeleton .............................................................................................. 133
Semantic Grid System .......................................................................... 133
320 and Up ......................................................................................... 134
Tworzenie w asnego szablonu ................................................................... 134
Struktura katalogów oraz podstawowe pliki ........................................ 134
Neutralizacja i normalizacja ................................................................. 138
Podstawowe biblioteki ........................................................................ 139
Bazowy arkusz stylów .......................................................................... 141
Przygotowywanie pod k tem wielokrotnego stosowania ........................... 142
Preprocesory CSS ................................................................................. 143
Zarz dzanie skryptami ......................................................................... 146
Przygotowanie do u ycia i udost pnianie ............................................ 147
Kiedy wszystko b dzie ju gotowe… ......................................................... 147
Odpowiadaj na potrzeby ........................................................................... 148
Skorowidz ......................................................................... 149
Kup książkę
Poleć książkę
Rozdzia
Zrozumie zapytania medialne
Zapytania medialne są trzecim filarem metodologii RWD i stanowią rozszerzenie języka
HTML5 pozwalające, by na dostarczanie arkuszy CSS do konkretnego urządzenia miały
wpływ cechy jego ekranu, zgodnie z definicją zawartą w specyfikacji modułu CSS3
1
. Inny-
mi słowy: istnieje możliwość wykrycia, że strona jest wyświetlana na urządzeniu przeno-
śnym z ekranem o szerokości 320 pikseli i działającym w układzie poziomym, i dostarczenia
do niej innego arkusza stylów niż do tej samej strony wyświetlanej na komputerze stacjo-
narnym z ekranem o obszarze prezentacyjnym o szerokości 1024 pikseli. Tradycyjnie róż-
nice w stylach ograniczałyby się jedynie do innego układu, tła oraz obrazów, jednak w rze-
czywistości istnieje możliwość dostarczenia całkowicie odrębnego zestawu stylów.
Arkusze stylów określane na podstawie zapytań medialnych mogą być podawane na trzy
sposoby, podobnie jak w przypadku typów mediów. Po pierwsze, przy użyciu elementu
link
języków HTML i XHTML:
<link rel="stylesheet" type="text/css" media="all and
(color)" href="/style.css">
Po drugie, przy użyciu kodu XML:
<?xml-stylesheet media="all and (color)" rel="stylesheet"
href="/style.css" ?>
Ostatnim sposobem jest użycie reguł
@import
w arkuszach stylów:
@import url("/style.css") all and (color);
1
http://www.w3.org/TR/css3-mediaqueries/.
Kup książkę
Poleć książkę

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika:

Zgłoś jeśli naruszono regulamin