Проект: Путешествие по России

Автор проекта: Яндекс.Практикум

Верстка: Корсунов Евгений

Обзор

• Введение
• Описание проекта
• Описание методов
• Заключение

Введение

Основная задача проекта - научиться выполнять адаптивную верстку сайта под большинство предполагаемых устройств. При создании проекта используется такой инструмент взаимодействия с дизайнером как Figma

Описание проекта

Проект показывает нам то, что не только за границей можно найти красивые места и получить уникальный опыт. Рассказывает нам о том, как широка и многогранна наша страна, какие у нас есть уникальные природные красоты и дает краткое описание некоторых самых значимых и интересных мест, которые обязатльно нужно посетить.

Описание методов

Для адаптивности проекта используются такие свойства как flex, grid-layout и использовние относительных величин.

Для отображения всей текстовой информации мы подключили шрифт Inter через импорт, что дает нам одинаковое отображение сайта на большинстве возможных устройств.

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

В подвале сайта реализована стилизация фонового изображения при помощи оверлея (верхнего слоя, которы мы реализовали с помощью псевдокласса ::before) с изменением прозрачности наложения при наведении курсора.

Заключение

В общем и целом верстка этого проекта не сложная, но кропотливая, нужно соблюсти все размеры и отступы сразу для нескольких экранов (в данном случае это 4 размера - 320, 768, 1024 и 1280px), что требует внимательности и усидчивости.

Большинство элементов можно отобразить различными методами и способами, что застравляет задумываться и выбирать тот вараиант, который будет максимально удовлетворять требованиям этого проекта.

Мы познакомились с большинством аспектов адаптивной верстки, научились предварительно анализировать задание, чтобы заблаговременно понять, какое именно решение отлично подойдет в том или ином моменте, закрепили знания по методологии БЭМ и можем спокойно называть себя начинающими HTML верстстальщиками!

Ссылка на проект Путешествие по России

Стек

HTML, CSS

| Да прибудет с вами сила |