Nowoczesne witryny WWW są w Twoim zasięgu!

Responsywne strony WWW to dziś standard, do którego dążą wszyscy projektanci stron. W świecie smartfonów, tabletów, laptopów, telewizorów z dostępem do sieci oraz komputerów stacjonarnych stworzenie strony, która będzie dobrze się prezentowała i zachowa swoją funkcjonalność na każdym z urządzeń, to klucz do sukcesu! Ta książka to doskonałe źródło informacji na temat responsywnych stron internetowych — zacznij je projektować już teraz!

W trakcie lektury poznasz zalety i wady trzech najlepszych szkieletów do błyskawicznego tworzenia stron WWW. To Bootstrap, Skeleton oraz Foundation Zurb. Dodatkowo zapoznasz się z preprocesorami CSS oraz zaznajomisz się z nowościami wprowadzonymi w CSS3. Po opanowaniu wiedzy zawartej w kolejnych rozdziałach z łatwością zbudujesz przykładową witrynę produktu na podstawie szkieletu Bootstrap, portfolio na podstawie Skeletona oraz responsywną stronę firmową na podstawie Foundation Zurb. Dzięki praktycznemu podejściu do tematu błyskawicznie przyswoisz cenną wiedzę na temat tworzenia responsywnych stron WWW. Książka ta jest doskonałą lekturą dla wszystkich projektantów oraz pasjonatów tworzenia stron WWW!

Sięgnij po książkę i dowiedz się, jak:

• tworzyć elastyczne arkusze stylów CSS za pomocą preprocesorów
• zbudować responsywną stronę produktu za pomocą szkieletu Bootstrap
• wykorzystać możliwości Foundation Zurb
• stworzyć nowoczesną stronę, prezentującą się idealnie na różnych urządzeniach

Buduj nowoczesne, responsywne strony WWW!

Osoby które kupowały "Responsive Web Design. Nowoczesne strony WWW na przykładach", wybierały także:

• Windows Media Center. Domowe centrum rozrywki 66,67 zł, (8,00 zł -88%)
• Przywództwo w świecie VUCA. Jak być skutecznym liderem w niepewnym środowisku 58,64 zł, (12,90 zł -78%)
• Mapa Agile & Scrum. Jak si 57,69 zł, (15,00 zł -74%)
• Sztuka podst 53,46 zł, (13,90 zł -74%)
• Lean dla bystrzaków. Wydanie II 49,62 zł, (12,90 zł -74%)

Spis treści

Responsive Web Design. Nowoczesne strony WWW na przykładach eBook -- spis treści

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)