Верстка PSD макетов сайта
Задача - верстка новых макетов для уже существующего сайта. Нужна только верстка и js интерактив (галереи листалки и тд). Макеты в jpg по ссылке.
В архиве основные страницы, остальные внутренние делаются накидыванием блоков из этих дизайнов.
Критично важна скорость загрузки страниц и подготовка к SEO (внутренняя оптимизация). Поэтому минимум подключаемых библиотек (лучше вообще без них). Один файл css, один файл js, спрайты и все остальное для ускорения.
Вот страница где уже начали верстать предыдущую версию дизайна Главной
carglass ru/bol/redesign/home.html
На этой странице уже был задан этот задел на "быстрый" и красивый код. Я хочу чтобы эта верстка обязательно была взята за основу. Адаптив само собой разумеещееся (в сверстаной страничке уже он сделан)
Цель верстки - качественное SEO продвижение. Поэтому критерии чистоты html кода и скорости загрузки наиболее критичные. Приемка работы будет осуществляться на основе оценки этих критериев
Разработка будет вестись на тестовом сервере параллельно будет существовать оригинал.
Чтобы ни в коем случае не допустить индексации тестового сайта ОБЯЗАТЕЛЬНО прописывание на каждой странице тега а также запрет на индексацию в robots.txt
Условия 100% завершения работы по верстке:
- Иконки должны быть объеденены в sprites
- Все теги img должны иметь заполненный атрибут alt и title
- Все javascript файлы должны быть объеденены в один файл. Все сторонние библиотеки должны лежать на сервере в минимизированных версиях.(А лучше вообще во возможности свести к минимуму использование лишних скриптов). Все js файлы подключаем в футере перед тегом
- Два файла css и javascript должны быть в удобном для чтения форматированном виде, а также в минимизированном виде (браузеру отдаем именно минимизированный вид)
- для мобильной версии кое кикие "текстовые блоки" будут скрыты display:none и visibility:hidden.
- все картинки должны иметь именно те размеры которые максимально нужны для отображения на дисплее с макс. разрешением 20" Т.е. если картинка отображается в браузере 200х200 то ее нужно порезать до этих размеров без потери качества.
- Кросбраузерность. Должна быть, но без фанатизма, проверяем на версиях популярных браузеров 2-х годичной давности
- Не использовать strong, b - нужную толщину шрифта задать в CSS
- Вся навигация сайта (меню, хлебные крошки, списки и тд.) с помощью ненумерованных списков (теги ul, li). Главное меню шапки опускаем в коде вниз, чтобы уникальный контент был выше (на сверстанной странице это уже реализовано)
- На странице только один тег H1 остальные теги h2, h3 ... идут в хронологическом порядке. (т.е. если у нас сейчас они идут не в хронологическом порядке то заменяем их на div и применяем стиль заголовка)
- Использование тегов html5 помогающих роботу правильно понять структуру страницы nav, head, section, footer и т.д.
- Код всех страниц полностью валиден. Валидность проверяем сервисом https://validator.w3.org/ При проверке каждой из страниц не должно быть ошибок Error и не более 5-ти Warning
- Микроразметка всех меню, логотипа, страницы контактов, статей, хлебных крошек, картинок