Projektowanie i tworzenie serwisów internetowych (INiB)

Photo by Nathan da Silva on Unsplash

piątek | 13.45, 15.15 | Sala C0.32

WH/BN/Projektowanie i tworzenie serwisów internetowych/Joanna Wróbel(2025/2026)
kod zespołu: 3kn15y0
Savoir-vivre spotkań online

Kontakt
Mail: joanna.wrobel(at)us.edu.pl
Konsultacje: piątek 13.00-13.45 | A4.18 lub Teams [zapisy]

Warunki zaliczenia przedmiotu
Lista domena i hosting

Program zajęć

  1. Wprowadzenie do projektowania stron internetowych — Czym jest dobry dizajn stron internetowych? | Podstawy kompozycji wizualnej
  2. Wprowadzenie do WordPressa — CMS, WordPress | Domena, hosting, nazwa | Certyfikat SSL
  3. Instalacja i konfiguracja WordPressa — panel zarządzania, podstawowe ustawienia | role w WP
  4. Personalizacja wyglądu strony — Motyw i builder | favicon | sidebar, widgety, stopka
  5. Struktura treści — Menu | Menu One Page | Strony statyczne vs dynamiczne wpisy
  6. Grafika — WordPress Media | Elementy graficzne na stronach www
  7. Typografia i kolor — Typografia w produktach cyfrowych | Kolorystyka strony WWW
  8. Kluczowe podstrony i funkcje — kontakt
  9. Bezpieczeństwo i zgodność — Bezpieczeństwo stron na WordPressie | aktualizacje | polityka prywatności | Zasady dostępności stron
  10. Realizacja projektów zespołowych

Literatura

WordPress

  1. Ciborowska, A., Lipiński, J. (2020). WordPress 5 dla początkujących. Helion
  2. Duckett, J. (2014). HTML i CSS. Zaprojektuj i zbuduj witrynę WWW. Helion
  3. Krug, S. (2014). Nie każ mi myśleć! O życiowym podejściu do funkcjonalności stron internetowych. Helion [spis treści]
  4. Messenlehner, B., Coleman, J. (2021). WordPress. Tworzenie aplikacji internetowych. Helion
  5. Williams, R. (2023). Dla każdego. Design i typografia. Helion

Źródła elektroniczne

  1. Poradnik WordPress Cyberfolks
  2. WordPress.org (2024). Dokumentacja dla użytkowników i deweloperów (HelpHub). Pobrane z: https://wordpress.org/documentation/
  3. Zespół WordPress (2024). Learn WordPress – oficjalne samouczki wideo. Pobrane z: https://learn.wordpress.org/

Notatka wizualna z lektury (30%)

  1. Wybierz jeden rozdział z książki —  Krug, S. (2014). Nie każ mi myśleć! O życiowym podejściu do funkcjonalności stron internetowych. Helion [spis treści] (lista rekomendacji obok).
  2. Zaprojektuj jeden slajd / plakat cyfrowy (1920×1080 px), który prezentuje tę myśl.
  3. Wrzuć do katalogu na Teams plik jpg podpisany nazwisko_nazwa
  4. Zaprezentuj swoją pracę przed grupą.

Rekomendowane rozdziały:
Rozdział 6: „Drogowskazy i okruszki chleba” (Nawigacja)
Wybierz, jeśli: Masz rozbudowane menu i boisz się, że użytkownik zgubi się na Twojej stronie. Pomoże Ci to dobrze skonfigurować „Menu” i „Widgety” w WordPressie.
Rozdział 7: „Wielki wybuch teorii web designu” (Strona Główna)
Wybierz, jeśli: Projektujesz sekcję Hero i stronę główną. Dowiesz się, co musi się na niej znaleźć, by użytkownik został na stronie dłużej niż 3 sekundy.
Rozdział 10: „Mobile: To nie tylko kwestia wielkości ekranu”
Wybierz, jeśli: Przeraża Cię wdrażanie RWD (responsywności). Pomoże Ci zdecydować, które elementy ukryć, a które powiększyć w widoku mobilnym edytora.
Rozdział 2: „Jak naprawdę korzystamy z sieci” (Skanowanie)
Wybierz, jeśli: Masz dużo tekstu na stronie. Dowiesz się, jak formatować nagłówki i akapity w edytorze blokowym, żeby ludzie chcieli to czytać.
Baza wiedzy
  1. The New Look. (2024). Projektowanie stron internetowych krok po kroku – Poradnik 2025. The New Look. https://thenewlook.pl/projektowanie-stron-internetowych/
  2. Wolska, W. (2022). Typografia w projektowaniu. Weronika Wolska. https://weronikawolska.pl/blog-typografia-w-projektowaniu/
Narzędzia do grafik
  1. Bank ikon
  2. Bank symboli
  3. Bank zdjęć
  4. Tinnypng
  5. Usuwanie tła ze zdjęcia
  6. Zmiana rozmiaru zdjęcia