Верстка сторінок сайту на Bootstrap 5.3.3

Розроблено адаптивну верстку сайту, що бездоганно працює на різних пристроях – від великих екранів ПК до мобільних телефонів, а також планшетів. Основне завдання – відтворити дизайн, затверджений у Figma, забезпечивши точне відображення зовнішнього вигляду та інтерактивну поведінку сторінки, аналогічну тестовому сайту.

Основні вимоги:

Адаптивність:
Верстка повинна коректно працювати для десктопу з контентом шириною 1440px (фон 1920px) та для мобільного пристрою (екран – 460px).

Інтеграція з Bootstrap 5:
Використання Bootstrap 5 є обов’язковим, що дозволяє прискорити розробку та забезпечити консистентність стилів. Загальний CSS-код для всіх сторінок винесено в окремі файли для зручної інтеграції у код сайту.

SEO-оптимізація:
Структура HTML коду розроблена з урахуванням сучасних вимог до SEO, що сприяє кращому ранжуванню сайту.

Обробка фотографій:
Фото готелів завантажуються з зовнішніх сервісів і можуть мати різні пропорції. Для вирішення цього завдання реалізовано відображення центральної частини зображення через CSS (за допомогою властивостей object-fit: cover; та object-position: center; ratio), що дозволяє зберегти відповідність дизайну.
Крім того, для фотогалереї запропоновано інтуїтивно зрозуміле рішення: відображення фотографій у модальному вікні як слайдшоу, що забезпечує зручність перегляду користувачами.

Проект демонструє використання сучасних технологій (HTML5, CSS3, JavaScript, Bootstrap 5) для створення ефективних та зручних інтерфейсів. Інтеграція верстки у код сайту здійснюється окремо, що дозволяє легко масштабувати та підтримувати проект.