Kurs Web Designer

cena 6600 zł (netto)

104h (13 dni)

Ścieżka: Tworzenie stron www i aplikacji

Najbliższy termin:


I Etap kursu: 5 lutego 2020

II Etap kursu: 10-14 lutego 2020
III Etap kursu: 17-21 lutego 2020
IV Etap kursu: 5-6 marca 2020

Sprawdź inne terminy zapisz się

Kurs Web Designer

średnia ocen: 5.0

Kurs Web Designer

Kurs Web Designer składa się z czterech szkoleń:

I Etap: Szkolenie HTML i CSS w praktyce – moduł I: Tworzenie stron www – 10-14 lutego 2020,
II Etap: Szkolenie HTML i CSS w praktyce – moduł II: Responsywne strony i aplikacje – 17-21 lutego 2020,
III Etap: Szkolenie UX – User Experience w projektowaniu interfejsów użytkownika i interakcji– 5-6 marca 2020,
IV Etap: Szkolenie SEO, pozycjonowanie i optymalizacja stron www – 5 lutego 2020

Dzięki uczestnictwu w zajęciach słuchacz osiągnie umiejętność tworzenia i projektowania serwisów oraz stron internetowych uwzględniając ich wymogi w zakresie responsywności.

Kurs Web Designer wdroży Cię w elementy trendów, dobrych praktyk w zakresie projektowania podniesie jakość realizowanych projektów i umożliwi tworzenie usług internetowych zgodnie z UX i SEO.

Zapisz się na kurs Web Designer już dziś!

Czego się nauczysz

  • Projektowania i tworzenia grafiki internetowej i jej optymalizacji
  • Wykorzystania narzędzi graficznych do edycji i dopasowania zdjęć
  • Użycia filtrów i efektów dla zdjęć oraz elementów graficznych
  • Dopasowania kolorów i jasności zdjęć
  • Sterowania wielkością zdjęć i elementów graficznych
  • Cięcia projektu na elementy konieczne do budowy strony HTML
  • Tworzenia atrakcyjnych nagłówków oraz reklam graficznych
  • Wykorzystanie programu Adobe Dreamweaver do edycji kodu HTML5 i stylów kaskadowych
  • Tworzenia szablonów stron www
  • Zasad tworzenia nowoczesnych stron www
  • Znaczników i struktury kodu HTML5
  • Dodawania łączy i ich formatowania
  • Tworzenia różnorodnych struktur nawigacyjnych (menu)
  • Formatowania menu głównego oraz innych elementów nawigacyjnych
  • Użycia grafik, tabel, elementów Flash na stronie www
  • Zasad języka HTML oraz nowości HTML5
  • Budowy stron WWW z użyciem HTML5 oraz arkuszy stylów CSS
  • Zarządzania wyglądem strony i jej elementów przy użyciu stylów CSS
  • Tworzenie i edycji różnorodnych stylów CSS
  • Wykorzystania różnych selektorów CSS
  • Wykorzystania języka JavaScript i różnorodnych widgetów
  • Wykorzystania interaktywnych elementów typu: Accordion, Tabbed Panel czy Collapsible Panel
  • Użycia zewnętrznych bibliotek JavaScript: Spry, MooTools i jQuery
  • Tworzenia, testowania i wdrażania atrakcyjnych formularzy w oparciu o style CSS
  • Walidacji danych formularza i przesyłania ich w wiadomości e-mail
  • Tworzenia nowoczesnych galerii zdjęć z użyciem biblioteki Lightbox lub podobnych
  • Wykorzystania dodatków do programu Adobe Dreamweaver
  • Użycia filmów wideo i muzyki na stronie internetowej
  • Przesyłania strony WWW na serwer internetowy
  • Optymalizacji grafiki i kodu
  • Aktualizacji strony na serwerze produkcyjnym
  • Tworzenia animacji JavaScript
  • Dodawania efektów specjalnych i trików
  • Tworzenia strony www od podstaw i… podszewki
  • Zasady wykorzystania Adobe Dreamweaver do pracy z kodem HTML i CSS
  • Zasady i sposoby tworzenia stron internetowych w oparciu o HTML5 i CSS
  • Wykorzystanie nowoczesnych stylów CSS 3.0
  • Tworzenie Media Queries – zapytań o media
  • Tworzenie prostych przejść i animacji CSS
  • Dostosowanie stylów CSS dla różnych mediów
  • Framework Bootstrap – prototypowanie i struktura strony
  • Podstawy języka JavaScript
  • Tworzenie interaktywnych formularzy
  •  Projektowanie stron mobilnych
  • Współpraca z jQuery i jQueryMobile
  • Współpraca z PhoneGapBuild
  • Zapis natywnej aplikacji dla systemu Android, iOS, Windows
  • Publikacji na różne media
  • Testowanie aplikacji na tabletach Android, iOS
  • Zasady publikacji w App Store i Google Play
  • Podstaw procesu koncepcyjnego, tworzenia architektury informacji
  • Wytycznych oraz dobrych praktyk przy tworzeniu stron internetowych
  • Metod i narzędzi do testowania i optymalizacji serwisów www
  • Tworzenia stron internetowych pod kątem optymalizacji dla wyszukiwarek
  • Wykorzystywania narzędzi: Google Analytics i Google Search Console
  • Zarządzania treścią witryny pod kątem jej poprawnej optymalizacji

Dla kogo jest to szkolenie?

Kurs skierowany jest do osób, które chcą osiągnąć umiejętność tworzenia i projektowania serwisów oraz responsywnych stron internetowych.

Czego oczekujemy?

Od uczestników oczekujemy znajomości obsługi komputera typu PC bądź MAC.

Program szczegółowy

Kurs Web Designer składa się z czterech szkoleń:

Szkolenie HTML i CSS w praktyce – moduł I: Tworzenie stron www

Możliwości i ograniczenia Internetu

Zasady projektowania i tworzenia serwisów internetowych

  • rozpoznanie potrzeb Klienta
  • wybór odpowiedniej technologii
  • przygotowanie struktury serwisu
  • omówienie układu strony internetowej
  • struktura strony internetowej

Standardy budowy stron WWW

  • typy dokumentów HTML
  • HTML4 i HTML5
  • CSS
  • JavaScript i popularne biblioteki
  • jQuery,
  • inne technologie

Podstawowe elementy strony WWW

  • tekst
  • grafika
  • style CSS
  • biblioteki JavaScript
  • PDF
  • wideo i muzyka

Przygotowanie struktury serwisu WWW

  • site – definicja i zasady tworzenia i edycji
  • budowa optymalnej struktury katalogów
  • przygotowanie katalogu site’a

Tworzenie site’a

  • konfiguracja site’a w programie Dreamweaver

Porównanie różnych metod budowy layoutu strony WWW

  • zasady tworzenie układu strony WWW
  • zasady tworzenie stron w oparciu o znacznik i style CSS
  • Zasady użycia semantycznych znaczników HTML5
  • zalety budowy strony w oparciu o znaczniki HTML5 i style kaskadowe

Przegląd layoutów stron WWW

  • Przegląd i porównanie wybranych układów strony internetowej
  • układ jednokolumnowy
  • układ dwukolumnowy
  • układy wielokolumnowe

Zasady budowy layoutu w Adobe Dreamweaver

  • Wykorzystanie semantycznych znaczników HTML5 do tworzenia struktury strony www
  • formatowanie elementów tekstowych
  • wykorzystanie listy
  • grafika na stronie www

Zasady użycia stylów CSS

  • zasady tworzenie stylów CSS
  • rodzaje selektorów
  • style typu class, tag, id, compound
  • dziedziczenie właściwości
  • podstawowe właściwości stylów
  • narzędzia tworzenia i edycji stylów w programie Adobe Dreamweaver
  • arkusze stylów
  • łączenie arkusza ze stroną HTML
  • CSS3

Tworzenie strony WWW

  • podstawowe informacje o znacznikach HTML5
  • tworzenie strony internetowej w oparciu o znaczniki semantyczne HTML5
  • analiza struktury strony (headrer, footer, section, content, nav i inne elementy)

Wprowadzanie treści strony

  • wprowadzanie tekstów
  • wykorzystanie grafiki
  • logiczna struktura strony WWW
  • wykorzystanie listy, akapitów i znaczników nagłówkowych
  • dodawanie elementów nawigacyjnych

Formatowanie strony i edycja układu strony w oparciu o style CSS

  • wykorzystanie różnorodnych selektorów CSS
  • zasady dziedziczenia
  • hierarchia stylów
  • użycie zaawansowanych właściwości CSS do formatowania elementów strony i jej układu

Tworzenie atrakcyjnej nawigacji

  • wykorzystanie listy do tworzenia nawigacji
  • wykorzystanie stylów CSS do edycji wyglądu menu
  • dodawanie łączy
  • efekty specjalne nawigacji (wykorzystanie pseudoklas :hover, :active, :selected)

Optymalizacja strony pod kątem wyszukiwarek internetowych

  • logiczna struktura strony
  • znaczniki w sekcji head
  • zasady tworzenia tytułu i użycia nagłówków
  • teksty alternatywne, nazwy łączy, itp
  • logika strony i znaczników

Praca z grafiką

  • zarządzanie wielkością, optymalizacja grafiki
  • kadrowanie i efekty graficzne w programie Dreamweaver
  • wykorzystanie elementów tylu Smart Object i współpraca z plikami Photoshopa
  • teksty alternatywne
  • dodawanie łączy
  • formatowanie grafiki za pomocą stylów CSS

Zaawansowane formatowanie tekstów

  • zasady formatowania tekstów na stronie WWW
  • wykorzystanie typografii i stylów CSS
  • formatowanie tekstów za pomocą stylów CSS

Arkusze stylów CSS  głębsze spojrzenie

  • formatowanie grafiki, list, nagłówków
  • ostateczne dostosowanie wyglądu strony przy użyciu stylów CSS
  • dostosowanie stylów do poprawnego wyświetlania strony w różnych przeglądarkach
  • ciekawe efekty wizualne z użyciem stylów CSS
  • dodawanie tła strony
  • interaktywne elementy nawigacji
  • wykorzystanie CSS3

Tworzenie animacji na bazie stylów CSS

  • animacje na stronie www
  • animacje za pomocą stylów CSS

Budowa szablonów stron WWW

  • tworzenie szablonów stron internetowych w programie Dreamweaver CS6
  • rodzaje szablonów
  • wykorzystanie szablonów do tworzenie kolejnych podstroi serwisu
  • edycja szablonu i aktualizowanie podstron

Tworzenie stron WWW na podstawie szablonów Dreamweavera

  • wykorzystanie i formatowanie tabel
  • zapis i testowanie stron
  • dodawanie łączy
  • tworzenie i edycja stylów CSS dla elementów nawigacyjnych
  • zaawansowane sposoby użycia stylów do formatowania menu

Praca z formularzem WWW

  • zasady budowy formularza
  • tworzenie interaktywnego formularza kontaktowego
  • formatowanie elementów formularza za pomocą stylów CSS
  • walidacja i testowanie działania formularza na stronie WWW
  • edycja stylów CSS formularza
  • przygotowanie formularza do przesyłania danych
  • tworzenie strony potwierdzającej przesłanie danych

Testowanie i walidacja strony WWW

  • testowanie poprawności działania strony w różnych przeglądarkach
  • testowanie poprawności kodu HTML i stylów CSS

Konfiguracja serwera WWW

  • konfiguracja site’a
  • wybór firmy hostingowej i zakup domeny
  • serwer ftp
  • konfiguracja Adobe Dreamweaver do pracy z serwerem

Przesyłanie i aktualizacja strony na serwer WWW

  • połączenie z fizycznym serwerem WWW
  • przesyłanie strony na serwer
  • pobieranie stron z serwera
  • aktualizacja strony na serwerze WWW
  • synchronizacja

Tworzenie interaktywnej galerii typu Lightbox

  • Instalacja biblioteki Lightbox
  • przygotowanie grafiki
  • struktura galerii
  • edycja i formatowanie galerii
  • edycja kodu JavaScript
  • publikacja galerii

Osadzenie mapy Google na stronie

  • wykorzystanie dodatku Google Map do osadzenia mapy

Dodatkowe biblioteki JavaScript np. JQuery

  • instalacja i wykorzystanie gadżetów JQuery
  • tworzenie galerii zdjęć przy użyciu biblioteki Lightbox

Pływające reklamy Aniamte na stronie WWW

  • zasady dodawania reklam umieszczonych ponad stroną internetową

Wykorzystanie filmów wideo i muzyki na stronie WWW

  • problemy z przeglądarkami i wojna formatów
  • praca z plikami FLV
  • wykorzystanie plików mp4, mp3, ogg
  • tworzenie odtwarzacza wideo na stronie WWW
  • tworzenie odtwarzacza audio na stronie www

Tips & Triks, biblioteki Javascript

Wstęp do pozycjonowania i optymalizacji SEO

 

Szkolenie HTML i CSS w praktyce – moduł II: Responsywne strony i aplikacje

Wykorzystane narzędzia i programy

Adobe Dreamweaver

  • Projektowanie serwisu
  • Tworzenie stron HTML
  • Tworzenie stylów CSS

Projektowanie i tworzenie stron WWW

  • Język HTML5
  • Struktura strony
  • Tworzenie zaawansowanych układów stron
  • Elementy graficzne
  • Wykorzystanie CSS

Praca z CSS

  • Nowoczesne style CS
  • Selektory CSS
  • Projektowanie bez użycia class i id
  • Grafika CSS
  • Gradienty i zaokrąglone narożniki
  • Cienie

Animacje CSS

  • Tworzenie prostych przejść CSS
  • Interaktywne przejścia CSS

Media Queries – Zapytania o media

  • Tworzenie punktów kontrolnych
  • Dopasowanie wyglądu strony dla różnych wielkości ekranu
  • Skalowanie strony na urządzenia mobilne
  • Modyfikacja wyglądu strony
  • Usuwanie i dodawanie elementów w zależności od wielkości stron
  • Tworzenie mobilnej strony internetowej

Formularze HTML5

  • Typy pól formularza
  • Dodawanie formularzy na stronie internetowej i aplikacji
  • Walidacja HTML5
  • Współpraca z JavaScript

Biblioteki JavaScript

  • Poznajemy przykładowe biblioteki JavaScript
  • Instalacja biblioteki
  • Praca z Lightbox, jQueryCycle
  • Podstawy jQuery, Zepto, Respond, html5shiv
  • Selektory, zdarzenia i funkcje

Framework Bootstrap

  • Instalacja plików
  • Wprowadzenie do projektowania
  • Grid system, układ kolumn
  • Tabele, listy, typografia, obrazki, glyphicons i itp
  • Przyciski i formularze
  • Wykorzystanie komponentów Bootstrap
  • Tworzenie responsywnego projektu strony www
  • Testowanie gotowej strony na symulacjach urządzeń mobilnych

jQuery Mobile

  • Tworzenie mobilnych serwisów i aplikacji
  • Sterowanie wyglądem
  • Theme Roller – tworzenie własnych skórek
  • Dodajemy przejścia

Kontrolki w jQuery Mobile:

  • Toolbar
  • Navbar
  • Tabs
  • Panel
  • Popup
  • Listview
  • Table Reflow
  • Table Column Toggle i Filterable

Dostosowanie aplikacji

  • Tworzenie interfejsu
  • Wykrywanie urządzenia oraz CSS 3 Media Queries
  • Wykorzystanie stylów CSS 3 w HTML5
  • Efekty wizualne oraz animacje
  • Elastyczny układ projektuTestowanie strony na urządzeniach mobilnych
  • Adoobe Edge Inspect
  • Ripple
  • Testowanie na tabletach, telefonach komórkowychTworzenie natywnej aplikacji iOS, Windows, Android
  • Współpraca z serwisem PhoneGapBuild
  • Zapis i tworzenie aplikacji
  • Testowanie aplikacji
  • Zasady publikacji pracy w App Store i Google Play

 

Szkolenie UX – User Experience w projektowaniu interfejsów użytkownika i interakcji

  • Wprowadzenie do zagadnień z dziedziny Interakcji Człowiek-Komputer (Human-Computer Interaction).
  • Podstawy projektowania zorientowanego na użytkownika (User-Centered Design).
  • Wytyczne i zasady projektowania interfejsów użytkownika dla rozwiązań internetowych i mobilnych.
  • Analiza współczesnych trendów w projektowaniu interfejsów użytkownika na przykładach.
  • Proces koncepcyjny i analiza wymagań projektowych.
  • Badanie potrzeb użytkowników w procesie projektowania rozwiązań interaktywnych.
  • Podstawy tworzenia architektury informacji.
  • Tworzenie prototypów interfejsów użytkownika o różnym poziomie dokładności za pomocą wybranych technik i narzędzi.
  • Metody testowania użyteczności i przegląd narzędzi do ich przeprowadzania.
  • Analiza danych i tworzenie raportów użyteczności.
  • Podsumowanie szkolenia i omówienie źródeł rozszerzających poznane zagadnienia.

 

Szkolenie SEO, pozycjonowanie i optymalizacja stron www

Wprowadzenie

  • Zasady projektowania i tworzenia nowoczesnych serwisów internetowych
  • Optymalna komunikacja użytkowników po serwisie internetowym
  • Standardy budowy stron WWW
  • Optymalizacja elementów graficznych
  • Przegląd layoutów stron WWW – analiza współczesnych trendów w projektowaniu stron internetowych

 Optymalizacja strony pod kątem wyszukiwarek internetowych

  • logiczna struktura strony
  • META znaczniki w sekcji head
  • zasady tworzenia tytułu i użycia nagłówków
  • teksty alternatywne, nazwy łączy, itp
  • logika strony i znaczników

Testowanie i walidacja strony WWW

Najważniejsze elementy serwisu

  • Teksty
  • Formularze
  • Linki
  • Menu główne
  • Więcej o nawigacji
  • Grafika
  • Adres URL
  • Tabele
  • Mapa serwisu
  • Wersja alternatywna

Jak działają wyszukiwarki stron internetowych

Korzyści płynące z optymalizacji dla wyszukiwarek internetowych

Najważniejsze informacje o stronach internetowych

  • Dobór domeny
  • Kompatybilność z przeglądarkami internetowymi
  • Znaczniki meta
  • JavaScript i Flash
  • Hierarchia treści, grafika, galerie na stronie, multimedia
  • Przyjazna struktura strony internetowej
  • Wpływ linków przychodzących i wychodzących na pozycję strony
  • Przekierowania
  • Blokowanie stron przed indeksacją
  • Prędkość działania

Indeksacja witryny

  • Ocena postępu indeksacji
  • Kontrola postępu indeksacji strony w Google

Mapa strony

  • Po co korzystać z map witryny?
  • Mapa witryny – schemat i budowa

Rozmieszczenie słów i fraz kluczowych na stronie www

Audyt strony www pod kątem SEO

Zarządzanie treścią witryny pod kątem jej poprawnej optymalizacji

Czynniki wpływające na pozycję w rankingu

  • Czynniki wewnętrzne
  • Czynniki zewnętrzne

Google Search Console oraz Google Analytics

Podsumowanie szkolenia i omówienie źródeł rozszerzających poznane zagadnienia.

Nasi trenerzy

Marcin Bober

Marcin Bober. Prowadzi szkolenia z zakresu budowania i optymalizacji serwisów www i aplikacji mobilnych. W pracy dydaktycznej duży nacisk kładzie na przygotowanie słuchaczy do samodzielnej pracy i tworzenia własnych kreatywnych rozwiązań.

dowiedz się więcej
o tym wykładowcy
Marcin Wichrowski

Specjalizuje się w zagadnieniach Human-Computer Interaction, Augmented Reality oraz Interactive Digital Storytelling. Autor artykułów naukowych dotyczących wykorzystania multimediów na potrzeby edukacji, sztuki, medycyny oraz wsparcia osób niepełnosprawnych.

dowiedz się więcej
o tym wykładowcy

Standard szkolenia

Jedyny w Polsce
Autoryzowany Ośrodek Szkoleniowy
Adobe i Maxon

Certyfikowani wykładowcy - praktycy

Najnowsze oprogramowanie i samodzielne stanowisko komputerowe PC/MAC

Certyfikat i materiały szkoleniowe

Małe, kameralne grupy szkoleniowe

Pyszny obiad i kawa

Opinie z ankiet po szkoleniu

Super przekazywana wiedza w luźny, ale konkretny sposób. Dużo pomocy od prowadzącego.

- Bartłomiej B.

Profesjonalne podejście, dużo wiedzy przekazanej przez prowadzącego.

- Aleksander C.

Wszystko ok, jak zwykle na najwyższym poziomie.

-

Czcesz zapytać o coś przed zakupem?
Napisz do nas na szkolenia@itmedia.pl

lub zadzwoń pod numer

22 678 38 87