księgarnia informatyczna aton.pl

Responsive Web Design. Projektowanie elastycznych witryn w HTML5 i CSS3. Wydanie II

Wydawnictwo HELION

Cena:    49.00   35.77zł

Responsive Web Design. Projektowanie elastycznych witryn w HTML5 i CSS3. Wydanie II


Autor: Ben Frain

ISBN: 978-83-283-2343-8

Ilość stron: 288

Data wydania: 07/2016

Oprawa: Miękka

Format: 170x230

Wydawnictwo: HELION


Profesjonalnie wykonana strona internetowa powinna działać bez zarzutu nie tylko na komputerze stacjonarnym, lecz także na tablecie czy telefonie. Użytkownicy chcą korzystać z aplikacji sieciowych w każdych warunkach i uruchamiać je na urządzeniach o najprzeróżniejszych rozmiarach czy parametrach.

Należy się spodziewać, że wkrótce katalog urządzeń podłączanych do internetu znacznie się poszerzy. W takich warunkach projektant koniecznie musi zadbać o responsywność, aby tworzone przez niego strony internetowe dostosowywały się do zmiennych warunków i zachowywały funkcjonalność.

Niniejsza książka stanowi kompletne źródło informacji potrzebnych do napisania responsywnej strony internetowej. Jeśli znasz HTML i CSS, możesz z jej pomocą zbudować taką aplikację. Znajdziesz tu opis wszystkich podstawowych aspektów responsywnych projektów stron i dowiesz się, jak korzystać z najbardziej przydatnych technik w technologiach HTML5 i CSS3.

Co więcej, odkryjesz najlepsze metody pisania i dostarczania kodu, obrazów i plików. Dzięki licznym przykładom i opisom bez trudu dostosujesz swój projekt do wymagań telefonów komórkowych i wielu innych urządzeń. Wydanie drugie uzupełniono o opis prawie wszystkich najnowszych technik i narzędzi potrzebnych do budowy responsywnych aplikacji internetowych.

W tej książce znajdziesz:
• opis elementów potrzebnych do zbudowania responsywnych stron internetowych
• informacje o zapytaniach medialnych, ich składni i sposobach wykorzystania
• omówienie projektowania struktury i układów płynnych oraz wykorzystania modelu Flexbox
• wskazówki co do wykorzystania niezwykłych możliwości CSS3 i HTML5
• wytyczne dotyczące grafiki SVG oraz metody obsługi obrazów SVG z poziomu JavaScriptu
• wyjaśnienie, jak tworzyć przejścia, transformacje i formularze
• spis dobrych praktyk kodowania responsywnych stron internetowych

Responsywne strony internetowe - będą równie piękne nawet po latach.

Spis treści:

Rozdział 1. Podstawowe wiadomości o projektowaniu responsywnych stron internetowych (21)

  • Rozpoczynamy przygodę (22)
  • Projekt responsywny - definicja (23)
    • Projektowanie responsywnych stron internetowych w pigułce (23)
  • Ustawianie poziomu obsługi przeglądarek (23)
    • Kilka uwag na temat narzędzi i edytorów tekstu (25)
  • Pierwszy przykład projektu responsywnego (26)
    • Podstawowy plik HTML (26)
    • Okiełznać obrazy (29)
    • Zapytania medialne wkraczają do akcji (32)
    • Wady opisanego przykładu (37)
  • Podsumowanie (38)

Rozdział 2. Zapytania medialne: obsługa zróżnicowanych obszarów roboczych (39)

  • Dlaczego zapytania medialne są potrzebne do budowy układów responsywnych (40)
    • Podstawowa logika warunkowa w CSS (41)
  • Składnia zapytań medialnych (41)
    • Zapytania medialne w znaczniku <link> (42)
  • Łączenie zapytań medialnych (43)
    • Importowanie zapytań medialnych za pomocą dyrektywy @import (44)
    • Zapytania medialne w arkuszach stylów (44)
    • Co można sprawdzać za pomocą zapytań medialnych (44)
  • Modyfikowanie projektu strony za pomocą zapytań medialnych (46)
    • W zapytaniu medialnym można wpisać każdą regułę CSS (48)
    • Zapytania medialne dla urządzeń o dużej gęstości pikseli (48)
  • Metody organizacji i pisania zapytań medialnych (49)
    • Dołączanie różnych plików CSS za pomocą zapytań medialnych (49)
    • Zasadność dzielenia zapytań medialnych na wiele plików (50)
    • Śródliniowe zagnieżdżanie zapytań medialnych (50)
  • Łączyć zapytania medialne w bloki czy rozpraszać je w różnych miejscach pliku (51)
  • Znacznik meta viewport (52)
  • Zapytania medialne - poziom 4. (54)
    • Obsługa skryptów (54)
    • Urządzenia wskazujące (55)
    • Funkcja sprawdzania obsługi efektu hover (56)
    • Zapytania dotyczące otoczenia (57)
  • Podsumowanie (58)

Rozdział 3. Układy płynne i obrazy responsywne (59)

  • Konwertowanie układu stałego na elastyczny (60)
    • Do czego służy model flexbox (64)
    • Bloki śródliniowe i białe znaki (65)
    • Elementy pływające (65)
    • Własności tabelaryczne (65)
  • Flexbox - wprowadzenie (66)
    • Wyboista droga do flexboksa (66)
    • Obsługa flexboksa przez przeglądarki (66)
  • Podstawy flexboksa (68)
    • Idealne środkowanie tekstu w pionie (68)
    • Przesuwanie elementów (70)
    • Zmienianie kolejności elementów (71)
    • Różne rodzaje układu flexboksa w różnych zapytaniach medialnych (72)
    • Własność inline-flex (73)
    • Wyrównywanie treści we flexboksie (74)
    • Własność flex (79)
    • Lepka stopka (82)
    • Zmienianie kolejności elementów (83)
    • Podsumowanie wiadomości o flexboksie (88)
  • Obrazy responsywne (88)
    • Wewnętrzny problem obrazów responsywnych (88)
    • Proste przełączanie rozdzielczości za pomocą atrybutu srcset (89)
    • Zaawansowane techniki przełączania obrazów za pomocą atrybutu srcset (90)
    • Prezentowanie obrazów za pomocą elementu picture (91)
  • Podsumowanie (92)

Rozdział 4. HTML5 i projekty responsywne (95)

  • Znaczniki HTML5 są rozpoznawane przez wszystkie nowoczesne przeglądarki (96)
  • Prawidłowe rozpoczynanie strony HTML5 (97)
    • Znacznik doctype (97)
    • Element HTML i atrybut lang (98)
    • Definiowanie różnych języków (98)
    • Kodowanie znaków (98)
  • Jak najlepiej pracować z językiem HTML5 (98)
    • Rozsądne podejście do pisania kodu (99)
    • Oddajmy cześć wszechmocnemu elementowi <a> (100)
  • Nowe elementy semantyczne HTML5 (101)
    • Element main (101)
    • Element <section> (102)
    • Element <nav> (102)
    • Element <article> (103)
    • Element <aside> (103)
    • Elementy <figure> i <figcaption> (103)
    • Elementy <details> i <summary> (104)
    • Element <header> (105)
    • Element <footer> (105)
    • Element <address> (106)
    • Uwaga na temat elementów h1 - h6 (106)
  • Śródliniowe elementy semantyczne HTML5 (107)
    • Element <b> (107)
    • Element <em> (107)
    • Element <i> (108)
  • Elementy języka HTML, które uległy dezaktualizacji (108)
  • Praktyczne wykorzystanie elementów strukturalnych HTML5 (109)
    • Rozsądne wybieranie elementów (109)
  • Standardy dostępności stron WCAG i WAI-ARIA (110)
    • WCAG (110)
    • Standard WAI-ARIA (111)
    • Zapamiętaj tylko jedną rzecz (111)
    • Krok dalej z ARIA (112)
  • Osadzanie elementów multimedialnych w HTML5 (112)
    • Dodawanie do stron internetowych filmów i dźwięków (113)
    • Znaczniki audio i video działają niemal identycznie (115)
  • Responsywne odtwarzacze filmów i ramki wewnętrzne (115)
  • Aplikacje sieciowe w trybie offline (116)
  • Podsumowanie (117)

Rozdział 5. CSS3: selektory, typografia, tryby kolorów i nowe funkcje (119)

  • Nikt nie wie wszystkiego (120)
  • Struktura reguł CSS (120)
  • Przydatne triki w CSS3 (121)
    • Układ wielokolumnowy w CSS3 dla projektu responsywnego (121)
  • Zawijanie tekstu (124)
    • Obcinanie tekstu (125)
    • Tworzenie poziomych przewijanych okienek (126)
  • Rozgałęzianie kodu CSS (128)
    • Zapytania o obsługę własności (128)
    • Łączenie warunków (129)
    • Biblioteka Modernizr (130)
  • Nowe selektory CSS3 i sposób ich wykorzystania (132)
    • Selektory atrybutów w CSS3 (132)
    • Szczegółowe selektory atrybutów CSS3 (133)
    • Pułapki związane z używaniem selektorów wartości atrybutów (135)
    • Za pomocą selektorów wartości atrybutów można wybierać identyfikatory i klasy zaczynające się od cyfr (136)
  • Strukturalne pseudoklasy CSS3 (136)
    • Selektor :last-child (137)
    • Selektory n-tego potomka (137)
    • Zasada działania selektorów n-tego potomka (138)
    • Selektory n-tego potomka w projektach responsywnych (141)
    • Selektor negacji (:not) (143)
    • Selektor :empty (144)
    • Formatowanie pierwszego wiersza akapitu bez względu na obszar roboczy (145)
  • Własności użytkownika i zmienne CSS (145)
  • Funkcja CSS calc (146)
  • Selektory, poziom 4. (147)
    • Pseudoklasa :has (147)
    • Jednostki zależne od rozmiaru obszaru roboczego (147)
  • Typografia sieciowa (148)
    • Reguła @font-face (149)
    • Odwołanie do fontów w regule @font-face (149)
    • Uwagi na temat reguły @font-face i projektów responsywnych (151)
  • Nowe formaty barw CSS3 i kanał alfa (152)
    • Format RGB (152)
    • Format HSL (152)
    • Kanały alfa (154)
    • Moduł kolorów poziomu 4. (154)
  • Podsumowanie (155)

Rozdział 6. Spektakularny wygląd i CSS3 (157)

  • Cienie tekstu w CSS3 (158)
    • Opuszczanie wartości rozmycia, gdy jest niepotrzebna (159)
    • Definiowanie wielu cieni dla tekstu (159)
  • Cienie elementów (159)
    • Cień wewnątrz elementu (160)
    • Definiowanie wielu cieni dla elementu (161)
    • Wartość spread (161)
  • Gradienty tła (162)
    • Liniowe gradienty tła (162)
    • Gradienty promieniste (165)
    • Gradienty responsywne (166)
  • Powtarzanie gradientu (167)
  • Gradientowe desenie tła (168)
  • Wiele obrazów tła jednocześnie (169)
    • Wymiary tła (170)
    • Własność background position (170)
    • Zbiorcza własność background (171)
  • Obrazy tła o wysokiej rozdzielczości (172)
  • Filtry CSS (172)
    • Dostępne filtry CSS (174)
    • Łączenie filtrów CSS (179)
  • Uwaga na temat wydajności CSS (179)
    • Uwagi na temat masek CSS i przycinania grafiki (180)
  • Podsumowanie (181)

Rozdział 7. Grafika SVG niezależna od rozdzielczości ekranu (183)

  • Historia SVG w pigułce (185)
  • Grafika, która jest dokumentem (186)
    • Element główny SVG (187)
    • Przestrzeń nazw (188)
    • Elementy <title> i <desc> (188)
    • Element <defs> (188)
    • Element <g> (188)
    • Kształty SVG (189)
    • Ścieżki SVG (189)
  • Najpopularniejsze programy i usługi do tworzenia grafiki SVG (189)
    • Oszczędzaj czas dzięki usługom oferującym ikony SVG (190)
  • Wstawianie grafik SVG na strony internetowe (191)
    • Element <img> (191)
    • Element <object> (191)
    • Ustawianie grafik SVG w tle elementów (192)
    • Krótka uwaga na temat kodowania danych w URI (194)
    • Generowanie sprite'ów graficznych (195)
  • Wstawianie dokumentów SVG bezpośrednio do kodu HTML (195)
    • Wielokrotne wykorzystywanie obiektów graficznych z symboli (196)
    • Osadzone grafiki SVG mogą mieć różne kolory w różnych kontekstach (197)
    • Wielokrotne wykorzystywanie obiektów graficznych ze źródeł zewnętrznych (198)
  • Możliwości każdej z metod wstawiania grafik SVG na strony internetowe (199)
    • Problemy z przeglądarkami (200)
  • Inne możliwości i dziwactwa SVG (201)
    • Animacje SMIL (201)
    • Stylizowanie grafik SVG za pomocą zewnętrznych arkuszy stylów (202)
    • Formatowanie grafik SVG za pomocą arkuszy wewnętrznych (203)
    • Animowanie grafik SVG za pomocą CSS (204)
  • Animowanie SVG za pomocą JavaScript (205)
    • Prosty przykład animacji na bazie biblioteki GreenSock (206)
  • Optymalizacja grafik SVG (207)
  • Filtry SVG (208)
  • Uwaga na temat zapytań medialnych w SVG (210)
    • Porady implementacyjne (211)
    • Dodatkowe źródła informacji (212)
  • Podsumowanie (212)

Rozdział 8. Przejścia, transformacje i animacje (215)

  • Czym są przejścia CSS3 i jak z nich korzystać? (216)
    • Rodzaje przejść (218)
    • Zbiorcza własność do definiowania przejść (218)
    • Przejścia różnych własności w różnych przedziałach czasowych (219)
    • Funkcje czasu (219)
    • Zabawne typy przejść dla stron responsywnych (221)
  • Transformacje dwuwymiarowe CSS3 (221)
    • scale (222)
    • translate (222)
    • rotate (225)
    • skew (226)
    • matrix (226)
    • Własność transform-origin (227)
  • Transformacje trójwymiarowe (229)
    • Wartość translate3d (232)
  • Animacje w CSS3 (236)
    • Własność animation-fill-mode (238)
  • Podsumowanie (239)

Rozdział 9. Formularze w HTML5 i CSS3 (241)

  • Formularze HTML5 (242)
  • Elementy formularzy HTML5 (243)
    • Atrybut placeholder (243)
    • Atrybut required (244)
    • Atrybut autofocus (244)
    • Atrybut autocomplete (246)
    • Atrybut list (i powiązany element datalist) (246)
  • Rodzaje kontrolek HTML5 (248)
    • Typ email (248)
    • Typ number (249)
    • Typ url (250)
    • Typ tel (252)
    • Typ search (253)
    • Typ pattern (253)
    • Typ color (254)
    • Kontrolki daty i godziny (254)
    • Typ range (257)
  • Wypełnienia dla starszych przeglądarek (258)
  • Formatowanie formularzy HTML5 za pomocą arkuszy CSS3 (259)
    • Oznaczanie pól wymaganych (262)
    • Wypełnianie tła (264)
  • Podsumowanie (265)

Rozdział 10. Ogólne zasady projektowania responsywnych stron internetowych (267)

  • Oglądanie projektu w przeglądarce najszybciej jak to możliwe (268)
    • Wartości punktów kontrolnych powinny być ustalane w odniesieniu do projektu (268)
  • Oglądaj i testuj projekt w prawdziwych urządzeniach (269)
  • Na czym dokładnie polega stopniowe ulepszanie strony (270)
  • Wybór funkcji obsługiwanych przez różne przeglądarki (271)
    • Równość funkcjonalna, nie estetyczna (271)
    • Wybór obsługiwanych przeglądarek (271)
  • Stopniowanie funkcjonalności (272)
    • Implementacja warstw funkcjonalnych (272)
  • Łączenie punktów kontrolnych CSS i JavaScript (273)
  • Unikaj szkieletów CSS w produkcji (275)
  • Kodowanie pragmatycznych rozwiązań (275)
    • Kiedy odnośnik staje się przyciskiem (277)
  • Pisz jak najprostszy kod (278)
  • Ukrywanie, pokazywanie i wczytywanie treści na różnych ekranach (278)
    • Warstwę wizualną strony definiuj za pomocą CSS (279)
  • Sprawdzanie składni (280)
  • Wydajność (281)
  • Co szykuje przyszłość (282)
  • Podsumowanie (283)
Cena:    49.00   35.77zł


Responsive Web Design. Projektowanie elastycznych witryn w HTML5 i CSS3. Wydanie IIKsiążka informatyczna: Responsive Web Design. Projektowanie elastycznych witryn w HTML5 i CSS3. Wydanie II
Księgarnia informatyczna aton.pl

Tutaj możesz kupić tę książkę w dobrej cenie. Zapraszamy na zakupy do naszej księgarni internetowej.