01 · Структура
Разобраться в задаче
Определить, кому нужен сайт и какое действие должен совершить посетитель.
- Сценарий посетителя
- Порядок блоков
Маленькая студия · учебный пример
Три шага к удобному сайту
Карточки растут по содержимому и перестраиваются по ширине экрана.
02 · Интерфейс
Собрать страницу, которая удобна на телефоне
Сделать аккуратную сетку, читаемый текст и понятные переходы.
- Адаптивная вёрстка
- Видимый фокус
03 · Проверка
Проверить важные состояния
Попробовать длинный текст, маленький экран и управление клавиатурой.
- Текст не обрезается
- Ссылки работают
Задача для проверки
Сделайте похожий раздел со своим текстом. Проверьте 320, 390 и 768 px; нажмите Tab и убедитесь, что видите выбранную ссылку.