O autorze (9)

O recenzentach (11)

Przedmowa (13)

• Zawartość książki (13)
• Co trzeba umieć? (14)
• Dla kogo jest ta książka? (14)
• Zastosowane konwencje (14)
  • Czas na działanie (14)
  • Quiz (15)
  • Zrób to sam (15)
• Przykłady kodu (16)
• Errata (16)
• Piractwo (16)

Rozdział 1. Koncepcja RWD (17)

• Podstawowy projekt elastyczny (18)
  • Metaznacznik viewport i zapytania medialne CSS3 (18)
• Ograniczenia technik elastycznych (20)
  • Skalowalne obrazy w elemencie picture (20)
• Dowiedz się więcej o HTML5 i CSS3 (23)
• Wprowadzenie do systemów RWD (24)
  • Po co używać systemów? (24)
  • Kto używa tych systemów? (26)
  • Wady (30)
• Narzędzia potrzebne do budowy elastycznych stron internetowych (30)
  • Przeglądarki internetowe (30)
  • Edytory kodu (31)
  • Elastyczne skryptozakładki (31)
• Krótkie wprowadzenie do preprocesorów CSS (32)
  • Kompilatory kodu preprocesorów CSS (33)
  • LESS (33)
  • Sass, czyli Syntactically Awesome Stylesheets (39)
• Więcej o preprocesorach CSS (41)
  • Materiały do nauki LESS (42)
  • Materiały do nauki Sassa (42)
• Co utworzymy w tej książce? (42)
• Podsumowanie (43)

Rozdział 2. Tworzenie elastycznego portfolio przy użyciu systemu Skeleton (45)

• Podstawy systemu Skeleton (46)
  • Czas na działanie - tworzenie katalogu roboczego i pobieranie systemu Skeleton (46)
• Co zawiera Skeleton? (46)
  • Początkowy dokument HTML (47)
  • Skalowalna siatka (48)
  • Zwijanie kontenera (49)
  • Zapytania medialne (50)
  • Style typograficzne (51)
  • Style przycisków (51)
  • Style formularzy (52)
  • Ikony Apple'a (53)
  • Szablon PSD (54)
• Jak ma wyglądać budowana strona? (54)
  • Nawigacja (56)
  • Efekt hover (56)
• Tworzenie dokumentu w systemie Skeleton (56)
  • Czas na działanie - dodawanie nowego pliku CSS (57)
• Dodawanie własnych fontów (58)
  • Czas na działanie - osadzanie fontów z serwisu Google Fonts (58)
• Przygotowywanie obrazów (59)
  • Ikony mediów społecznościowych (60)
  • Czas na działanie - sprite'y (61)
  • Ikony kontaktowe (62)
• Elementy HTML5 (63)
• Atrybuty danych HTML5 (63)
  • Czas na działanie - konstruowanie dokumentu HTML (64)
• Podsumowanie (69)

Rozdział 3. Ulepszanie strony portfolio przy użyciu CSS3 (71)

• Model polowy CSS (72)
  • Własność CSS3 box-sizing (73)
  • Czas na działanie - definiowanie własności box-sizing (74)
• Jednostki miary CSS (74)
  • Piksele (74)
  • Jednostka em (76)
  • Procenty (78)
• Ustawianie rodziny fontów (78)
  • Czas na działanie - ustawianie rodziny fontów nagłówków (79)
• Formatowanie nagłówka (80)
  • Czas na działanie - definiowanie stylów nagłówka (80)
• Selektory CSS (81)
  • Selektor dziecka (81)
  • Selektor przylegającego elementu siostrzanego (82)
  • Ogólny selektor elementu siostrzanego (83)
• Pseudoklasy CSS3 (84)
  • Pseudoklasa CSS3 :checked (84)
  • Pseudoklasa CSS3 :nth-child (84)
• Style miniatur i podpisów (85)
  • Czas na działanie - definiowanie stylów miniatur i podpisów (86)
• Przekształcenia dwuwymiarowe CSS (90)
  • Funkcja translate() (91)
• Przejścia CSS3 (93)
  • Wartości przejść CSS3 (93)
  • Czas na działanie - zmiana obrazu po najechaniu kursorem (94)
• Filtrująca nawigacja po stronie (97)
  • Czas na działanie - tworzenie filtra portfolio (98)
• Stopka (99)
  • Czas na działanie - formatowanie stopki (100)
• Definiowanie stylów dla mniejszych ekranów (105)
  • Czas na działanie - rozmiar obszaru widoku poniżej 960 pikseli (106)
  • Czas na działanie - rozmiar obszaru widoku od 767 do 480 pikseli (107)
  • Czas na działanie - rozmiar obszaru widoku poniżej 480 pikseli (109)
• Testowanie strony w różnych rozmiarach obszaru widoku (111)
• Podsumowanie (113)

Rozdział 4. Tworzenie strony produktu przy użyciu systemu Bootstrap (115)

• Wprowadzenie do systemu Bootstrap (116)
  • Czas na działanie - przygotowywanie systemu Bootstrap (116)
• Przygotowywanie grafik (117)
• Aplikacje LESS (119)
  • Czas na działanie - instalowanie aplikacji CrunchApp (119)
  • Tworzenie plików LESS (121)
  • Czas na działanie - tworzenie nowego pliku LESS w CrunchAppie (122)
  • Kompilowanie kodu LESS na standardowy CSS (123)
  • Czas na działanie - dodawanie plików LESS do CrunchAppa i kompilowanie ich na CSS (124)
• Dodawanie własnych rodzin fontów przy użyciu reguły @font-face (125)
  • Gdzie w internecie szukać darmowych fontów? (125)
  • Składnia reguły @font-face (125)
  • Formaty fontów dla różnych przeglądarek internetowych (126)
  • Czas na działanie - definiowanie nowego fontu przy użyciu reguły @font-face (127)
• Skalowalność systemu Bootstrap (128)
  • Siatka systemu Bootstrap (128)
  • Zapytania medialne CSS3 w systemie Bootstrap (129)
  • Czas na działanie - tworzenie nowego pliku LESS do przechowywania zapytań medialnych CSS3 (129)
  • Tworzenie nawigacji w systemie Bootstrap (130)
• Tworzenie dokumentów HTML (131)
  • Czas na działanie - tworzenie podstawowych dokumentów HTML5 (132)
  • Quiz (136)
  • Treść strony głównej (136)
  • Czas na działanie - budowa struktury HTML treści strony głównej (136)
  • Treść strony galerii (140)
  • Czas na działanie - definiowanie struktury treści strony galerii (141)
  • Treść strony kontaktowej (143)
  • Czas na działanie - definiowanie struktury treści strony kontaktowej (143)
  • Strona O nas (147)
  • Czas na działanie - definiowanie struktury treści strony O nas (147)
  • Strona o zasadach korzystania z serwisu (149)
  • Czas na działanie - definiowanie struktury treści strony o zasadach korzystania (149)
• Podsumowanie (150)

Rozdział 5. Ulepszanie strony produktu przy użyciu CSS3 i LESS (151)

• Zmienne LESS (152)
  • Czas na działanie - definiowanie zmiennych (152)
• Definiowanie domieszek LESS (154)
  • Czas na działanie -? definiowanie własnych domieszek LESS (154)
• Funkcje LESS do modyfikacji kolorów (155)
• Pojęcie zakresu (156)
• Ogólne reguły stylistyczne (157)
  • Czas na działanie - dodawanie ogólnych reguł stylistycznych (157)
  • Pozbywanie się przedrostków firmowych (160)
• Style przycisków (161)
  • Czas na działanie - zmienianie stylów przycisków systemu Bootstrap (162)
• Czemu te przyciski są takie duże? (163)
• Style nagłówka (164)
  • Czas na działanie - dodawanie stylów nagłówka witryny (164)
• Style stopki (167)
  • Czas na działanie - dodawanie stylów stopki (167)
• Strona główna (170)
  • Sekcja powitalna (170)
  • Czas na działanie - formatowanie stylu sekcji powitalnej (170)
  • Sekcja wezwania do działania (171)
  • Czas na działanie - formatowanie stylu sekcji wezwania do działania (172)
  • Sekcja galerii (172)
  • Czas na działanie - definiowanie stylu sekcji galerii (173)
  • Sekcja referencji (174)
  • Czas na działanie - definiowanie stylu sekcji referencji (174)
  • Formularz subskrypcji (175)
  • Czas na działanie - formatowanie stylu pola adresu e-mail (175)
• Strona galerii (176)
  • Czas na działanie - dostosowywanie stylów tytułu strony (178)
• Strona kontaktowa (179)
  • Czas na działanie - dostosowywanie stylów strony kontaktowej (181)
• Strona O nas (182)
• Strona o zasadach korzystania z serwisu (184)
• Zapewnianie dobrego wyglądu strony w różnych urządzeniach (184)
  • Czas na działanie - poprawianie wyglądu strony w oknach o szerokości do 767 pikseli (186)
  • Czas na działanie - poprawianie wyglądu strony w oknach o szerokości do 480 pikseli (190)
• Usuwanie niepotrzebnych reguł stylistycznych (193)
• Testowanie witryny (195)
• Podsumowanie (195)

Rozdział 6. Elastyczna strona firmowa na bazie systemu Foundation (197)

• System szkieletowy oparty na języku Ruby (198)
• Gem Foundation (198)
  • Czas na działanie - instalowanie systemu Foundation i konfiguracja nowego projektu (199)
• Składnie Sassa i SCSS (200)
  • Edytory kodu Sassa i SCSS (201)
  • Czas na działanie - instalowanie edytora Sublime Text i włączanie kolorowania składni SCSS (201)
• Tworzenie własnych arkuszy stylów SCSS (203)
  • Czas na działanie - tworzenie arkuszy stylów SCSS, aby nie utrudniać obsługi systemu (203)
• Wprowadzenie do Compassa (204)
  • Funkcje pomocnicze Compassa (204)
  • Konfiguracja projektu Compassa (204)
  • Czas na działanie - konfiguracja ścieżki projektu w pliku config.rb (206)
• Kompilowanie SCSS na CSS (207)
  • Czas na działanie - obserwowanie zmian w arkuszach stylów SCSS (207)
• Przygotowywanie obrazów (208)
• Składniki systemu Foundation (209)
  • Siatka (209)
  • Zapytania medialne CSS3 (212)
  • Style interfejsu użytkownika (212)
  • Wtyczka do jQuery Orbit (213)
• Tworzenie dokumentów HTML (214)
  • Podstawowy dokument HTML (214)
  • Czas na działanie - modyfikowanie podstawowego dokumentu HTML (214)
  • Strona główna (218)
  • Czas na działanie - tworzenie treści strony głównej (218)
  • Strona z opisem usług (225)
  • Czas na działanie - budowa struktury HTML strony Usługi (225)
  • Strona z cennikiem (230)
  • Czas na działanie - budowa struktury HTML strony z cennikiem (231)
  • Strona O nas (236)
  • Czas na działanie - budowa struktury HTML strony O nas (236)
  • Strona kontaktowa (240)
  • Czas na działanie - budowa struktury HTML strony kontaktowej (240)
• Podsumowanie (244)

Rozdział 7. Rozszerzanie systemu Foundation (245)

• Monitorowanie projektu (246)
  • Czas na działanie - włączanie monitorowania projektu (246)
• Wprowadzenie do funkcji kolorów Sassa (247)
• Zmienne w Sassie (248)
  • Czas na działanie - dostosowywanie zmiennych Sassa dotyczących kolorów systemu Foundation (248)
• Własne rodziny fontów (250)
  • Domieszka Compassa do deklarowania reguł @font-face (251)
  • Czas na działanie - dodawanie własnych rodzin fontów przy użyciu domieszki Compassa (251)
• Nawigacja (254)
  • Czas na działanie - formatowanie sekcji nagłówkowej (254)
• Wprowadzenie do funkcji pomocniczych Compassa dotyczących sprite'ów (255)
• Stopka (256)
  • Czas na działanie - formatowanie stylu stopki (257)
• Wprowadzenie do selektorów strukturalnych CSS3 (261)
• Strona główna (262)
  • Czas na działanie - formatowanie strony głównej (263)
  • Do boju (270)
• Strona Usługi (272)
  • Czas na działanie - formatowanie strony o usługach (273)
• Strona z cennikiem (278)
  • Czas na działanie - formatowanie stylu strony z cennikami (279)
• Strony O nas i Kontakt (282)
  • Czas na działanie - formatowanie stylu stron O nas i Kontakt (282)
  • Czas na działanie - czynności końcowe (284)
• Testowanie witryny (286)
• Podsumowanie (287)
• Źródła dodatkowych informacji (287)
  • Książki (287)
  • Internet (288)

Skorowidz (289)

• Title: Responsive Web Design. Nowoczesne strony WWW na przykładach
• Author: Thoriq Firdaus
• Original title: Responsive Web Design by Example
• Translation: Łukasz Piwko
• ISBN: 978-83-246-9191-3, 9788324691913
• Date of issue: 2014-08-22
• Format: Ebook
• Item ID: reweno
• Publisher: Helion