Этот проект представляет собой одностраничный сайт, целью которого было отточить навыки вёрстки. В рамках этого проекта я сосредоточилась на следующих аспектах:
- Подключение и настройка шрифтов: как локальных, так и интеграция их со сторонних источников.
- Оформление текста: согласно предоставленному макету.
- Работа с переполнением текстовых блоков: решение проблем переполнения текста.
- Семантическая структура документа: согласно стандартам HTML5.
- Инструменты оптимизации вёрстки: использование идентификаторов и классов.
- Псевдоклассы и псевдоэлементы: применение для создания сложных стилей.
- Доступность (a11y): базовые правила для работы со скринридерами, настройки уменьшения движения и повышения контрастности, использование декоративных и контентных изображений.
- Дерево доступности и ARIA-атрибуты: для повышения доступности интерфейса.
| Функция | Описание |
|---|---|
| Отображение карточек с информацией о предметах | Описание предметов, выставленных на аукцион. |
| Оформление текста и элементов страницы | Согласно заданным требованиям указанных в макете, типографика, шрифты, расположение элементов. |
| Гарантия доступности сайта | Для пользователей с ограниченными возможностями. |
| Технология | Описание |
|---|---|
| HTML5 | Создание семантической структуры документа. |
| CSS3 | Стилизация страницы. |
| SCSS | Расширение CSS для упрощения написания кода. |
| Псевдоклассы и псевдоэлементы | Применение для создания сложных стилей (затеменение изображения, изменение стиля при наведении) . |
| Семантическая вёрстка | Согласно стандартам HTML5. |
| Доступность (a11y) | Базовые правила для работы со скринридерами. |
| Скринридеры | Поддержка для пользователей с ограниченными возможностями. |
Для просмотра проекта просто откройте.