Исправить верстку
https://up2.whitebx.ru/s/c/f/Screenshot_2021-02-03_12:58:03.SCFCr54sYF3BPP2RLMk9q9.png
https://up2.whitebx.ru/u/b/4/Screenshot_2021-02-03_12:58:25.UB441Eob6TtevZPEyZZKE8.png
https://up2.whitebx.ru/9/8/5/y0uvmp.98554nCTJT719NpzLeW8b9.png
страниц раздела услуги на сайте
https://prodveri.dev-hi99.whitebx.ru/uslugi
https://prodveri.dev-hi99.whitebx.ru/ustanovka-mezhkomnatnyh-dverej
Подробнее:
1.
Блоки в сетке должны ровно упорядочиваться, не создавая "дыр" как на скриншоте.
1.1.
Блоки должны быть одинаковой высоты.
2.
Работы ведутся на тестовом сервере, после того как всё готово, нужно будет перенести сделанное на основной сайт.
Особенности:
A. Кроссбраузерность.
Результаты работ должны одинаково выглядеть в основных браузерах (в том числе
старых версий): Firefox 53.0.3, Firefox ESR 52.9.0, Firefox, Chrome,
Safari.
B. Адаптивная вёрстка.
Сайт использует адаптивную вёрстку, необходимо чтобы после выполнения задач, в мобильной версии всё
было читабельно и никуда не съезжало.
Устройство посетителя считается мобильным в случаях когда:
Ширина экрана браузера менее 768px (если CSS-правилами сайта не определено иное).
User-Agent браузера позволяет определить что устройство мобильное.
Вышеуказанные условия должны реагировать на resize окна браузера (мобильные элементы
после ресайза должны быть такими же как после полной перезагрузки с
изначально мобильным разрешением).
Размеры элементов адаптивной версии должны растягиваться в зависимости от размера экрана браузера, и
по ширине и высоте, сохраняя макетные пропорции.
C. Пояснение по адаптиву.
Адаптивность вёрстки мобильного варианта подразумевает, что не существует какого-то
отдельного html-кода для мобильной верстки, дублирующего десктопные
элементы. Вместо этого, один единственный вариант вёрстки, в зависимости
от размера экрана, отображается как десктопный, либо как адаптивный
вариант. Т.е. для десктопного вида и для мобильного вида шапки+меню не
должно быть двух разных блоков html-кода. Один и тот же html должен
отображаться по-разному в зависимости от разрешения экрана..
D. Нельзя использовать h1, h2, h3.
Для вёрстки новых элементов нельзя использовать теги h1 h2 h3 и т.д., поскольку это вредно с точки зрения SEO.
E. Минимум javascript.
Задачи должны быть выполнены с минимально возможным применением javascript.
Если какие-то задачи могут быть решены средствами PHP/HTML/CSS, то они
должны быть решены с помощью PHP/HTML/CSS.
F. Готовые решения.
При выборе варианта решения данной задачи приоритет следует отдавать
интеграции готовых решений (плагинов/модулей) при наличии таковых
надлежащего качества.
G. Поломки.
Выполнение данной задачи не должно сломать какой-либо другой функционал. Если в процессе работы вы
что-то сломаете, то исправление поломки осуществляется вами
безвозмездно.
H. Результат.
Результат задачи должен быть представлен в том конечном виде, который описан в ТЗ. Варианты "оно в
принципе готово, просто зайдите туда-то, нажмите то-то, затем ещё туда и
туда и вот сюда" крайне не приветствуются. Если после выполнения работ
нужно обновить кэш модификаторов сайта - обновите. Если нужно будет
обновить кэш браузера - измените html-код таким образом, чтобы файл сам
обновился либо смените режим кэширования для этого файла. Посетители
сайта обновлять кэш не будут, но зато увидят поехавшую вёрстку.
Закладывайте это дополнительно в стоимость задачи.
I. SCSS/SASS/препроцессоры.
Следует избегать использования технологий, предполагающих стадию компиляции,
поскольку они усложняют и без того запутанный процесс разработки,
повышая её стоимость. Выгоды от их использования нивелируются негативным
экономическим эффектом.
J. Никакого дебага на продакшене.
На продакшене не должно появляться никаких заглушек и прочего. В случаях
острой необходимости произвести дебаг именно на продакшене, выводите
дамп внутрь HTML-комментария, либо оборачивайте в <?php
if($_SERVER == 'ВАШ-IP-АДРЕС') { ?>.
K. Тестовый сервер.
Работы ведутся на тестовом сервере, после того как всё готово, нужно будет перенести сделанное на основной сайт.
