Верстка Fresh-med Page

HTML-верстка
103 просмотра
04.07.2020
1439×882828 КБ
Slice1.png
light-house1.png
1439×705200 КБ
Slice5.png
1256×100762 КБ
Slice4.png
1387×1008648 КБ
Slice3.png
1440×70593 КБ
Slice2.png

[b][h3]Верстка главной страницы украинской больницы. [/h3] [/b][u][url=https://fresh-med.herokuapp.com/]DEMO(Взглянуть на проект)[/url] [/u] [list][*][b]Адаптивно:[/b] Адаптивной код с использованием flex-box/grid, современных подход написания media запросов и директивы @supports если какой-то браузер не поддерживает последние технологии.[/list] [list][*][b]Кросс-браузерно:[/b] Одинаково работает на телефонах, планшетах, ie11  и современных браузерах.[/list] [list][*][b]Оптимизировано: [/b]Код структурированный, написанный по методологии BEM, javascript разбит на модули, все статические файлы(шрифты, картинки, js css бандлы(чанки) оптимизированы и подгружаются только тогда, когда это необходимо(lazy-load).[/list] [list][*][b]Валидный: [/b]код разбит на блоки, везде есть комментарии и пометки, в режиме production все файлы мумифицируются, все лишнее удаляется. Код встроется в любую CMS систему его легко поддерживать, 90% поддержка SEO в light-house, быстра подгрузка, доступность для Screen reader(role aria label)[/list] [list][*][b]Доступный:[/b] проект написан на актуальных технологиях простым языком без фреймворков, при поддержки style lintera для контроля чистоты кода.[/list] [list][*][b]Технологии:[/b]  сборка, организация проекта Webpack. Vanila js(обычный javascript) ,  post-css, post-css плагины для качественной работы. glide.js(библиотека для работы со слайдером в vanila js, аналог slick slider), методология написания классов и файловая система BEM.[/list] [list][*][b]Функционал проекта[/b]: в проекте используется модальные окна, pop-upы, валидация форм, slider, бургер меню, акардион,  скрипты для оптимизации: ObserverFont(оптимизированная подгрузка шрифтов), lazy load для статичесеий файлов, внешних скриптов.[/list] [list][*][u][/u][u][/u][u][/u][u][/u][u][url=https://fresh-med.herokuapp.com/]DEMO(Взглянуть на проект)[/url] [/u][*][u][/u][u][/u][u][/u][u][/u][u][url=https://github.com/Batyodie/FreshMed]Исходный код[/url] [/u][*][u][/u][u][/u][u][/u][u][/u][u][url=https://github.com/Batyodie]Мой github[/url] [/u][/list]
CSSJavaScript