Vladimir-code Верска сайтов

Меня зовут Владимир

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

Хочу сайт
vladimir_code
Frontend developer, верстальщик сайтов
shield

Надёжность верстки

Вы без проблем сможете изменять контент сайта и не важно что это будет текст, изображения или блоки. Структура сайта не развалится.

shield

Гарантия

Я дорожу своей репутацией, по этому на все мои работы распространяется гарантия. Всегда на связи и оперативно внесу правки без какой либо доплаты.

shield

Методология БЭМ

Разделение интерфейса на независимые блоки. Возможность повторно использовать существующий код, избегая лишнего переиспользования.

shield

Анимация

Визуально украсит Ваш сайт и сделает его более привлекательным для пользователя. Одна из самых важных составлющих современного сайта.

shield

Проверка вёрстки

Всегда проверяю верстку на наличие ошибок в HTML, CSS. Так же проверяю скорость загрузки сайта и совместимость со всеми браузерами.

shield

Развитие

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

Навыки

html
HTML5
css
CSS3
sass
SASS
js
JS
vs_code
VS-CODE
figma
FIGMA
gulp
GULP
bem
БЭМ

Подробнее о навыках и преимуществах

HTML5/CSS3/JavaScript

  • Чистый и структурированный код.
  • Валидный, кроссбраузерный код.
  • Cемантический HTML-код.
  • Методология БЭМ.
  • Надёжная вёрстка. Не ломается при замене контента.
  • Анимация, hover эффекты. Transition.
  • Чистый JavaScript код.
  • Flexbox / Grid.

Адаптив/Оптимизация

  • Адаптивная вёрстка под любые устройства.
  • Отзывчивая вёрстка (резиновая).
  • Адаптивная вёрстка с брейкпоинтами.
  • Отзывчиво-адаптивная вёрстка (резиновая с брейкпоинтами).
  • Конвертирование изображений в современный формат WEBP.
  • Экспорт SVG-изображений. SVG-спрайты.
  • Ленивая загрузка данных lazy loading.

Gulp/SASS

  • Стартовый шаблон для быстрого старта и качественной вёрстки.
  • Автоматизация процесса верстки.
  • Компиляция препроцессоров.
  • Минификация файлов.
  • Более гибкий код.
  • Улучшенная логика стилей.
  • Упрощенный синтаксис.
  • Вложенность селекторов без ошибок.

Процесс

01
web

Работа с
макетом

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

02
communication

Обсуждение проекта с
заказчиком

Обсудим с Вами все нюансы по Вашему проекту. Так же выслушаю Ваши пожелания и вопросы. Подробно расскажу как я буду выполнять работу.

03
html

Вёрстка
контента

Семантическая вёрстка контента по методологии БЭМ с грамотным названием классов делает код красивым и максимально понятным для любого разработчика.

04
css

Стилизация
сайта

Стилизую блоки и элеметы сайта, добавляю анимацию и различные эффекты. Спомощю чистого JavaScript создаю аккордеоны, меню бургер, попапы, табы и т.д.

05
adaptive

Адаптив
сайта

Адаптирую сайт под все виды устройств. Адаптивная верстка медиа-запросами, отзывчивая вёрстка по бейкпоинтам, отзывчиво адаптивная вёрстка.

06
browsers

Проверка в
браузерах

Проверяю адекватное отображение и поведение вёрстки во всех популярных браузерах.

07
error

Устранение
ошибок в коде

Проверяю код на наличие ошибок HTML и CSS. Исправляю если таковые имеются и довожу код до идеала. Также проверяю скорость загрузки сайта.

08
ok

Сборка и сдача
проекта

Загружаю вёрстку на хостинг и показываю Вам для оценки. Если не нужно вностить правки, собираю проект в файлы и передаю их Вам.

Эффекты

Часто используемые анимации
и hover эффекты

Анимированный
текст
Animation-text
Анимация при
наведении на сылку
Анимация при
наведении на кнопку
Click
button
Анимированные
иконки
Анимация
блока
img img img
Анимация при наведении
на изображение
image
HOVER
Hover-effect image