В этом пункте объясняется, почему школьникам полезно понимать устройство и оформление веб-страниц, а также формулируются тема, проблема и ожидаемый результат проекта. Здесь обозначаются границы работы: участники изучают основы дизайна и создают небольшую страницу, а не разрабатывают сложный многостраничный сайт. Отдельно указываются аудитория, практическая направленность и способы проверки готового продукта.

Раздел знакомит с веб-дизайном как проектированием структуры, внешнего вида и пользовательского взаимодействия на сайте. Объясняется, чем дизайн отличается от разработки и почему оформление должно помогать посетителю находить нужную информацию. На примерах рассматриваются задачи веб-страницы: сообщить сведения, организовать переходы между разделами и поддержать понятное восприятие содержания.

В пункте рассматриваются основные части типовой веб-страницы: шапка, навигация, основная область содержания и подвал. Участники узнают, как заголовки помогают разделять материал, а меню и ссылки — переходить к нужным разделам. Раздел нужен, чтобы научиться планировать порядок информации до оформления и избегать страниц, в которых важные сведения трудно найти.

Здесь изучается влияние цвета, размера и начертания шрифта, интервалов и отступов на читаемость и восприятие страницы. Рассматриваются контраст между текстом и фоном, единообразие оформления и визуальная иерархия заголовков. Участники сравнивают удачные и неудачные решения и учатся выбирать оформление, которое подчёркивает содержание, а не отвлекает от него.

Пункт объясняет начальный уровень технической основы веб-страницы: HTML размечает содержание, а CSS задаёт его внешний вид. На простых примерах разбираются заголовки, абзацы, ссылки и изображения, а также стили текста и блоков. Отдельно вводится понятие адаптивности: оформление должно оставаться понятным при просмотре на экранах различной ширины.

В практической части участники выбирают тему страницы и определяют, кому она предназначена и какую информацию посетитель должен найти. Затем составляют перечень материалов, распределяют их по разделам и рисуют схематичный макет на бумаге или в редакторе. Такой порядок помогает заранее заметить пропуски в содержании и согласовать структуру до начала оформления.

На этом этапе согласованный макет превращается в учебную веб-страницу с заголовком, текстовыми блоками, изображениями и ссылками. Участники применяют базовую разметку и стили либо используют подходящий визуальный редактор, соблюдая общие правила оформления. В описании этапа фиксируются выбранные цвета, шрифты и решения по расположению элементов, чтобы продукт можно было объяснить и доработать.

Готовую страницу проверяют по заранее составленному чек-листу: читается ли текст, понятны ли заголовки и меню, работают ли ссылки и не теряются ли элементы на узком экране. Участники получают обратную связь от одноклассника и записывают обнаруженные затруднения. По итогам проверки вносятся исправления, а изменения связываются с конкретными замечаниями пользователей.

В заключительном пункте кратко описываются изученные принципы и выполненные этапы создания страницы. Участники оценивают, насколько полученный продукт соответствует выбранной аудитории, и называют сильные стороны и ограничения своей версии. Также отмечаются навыки, которые удалось освоить, и возможные направления дальнейшего развития: добавление новых разделов, улучшение адаптивности или проверка доступности.

В этом пункте перечисляются учебные, справочные и электронные источники, использованные для изучения веб-дизайна и подготовки страницы. Для сайтов указываются название ресурса, адрес и дата обращения, а для книг и учебников — автор, название и год издания, если эти сведения известны. Список помогает проверить происхождение использованных рекомендаций, терминов и технических примеров.