Tworzenie stron i aplikacji internetowych – Klasa 4TI / 5TI

Program nauczania dla zawodu Technik Informatyk 351203
Rok szkolny: 2024/2025
Łączna liczba godzin: 210 (KL. IV: 120, KL. V: 90)
Kwalifikacja: INF03
Podręcznik: Małgorzata Łokińska, „Aplikacje internetowe”, WSiP
Opracował: Tomasz Puchała

Technologie webowe

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
1Organizacja zajęć oraz omówienie regulaminu pracowni i zasad bhp1 zna zasady bhp w pracowni komputerowej; przestrzega regulaminu pracowni potrafi przypomnieć innym zasady bezpieczeństwa i higieny pracy INF.03.1 (5)
2Przypomnienie informacji dotyczących usług sieciowych oraz technologii webowych1 rozróżnia podstawowe technologie sieciowe i webowe wyjaśnia rolę usług sieciowych i protokołów w Internecie INF.03.3 (8)

Tworzenie stron internetowych w języku HTML

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
3Struktura dokumentu HTML1 stosuje standardy HTML5; buduje podstawową strukturę strony tworzy rozbudowaną, poprawną semantycznie strukturę HTML INF.03.3 (1)
4Charakterystyka dokumentów: HTML, XML, XHTML1 rozróżnia dokumenty HTML, XML i XHTML wyjaśnia zastosowania każdego rodzaju dokumentu i jego cechy INF.03.3 (1)
5Kodowanie polskich znaków i języka strony1 stosuje poprawne kodowanie znaków w HTML konfiguruje dokumenty z różnymi zestawami znaków i językami INF.03.3 (1)
6Edytory do edycji dokumentów HTML1 posługuje się edytorami HTML dobiera odpowiednie narzędzia do szybkiego tworzenia stron INF.03.3 (1)
7Składnia języka HTML 5 – podstawowe znaczniki1 stosuje podstawowe znaczniki HTML dobiera znaczniki w zależności od semantyki strony INF.03.3 (1)
8Znaczniki formatowania tekstu oraz znaki specjalne2 formatuje tekst; używa znaków specjalnych tworzy złożone formatowanie i poprawnie interpretuje znaki specjalne INF.03.3 (1)
9Elementy liniowe i blokowe2 stosuje znaczniki liniowe i blokowe projektuje strukturę strony z zachowaniem hierarchii bloków INF.03.3 (1)
10Wykazy2 tworzy listy numerowane i punktowane tworzy listy zagnieżdżone i definicyjne INF.03.3 (1)
11Odsyłacze2 tworzy podstawowe linki dodaje linki z atrybutami i odsyłacze do sekcji INF.03.3 (1)
12Barwa na stronach internetowych2 stosuje kolory w HTML i CSS dobiera paletę barw zgodnie z zasadami projektowania INF.03.3 (1)
13Podział strony na sekcje2 stosuje sekcje i nagłówki projektuje logiczne sekcje witryny z semantyką INF.03.3 (1)
14Tabele2 tworzy proste tabele tworzy tabele z nagłówkami, stopkami i scalonymi komórkami INF.03.3 (1)
15Formularze2 tworzy formularze z podstawowymi polami projektuje formularze z różnymi typami pól i walidacją INF.03.3 (1)
16Ćwiczenia podsumowujące2 tworzy prostą stronę HTML tworzy kompletną stronę HTML z tabelami, formularzami i multimediów INF.03.3 (1)

Stylizacja stron w CSS

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
17Wprowadzenie do CSS – selektory i właściwości2 rozróżnia selektory i właściwości CSS; stosuje podstawowe style tworzy złożone reguły CSS; korzysta z różnych typów selektorów INF.03.3 (2)
18Kolory, tła i czcionki2 dobiera kolory i fonty do tekstu i tła strony projektuje harmonijną paletę kolorów i dobiera fonty zgodnie z UX INF.03.3 (2)
19Model pudełkowy CSS (box model)2 rozumie padding, margin, border i content tworzy złożone układy z wykorzystaniem box model INF.03.3 (2)
20Pozycjonowanie elementów2 stosuje pozycjonowanie statyczne, względne i absolutne projektuje responsywne układy stron z użyciem pozycjonowania INF.03.3 (2)
21Flexbox i Grid2 tworzy układy stron za pomocą Flexbox lub Grid projektuje zaawansowane układy responsywne i adaptacyjne INF.03.3 (2)
22Animacje i przejścia CSS2 stosuje proste przejścia i animacje CSS tworzy złożone animacje i efekty interaktywne INF.03.3 (2)

Systemy zarządzania treścią (CMS)

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
23Wprowadzenie do CMS1 zna funkcje CMS i potrafi je wskazać instaluje CMS i dokonuje podstawowej konfiguracji INF.03.3 (3)
24Tworzenie i publikacja treści w CMS2 tworzy strony i wpisy w CMS tworzy złożone struktury witryn z podstronami INF.03.3 (3)
25Administrowanie użytkownikami i uprawnieniami1 dodaje użytkowników i nadaje podstawowe role konfiguruje zaawansowane uprawnienia i grupy użytkowników INF.03.3 (3)
26Tworzenie szablonów i modyfikacja wyglądu strony2 modyfikuje proste szablony CMS tworzy własne szablony i dostosowuje wygląd witryny INF.03.3 (3)
27Aktualizacja i bezpieczeństwo CMS1 aktualizuje CMS i wtyczki konfiguruje zabezpieczenia CMS i kopie zapasowe INF.03.3 (3)

Grafika i multimedia

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
28Formaty grafiki rastrowej i wektorowej1 rozróżnia formaty graficzne i potrafi je stosować dobiera format do zastosowań webowych i multimedialnych INF.03.4 (1)
29Optymalizacja obrazów do stron www1 zmniejsza wagi plików graficznych bez utraty jakości stosuje różne techniki kompresji i optymalizacji INF.03.4 (1)
30Wstawianie multimediów (audio, wideo)1 dodaje multimedia na stronę konfiguruje odtwarzacze i ustawienia multimediów INF.03.4 (1)
31Animacje i interaktywne elementy multimedialne2 stosuje proste animacje i efekty multimedialne tworzy interaktywne galerie i animacje z użyciem HTML5/CSS3/JS INF.03.4 (1)

Projekt witryny i testowanie

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
32Projektowanie struktury strony2 tworzy prosty projekt strony na papierze tworzy pełny projekt struktury i schemat funkcjonalny INF.03.5 (1)
33Tworzenie prototypów i makiet2 projektuje prostą makietę strony tworzy interaktywne prototypy i testuje UX INF.03.5 (1)
34Testowanie funkcjonalności i poprawności stron2 sprawdza poprawność linków i wyświetlania elementów stosuje narzędzia automatycznego testowania i debugowania INF.03.5 (2)
35Walidacja formularzy2 sprawdza poprawność danych w formularzach tworzy zaawansowaną walidację po stronie klienta i serwera INF.03.5 (2)

JavaScript

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
36Wprowadzenie do JavaScript2 dodaje proste skrypty JS do strony tworzy dynamiczne efekty i obsługę zdarzeń INF.03.6 (1)
37Zmienne, typy danych i operatory2 stosuje zmienne i podstawowe typy danych tworzy złożone wyrażenia i konwersje typów INF.03.6 (1)
38Instrukcje warunkowe i pętle2 stosuje if, switch i pętle for/while tworzy złożone algorytmy zagnieżdżone INF.03.6 (1)
39Funkcje i zdarzenia2 tworzy proste funkcje i obsługuje zdarzenia projektuje modułowe skrypty i obsługuje zdarzenia dynamiczne INF.03.6 (2)
40Manipulacja DOM i BOM2 modyfikuje elementy strony przez DOM tworzy dynamiczne interfejsy i efekty wizualne INF.03.6 (2)
41AJAX i komunikacja z serwerem2 wyświetla dane z serwera bez odświeżania strony tworzy złożone interaktywne aplikacje webowe INF.03.6 (3)

PHP i obsługa baz danych

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
42Wprowadzenie do PHP2 tworzy proste skrypty PHP tworzy dynamiczne strony z PHP i HTML INF.03.7 (1)
43Zmienne, typy danych i operatory w PHP2 stosuje zmienne i typy danych w PHP projektuje złożone obliczenia i algorytmy INF.03.7 (1)
44Instrukcje warunkowe i pętle w PHP2 stosuje if, switch, for, while tworzy złożone skrypty PHP INF.03.7 (1)
45Formularze HTML i przesyłanie danych do PHP2 odbiera dane z formularza waliduje dane i przetwarza różne typy pól INF.03.7 (2)
46Podstawy MySQL i połączenie z PHP2 tworzy proste zapytania i wyświetla wyniki w PHP tworzy złożone zapytania, łączenia tabel i raporty INF.03.7 (2)
47Operacje CRUD w PHP i MySQL2 dodaje, modyfikuje, usuwa dane w bazie tworzy aplikacje z kompletną obsługą CRUD INF.03.7 (2)
48Bezpieczeństwo danych w PHP2 stosuje podstawowe filtrowanie danych stosuje przygotowane zapytania i ochronę przed SQL Injection INF.03.7 (3)
49Tworzenie raportów i dynamicznych stron2 generuje proste raporty tworzy dynamiczne raporty i zestawienia INF.03.7 (3)

Multimedia na stronach internetowych

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
50 Rodzaje elementów multimedialnych na stronach internetowych. Format plików multimedialnych 1 – dobiera oprogramowanie użytkowe do edycji wideo, dźwięku i animacji
– stosuje narzędzia i funkcje programu do obróbki wideo, dźwięku i animacji
– łączy ze sobą wideo, dźwięk i animację
– eksportuje i zapisuje pliki w różnych formatach multimedialnych
INF.03.3 (5)
51 Rodzaje animacji komputerowej 1 – rozróżnia animacje wektorowe, klatkowe i trójwymiarowe – projektuje prostą animację wektorową lub klatkową INF.03.3 (5)
52 Zasady tworzenia animowanych GIF-ów 1 – tworzy animowany plik GIF z wykorzystaniem klatek
– stosuje podstawowe narzędzia edytora grafiki rastrowej
– optymalizuje rozmiar i czas trwania animacji INF.03.3 (5)
53 Tworzenie animacji metodą klatek kluczowych 1 – tworzy animację z wykorzystaniem osi czasu – dodaje efekty przejść i przekształceń INF.03.3 (5)
54 Publikacja plików wideo na stronach internetowych 1 – umieszcza wideo w kodzie HTML5
– stosuje tag <video> i atrybuty źródła
– konwertuje pliki wideo do różnych formatów (mp4, webm, ogv) INF.03.3 (5)
55 Obróbka plików wideo 2 – wykorzystuje oprogramowanie do edycji i montażu wideo – dodaje efekty specjalne, dźwięk i napisy INF.03.3 (5)
56 Przygotowanie plików dźwiękowych 1 – opisuje parametry plików audio (bitrate, częstotliwość, kanały) – stosuje różne formaty plików (MP3, OGG, WAV) INF.03.3 (5)
57 Obróbka plików audio 2 – przycina i łączy pliki audio
– stosuje efekty dźwiękowe
– przygotowuje ścieżkę dźwiękową do filmu lub prezentacji INF.03.3 (5)

Projektowanie stron internetowych

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
58 Zasady projektowania stron internetowych 1 – analizuje cechy dobrej strony WWW
– zna pojęcia: UX, UI, RWD
– stosuje dobre praktyki projektowe EE.09.3 (1), EE.09.3 (2)
59 Brief projektu strony internetowej 1 – określa cel i grupę odbiorców strony – tworzy pełen opis projektu (brief) EE.09.3 (1)
60 Szablon strony internetowej 2 – tworzy szablon HTML/CSS – modyfikuje gotowy szablon do potrzeb projektu EE.09.3 (2)
61 Dobór palety barw na stronę internetową 2 – dobiera kolory zgodnie z zasadami kontrastu i psychologii barw – tworzy własną paletę kolorystyczną EE.09.3 (1)
62 Projekt graficzny strony internetowej 1 – projektuje układ graficzny w edytorze graficznym – przygotowuje elementy graficzne do kodowania EE.09.3 (1)
63 Tworzenie stron zgodnie z projektem 1 – koduje stronę na podstawie projektu graficznego – wdraża pełną strukturę witryny EE.09.3 (2)

Testowanie, publikacja i optymalizacja stron WWW

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
64 Sprawdzanie poprawności strony 1 – wykorzystuje programy walidujące do kontroli poprawności kodu HTML i CSS – naprawia błędy w strukturze dokumentu INF.03.3 (7), INF.03.3 (9)
65 Walidacja strony 1 – stosuje narzędzia walidacyjne (W3C Validator) – interpretuje raporty walidacyjne INF.03.3 (9)
66 Testowanie strony w przeglądarkach 1 – testuje działanie strony w różnych przeglądarkach – analizuje kompatybilność i responsywność INF.03.3 (9)
67 Publikowanie strony internetowej 1 – zna pojęcia domena, hosting, FTP – publikuje stronę na serwerze INF.03.3 (9)
68 Testy funkcjonalności strony internetowej 1 – testuje poprawność działania linków, formularzy, skryptów – przygotowuje raport testów INF.03.3 (9)
69 Optymalizacja strony internetowej 1 – kompresuje obrazy i skrypty – optymalizuje strukturę kodu INF.03.3 (9)
70 Pozycjonowanie strony 1 – zna pojęcia SEO i meta tagi – optymalizuje stronę pod kątem wyszukiwarek INF.03.3 (9)
71 Bezpieczeństwo stron internetowych 1 – zna podstawowe zagrożenia: XSS, SQL Injection – stosuje mechanizmy zabezpieczające formularze INF.03.3 (9)

Opracowanie własnych projektów stron internetowych

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
72 Opracowanie własnych stron w technologiach HTML i CSS 5 – tworzy samodzielnie stronę z wykorzystaniem HTML i CSS – stosuje zaawansowane techniki stylizacji EE.09.3 (1), EE.09.3 (2)
73 Projektowanie systemów CMS 4 – rozumie zasadę działania systemów CMS – projektuje własny prosty system zarządzania treścią EE.09.3 (3)
74 Dokumentowanie projektu 1 – przygotowuje dokumentację użytkową – tworzy dokumentację techniczną aplikacji INF.03.3 (10)
75 Prezentacja i obrona projektu końcowego 1 – prezentuje efekty swojej pracy – omawia zastosowane rozwiązania i technologie INF.03.3 (12)

Zintegrowana aplikacja

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
76 Projektowanie zintegrowanej aplikacji internetowej 2 – analizuje wymagania projektu aplikacji
– planuje strukturę folderów i plików aplikacji
– wykorzystuje HTML, CSS, JavaScript i PHP do tworzenia zintegrowanych rozwiązań
– projektuje responsywny układ interfejsu
– stosuje wzorce projektowe i dobre praktyki kodowania
INF.03.3 (1, 3, 5)
77 Implementacja systemu logowania i rejestracji użytkowników 2 – tworzy formularze rejestracji i logowania
– przechowuje dane użytkowników w bazie danych
– weryfikuje poprawność danych przy logowaniu
– szyfruje hasła użytkowników (np. funkcją password_hash)
– zabezpiecza aplikację przed SQL Injection i XSS
INF.03.3 (2, 5)
78 Tworzenie panelu administracyjnego aplikacji 2 – projektuje panel do zarządzania zawartością strony
– umożliwia edycję, dodawanie i usuwanie danych z bazy
– stosuje paginację i filtrowanie wyników
– tworzy przyjazny interfejs użytkownika (UI)
INF.03.3 (3, 5)
79 Testowanie działania aplikacji internetowej 2 – testuje poprawność działania funkcji aplikacji
– analizuje błędy i je poprawia
– stosuje testy walidacyjne i jednostkowe
– dokumentuje wyniki testów
INF.03.3 (5)
80 Bezpieczeństwo aplikacji internetowych 2 – rozpoznaje zagrożenia w aplikacjach internetowych
– stosuje podstawowe zabezpieczenia (walidacja danych, sesje)
– implementuje ochronę przed atakami XSS i SQL Injection
– analizuje raporty bezpieczeństwa
INF.03.3 (5)
81 Publikacja aplikacji na serwerze 1 – przygotowuje pliki projektu do wdrożenia
– korzysta z klienta FTP do przesyłania plików
– konfiguruje serwer wirtualny i domenę
– zabezpiecza dostęp do zasobów serwera
INF.03.3 (6)
82 Dokumentacja projektu aplikacji internetowej 2 – tworzy podstawową dokumentację techniczną projektu
– opisuje funkcje, strukturę i sposób działania aplikacji
– opracowuje dokumentację zgodną z zasadami inżynierii oprogramowania
– przygotowuje prezentację projektu
INF.03.3 (6)

Dodatek

Lp. Tematy jednostek metodycznych Liczba godzin Wymagania podstawowe (Uczeń) Wymagania ponadpodstawowe (Uczeń) Efekt z podstawy programowej
83 Powtórzenie i utrwalenie wiadomości 2 – przypomina główne pojęcia z zakresu HTML, CSS, JavaScript, PHP i SQL
– rozwiązuje zadania praktyczne z poprzednich tematów
– opracowuje własne projekty łączące różne technologie
– dokonuje samooceny wiedzy i umiejętności
INF.03.3 (1–6)
84 Słownik pojęć z zakresu aplikacji internetowych 1 – definiuje podstawowe pojęcia z dziedziny programowania webowego
– rozumie skróty i terminy branżowe
– opracowuje własny słownik pojęć lub mapę myśli
– potrafi wytłumaczyć zasady działania technologii webowych
INF.03.3 (1)
85 Rozszerzenie wiedzy – nowoczesne technologie webowe 2 – omawia rolę frameworków (np. React, Laravel, Bootstrap)
– zna pojęcie API i integracji zewnętrznych usług
– wykorzystuje API w prostym projekcie
– analizuje różnice między front-endem a back-endem nowoczesnych aplikacji
INF.03.3 (4, 6)
86 Ewaluacja, test końcowy i prezentacja projektów 2 – uczestniczy w podsumowaniu kursu
– prezentuje wykonany projekt aplikacji internetowej
– dokonuje autoewaluacji i analizy własnych postępów
– prezentuje projekt przed komisją egzaminacyjną
INF.03.3 (6)
Wskazówka: Każdy temat może być rozwinięty o ćwiczenia praktyczne HTML, CSS, JavaScript lub PHP, dokładnie tak jak w module baz danych dla INF.03.