HTML и CSS-Создание сайта.
Вы познакомитесь с основными принципами и инструментами веб-разработки, научитесь работать с различными HTML-тегами, структурировать содержимое страницы, форматировать текст и изображения, создавать таблицы и списки, а также добавлять ссылки и мультимедиа. Кроме того, вы изучите основы CSS, которые позволют стилизовать веб-страницы, изменять цвета, шрифты, размеры и расположение элементов, создавать анимации и адаптивные дизайны. В результате вы получите необходимые навыки для создания простых и эффективных фрагментов верстки с использованием HTML5 и CSS3.
Программа курса
- Тема1. Введение в HTML
- Определение HTML и его роль в создании веб-страниц.
- Основные понятия Всемирной паутины: веб-страницы, веб-серверы.
- Разметка текста с использованием HTML-элементов.
- Атрибуты HTML-элементов и специальные символы.
- Синтаксис и семантика HTML-элементов.
- Использование Visual Studio Code.
- Практика создания HTML-страницы в VSCode.
- Тема2. Структура страницы
- Различие между элементами форматирования текста и структурными элементами.
- Разметка страницы и проверка на валидность.
- Исправление ошибок на странице.
- Практика по разметке и валидации.
- Тема3. Создание гиперссылок
- Понятие гиперссылки и вставка элементов гиперссылок.
- Различия в записи гиперссылок и использование атрибутов.
- Создание разметки для меню сайта.
- Практика работы с гиперссылками.
- Тема4. Основы CSS
- Варианты задания стилей на странице.
- Подключение стилевого файла.
- Понятия: селектор, свойство, каскад, наследование, единицы измерения.
- Работа с различными видами селекторов.
- Практика изменения оформления страницы.
- Тема5. Размещение изображений, списков и таблиц
- Размещение изображений на странице.
- Использование неупорядоченных и упорядоченных списков.
- Создание и оформление таблиц.
- Использование CSS-свойств для стилизации элементов.
- Практика размещения изображений, списков и таблицы.
- Тема6. Iframe
- Встраивание внешних файлов с помощью элемента <iframe>.
- Взаимодействие ссылок с iframe-элементами.
- Практика добавления iframe-элемента на страницу.
- Тема7. Формы для сбора данных
- Цель и состав форм на веб-страницах.
- Различные элементы формы и их атрибуты.
- Создание формы обратной связи и обработка данных.
- Практика разметки HTML-формы
- Тема8. Макетирование страницы с CSS
- Изменение оформления границ и отступов элементов.
- Задание ширины и высоты элементов.
- Использование свойства float для плавающих элементов.
- Управление видимостью элементов.
- Применение различных значений свойства display для сложных макетов.
- Практика вёрстки HTML-страницы.
- Тема9. Таблицы стилей для печати и мобильной версии сайта
- Оформление страницы при печати с помощью стилей.
- Создание мобильной версии сайта с использованием медиа-запросов.
- Использование других медиа свойств для различных устройств.
- Практика создания стилей для печати и мобильной версии.
- Тема10. Подготовка, размещение и поддержка сайта
- Использование элемента meta для размещения мета-информации на страницах.
- Выбор хостера и размещение сайта в сети.
- Упрощение процесса размещения сайта в сети.
- О системе управления версиями.
- Тема11. Дополнительная информация
- Размещение звуковых и видео-файлов на странице.
- О генерации содержимого сайта на сервере (Python, JS, PHP и др.).
- Об использовании JavaScript в браузере (+ HTML5 API).
- О вспомогательных инструментах (Figma, AI и др.).
- Подведение итогов
