Интерфейсные технологии веб-программирования предназначены для «клиентской стороны» веб-сайта или приложения. Они используются для разработки интерактивных компонентов сайта и создания элементов, которые пользователи видят и с которыми взаимодействуют. Сюда входят цвета и стили текста, изображения, кнопки и меню навигации и др. [5].

Эти технологи включают HTML (язык гипертекстовой разметки), использующийся для структурирования содержимого веб-страницы, CSS (каскадные таблицы стилей), использующиеся для оформления внешнего вида веб-страницы, JavaScript, использующийся для добавления интерактивности и динамического поведения на веб-страницу [1]. Широкое распространение в данной области получили фреймворки и библиотеки JavaScript (такие как React, Angular и Vue.js), которые используется для упрощения и рационализации разработки сложных веб-приложений.

Студентам педагогических направлений важно иметь базовое представление об интерфейсных технологиях веб-разработки и о том, как их можно использовать при обучении школьников. Будучи знакомыми с интерфейсными веб-технологиями, преподаватели смогут создавать привлекательные и интерактивные учебные материалы для своих учеников, а также использовать разработанные приложения в качестве инструмента для оценки результатов обучения.

Изучение интерфейсных веб-технологий предполагает сочетание теоретической и практической деятельности. В рамках аудиторных занятий раскрываются основные принципы и техники интерфейсных веб-технологий. В ходе самостоятельной работы студенты выполняют задания, ориентированные на анализ и исследование учебных материалов и демонстрационных примеров, способствующих пониманию концепций и технологий интерфейсной веб-разработки. Внеаудиторная самостоятельная работа способствует закреплению знаний и умений, получению опыта в применении полученных знаний при выполнении учебных проектов, предполагающих использование HTML, CSS и JavaScript для создания и оформления веб-страниц и приложений.

Отметим, что самостоятельная работа имеет решающее значение при изучении интерфейсных веб-технологий [2], поскольку она позволяет приобрести практический опыт, создавая собственные проекты, экспериментируя с различными технологиями и техниками; развивает критическое мышление. Это обусловлено тем, что интерфейсная разработка часто включает в себя решение проблем; а также позволяет контролировать процесс обучения и следить за его прогрессом. Это особенно важно в такой области, как интерфейсная веб-разработка, где постоянно появляются новые технологии и приемы.

В качестве основного инструмента в поддержку самостоятельной работы студентов при изучении интерфейсных веб-технологий целесообразно использовать цифровые образовательные ресурсы (ЦОР). Доступ к ЦОР возможен из любого места и в любое время, что позволяет обучающимся учиться в своём темпе и по собственному расписанию. Это может быть особенно полезно для студентов, которым требуется дополнительное время или поддержка для освоения определенных концепций.

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

Созданию цифрового образовательного ресурса должно предшествовать тщательное планирование: цель, отбор содержания, разработка структуры и механизма навигации и оформления.

Определение цели использования ЦОР является одним из ключевых этапов его разработки [3]. Ожидаемый результат обучения студентов интерфейсным веб-технологиям может варьироваться в зависимости от конкретной педагогической области, но в целом студенты должны продемонстрировать глубокое понимание ключевых концепций и методов, связанных с веб-разработкой, понимание основных составляющих веб-технологий, включая HTML, CSS и JavaScript, в том числе, уметь писать и изменять веб-страницы, используя эти технологии, осознавать, как они взаимодействуют при создании динамичных интерактивных веб-интерфейсов, а также обладать способностью применять эти знания при создании реальных проектов.

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

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

Репродуктивные задания могут помочь закрепить концепции, которые были усвоены ранее. Повторение упражнений или создание похожих проектов может помочь учащимся укрепить свое понимание изучаемого языка или фреймворка. Выполнение простых упражнений или проектов по кодированию может помочь учащимся обрести уверенность в своей способности кодировать и работать с интерфейсными веб-технологиями. Эти задания также помогают студентам закрепить свои знания и подготовиться к самостоятельной практической работе. Например, учащиеся могут выполнять упражнения, уточняющие ключевые умения, такие как написание HTML-кода для создания структуры веб-страницы или CSS-кода для оформления страницы.

Задания частично-поискового типа являются основой для развития практических навыков студентов в области веб-технологий. Частично-поисковое задание предполагает наличие конкретной проблемы или задания для решения, но им не предоставляется полностью подробный набор инструкций. Вместо этого они должны использовать свои знания об интерфейсных веб-технологиях для принятия решений о том, как действовать дальше. Это позволяет студентам увидеть практическое применение изученного материала. В качестве основных примеров можно выделить упражнения по кодированию, в которых студентам предлагается написать HTML, CSS или JavaScript-код для достижения конкретных целей, таких как создание адаптивного веб-сайта или создание интерактивного веб-приложения; создание веб-сайта или веб-приложения, чтобы укрепить свое понимание ключевых концепций и развить свои практические навыки; или же выполнение проектных работ, в рамках которых студенты могут работать над проектами, которые включают создание полноценного веб-сайта или веб-приложения с нуля, используя навыки и методы, которым они научились во время учебы.

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

Таблица 1 – Содержание обучения интерфейсным веб-технологиям и примеры заданий для самостоятельной работы

Вывод. При создании ЦОР для самостоятельного изучения веб-технологий важно следовать основному принципу дизайна. ЦОР должен иметь четкий, простой и интуитивно понятный дизайн, позволяющий студентам легко ориентироваться в материале и понимать его. Для реализации ЦОР целесообразно использовать DHTML (динамический HTML), сочетающий инструментарий HTML, CSS и JavaScript для создания интерактивных, динамичных, привлекательных и сложных веб-приложений [4].

Литература:

1. Зеленко О.В., Валеева Л.Р., Климанов С.Г., Обзор современных WEB - технологий / Вестник технологического университета. 2015, т.18, в.2, с.354-356 (RINC, ВАК)

2. Разливинских, И. Н. Самостоятельная работа студентов как психолого-педагогический феномен / И. Н. Разливинских // Вестник Шадринского государственного педагогического университета. – 2017. – № 3(35). – С. 33-41.

3. Поначугин, А. В. Цифровые образовательные ресурсы вуза: проектирование, анализ и экспертиза / А. В. Поначугин, Ю. Н. Лапыгин // Вестник Мининского университета. – 2019. – Т. 7, № 2(27). – С. 5.

4. Солодушкин, С. И. Web и DHTML : учебное пособие / С. И. Солодушкин, И. Ф. Юманова. — Екатеринбург : УрФУ, 2018. — 128 с.

5. Урок 1. Введение в WEB - разработку. — Текст : электронный // WEB-labaratory : [сайт]. — URL: https://cls.tgl.ru/generator-bo/ (дата обращения: 19.02.2023).