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/sr/3-terrarium/1-intro-to-html/assignment.md

6.0 KiB

HTML Практични Задатак: Изградња Макете Блога

Циљ

Осмислите и ручно кодирајте HTML структуру за почетну страницу личног блога. Овај задатак ће вам помоћи да увежбате семантички HTML, планирање распореда и организацију кода.

Упутства

  1. Осмислите Макету Свог Блога

    • Направите визуелну макету почетне странице свог блога. Укључите кључне секције као што су заглавље, навигација, главни садржај, бочна трака и подножје.
    • Можете користити папир и скенирати своју скицу или користити дигиталне алате (нпр. Figma, Adobe XD, Canva или чак PowerPoint).
  2. Идентификујте HTML Елементе

    • Направите списак HTML елемената које планирате да користите за сваку секцију (нпр. <header>, <nav>, <main>, <article>, <aside>, <footer>, <section>, <h1><h6>, <p>, <img>, <ul>, <li>, <a> итд.).
  3. Напишите HTML Ознаке

    • Ручно кодирајте HTML за своју макету. Фокусирајте се на семантичку структуру и најбоље праксе.
    • Укључите најмање 10 различитих HTML елемената.
    • Додајте коментаре како бисте објаснили своје изборе и структуру.
  4. Предајте Свој Рад

    • Отпремите своју скицу/макету и HTML датотеку.
    • Опционално, напишите кратку рефлексију (23 реченице) о својим дизајнерским одлукама.

Рубрика

Критеријум Изузетно Прихватљиво Потребно Побољшање
Визуелна Макета Јасна, детаљна макета са означеним секцијама и промишљеним распоредом Основна макета са неким означеним секцијама Минимална или нејасна макета; недостају ознаке секција
HTML Елементи Користи 10+ семантичких HTML елемената; показује разумевање структуре и најбољих пракси Користи 59 HTML елемената; делимично семантичка структура Користи мање од 5 елемената; недостаје семантичка структура
Квалитет Кода Добро организован, читљив код са коментарима; прати HTML стандарде Углавном организован код; мало коментара Неорганизован код; недостају коментари
Рефлексија Проницљива рефлексија о дизајнерским изборима и изазовима Основна рефлексија Без рефлексије или недовољно релевантна

Савети

  • Користите семантичке HTML ознаке за бољу приступачност и SEO.
  • Организујте свој код уз помоћ увлачења и коментара.
  • Погледајте MDN HTML Elements Reference за смернице.
  • Размислите о томе како би ваш распоред могао бити проширен или стилизован у будућим задацима.

Одрицање од одговорности:
Овај документ је преведен коришћењем услуге за превођење помоћу вештачке интелигенције Co-op Translator. Иако се трудимо да обезбедимо тачност, молимо вас да имате у виду да аутоматски преводи могу садржати грешке или нетачности. Оригинални документ на изворном језику треба сматрати ауторитативним извором. За критичне информације препоручује се професионални превод од стране људи. Не сносимо одговорност за било каква погрешна тумачења или неспоразуме који могу настати услед коришћења овог превода.