You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Web-Dev-For-Beginners/translations/pl/3-terrarium/1-intro-to-html/assignment.md

4.2 KiB

HTML Praktyczne Zadanie: Stwórz Makietę Bloga

Cel

Zaprojektuj i ręcznie zakoduj strukturę HTML dla strony głównej osobistego bloga. To ćwiczenie pomoże Ci w praktyce z semantycznym HTML, planowaniem układu i organizacją kodu.

Instrukcje

  1. Zaprojektuj Makietę Bloga

    • Naszkicuj wizualną makietę strony głównej bloga. Uwzględnij kluczowe sekcje, takie jak nagłówek, nawigacja, główna treść, pasek boczny i stopka.
    • Możesz użyć papieru i zeskanować swój szkic lub skorzystać z narzędzi cyfrowych (np. Figma, Adobe XD, Canva, a nawet PowerPoint).
  2. Zidentyfikuj Elementy HTML

    • Sporządź listę elementów HTML, które planujesz użyć w każdej sekcji (np. <header>, <nav>, <main>, <article>, <aside>, <footer>, <section>, <h1><h6>, <p>, <img>, <ul>, <li>, <a> itd.).
  3. Napisz Kod HTML

    • Ręcznie zakoduj HTML dla swojej makiety. Skup się na semantycznej strukturze i najlepszych praktykach.
    • Uwzględnij co najmniej 10 różnych elementów HTML.
    • Dodaj komentarze, aby wyjaśnić swoje wybory i strukturę.
  4. Prześlij Swoją Pracę

    • Prześlij swój szkic/makietę oraz plik HTML.
    • Opcjonalnie, napisz krótką refleksję (23 zdania) na temat swoich decyzji projektowych.

Kryteria Oceny

Kryterium Wzorowe Wystarczające Wymaga Poprawy
Wizualna Makieta Jasna, szczegółowa makieta z oznaczonymi sekcjami i przemyślanym układem Podstawowa makieta z kilkoma oznaczonymi sekcjami Minimalna lub niejasna makieta; brak oznaczenia sekcji
Elementy HTML Użycie 10+ semantycznych elementów HTML; zrozumienie struktury i najlepszych praktyk Użycie 59 elementów HTML; częściowa semantyczna struktura Użycie mniej niż 5 elementów; brak semantycznej struktury
Jakość Kodowania Dobrze zorganizowany, czytelny kod z komentarzami; zgodność ze standardami HTML W większości zorganizowany kod; niewiele komentarzy Nieuporządkowany kod; brak komentarzy
Refleksja Wnikliwa refleksja na temat wyborów projektowych i wyzwań Podstawowa refleksja Brak refleksji lub brak jej istotności

Wskazówki

  • Używaj semantycznych znaczników HTML dla lepszej dostępności i SEO.
  • Organizuj kod za pomocą wcięć i komentarzy.
  • Odwiedź MDN HTML Elements Reference jako źródło informacji.
  • Pomyśl o tym, jak Twój układ może być rozszerzony lub stylizowany w przyszłych zadaniach.

Zastrzeżenie:
Ten dokument został przetłumaczony za pomocą usługi tłumaczenia AI Co-op Translator. Chociaż dokładamy wszelkich starań, aby tłumaczenie było precyzyjne, prosimy pamiętać, że automatyczne tłumaczenia mogą zawierać błędy lub nieścisłości. Oryginalny dokument w jego rodzimym języku powinien być uznawany za źródło autorytatywne. W przypadku informacji krytycznych zaleca się skorzystanie z profesjonalnego tłumaczenia przez człowieka. Nie ponosimy odpowiedzialności za jakiekolwiek nieporozumienia lub błędne interpretacje wynikające z użycia tego tłumaczenia.