Работа с
макетом
Анализирую макет на наличие одинаковых блоков и различных элементов, самого распространенного шрифта и т.д., что бы избежать дублирования кода.
Vladimir-code Верска сайтов
Навыки
HTML5
CSS3
SASS
JS
VS-CODE
FIGMA
GULP
БЭМ
Подробнее о навыках и преимуществах
HTML5/CSS3/JavaScript
- Чистый и структурированный код.
- Валидный, кроссбраузерный код.
- Cемантический HTML-код.
- Методология БЭМ.
- Надёжная вёрстка. Не ломается при замене контента.
- Анимация, hover эффекты. Transition.
- Чистый JavaScript код.
- Flexbox / Grid.
Адаптив/Оптимизация
- Адаптивная вёрстка под любые устройства.
- Отзывчивая вёрстка (резиновая).
- Адаптивная вёрстка с брейкпоинтами.
- Отзывчиво-адаптивная вёрстка (резиновая с брейкпоинтами).
- Конвертирование изображений в современный формат WEBP.
- Экспорт SVG-изображений. SVG-спрайты.
- Ленивая загрузка данных lazy loading.
Gulp/SASS
- Стартовый шаблон для быстрого старта и качественной вёрстки.
- Автоматизация процесса верстки.
- Компиляция препроцессоров.
- Минификация файлов.
- Более гибкий код.
- Улучшенная логика стилей.
- Упрощенный синтаксис.
- Вложенность селекторов без ошибок.
Процесс
01
Работа с
02
Обсуждение проекта с
заказчиком
Обсудим с Вами все нюансы по Вашему проекту. Так же выслушаю Ваши пожелания и вопросы. Подробно расскажу как я буду выполнять работу.
03
Вёрстка
контента
Семантическая вёрстка контента по методологии БЭМ с грамотным названием классов делает код красивым и максимально понятным для любого разработчика.
04
Стилизация
сайта
Стилизую блоки и элеметы сайта, добавляю анимацию и различные эффекты. Спомощю чистого JavaScript создаю аккордеоны, меню бургер, попапы, табы и т.д.
05
Адаптив
сайта
Адаптирую сайт под все виды устройств. Адаптивная верстка медиа-запросами, отзывчивая вёрстка по бейкпоинтам, отзывчиво адаптивная вёрстка.
06
Проверка в
браузерах
Проверяю адекватное отображение и поведение вёрстки во всех популярных браузерах.
07
Устранение
ошибок в коде
Проверяю код на наличие ошибок HTML и CSS. Исправляю если таковые имеются и довожу код до идеала. Также проверяю скорость загрузки сайта.
08
Сборка и сдача
проекта
Загружаю вёрстку на хостинг и показываю Вам для оценки. Если не нужно вностить правки, собираю проект в файлы и передаю их Вам.
Эффекты
Часто используемые анимации
и hover эффекты
Анимированный
текст
Animation-text
Анимация при
наведении на сылку
Hover link
Анимация при
наведении на кнопку
Анимированные
иконки
Анимация
блока
Анимация при наведении
на изображение
HOVER
Hover-effect image
