Podstawy tworzenia stron internetowych

Podstawy tworzenia stron internetowych — język HTML oraz style CSS — to praktyczny temat matury rozszerzonej z informatyki, wprowadzający ucznia w mechanikę budowy współczesnych stron WWW od strony strukturalnej i wizualnej.

Lekcja rozpoczyna się od znaczników semantycznych HTML5, takich jak <nav> — element przeznaczony specjalnie do bloków nawigacyjnych, w odróżnieniu od bardziej ogólnych znaczników jak <section> (ogólna sekcja), <header> (nagłówek) czy <article> (niezależna treść). Uczeń poznaje też podstawowe znaczniki strukturalne: <ul> dla list nieuporządkowanych (wypunktowanych) i <ol> dla list uporządkowanych (numerowanych), a także atrybuty kluczowe dla dostępności strony — href w znaczniku <a> (wskazujący adres docelowy hiperłącza) oraz alt w znaczniku <img> (tekst alternatywny wyświetlany, gdy obraz nie może zostać załadowany).

Druga część materiału koncentruje się na CSS — języku stylów odpowiedzialnym za wygląd strony. Kluczowym tematem jest rozróżnianie typów selektorów: selektory klas (poprzedzone kropką, np. .menu), selektory ID (poprzedzone hashem, np. #header) oraz selektory typu (np. p, bez prefiksu). Uczeń ćwiczy też bardziej zaawansowaną składnię — selektor potomka (.container p), wybierający wszystkie elementy <p> zagnieżdżone wewnątrz elementu o klasie container.

Materiał omawia właściwości CSS odpowiedzialne za typografię — font-size, font-family oraz font-weight bezpośrednio wpływają na wygląd czcionki, w odróżnieniu od text-align, która dotyczy wyrównania tekstu, a nie samej czcionki. Uczeń poznaje też dopuszczalne jednostki miary dla rozmiaru czcionki w CSS: piksele (px), jednostkę względną em oraz procenty (%) — w przeciwieństwie do deg, stosowanej wyłącznie w transformacjach kątowych.

Fiszki porządkują też budowę tabel (<tr>, <td>), a zadania do pisemnej odpowiedzi sięgają dalej: elementy blokowe i liniowe, kaskadowość i specyficzność selektorów, sposoby dołączania CSS oraz model pudełkowy. Ten zestaw buduje solidne podstawy budowy stron internetowych — od struktury dokumentu HTML po podstawową stylizację CSS.

• Uczeń rozpoznaje semantyczne znaczniki HTML5 (nav, section, header, article) i ich przeznaczenie
• Uczeń stosuje znaczniki list uporządkowanych i nieuporządkowanych (ol, ul)
• Uczeń zna kluczowe atrybuty HTML: href w znaczniku a oraz alt w znaczniku img
• Uczeń rozróżnia selektory CSS: klasy (.), ID (#) i typu elementu
• Uczeń stosuje selektor potomka do wybierania zagnieżdżonych elementów
• Uczeń rozróżnia właściwości CSS dotyczące czcionki od właściwości wyrównania tekstu
• Uczeń zna dopuszczalne jednostki miary dla rozmiaru czcionki w CSS (px, em, %)

Materiał tematyczny (bez dokumentu źródłowego): podstawy tworzenia stron internetowych — język HTML (znaczniki, struktura dokumentu, listy, tabele, hiperłącza, obrazy) oraz podstawy CSS (selektory, style, właściwości kolorów i czcionek), zgodnie z zakresem matury rozszerzonej z informatyki.