Индивидуальное задание по производственной практике
по профессиональному модулю ПМ.05 Основы верстки сайтов
|
№ п/п
|
Виды работ
|
Период выполнения работ
|
|
1.
|
Ознакомительная лекция, включая инструктаж по соблюдению правил противопожарной безопасности, правил охраны труда, техники безопасности, санитарно-эпидемиологических правил и гигиенических нормативов.
Пройти инструктивное совещание с руководителем практики от Образовательной организации, на котором ознакомиться с кругом обязанностей по определенным видам работ, связанным с будущей профессиональной деятельностью, а также уточнить правила в отношении субординации, внешнего вида, внутреннего трудового распорядка и режима конфиденциальности.
Пройти инструктаж по соблюдению правил противопожарной безопасности, правил охраны труда, техники безопасности, санитарно-эпидемиологических правил и гигиенических нормативов (в случае медицинских противопоказаний к выполнению определенных видов деятельности – принести подтверждающую справку из медицинского учреждения).
|
|
|
2.
|
Изучение дополнительной литературы и методических материалов.
В целях развития профессиональных навыков в разработке и дизайне веб-приложений необходимо ознакомиться с дополнительной литературой и методическими материалами по теме «Веб-приложения»:
Основная литература:
Вагин, Д. В. Современные технологии разработки веб-приложений : учебное пособие / Д. В. Вагин, Р. В. Петров. — Новосибирск : Новосибирский государственный технический университет, 2019. — 52 c. — ISBN 978-5-7782-3939-5. — Текст : электронный // Цифровой образовательный ресурс IPR SMART : [сайт]. — URL: https://www.iprbookshop.ru/98738.html
Интернет-ресурсы:
Позевалкин В.В. Разработка веб-приложений на основе клиентских каркасов и библиотек : учебное пособие / Позевалкин В.В., Панова Н.Ф.. — Оренбург : Оренбургский государственный университет, ЭБС АСВ, 2025. — 191 c. — ISBN 978-5-7410-3380-7. — Текст : электронный // Цифровой образовательный ресурс IPR SMART : [сайт]. — URL: https://www.iprbookshop.ru/153228.html
|
|
|
3.
|
Формирование теоретико-методологической базы экспериментально-практической работы
Провести аналитический обзор профильной технической документации и учебно-методических источников, регламентирующих:
- структуру HTML-документа и назначение его основных элементов (<!DOCTYPE html>, <html>, <head>, <body>), принципы семантической разметки, использование тегов блочной и строчной структуры (header, main, footer, section, article, nav, div, span) и формирование логической иерархии контента;
- основы CSS, включая понятие каскада, наследования и специфичности, применение селекторов и свойств для оформления текста, цвета, фона, границ, отступов и выравнивания элементов;
- блочную модель и особенности работы свойств margin, padding, border, display, box-sizing, обеспечивающих корректное расположение элементов;
- методы построения макета страницы с использованием Flexbox и CSS Grid, а также базовые принципы адаптивной и отзывчивой вёрстки (медиазапросы, относительные единицы измерения, масштабирование изображений);
- работу с графическими ресурсами и формами — подключение изображений, использование атрибутов alt, srcset, оформление таблиц и интерактивных форм (input, label, button);
- организацию файловой структуры проекта и подключение внешних ресурсов (таблицы стилей, шрифты, изображения), а также принципы валидации HTML и CSS в соответствии со стандартами W3C.
Сформировать персональный справочный материал (конспект, чек-листы, и др.), содержащий ключевые правила, синтаксические конструкции и практические примеры, необходимые для оперативного обращения в процессе вёрстки.
|
|
|
4.
|
Экспериментально-практическая работа. Приобретение необходимых умений и первоначального опыта практической работы по специальности в рамках освоения вида деятельности ВД 5. Основы верстки сайтов.
Получить практический опыт в:
- управлении процессом разработки приложений с использованием инструментальных средств;
- обеспечении сбора данных для анализа использования и функционирования информационной системы;
- программировании в соответствии с требованиями технического задания;
- использовании критериев оценки качества и надежности функционирования информационной системы;
- применении методики тестирования разрабатываемых приложений;
- определении состава оборудования и программных средств разработки информационной системы;
- разработке документации по эксплуатации информационной системы;
- проведении оценки качества и экономической эффективности информационной системы в рамках своей компетенции;
- модификации отдельных модулей информационной системы.
С целью получения практического опыта работы с веб-приложениями на проектном этапе обучающемуся предлагается выполнить следующие практические задания:
- в рамках производственной практики студенту предлагается выполнить проект по созданию многостраничного веб-сайта в выбранной предметной области, отражающей реальные сценарии применения веб-технологий (например, сайт кофейни, театра, туристического агентства, онлайн-школы и т.д.). Целью работы является отработка практических навыков профессиональной вёрстки с использованием HTML5 и CSS3, освоение принципов адаптивного макетирования, семантической структуры и единых стилевых решений для нескольких связанных страниц веб-приложения;
- разрабатывается три взаимосвязанные страницы (главную, контентную и контактную), реализует навигационное меню, формирует визуальную сетку с применением Flexbox или Grid, оформляет элементы интерфейса средствами каскадных таблиц стилей, обеспечивает корректное отображение на различных устройствах и проводит проверку валидности кода. Итоговый результат должен представлять собой структурированный, адаптивный и визуально согласованный прототип сайта, соответствующий требованиям современного уровня фронтенд-разработки.
|
|
|
5.
|
Обработка и систематизация полученного фактического материала.
С целью подготовки к сдаче экзамена по модулю ПМ.05 Основы верстки сайтов осуществить комплексный анализ результатов выполненных видов работ, оформить презентационные материалы, разработать свои предложения и рекомендации на основе сравнения полученных в процессе обучения теоретических знаний с навыками, полученными в период прохождения практики.
|
|
|
6.
|
Оформление отчетных документов о прохождении учебной практики и экспертная оценка результатов ее прохождения.
Оформить отчет по практике в формате презентации PowerPoint, содержащий базовую и информационно-вспомогательную информацию, согласно Приложению 1.
Оформить справку, заверенную подписью и печатью (при наличии) ответственного лица от Профильной организации, содержащую сведения о прохождении практики
Разместить полностью оформленный комплект отчетной документации по практике в электронной информационно-образовательной среде Университета «Синергия» на платформе lms.synergy.ru руководителю практики от Образовательной организации для экспертной оценки результатов ее прохождения.
|
|
Перечень предметных областей
|
№
|
Предметная область
|
Суть учебного кейса (о чём сайт)
|
|
1.
|
Онлайн-школа программирования
|
Главная с курсами, карточка курса, форма записи.
|
|
2.
|
Кофейня или пекарня
|
Меню, карточки десертов, контакты и карта.
|
|
3.
|
Туристическое агентство
|
Главная с баннером, список туров, страница тура.
|
|
4.
|
Интернет-магазин одежды
|
Каталог товаров, карточка товара, доставка.
|
|
5.
|
Фото-портфолио
|
Галерея, страница проекта, контакты фотографа.
|
|
6.
|
Театр и репертуар
|
Афиша, страница спектакля, билеты/контакты.
|
|
7.
|
Книжный магазин
|
Каталог книг, карточка книги, форма заказа.
|
|
8.
|
Фитнес-клуб
|
Услуги, расписание, форма записи на тренировку.
|
|
9.
|
Учебный центр
|
Программы обучения, карточка направления, контакты.
|
|
10.
|
Музыкальная студия
|
Услуги записи, примеры работ, контакты.
|
|
11.
|
Салон красоты
|
Услуги, портфолио мастеров, онлайн-запись.
|
|
12.
|
Библиотека
|
Каталог книг, страница книги, форма заявки.
|
|
13.
|
Городской музей
|
Главная с выставками, карточка экспозиции, карта.
|
|
14.
|
Кинотеатр
|
Афиша, страница фильма, бронирование билетов.
|
|
15.
|
Ресторан
|
Меню, карточка блюда, бронирование столика.
|
|
16.
|
Спортивный магазин
|
Каталог товаров, карточка, акции и скидки.
|
|
17.
|
Стартап или IT-компания
|
Главная с продуктами, страница продукта, обратная связь.
|
|
18.
|
Турнир по киберспорту
|
Главная, расписание матчей, регистрация участников.
|
|
19.
|
Ветеринарная клиника
|
Услуги, врачи, форма записи.
|
|
20.
|
Онлайн-портфолио дизайнера
|
Главная, проекты, контакты.
|
|
21.
|
Цветочный магазин
|
Каталог букетов, карточка, заказ.
|
|
22.
|
Автошкола
|
Главная, программы обучения, форма записи.
|
|
23.
|
Сайт фотографа-свадебщика
|
Галерея, отзывы, контакты.
|
|
24.
|
Курсы иностранных языков
|
Главная, карточка курса, контакты.
|
|
25.
|
Студия веб-дизайна
|
Главная, проекты, заявка на разработку.
|
|
26.
|
Блог-портал о технологиях
|
Главная с анонсами статей, страница статьи.
|
|
27.
|
Коворкинг
|
Описание помещений, тарифы, бронирование.
|
|
28.
|
Онлайн-журнал о моде
|
Главная, статья, подписка на рассылку.
|
|
29.
|
Агентство недвижимости
|
Каталог объектов, карточка объекта, контакты.
|
|
30.
|
Благотворительный фонд
|
Миссия, проекты, форма пожертвования.
|
|