Ярослав Жук

Обо мне

Я веб-разработчик. Это значит, что я забочусь о том, чтобы вёрстка сайта не разъезжалась в браузерах и сайт выглядел красиво не только снаружи, но и внутри. Моими инструментами являются HTML, CSS и Java Script. Когда мне надоедают цифры, я могу открыть Photoshop или Illustrator, чтобы нарисовать изображения, например, для этого сайта.

С чем мне приходилось работать:

  • написание брифа и технического задания по веб-ресурсу;
  • составление проектной документации, регламентирующей сроки, состав и калькуляцию работ;
  • прототипирование интерфейса, разработка информационной архитектуры веб-ресурса;
  • навыки владения программами проектирования (Balsamiq, Mockingbird);
  • опыт работы с модульными сетками;
  • Adobe Photoshop (уровень изготовление дизайн-макета с учётом вертикального ритма и модульной сетки сайта);
  • Adobe Flash (уровень изготовления анимированных баннеров);
  • Adobe Illustrator;
  • HTML5 (максимальное использование возможностей поддерживающихся в браузерах, кроссбраузерный и кроссплатформенный код);
  • CSS (препроцессоры: Sass/SCSS, LESS, фреймворки: Compass, Bootstrap, Foundation) (максимальное использование возможностей поддерживающихся в браузерах);
  • модульная структура кода (БЭМ);
  • использование резиновой и адаптивной вёрстки в проектах;
  • вёрстка e-mail рассылок;
  • JavaScript(ванильный JavaScript, jQuery, Handlebars, React);
  • Haml, Pug(Jade);
  • XSLT;
  • Template toolkit;
  • Git;
  • Сборщики: Grunt, Gulp, Webpack;
  • Jira, Bacecamp;
  • пользователь MAC;
бревно

План

Первый этап разработки. На этом этапе разрабатывается Информационная архитектура сайта. Для создания прототипов я использую balsamiq либо mockingbird. Эти ресурсы помогают мне реализовать даже некоторую интерактивность в прототипах, что существенно облегчает восприятие заказчиком материала. Это самый важный этап разработки, качественно продуманная архитектура может обезопасить от возникновения ошибок в последующем использовании проекта.

ведро, кисть, пергамент

Дизайн

На основе утверждённых прототипов и технического задания разрабатываются дизайн-макеты веб-сайта. В процессе работы над дизайном я прохожу следующие этапы:

  • собираю все элементы воедино и воплощаю идею будущего сайта;
  • выбираю подходящие цвета и составляю общую цветовую палитру;
  • создаю макеты на основе модульной сетки;
  • тестирую и подбираю подходящие шрифты и утверждаю типографику;
  • оживляю веб-сайт изображениями и фотографиями;
мореПлот

Вёрстка

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

  • валидные HTML и CSS;
  • отделение структуры от представления;
  • блочная вёрстка (таблицы используются только для представления табличных данных);
  • вертикальный ритм в типографике;
  • семантически правильная разметка и кросс-браузерный код;
  • проверка Accessibility и анализ Usability сайта;
  • отсутствие орфографических и пунктуационных ошибок на сайте;

Пример вёрстки анимированного плота