Dla nauczycieli i rodziców
Godzina Kodowania: gotowa lekcja HTML na 60 minut
Poprowadź Godzinę Kodowania bez długich przygotowań. Uczniowie przechodzą prawdziwe lekcje z kursu HTML i CSS w CodeWorlds, zmieniają kod w edytorze na stronie i od razu sprawdzają się w pytaniach. Nie trzeba niczego instalować ani zakładać kont.
Czym jest Godzina Kodowania?
Godzina Kodowania (ang. Hour of Code) to światowa akcja, w której uczniowie poznają podstawy programowania podczas jednogodzinnych zajęć. Organizuje ją Code.org. Pierwsza edycja odbyła się w 2013 roku w ramach Computer Science Education Week, tygodnia edukacji informatycznej, który organizatorzy obchodzą co roku w tygodniu urodzin Grace Hopper (9 grudnia).
Organizator zmienił formułę akcji. Według Code.org Hour of Code to teraz Hour of AI, czyli jednogodzinne zajęcia o sztucznej inteligencji, a 2 czerwca 2026 roku Code.org zmieniło nazwę na CodeAI. Adres hourofcode.com przekierowuje teraz na stronę Hour of AI.
Oficjalne zajęcia znajdziesz w katalogu na stronie organizatora. Można je przeglądać według klasy i tematu, a wcześniejsze zajęcia Hour of Code są zebrane na osobnej liście. Każdy, kto prowadzi zajęcia, może też zgłosić swoje wydarzenie na stronie akcji.
Tegoroczne terminy sprawdź na oficjalnej stronie. Nasz scenariusz możesz poprowadzić w dowolnym dniu.
Źródła
Scenariusz lekcji na 60 minut
Scenariusz korzysta z pierwszych lekcji kursu HTML i CSS. Pod każdą z nich jest blok „Sprawdź się” z pytaniami: uczeń wybiera odpowiedź i od razu widzi, czy jest poprawna. W modułach 1 i 2 kursu wszystkie pytania są dostępne bez konta.
0-5 min
Start
Powiedz uczniom, że HTML opisuje zawartość strony internetowej: nagłówki, akapity, obrazy i linki. Wyświetl pierwszą lekcję na projektorze lub tablicy interaktywnej i pokaż, gdzie jest edytor kodu i blok „Sprawdź się”.
5-20 min
Lekcja 1: Wprowadzenie do HTML
Uczniowie czytają lekcję, zmieniają przykładowy kod w edytorze i patrzą, co zmienia się w podglądzie. Na koniec odpowiadają na pytania w bloku „Sprawdź się”.
20-35 min
Lekcja 2: Elementy HTML
Uczniowie czytają lekcję, zmieniają przykładowy kod w edytorze i patrzą, co zmienia się w podglądzie. Na koniec odpowiadają na pytania w bloku „Sprawdź się”.
35-50 min
Lekcja 3: Struktura dokumentu HTML
Uczniowie czytają lekcję, zmieniają przykładowy kod w edytorze i patrzą, co zmienia się w podglądzie. Na koniec odpowiadają na pytania w bloku „Sprawdź się”.
50-60 min
Podsumowanie
Poproś kilka osób, żeby pokazały, co zmieniły w kodzie i jaki był efekt. Zbierzcie razem nowe pojęcia, na przykład znacznik, element, nagłówek, akapit, head i body, i pokaż, jak można uczyć się dalej w grze.
Dla szybszych uczniów
Kto skończy wcześniej, może przejść do kolejnej lekcji i dalej eksperymentować z kodem: Elementy HTML - rozszerzenie
Czego potrzebujesz
- Komputer lub laptop z przeglądarką internetową i dostępem do internetu, najlepiej jeden na osobę albo na parę uczniów.
- Nic więcej: lekcje, edytor kodu i pytania działają na stronie, więc niczego nie instalujesz.
- Uczniowie nie potrzebują kont ani adresów e-mail.
- Rzutnik albo tablica interaktywna przydadzą się na wspólny start, ale nie są konieczne.
Co dalej po Godzinie Kodowania?
Kto chce grać dalej, może założyć darmowe konto w CodeWorlds. Na darmowym koncie można przejść w grze kurs HTML i CSS z limitem 10 jednostek paliwa dziennie. Do każdej lekcji są tam zadania z edytorem kodu, pytania i układanki, a za postępy zdobywa się XP i odblokowuje kolejne lokacje. Każde zadanie kosztuje paliwo, a postęp zapisuje się na koncie. Plan premium znosi limit paliwa i odblokowuje pozostałe kursy.
Zacznij za darmo →Wskazówki do prowadzenia
- Przejdź lekcje samodzielnie przed zajęciami, żeby wiedzieć, gdzie uczniowie mogą utknąć.
- Pracujcie w parach: jedna osoba pisze kod, druga czyta polecenia, a po każdej lekcji zamieniają się rolami.
- Zachęcaj do zmieniania przykładów. Błąd w edytorze niczego nie psuje, a szukanie go uczy najwięcej.
- Pytania w bloku „Sprawdź się” od razu pokazują poprawną odpowiedź, więc omów z klasą te, które sprawiły najwięcej kłopotu.
- Jeśli grupa potrzebuje więcej czasu, zakończ na dwóch lekcjach, a trzecią zostaw na kolejne zajęcia.
- Rodzice mogą poprowadzić tę godzinę w domu: wystarczy usiąść obok dziecka i przejść lekcje razem.
Pytania o Godzinę Kodowania
Czy uczniowie muszą zakładać konta?
Nie. Lekcje, edytor kodu i pytania „Sprawdź się” działają bez logowania. Konto przyda się dopiero tym, którzy chcą grać dalej i zapisywać postępy.
Ile to kosztuje?
Nic. Lekcje na stronie są bezpłatne, a na darmowym koncie można przejść w grze kurs HTML i CSS z limitem 10 jednostek paliwa dziennie.
Czy trzeba coś instalować?
Nie. Wystarczy przeglądarka internetowa i dostęp do internetu. Edytor kodu z podglądem strony działa bezpośrednio na stronie lekcji.
Kiedy jest Godzina Kodowania w tym roku?
Akcja jest związana z Computer Science Education Week, który organizatorzy obchodzą co roku w tygodniu urodzin Grace Hopper (9 grudnia). Organizator przekształcił ją w Hour of AI, więc tegoroczne terminy sprawdź na oficjalnej stronie. Nasz scenariusz możesz poprowadzić w dowolnym dniu.
Czy ten scenariusz pochodzi od organizatorów Hour of Code?
Nie. Przygotował go zespół CodeWorlds na podstawie własnych lekcji HTML. Oficjalne zajęcia znajdziesz w katalogu na stronie organizatora.
Gotowi na pierwszą lekcję?
Otwórz pierwszą lekcję na projektorze i zacznijcie od razu. Po zajęciach cały kurs HTML i CSS czeka w CodeWorlds.