Деталі електронної книги

Head First Web Design. Edycja polska

Head First Web Design. Edycja polska

Ethan Watrall, Jeff Siarto

Eлектронна книга

Poznaj sekrety tworzenia efektownych stron WWW, spełniających wszelkie wymagania dostępności i użyteczności

Istnieje tylko jedna metoda, dzięki której możesz stać się doświadczonym webmasterem — to samodzielne projektowanie i tworzenie witryn internetowych. Dzięki książce, którą trzymasz w rękach, z pewnością zdobędziesz umiejętności w tej dziedzinie. Ten niezwykły podręcznik został bowiem przygotowany tak, aby zmusić Twój mózg do przyswojenia potrzebnych informacji. W rezultacie Tobie pozostanie już tylko wykonać zaproponowane przez autorów ćwiczenia. A więc do dzieła! Współpracując ze swoim mózgiem, możesz zostać twórcą atrakcyjnych i użytecznych witryn WWW.

Książka "Head First Web Design. Edycja polska" zawiera wszystko to, czego naprawdę potrzebujesz, aby stworzyć doskonałą witrynę internetową, a jednocześnie nie zaśmiecać pamięci niepotrzebnymi informacjami. Podręcznik został wzbogacony ilustracjami, anegdotami i opisami, a przede wszystkim ciekawymi ćwiczeniami i zadaniami do rozwiązania — tak abyś jak najszybciej nauczył się projektować architekturę strony WWW. To nie wszystko. Podczas lektury dowiesz się, jak wykorzystywać systemy nawigacji, testy użyteczności oraz narzędzia do prowadzenia statystyk, a także jak sporządzać kalkulacje i listy ofertowe dla klientów.

  • Organizacja strony internetowej
  • Układ strony — przestrzeganie złotej reguły
  • Architektura informacji i nawigacja
  • Pisanie tekstów na potrzeby strony WWW
  • Ankiety i grupy fokusowe
  • Testy użyteczności
  • Narzędzia do prowadzenia statystyk witryny
  • Projektowanie stron jako biznes
  • Kalkulacja oferty i listy ofertowe
  • Flash, XHTML, CSS
  • Biblioteka JavaScript JQuery

Praktyczny, intuicyjny i niezawodny podręcznik tworzenia nowoczesnych stron internetowych!



Przykładowe strony:

Rozdział 1: Red Lantern Design
Rozdział 2: Mark w Japonii_r02
Rozdział 3: Mark w Japonii_r03
Rozdział 4: RPM Music
Rozdział 5: Sample Rate
Rozdział 6: College of New Media (stara wesja)
Rozdział 6: College of New Media (nowa wesja)
Rozdział 7: Przebieganie wzrokiem
Rozdział 8: Audio 2 Go (stara wersja)
Rozdział 8: Audio 2 Go (nowa wersja)
Rozdział 9: RPM Music
Rozdział 10: Red Lantern Design
Rozdział 11: Foo Bar
Rozdział 11: Foo Bar (kradziony)

Wprowadzenie

  • Dla kogo przeznaczona jest ta książka? (22)
  • Wiemy, co sobie myślisz (23)
  • Metapoznanie - myślenie o myśleniu (25)
  • A oto, co możesz zrobić, by skłonić swój mózg do posłuszeństwa (27)
  • Ważne informacje (28)
  • Zespół korektorów merytorycznych (30)
  • Podziękowania (31)

1. Tworzenie atrakcyjnych stron internetowych

  • Twoja wielka szansa - Red Lantern Design (34)
  • Od czego zaczynamy? (37)
  • ZACZNIJ od narysowania projektu (39)
  • Ustalenie nawigacji najwyższego poziomu (45)
  • Umieszczenie wszystkiego w kontekście (47)
  • Pokaż Jane proste szkice (48)
  • Szkice pomagają skoncentrować się na funkcjonalności (49)
  • Nie rujnuj dobrego projektu złym tekstem (60)
  • Co sprawia, że tekst można szybko przebiec wzrokiem? (61)
  • Projektowanie stron internetowych oparte jest na komunikacji i UŻYTKOWNIKACH (67)

2. Faza preprodukcji

  • Twoje pierwsze "międzynarodowe" zlecenie... (70)
  • Pomyśl, zanim zabierzesz się za tworzenie kodu (72)
  • Jasna metafora wizualna wzmacnia motyw przewodni strony internetowej (73)
  • Motyw przewodni reprezentuje zawartość strony (74)
  • Burza mózgów - droga do metafory wizualnej (77)
  • Wymyśl motyw przewodni i metaforę wizualną dla Marka (78)
  • Elementy strony powinny kształtować metaforę wizualną (81)
  • Zbuduj szybko próbkę kodu XHTML dla Marka (88)
  • A także kod CSS... (89)
  • Użyj szkiców, by rozwinąć pomysły i zaoszczędzić trochę czasu bez tworzenia kodu (93)
  • Nie projektuj dla siebie! (94)
  • Utworzymy teraz szkic dla Marka (96)

3. Organizacja strony

  • Dopasowanie zawartości strony do jej układu (103)
  • Organizacja informacji znajdujących się na stronie (104)
  • Organizacja strony za pomocą architektury informacji (111)
  • Architektura informacji w oparciu o sortowanie kart (112)
  • Cała prawda o sortowaniu kart (113)
  • Posortuj karty w stosy zgodnie z ich podobieństwem (118)
  • Nazwy stosów powinny być krótkie i opisowe (119)
  • Który sposób sortowania jest właściwy? (124)
  • Ułóż karty w hierarchię strony (125)
  • Diagramy architektury informacji to po prostu karty posortowane na papierze (127)
  • Diagramy architektury informacji NIE są tylko spisem odnośników między stronami (128)
  • Przejście z fazy preprodukcji do produkcji (132)
  • Budowanie struktury witryny Marka (133)
  • Najpierw utworzymy plik index.html... (134)
  • ...a później plik screen.css ze stylami (135)
  • Od preprodukcji do produkcji - pełny proces (138)

4. Układ strony

  • Projektuje się z myślą o odbiorcach (142)
  • Twoje najnowsze zadanie - RPM Music (145)
  • Ustalenie odbiorców strony RPM Music za pomocą person (146)
  • Pozwól, by to persony były Twoimi przewodnikami... (152)
  • Rozdzielczość wpływa na projekt i układ strony (154)
  • Miejsce dostępne na ekranie określa, jak DUŻA część strony będzie widoczna w przeglądarce użytkownika (156)
  • Zbuduj kod XHTML i CSS zoptymalizowany pod kątem rozdzielczości 1024×768 (160)
  • Ludzie lubią, gdy wszystko jest dobrze zorganizowane i równo ułożone (164)
  • Jak szeroka powinna być moja siatka? Użyj złotej proporcji (165)
  • Reguła trójpodziału: uproszczenie złotej proporcji (166)
  • Strona RPM Music i złota proporcja - studium (złego) przypadku (167)
  • Pamiętasz o personach i kliencie? (171)
  • Konfiguracja strony RPM Music 2.0 z platformą Blueprint (173)
  • Użyj reguł CSS platformy Blueprint do nadania stylu stronie RPM Music 2.0 (176)
  • Czas dodać zawartość strony RPM Music (177)
  • Dodaj nieco kodu CSS, by uporządkować układ strony (181)

5. Projektowanie w kolorze

  • Wspomóż lokalną scenę muzyczną (192)
  • Strona 9Rules - złoty standard sieci blogów (193)
  • Czasami możliwość wyboru jest nieco ograniczona (194)
  • Kolor wpływa na emocje (195)
  • Koło barw (czyli od czego wszystko się zaczęło) (199)
  • Użyj koła barw do wybrania kolorów, które do siebie pasują (202)
  • Najpierw wybiera się kolor PODSTAWOWY (202)
  • Atrakcyjny wzorzec kolorów można stworzyć za pomocą schematu triady kolorów (203)
  • Zaczynamy pisać kod strony SampleRate (205)
  • Utworzenie prostego układu strony za pomocą arkusza CSS (206)
  • Przeciwieństwem ciężkości jest... lekkość (212)
  • Utwórz bogatszą paletę kolorów za pomocą schematu czwórkowego (214)
  • Czas uaktualnić arkusz CSS strony SampleRate (218)

6. Dobry system nawigacyjny

  • Nowy semestr w szkole rozpoczęty (226)
  • Pierwszym krokiem w stronę dobrej nawigacji jest dobra architektura informacji (229)
  • Czym tak naprawdę jest nazwa? (230)
  • Rozwiązanie nr 1 - nawigacja z poziomymi zakładkami (236)
  • Rozwiązanie nr 2 - nawigacja pionowa (238)
  • Elementy blokowe to Twoi przyjaciele (244)
  • Pozycjonowanie nawigacji blokowej za pomocą pływania (245)
  • Ikony nic nie MÓWIĄ... po prostu ładnie wyglądają (247)
  • Dodawaj ikony do tekstu, a nie odwrotnie (249)
  • Uaktualnij kod XHTML strony CNM, by używał odnośników tekstowych (250)
  • Teraz możesz nadać elementom blokowym styl... (251)
  • Główny system nawigacyjny nie powinien się zmieniać... ale system drugorzędny już TAK (253)
  • Każda podstrona otrzymuje własny drugorzędny system nawigacyjny (254)
  • Dodanie stylu do nawigacji za pomocą arkusza CSS (255)

7. Pisanie tekstów na potrzeby stron internetowych

  • Utwórz lepszą gazetę internetową (265)
  • Strona gazety "The Hipster Intelligencer" - specyfikacja projektu (266)
  • Problemem jest TEKST (266)
  • Ulepszenie zawartości strony za pomocą odwróconej piramidy (273)
  • Skracanie tekstu (279)
  • Dodanie list do kodu XHTML (289)
  • Nagłówki sprawiają, że tekst jeszcze łatwiej przebiec wzrokiem (291)
  • Mieszaj ze sobą czcionki, by podkreślić nagłówki i inny tekst (300)
  • Ważny jest poziom nagłówka, a nie jego rozmiar (301)

8. Dostępność

  • Audio-2-Go - niedostępna dostępność (308)
  • Dostępność oznacza, że ze strony może korzystać KAŻDY (309)
  • Jak CZYTA się Twoja strona? (310)
  • Informacje na stronie powinny być zrozumiałe... dla KAŻDEGO (312)
  • Pogódź się z tym - komputery naprawdę są głupie (313)
  • Komputer przeczyta tekst atrybutu ALT obrazka (314)
  • Przekształć długi tekst atrybutu ALT w opis LONGDESC (318)
  • Twoje modyfikacje poprawiły sytuację tylko NIEKTÓRYCH klientów Audio-2-Go (320)
  • Dostępność nie ogranicza się do czytników ekranu (321)
  • Elementy powinny być aktywowane PO KOLEI (323)
  • Strona Audio-2-Go jest teraz ZNACZNIE bardziej DOSTĘPNA (326)
  • WCAG Priority 1 (330)
  • Kolory nie powinny być JEDYNĄ formą komunikacji (334)
  • Świat w bezpiecznych barwach... (335)
  • Świat w zaburzonych barwach... (335)
  • Audio-2-Go oczami osoby z zaburzeniami rozpoznawania barw (336)
  • Gwiazdki są prawdziwym problemem (338)
  • Obrazki tła są nadal Twoimi przyjaciółmi (339)
  • Kolejność to nie tylko atrybuty tabindex (340)

9. Słuchaj swoich użytkowników

  • Problemy w RPM Music (352)
  • Niech przemówią użytkownicy - za pośrednictwem ankiet i grup fokusowych (354)
  • Ankiety i grupy fokusowe nie są darmowe (357)
  • Zadaj w ankiecie właściwe pytania (360)
  • Ostateczna wersja ankiety dla użytkowników strony RPM Music (370)
  • Mamy wyniki! (372)
  • Odpowiedzi na pytanie otwarte: (373)
  • Użycie przeglądarek (375)
  • Napraw błąd CSS na stronie RPM Music przez przeniesienie pseudoklasy :hover (376)
  • Składniki taniego testu użyteczności (383)
  • Wykorzystaj skrypt moderatora do organizacji testu (384)
  • Przyjaciele i rodzina mogą być problemem (391)
  • Wyniki testu użyteczności - czyli co mówią użytkownicy (392)
  • Prosty problem... (393)
  • O użytkownikach mówią statystyki strony (395)
  • Narzędzia do statystyk strony internetowej (396)

10. Ewolucja projektu

  • Twoje dotychczasowe portfolio... (402)
  • Odświeżanie strony i jej zawartości sprawia, że użytkownicy chętnie powracają (404)
  • W projektowaniu stron chodzi o ewolucję, nie rewolucję (407)
  • Do ewolucji projektu strony wykorzystaj CSS (408)
  • Dodaj interaktywność do strony za pomocą efektownego wyświetlania zdjęć z użyciem JavaScriptu (420)
  • Dodanie biblioteki Facebox do strony Red Lantern Design (421)
  • Edycja pliku strony głównej (422)
  • Dodanie do strony bloga - WordPress (427)
  • Dodaj bloga opartego na systemie WordPress do strony Red Lantern Design (428)
  • Cała prawda o Blogu (430)
  • Zmieniaj wygląd i sposób działania bloga za pomocą motywów (432)

11. Projektowanie stron jako biznes

  • Najnowszy potencjalny klient - "Foo Bar" (436)
  • Oferta dla restauracji "Foo Bar" musi zawierać (437)
  • Budujemy prototyp strony restauracji "Foo Bar" (438)
  • Witaj w świecie PIRACTWA PROJEKTÓW (445)
  • Jakim typem projektanta stron jesteś? (448)
  • Red Lantern Design ma nowego potencjalnego klienta (453)
  • Co tak naprawdę składa się na projektowanie strony internetowej? (456)
  • Ostateczna kalkulacja oferty... (457)
  • W specjalnym liście ofertowym przedstaw klientowi szczegółowe wyliczenia (463)
  • Podcast Trilobite Labs - kolejne wyzwanie (465)
  • Wykorzystaj licencję Creative Commons (465)
  • Licencje Creative Commons (466)

12. Dziesięć najważniejszych rzeczy (których nie omówiliśmy)

  • Nr 1: Projekty międzynarodowe i wielokulturowe (472)
  • Nr 2: Przyszłość kodu stron internetowych (474)
  • Nr 3: Przyszłość CSS (476)
  • Nr 4: Projektowanie dla urządzeń mobilnych (477)
  • Nr 5: Tworzenie aplikacji internetowych (478)
  • Nr 6: Rytm w układzie strony (479)
  • Nr 7: Kontrastowy tekst (480)
  • Nr 8: Dopasuj nazwy odnośników do stron, do których kierują (481)
  • Nr 9: Kontrast jest podstawowym elementem tworzącym układ strony (482)
  • Nr 10: Więcej narzędzi do projektowania (483)

Skorowidz (485)

  • Назва: Head First Web Design. Edycja polska
  • Автор: Ethan Watrall, Jeff Siarto
  • Оригінальна назва: Head First Web Design
  • Переклад: Anna Trojan
  • ISBN: 978-83-246-6061-2, 9788324660612
  • Дата видання: 2012-10-16
  • Формат: Eлектронна книга
  • Ідентифікатор видання: hfwdep
  • Видавець: Helion