МУ Синергия, основы верстки сайтов (учебная практика)


Узнать стоимость этой работы
02.04.2026, 13:06

Индивидуальное задание по учебной практике

по профессиональному модулю ПМ.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.

Учебно-практическая работа. Приобретение необходимых умений и первоначального опыта практической работы по специальности в рамках освоения вида деятельности ВД 5. Основы верстки сайтов.

Получить практический опыт в:

управлении процессом разработки приложений с использованием инструментальных средств;

обеспечении сбора данных для анализа использования и функционирования информационной системы;

программировании в соответствии с требованиями технического задания;

использовании критериев оценки качества и надежности функционирования информационной системы;

применении методики тестирования разрабатываемых приложений;

определении состава оборудования и программных средств разработки информационной системы;

разработке документации по эксплуатации информационной системы;

проведении оценки качества и экономической эффективности информационной системы в рамках своей компетенции;

модификации отдельных модулей информационной системы.

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

- Изучить: Структура HTML-документа включает декларацию <!DOCTYPE html> и основные элементы <html>, <head> и <body>, в которых используются теги разметки (h1–h6, p, a, img, ul/li, ol/li, table/tr/td, div, span, form, input, button) с соответствующими атрибутами (src, href, alt, class, id), а оформление страницы осуществляется с применением каскадных таблиц стилей (CSS), где используются селекторы, параметры цвета (color, background-color), шрифтов (font-family, font-size), отступов (margin, padding), границ (border) и принципов блочной модели, при этом стили могут подключаться тремя способами — встроенным (style=""), внутренним (<style> в разделе <head>) и внешним (<link rel="stylesheet" href="styles.css">).

- Разработать простую HTML-страницу «О себе», демонстрирующую базовые навыки вёрстки и структурирования веб-контента. В состав страницы необходимо включить заголовок первого уровня (<h1>) с указанием имени автора, фотографию с корректно заданным атрибутом alt, абзац с краткой информацией о себе (<p>), ненумерованный список профессиональных или личных навыков (<ul>), а также контактные ссылки с использованием протоколов mailto:, tel: и гиперссылок формата https://. В нижней части страницы следует разместить колонтитул с текстом «© 2025 Моя визитка». Технические требования к работе предусматривают создание файла index.html с рекомендованным размером рабочего кадра 1440 × 1024 px, применение светлой цветовой схемы (светлый фон, тёмный текст), подключение как минимум одного внешнего файла таблицы стилей styles.css, а также соблюдение корректности HTML-структуры, включая обязательное закрытие и правильное вложение всех используемых тегов.

 

4.

Обработка и систематизация полученного фактического материала.

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

 

5.

Оформление отчетных документов о прохождении учебной практики и экспертная оценка результатов ее прохождения.

Оформить отчет по практике в формате презентации PowerPoint, содержащий базовую и информационно-вспомогательную информацию, согласно Приложению 1.

Разместить полностью оформленный комплект отчетной документации по практике в электронной информационно-образовательной среде Университета «Синергия» на платформе lms.synergy.ru руководителю практики от Образовательной организации для экспертной оценки результатов ее прохождения.

 

 

Перечень предметных областей

Предметная область

Краткое задание

1.

Личная визитка

Создать страницу «О себе» с фото, контактами и ссылками.

2.

Учебная страница курса

Страница курса с расписанием и описанием тем.

3.

Каталог книг

Таблица с книгами, авторами, ценой, кнопкой «Купить».

4.

Галерея изображений

Сетка миниатюр с подписями.

5.

Рецепт блюда

Страница рецепта с фото, ингредиентами и шагами.

6.

Портфолио фотографа

Главная страница с карточками проектов.

7.

Афиша событий

Список концертов или спектаклей.

8.

Магазин одежды

Макет каталога товаров с карточками.

9.

Профиль пользователя

Карточка профиля + кнопки действий.

10.

Блог-пост

Страница записи блога с заголовком, текстом, комментариями.

11.

Страница регистрации

Форма с полями логина, пароля и кнопкой «Войти».

12.

Контактная форма

Макет страницы обратной связи.

13.

Лэндинг курса

Главная страница с баннером и кнопкой «Записаться».

14.

Расписание занятий

Таблица времени и аудиторий.

15.

Приложение «To-Do List»

Список дел (визуальный макет без JS).

16.

Каталог фильмов

Карточки фильмов с постерами и описанием.

17.

Музыкальный плеер (макет)

Обложка альбома, кнопки play/pause.

18.

Путешествия и туризм

Карточки туров с фото и ценой.

19.

Учебный дневник

Таблица предметов и оценок.

20.

Ресторанное меню

Список блюд с ценами и описанием.

21.

Онлайн-портфолио дизайнера

Сетка с миниатюрами проектов.

22.

Галерея животных

Макет страницы с карточками питомцев.

23.

Учебный журнал группы

Таблица студентов и успеваемости.

24.

Интернет-магазин электроники

Карточки товара + фильтр по категориям.

25.

Моя библиотека

Список книг с описанием и рейтингом.

26.

Кинотеатр

Афиша фильмов + расписание сеансов.

27.

Новости кампуса

Главная страница новостного сайта.

28.

Погодное приложение (макет)

Карточка города, температура, иконка погоды.

29.

Музей

Страница с описанием экспозиции и галереей.

30.

Путеводитель по городу

Карточки достопримечательностей.

 



Узнать стоимость этой работы