Лэндинг онлайн-школы иностранных языков

Описание

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

Решение

Спроектировала структуру лендинга и пользовательский сценарий, разработала дизайн в Figma, выполнила подбор и обработку изображений, после чего сверстала и реализовала проект на чистых HTML, SCSS и JavaScript без использования тяжелых библиотек.

Реализованы адаптивная Pixel Perfect верстка, интерактивные вкладки, несколько слайдеров на Embla Carousel, FAQ, модальные окна, анимации появления блоков, фиксированный хедер, адаптивное меню, кнопка возврата наверх, уведомление о cookies, формы обратной связи и другие интерактивные элементы. Также выполнена оптимизация изображений (WebP, Retina, image-set), семантическая верстка, базовая SEO-подготовка и оптимизация производительности.

Результат

Получился современный адаптивный лендинг с высокой скоростью загрузки, продуманной структурой и удобной навигацией. Проект полностью разработан с нуля — от структуры и дизайна до финальной реализации, с акцентом на производительность, удобство пользователей и дальнейшее развитие сайта.
Использованные технологии
Figma
HTML5
SCSS
JavaScript (ES6)
Embla Carousel
Responsive / Pixel Perfect
SVG-спрайты
WebP, Retina, image-set
Семантическая верстка
Базовая SEO-оптимизация

Ссылки на примеры реализации

 lensya.github.io/lang-school/

Презентация проекта