Сверстаю
Вам сайт по дизайн макету PSD Figma Sketch
от 1 дня

Пройдите тест и получите предварительный развернутый расчет стоимости HTML верстки ваших макетов.

Рассчитать цену верстки

Привет, меня зовут Андрей Лобанов, я HTML верстальщик.

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

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

Моя цель стать FULL STACK JAVASCRIPT программистом, чтобы разрабатывать высоконагруженные и интересные приложения.

Рассчитайте стоимость верстки

Вопрос 1 из 3

Количество экранов/блоков?

1 экранов

Дополнительно рублей

За один блок рублей

В сумме примерно рублей

Кто Вы?

Есть макеты адаптивной версии сайта?

Какие сроки:

3 Дней

Вставьте ссылку на макеты с облачного диска (необязательно)

Дополнительные работы:

Опишите техническое задание, если его нет на диске

Спасибо за ответы!

Получите результат расчета, оставив контактный телефон или ссылку на соц сети:

Нажимая "Узнать стоимость", вы соглашаетесь с

Что вы получите от работы со мной

Зеленая зона в Google PageSpeed

Google PageSpeed

Что входит:
1. Обьединение и сжатие скриптов и стилей.
2. Оптимизация размера и сжатие картинок.

Зачем это:
Это нужно для того чтобы сверстанная страница мгновенно загружалась.

Одинаковое отображение как на макете во всех современных браузерах

Browser Mozilla Browser Chrome Browser Safari
Browser Yandex Browser Opera Browser Edge Internet Explorer

Отображение кастомных шрифтов

Fonts

Адаптивность под 6 разрешений

1920px
1170px
960px
720px
540px
320px-
540px

Что это:
Это размеры основных устройств: мониторы, планшеты и мобильные устройства.

Зачем это:
Это нужно для того чтобы сверстанная страница отображалась удобно на всех устройствах.

Микроразметка для социальных сетей

Микроразметка Вконтакте

Что это:
Показ картинки 1 экрана и заголовка при отправке ссылки в сообщения социальных сетей между друзьями.

Зачем это:
По умолчанию социальные сети выдергивают любую попавшиюся картинку на странице и показывают при отправке, это не презентабельно.

Ваши макеты и исходники не уйдут дальше меня

Pixel Perfect

Окно браузера Прототип сайта Прототип сайта

Что это:
Это когда сверстанная страница в точности до пикселя соответствует макету.

Как проверить:
На эту тему у меня написана статья, можно прочитать здесь.

Валидация по https://validator.w3.org

Что это:
Это когда сверстанная страница может прочитана корректно поисковым роботом.

Мои работы по верстке

За 2 года непрерывной верстки ко мне попадали разные макеты, от 3 экранной визитки до CPA систем и объемных интернет магазинов, в которых легко было потеряться. После 150 интересных макетов не боишься взяться за абсолютно любую задачу, нужен квиз, без проблем, заверстаем и запрограммируем, нужен кастомный скролл для прокрутки по целой странице, я готов. Мне нравятся задачи, в которых нужно узнать новое и подумать.

Представлены не все работы, не все заказчики дают право показывать выполненную верстку.

Портфолио верстальщика

Иконкаanimator142.ru

Адаптивная верстка 2 страниц под 6 разрешений с запрограммированным квизом и отправкой заявок в телеграмм.

посмотреть
Портфолио верстальщика

Иконкаkupipet.ru

Адаптивная верстка 40 страниц под 6 разрешений сервиса по поиску домашних питомцев с поиском породы и региона в фильтрах.

посмотреть
Портфолио верстальщика

Иконкаkovroclean.ru

Адаптивная верстка под 2 разрешения лендинга с квизом и таймером обратного отсчета

посмотреть
Портфолио верстальщика

Иконкаdari42.ru

Адаптивная верстка под 4 разрешения интернет-магазина подарков.

посмотреть
Портфолио верстальщика

Иконкаремонт-в-ванной.рф

Адаптивная верстка под 2 разрешения объемного лендинга с мини квизом, аккордионами и картой

посмотреть
Портфолио верстальщика

Иконкаsite.ru

Адаптивная верстка под 2 разрешения лендинга с подключением отправки заявки на почту

посмотреть
Портфолио верстальщика

Иконкаksk-biz.ru.ru

Адаптивная верстка под 2 разрешения лендинга с анимированными элементами, интеграция с AmoCRM

посмотреть
Портфолио верстальщика

Иконкаsite.ru

Адаптивная верстка обучающего интерфейса под 4 разрешения

посмотреть

Мои отзывы

Дмитрий Гречишкин

Дмитрий Гречишкин

неделю назад

Узнал про Андрея банально полопатив интернет и внимательно изучив работы.

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

Понравилось при работе с Андреем, что не было "воды" в общении, максимально быстро, максимально профессионально, задача поставлена - задача выполнена)

Аватар

Игорь Мисюров

2 дня назад

Выбрал Андрея среди других потому что понравился сайт и описание.

Сомнений перед обращением не было, потому что предоставил 2 блока страницы до оплаты работ.

Понравилось что делаете правки пока все не получиться, три дня делали фильтры и каждый день предлагали решение.

Иван Кунин

Иван Кунин

2 месяца назад

Верстает быстро и качественно, ещё и цены более чем адекватные.

Прям, сильно благодарен за качество и скорость работы.

Ваше имя

Сегодня

Ваш отзыв

5 причин
заказать у меня верстку

1

Расчет стоимости
и сроков перед
началом работы

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

2

Штраф 25%
от заказа
за просрочку

Я понимаю неприятно и затратно, когда дела идут не по плану. Поэтому при условии внесения всех необходимых материалов (шрифтов, макетов, полного ТЗ) и без внесения дополнительных работ или правок в ТЗ и макет после начала работ, я снижаю стоимость заказа на 25% в случае срыва сроков.

Если условия не выполняются штраф аннулируется.

3

На связи
14 часов в сутки
7 дней в неделю

Чтобы не беспокоиться и узнать как продвигается работа, не нужно ждать несколько часов, по запросу я выгружу результат работы на текущий момент на хостинг в течении 10 минут, если это не раньше 6 утра и не позже 8 вечера по Москве.

4

Лично
выполняю
всю работу

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

Все правки не входящие в первоначальную стоимость оплачиваются дополнительно.

5

Не беру в работу
больше 2 заказов
в одно время

Моя практика показывает, что если брать больше 2 заказов в одно время то снижается продуктивность и качество работы. Это может вылиться в плохое впечатление от работы со мной, нервный срыв и плохо поддерживаемый код.

Моё окружение

Основные инструменты (для клиентов)

HTML 5

HTML 5

Король верстки, каркас будущей страницы из семантических тегов

CSS 3

CSS 3

Королева верстки, благодаря ей можно заливать фоны градиентом, делать тени, подключать и задавать шрифты и даже делать не большую анимацию

JavaScript

JavaScript

Главный маг и чародей верстки, делает то на что HTML и CSS не способны, например 3D модели на сайте, абсолютно любую анимацию к примеру сладеры, молниеносные переходы по страницам без перезагрузки, специальные калькуляторы для сайтов, личные кабинеты с верификацией, онлайн чаты в реальном времени. Но в браузере он ничто без HTML и CSS.

Сборщик Gulp (для программистов)

Browser-sync

Browser-sync

Для чего:
Для автоматической перезагрузки страницы при сохранени скриптов, стилей и html

Babel

Browser-sync

Для поддержки старых браузеров 6 и 7 спецификаций JavaScript

SASS

Browser-sync

Для упрощенного и быстрого написания стилей

Autoprefixer

Browser-sync

Для автоматического добавления кроссбраузерных префиксов

БЭМ

Browser-sync

Способ написания стилей, с восможностью переиспользования в будущем.

Сoncat

Для обьедиения стилей и скриптов по одному файлу

Uglifyjs

Для сжатия скриптов

Cssnano

Для сжатия стилей

Графические редакторы (для дизайнеров)

Photoshop

Browser-sync

Figma

Browser-sync

Adobe XD

Browser-sync

Sketch

Browser-sync

Zeplin

Browser-sync

Adobe Illustrator

Browser-sync

Сетки (для дизайнеров)

Flexbox Grid

Bootstrap

Любая другая, с вашими разрешениями и количеством колонок

Полный процесс работы

Требования к макету

  • Текст должен быть текстом, а не картинкой.
  • Если делаете по сетке и знаете что это такое, то не выходите за пределы предпоследних направляющих по бокам, это частая ошибка.
  • Никаких лишних слоев, они могут сбить с толку.
  • Приложить шрифты к макету.
  • Иметь слои для кнопок, ссылок для состояния при "наведении"
  • Выделять цветом папки с всплывающими окнами
  • Приготовить папку с картинками доступными в формате SVG

На досуге я пишу статьи для клиентов, чтобы вас не обманули.

Адаптивная верстка

Как за 3 минуты проверить сайт на адаптивную верстку

Время прочтения: ~2 минут

Прочитать

Pixel Perfect

Как проверить верстает ли верстальщик пиксель в пиксель

Время прочтения: ~2 минут

Прочитать

Экономия

Как сэкономить на верстке или как составить тз на верстку

Время прочтения: ~2 минут

Прочитать

Молния

Как проверить отмизирована ли скорость загрузки сайта

Время прочтения: ~2 минут

Прочитать

Browser Mozilla Browser Chrome Browser Safari
Browser Yandex Browser Opera Browser Edge

Что такое кроссбраузерная верстка и как проверить

Время прочтения: ~2 минут

Прочитать

Можете задать вопросы в реальном времени

Оставаясь на сайте вы соглашаетесь с условиями пользования сайта

Политика конфиденциальности сайта

Данная Политика конфиденциальности применима к данному Сайту. После просмотра данного Сайта обязательно прочитайте текст, содержащий политику конфиденциальности используемого сайта. В случае несогласия с данной Политикой конфиденциальности прекратите использование данного Сайта. Заполнив любую из форм и используя данный Сайт, Вы тем самым выражаете согласие с условиями изложенной ниже Политики конфиденциальности. Сайт охраняет конфиденциальность посетителей сайта. Персональная информация Для того чтобы оказывать вам услуги, отвечать на вопросы, выполнять ваши пожелания и требования требуется такая информация, как ваше имя и номер телефона. САЙТ может использовать указанную информацию для ответов на запросы, а также для связи с Вами по телефону с целью предоставления информации о предлагаемых САЙТ услугах и рекламных кампаниях. При поступлении от вас обращения в виде отправки любой заполненной на сайте формы САЙТ может потребоваться связаться с Вами для получения дополнительной информации, необходимой для вашего обслуживания и ответа на интересующие вопросы. САЙТ обязуется не передавать данную информацию третьим лицам без Вашего разрешения, за исключением информации, необходимой для выполнения вашего обслуживания. Со своей стороны, Вы предоставляете САЙТ право использовать любую сообщѐнную Вами информацию для выполнения указанных выше действий.

Безопасность

Передача персональных данных в любой форме (лично, по телефону или через Интернет) всегда связана с определенным риском, поскольку не существует абсолютно надежных (защищенных от злонамеренных посягательств) систем, однако САЙТ принимает необходимые адекватные меры для минимизации риска и предотвращения несанкционированного доступа, несанкционированного использования и искажения Ваших персональных данных. Несовершеннолетние САЙТ не принимает никакой информации от лиц моложе 18 лет без согласия их родителей или законных опекунов. Кроме того, лица моложе 18 лет не могут совершать каких-либо покупок или иных юридических действий на данном Сайте без согласия родителей или законных опекунов, если это не допускается законодательством Российской Федерации.

Модификация

САЙТ имеет право изменять данную Политику конфиденциальности, изменять и корректировать условия доступа или запрещать доступ к сайту, а также изменять его содержание в любое время без предварительного уведомления.

Сайт ни при каких обстоятельствах не является публичной офертой.