Bootstrap_Tworzenie_wlasnych_stylow_graficznych_bootgr.pdf

(848 KB) Pobierz
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.
Redaktor prowadzący: Małgorzata Kulik
Projekt okładki: Studio Gravite / Olsztyn
Obarek, Pokoński, Pazdrijowski, Zaprucki
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/bootgr
Możesz tam wpisać swoje uwagi, spostrzeżenia, recenzję.
Kody źródłowe wybranych przykładów dostępne są pod adresem:
ftp://ftp.helion.pl/przyklady/bootgr.zip
ISBN: 978-83-246-9255-2
Copyright © Helion 2017
Printed in Poland.
•
Kup książkę
•
Poleć książkę
•
Oceń książkę
•
Księgarnia internetowa
•
Lubię to! » Nasza społeczność
Spis tre ci
S owo wst pne ........................................................................................ 9
Rozdzia 1. Najwa niejsze informacje — tytu em przypomnienia ..................13
Bootstrap: siatka, czyli grid ............................................................................................... 14
Narzędzia deweloperskie ................................................................................................... 15
Semantyka kodu ................................................................................................................. 16
Outline kodu HTML .......................................................................................................... 17
Block Element Modifier .................................................................................................... 18
Progressive Enhancement ................................................................................................. 20
Dostępność stron WWW .................................................................................................. 21
Podsumowanie rozdziału .................................................................................................. 23
Rozdzia 2. Bootstrap i jego zastosowanie w praktyce
— przyk ady stron WWW .................................................... 25
Jak rozpoznać, że witrynę napisano w Bootstrapie? ...................................................... 26
Datanyze Insider .......................................................................................................... 26
builtwith.com ................................................................................................................ 27
Badanie źródła strony .................................................................................................. 27
Strony napisane za pomocą Bootstrapa .......................................................................... 28
Musicam Sacram .......................................................................................................... 28
rozwal.to ........................................................................................................................ 30
nba.com ......................................................................................................................... 31
gfycat.com ..................................................................................................................... 32
fontawesome.io ............................................................................................................. 33
Portale z projektami utworzonymi w Bootstrapie ......................................................... 33
Bootstrap Expo ............................................................................................................. 34
Built with Bootstrap ..................................................................................................... 34
Rozdzia 3. Dodatkowe, bardzo przydatne zasoby
zwi zane z Bootstrapem ....................................................... 37
Edytor kodu ......................................................................................................................... 37
Emmet ............................................................................................................................ 40
Snippety ......................................................................................................................... 42
Kup książkę
Poleć książkę
6
Bootstrap. Tworzenie w asnych stylów graficznych
Minimapa kodu ............................................................................................................ 44
Polskie znaki w Atomie ............................................................................................... 45
Dodatkowe materiały dotyczące pisania stron ............................................................... 47
Bootswatch .................................................................................................................... 47
Kolorystyka ................................................................................................................... 50
Stałe fragmenty kodu ................................................................................................... 50
Dokumentacja Bootstrapa ................................................................................................. 51
Kody HTML oraz CSS — przydatne adresy ................................................................... 55
Zdjęcia stockowe oraz placeholdery ................................................................................ 57
Podsumowanie ................................................................................................................... 59
ZADANIA ........................................................................................................................... 61
Rozdzia 4. Zaczynamy w asny projekt w Bootstrapie — plan witryny ....... 63
Obsługa programu graficznego ........................................................................................ 67
Praca nad szablonem ......................................................................................................... 71
Nawigacja oraz strona wejściowa ............................................................................... 71
Część strony „Jacy jesteśmy?” ..................................................................................... 75
Część strony „Galeria” ................................................................................................. 79
Część strony „Zespół” .................................................................................................. 83
Część strony „Osiągnięcia i nagrody” ....................................................................... 87
Część strony „Poznaj opinie” ..................................................................................... 92
Ostatnia część strony — stopka .................................................................................. 96
Podsumowanie pracy nad szablonem ....................................................................... 97
Praca ogólna nad szablonem ............................................................................................ 98
ZADANIA ......................................................................................................................... 101
Rozdzia 5. Wydajno
strony a narz dzia Bootstrapa ..............................103
Optymalizacja grafiki ....................................................................................................... 104
Optymalizacja obrazów za pomocą programu GIMP .......................................... 104
Optymalizacja obrazów za pomocą narzędzi online ............................................. 105
Kompatybilność z różnymi przeglądarkami ................................................................ 106
Badanie optymalizacji strony za pomocą narzędzi deweloperskich ......................... 108
Szybkość pobierania elementów .............................................................................. 108
Kody HTML oraz CSS witryny ................................................................................ 109
Konsola JS na stronie ................................................................................................. 110
Treści na stronie ......................................................................................................... 110
Testy optymalizujące stronę ..................................................................................... 111
Narzędzia zewnętrzne ...................................................................................................... 112
YSlow ........................................................................................................................... 112
PageSpeed Insights ..................................................................................................... 113
Badanie strony w wersji dla urządzeń mobilnych ....................................................... 115
SEO — RWD a subdomena m. ....................................................................................... 116
Kup książkę
Poleć książkę
Spis tre ci
7
Ładowanie się plików ....................................................................................................... 117
Modyfikacja gotowych stylów Bootstrapa .............................................................. 118
Minifikacja plików CSS — generatory .................................................................... 122
Content Delivery Network (CDN) .......................................................................... 123
Kolejność ładowania się plików ............................................................................... 127
ZADANIA ......................................................................................................................... 128
Rozdzia 6. Pisanie strony w j zyku HTML .............................................129
Szablony HTML ............................................................................................................... 130
Modyfikacja pliku HTML ............................................................................................... 134
Ekran powitalny ......................................................................................................... 136
Sekcja „Jacy jesteśmy?” .............................................................................................. 139
Galeria strony ............................................................................................................. 145
Prezentacja zespołu (karuzela) ................................................................................. 150
Osiągnięcia i nagrody ................................................................................................ 155
„Co mówią” — poznaj opinie ................................................................................... 160
Stopka strony .............................................................................................................. 164
Rozdzia 7. W asne style CSS
— dostosowywanie stylów do potrzeb strony ........................169
Style resetujące oraz normalizujące ............................................................................... 170
Stylizowanie strony WWW ............................................................................................ 171
Czcionki ....................................................................................................................... 173
Stylizowanie klas ogólnych ....................................................................................... 173
Stylizowanie poszczególnych części strony ............................................................ 179
Dostosowanie strony do potrzeb urządzeń mobilnych ........................................ 209
ZADANIA ......................................................................................................................... 216
Rozdzia 8. Podsumowanie, wnioski i gar refleksji
o pisaniu responsywnych stron bez Bootstrapa .......................217
Sko czyli my… i co dalej? ......................................................................221
Inne frameworki CSS ....................................................................................................... 222
Foundation .................................................................................................................. 222
Semantic UI ................................................................................................................ 222
Material Design Lite .................................................................................................. 223
Skorowidz .......................................................................................... 225
Kup książkę
Poleć książkę

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika:

Zgłoś jeśli naruszono regulamin