Ирина Мозес застала появление Arpanet и победу СССР над США в баскетбольном олимпийском турнире. Уже больше 30 лет она занимается программированием, но веб-разработку начала изучать только 5 лет назад. Сегодня Ирина работает ревьюером в крупной компании, а её упорству и интересу к жизни можно только позавидовать.

Ирина, обучаться в HTML Academy вы начали с курса по JavaScript. Почему пропустили курс по вёрстке?

Дело в том, что я изучала HTML и CSS в Университете ИТМО. Там читал курс лекций Александр Першин (генеральный директор HTML Academy — прим.), от него я и узнала про компанию и про ваши курсы. Так что решила после ИТМО сразу пойти на «Профессиональную разработку веб-интерфейсов» именно в Академию.

А чем занимались до курсов?

До курсов я была репетитором по информатике и программированию, но с веб-разработкой никогда не соприкасалась. А вообще, заканчивала математический факультет УрГУ (Уральский государственный университет им. А. М. Горького — прим.) и с тех пор связана с программированием. Сначала была инженером-расчётчиком на Уралмаше (машиностроительное предприятие в Екатеринбурге — прим.), работала со сложными математическими формулами. А в 2001 году я перешла на Екатеринбургский почтамт и 10 лет занималась базами данных, софт-обеспечением. Например, разрабатывала программы для сортировки посылок. Кстати, почта — это не такое отсталое хозяйство, как некоторые представляют. Даже 20 лет назад в любом филиале у каждого оператора был свой рабочий компьютер. Да, не всё железо было современным, но технологии уже на тот момент были передовые — например, денежные переводы Western Union.

Почему вы решили заняться веб-разработкой?

Это современно. По-моему, сейчас не знать, как устроен интернет, значит не знать, как устроена сама жизнь. Потому что жизнь в конечном счете заключается в обмене информацией. Мой сын — программист, тоже связан с базами данных. Я вижу, как он работает с интернетом, ищет там что-то, устанавливает. Вот, например, он установил какой-то Kerberos для домашней сети. А я думаю: почему я не понимаю? Плюс всё общение сейчас в основном по сети. Мне мешало, что я не знаю, как происходит это общение. Вот и решила исправить. Программирование я всегда любила, теперь стала просто разбираться в новой области. 

Не знать, как устроен интернет, значит не знать, как устроена сама жизнь.

Было сложно проходить курс?

Одни знакомые говорили, что тема — легкота, другие — что там надо подумать. Мне было трудно, причём я его закончила не сразу. В первый раз помешали семейные обстоятельства, поэтому под конец пришлось бросить. Но я пошла на новый поток. Притом работала уже над другим проектом примерно по 3 часа в день. Так что, можно сказать, я хоть и один курс закончила, но два раза. Это тоже сказалось на знаниях: думаю, они у меня более глубокие.

Правда мне, как новичку, было трудно формулировать вопросы наставнику. Но, конечно, наставник мне очень помогал. У нас и общение было не только письменное, но и устное.

Как вы справлялись с трудностями?

А сложности меня совсем не пугают. Я просто сижу и разбираюсь. Сейчас же есть интернет. Это 20 лет назад были проблемы с тем, чтобы что-то найти. А сейчас это намного проще. К тому же мне интересна эта область, поэтому я не боялась пробовать, искать.

А что говорили окружающие?

Когда только начинала, говорили: «Зачем тебе это надо? Лучше бы пошла в лес погуляла!» Но, честно сказать, это устаревшие взгляды какие-то. Зато сейчас говорят, что я молодец. И все поддерживают.

Когда только начинала, говорили: «Зачем тебе это надо? Лучше бы пошла в лес погуляла!»

Надо и их тоже вести за собой в веб-разработку!

Кстати, да! Друзья со студенческих времён у меня математики. Надо спросить, может, кому пригодится. Вообще, цифры в паспорте не всё определяют. Очень много взрослых людей учатся, проходят курсы. Например, руководители, которые хотят хорошо понимать, что делают их подчинённые.

Цифры в паспорте не всё определяют

Кто-нибудь помогал вам проходить курс? Вот сын у вас тоже программист.

Сын мне немного помогал с вёрсткой в тестовых заданиях. Он знает Figma, поэтому мог мне что-то подсказать. А вообще, сказал, чтобы я шла в бэкенд, потому что во фронтенде ещё всякие «финтифлюшки» нужны, чтобы интерфейс работал при всех непредсказуемых действиях пользователя и при этом был «дружественным» к нему. Так, возможно, и есть: во фронтенде ещё больше логики, как мне теперь уже кажется.

Ирина, вы сейчас зарабатываете на веб-разработке?

Да, трудоустраиваться я начала где-то с лета 2019 года, то есть спустя 3 года после окончания курса по JavaScript. Центр Карьеры предлагал вакансии, для которых я делала тестовые задания.

Сначала я целых полгода выполняла одно объёмное тестовое от фирмы в Екатеринбурге, где как раз я живу. Но это было просто для себя, хотелось набить руку, посмотреть, какие задания вообще предлагают компании. А со второй половины 2019 года я уже отправляла выполненные тестовые задания. На моё творчество две компании не ответили, зато откликнулся «Яндекс. Практикум». Потом я выполнила для них ещё несколько тестовых, и в январе 2020 года меня взяли ревьюером. Сейчас проверяю там текущие и дипломные работы студентов на курсах по JavaScript и React.

А почему вы начали искать работу только спустя 3 года после окончания курса?

Я занималась самообразованием. Вникала в JavaScript ещё глубже, проходила другие курсы. Вообще, мне хотелось узнать весь процесс создания сайтов. Не только фронтенд, но и бэкенд. Поэтому я решила познакомиться даже с PHP. 

А что вы читаете или смотрите по веб-разработке?

Я больше читаю официальную документацию. Например, по JavaScript доверяю MDN. Иногда в интернете увидишь статью, и кажется, что она хорошая. А потом вчитаешься и понимаешь, что там ерунда. А в MDN, может, и не всё есть, но хотя бы правда написана. 

Ещё для этого подходит сайт с лекциями по JavaScript Ильи Кантора. Ну а потом всё-таки надо переходить в MDN, на строгую документацию. Кстати, когда я только начинала, я читала именно Илью Кантора. 

Ну и если возникает какой-то вопрос, его всегда можно обсудить с коллегами-ревьюерами.

В прошлом году вы собирались освежить знания по HTML и CSS и пройти у нас курс по профессиональной вёрстке сайтов. Но вы его так и не окончили. Почему?

Да, дело в том, что меня тогда как раз пригласили на работу, и я подумала, что всё просто не успею. Потому пришлось приостановить обучение.

Получается, вам понравилась веб-разработка и вы довольны своей работой сейчас?

Конечно! Студенты, чьи работы я проверяю, мне пишут: «Ирина, ты клёвая!» Все думают, что мне лет 25-27, а я никого в этом и не разуверяю. 

Здорово, когда со студентами на одной волне! Спасибо, Ирина, удачи вам!

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

Резюме и ответ на тестовое задание — первое, что работодатель получает от кандидата. Если на этом этапе что-то не так, до собеседования дело не доходит. Только кандидату не всегда сообщают, в чём конкретно проблема.

Мы попросили наших студентов, выпускников и подписчиков поделиться воспоминаниями о том, как они искали работу. Спустя месяцы кто-то так и не понял, почему его или её не пригласили на собеседование, — остались догадки и вопросы. Мы показали эти истории тем, кто нанимает разработчиков, и получился целый диалог — теперь на все ситуации можно посмотреть с обеих сторон. Каждый пункт прокомментировали технический директор HTML Academy Алексей Малейков и HR фронтенд-аутсорса «Лига А.» София Петлякова.

В итоге получился список советов и для соискателей, и для работодателей.

Отклик на вакансию

Мне вообще не отвечают

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

Я чувствовал разочарование и непонимание: почему нет ответа на отклик? Я считаю, если человек откликнулся, а его резюме просмотрели, то нужно ответить с пометкой «не подходите по вакансии», «отказано», «резюме не для этой вакансии» и т.д. — то есть да или нет. А просмотр без ответа я считаю странным.

Дмитрий, студент 

Отсутствие ответа на отклик — это своего рода дурной тон. Даже если большой поток откликов уже обработан, назначены собеседования, остальным всё равно надо ответить, что работодатель сейчас не может ничего предложить и набор уже не проводится. В таких случаях есть заготовленные ответы, и нет ничего сложного в том, чтобы успокоить человека. Со стороны соискателя тоже нормально напомнить о себе. Письмо может затеряться, работодатель может быть занят. Так что напомнить о себе через пару дней — вполне норма. Работодатель увидит, что человек заинтересован и хочет работать именно у него.

Алексей Малейков

Отказали после просмотра резюме

Кто-то считает, что в резюме надо расписать все свои (или не совсем свои) лучшие качества и рассказать обо всём, что он когда-то делал. Мало ли что пригодится! Но работодатели смотрят на это по-другому и могут отказать, даже не предложив выполнить тестовое задание. 

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

Анна, выпускница

Мы отказываем, когда понимаем, что не сможем дать кандидату то, на что он рассчитывает: определённый уровень или разнообразие задач, график работы, заработная плата. Ещё влияет содержание или отсутствие сопроводительного письма. Или явное понимание того, что человек не сможет разделить наших ценностей и корпоративной культуры. 

Если человек решил поменять сферу деятельности, то не стоит указывать весь опыт работы, связанный с прошлой специальностью. Если опыта нет, то лучше просто ничего не писать. Эту информацию в кратком виде можно написать в раздел «О себе» и объяснить причину смены профессии.

София Петлякова

Ответили, но прошла куча времени

Компании реагируют на отклики по-разному: кто-то через пару дней, некоторые спустя пару недель. Но иногда это занимает намного больше времени. Вот, что рассказали подписчики Академии.

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

Некоторые работодатели мне до сих пор не отвечают, спустя год. Одному из них я даже написал: «Вы ещё не проверили моё тестовое задание?». Случился нелепый диалог, человек сказал, что посмотрит тестовое сегодня вечером, и на этом опять тишина.

Вячеслав, выпускник

Оптимальный срок для ответа — два-три рабочих дня. Конечно, в разных компаниях процессы устроены по-разному, но отвечать человеку спустя месяц — странно. За это время в компании может что-то поменяться, сам человек уже может передумать или устроиться на другое место. Может быть простительна неделя, максимум две. А когда ответы приходят через месяц, закрадываются сомнения: а работа тоже построена так, с задержками и проблемами? В серьёзных структурах, компаниях могут проводиться дополнительные проверки, например, службой безопасности, что может повлиять на скорость ответа, но обычно это происходит уже на следующих этапах.

Алексей Малейков

Почему я должен редактировать резюме под каждую компанию?

Кто-то готовит универсальное резюме и пишет там о себе всё, что может пригодиться. Это удобно: можно отправить одно и то же резюме в разные компании, никто об этом не узнает, а работодатель сам разберётся, что из фактов ему важно. Только информация, подходящая для одной вакансии, не всегда годится для другой.  

В резюме я кратко пишу о себе: что умею (2-3 пункта, самых значимых по моему мнению), причина, по которой хочу поменять работу, почему мне понравилась вакансия и чем я могу быть им полезна. В разные компании отправляю одно и тоже резюме, но графу «О себе» немного меняю под вакансию или компанию.

Анна, выпускница

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

Алексей Малейков

Когда человек откликается, например, на вакансию менеджера проектов, а в шапке написано «QA Engineer Junior», это вызывает вопросы и создаёт впечатление, что человек ещё не определился с выбором.

София Петлякова

Что запомнить

Кандидатам

• Если через пару дней вам не ответили на отклик, напомните о себе. Это нормально, и никто вас за наглость не поругает. Возможно, первое письмо просто не дошло или за другими делами работодатель забыл про вас. 

• Составьте резюме в официально-деловом стиле. Покажите, что вы умеете вести деловую переписку. 

• Опишите только тот опыт, который относится к должности.

• Резюме под конкретного работодателя можно не менять, если добавить сопроводительное письмо, где написано, почему должны взять именно вас. Только не забудьте указать в резюме правильную должность.

Эйчарам

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

• Даже если у кандидата мало опыта, но этот опыт релевантный, а само резюме составлено и оформлено грамотно, человеку можно дать шанс пройти следующий этап. Особенно если кандидат чётко указал, чем он может быть полезен и почему хочет у вас работать.

Заметка на полях: нужно ли делать резюме красивеньким?

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

Я составлял своё резюме в Word. Думаю, что работодатель не обращает внимание на оформление. Главное — чтобы оно было аккуратно составлено.

Антон, выпускник

Сейчас есть много разных инструментов, чтобы сделать красивую pdf. И хорошо, если человек инвестировал немного времени в своё же устройство и грамотно оформил резюме. Работодатели обычно не сильно придираются к внешнему виду резюме, ведь важно содержание. Но если документ собран нелепо, осадок может остаться.

Алексей Малейков

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

София Петлякова

Тестовое задание

У меня есть портфолио, зачем тестовое задание?

Некоторые не понимают, зачем вообще выполнять какие-то задания, если похожие примеры есть в портфолио.

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

Марина, выпускница

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

Иметь портфолио — это плюс, но оно может и сыграть злую шутку. Однажды в чьём-то портфолио я смотрел проект, где адаптивное меню разваливалось на маленьком экране — галочка в графе «Против». Поэтому кандидатам обязательно нужно проверять, что в портфолио действительно хорошие примеры. И ещё портфолио должно быть актуальным. То есть давая ссылку на сайт, надо убедиться, что там по-прежнему ваша вёрстка, а не уже что-то другое. И наконец, работодатель не знает, человек делал весь проект из портфолио или только какую-то часть. А может, это вообще чужая работа. Чтобы убедиться, что у кандидата есть нужные навыки, и предлагаются тестовые.

Алексей Малейков

Не хочу тратить много времени на тестовое задание

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

Я отказывался выполнять тестовое задание, если по объёму оно занимало более 20 часов и выглядело как вполне реальная задача (например, сделать полноценную галерею или Masonry сетку). Создаётся впечатление, что хотят сделать реальную работу бесплатно.

Константин, подписчик

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

Даже для работодателя невыгодно давать сверстать целый макет: проверять его слишком долго. Это большая затрата времени для всех. Оптимальное тестовое задание должно выполняться не больше четырёх часов.

Алексей Малейков

Не хочу бесплатно делать для вас работу

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

Некоторые тестовые задания были очень объёмными, и я спрашивал, будут ли они оплачиваться. Мне отвечали отказом, и я их просто не выполнял. 

Александр, выпускник

С одной стороны, любой труд должен оплачиваться. Но если задание занимает не больше четырёх часов, то особо и оплачивать здесь нечего. Если работодатель даёт большое задание, которое выполняется два-три дня, то это уже полноценная работа. И если у соискателя возникает вопрос об оплате, значит, объём тестового задания слишком большой.

Алексей Малейков

Моё тестовое украдут и используют без спроса

Самый лёгкий путь для работодателя — дать в качестве тестового реальный проект. Обычно это большое задание, и кандидаты начинают спрашивать: будут ли использовать их решение, заплатят ли им. Многие даже не берутся выполнять такое задание. Другое дело — дать небольшие задачи по мотивам настоящих проектов или вообще полностью выдуманную штуку, которая не имеет ничего общего с работой компании.

В качестве тестового задания мне предложили сверстать всю главную страницу макета, включая меню на JavaScript и попап. Из-за большого объёма, появилось подозрение, что это реальный проект. Когда я спросил руководителя, так ли это, он ответил: «А что, бывают тестовые не по реальным проектам?»

Александр, выпускник 

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

Алексей Малейков

Прислали отписку вместо подробного ответа на тестовое

Обратная связь на тестовое задание тоже может удивить. Бывает, её просто нет. А иногда она шаблонная, и невозможно понять, что именно не понравилось нанимателю.  

Мне приходила обратная связь, но очень служебная, типа: «Сделанное тестовое задание не на том уровне, на котором мы ожидали». То есть текст, который отправляют всем. И никакой конкретики нет. Чего они ожидали? Какие проблемы?

Александр, выпускник

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

Ещё хорошо отметить, в чём сильные стороны кандидата, а что необходимо подтянуть или изучить. Если по какой-то причине работодатель так не сделал, то стоит проявить активность и запросить этот фидбек. В этом нет ничего такого. Эта информация 100% будет полезна для кандидата и его дальнейшего развития.

София Петлякова

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

Не утверждаю, что все советы из этой статьи подходят всем без исключения, но что-то наверняка пригодится. В конце концов, даже самые опытные из нас когда-то впервые искали работу, а любой синьор однажды проваливал двоичный переворот сине-чёрного дерева пузырьком. Вместе с «Центром карьеры» HTML Academy мы решили в этом помочь и собрали для вас полезные советы. 

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

Напишите, кто вы

Если вы ищете работу в России, то имя и фамилия должны быть заполнены по-русски. 

Укажите место проживания. Эта информация важна, чтобы работодатель понимал, сможете ли вы ходить в офис, или в каком часовом поясе вы находитесь, если работа удалённая. Явно укажите, готовы ли вы работать удалённо или рассматриваете только офис. Если готовы переехать — так и напишите.

Отсутствие даты рождения — не ок. Рекрутёр всё равно сможет предположить ваш возраст по дате окончания вуза или по стажу работы и, вероятнее всего, отложит резюме в папку “отказать”.

Загрузите фотографию

По этому пункту много споров — некоторые говорят, что фотография ни на что не влияет и в иностранных компаниях это необязательный пункт. Тем не менее в российских компаниях на наличие фотографии чаще всего смотрят. Её присутствие говорит о том, что человек себя не скрывает и готов заявить о себе заочно. 

Есть несколько правил к фото в резюме:

• не должно быть лишних людей, 

• желательно на однотонном фоне

• в меру строго и с улыбкой. Когда кандидат доброжелателен на фотографии, это притягивает. 

Определитесь с должностью

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

• HTML-верстальщик

• Фронтенд-разработчик

• РНР-разработчик

• Веб-разработчик

Если вы ищете работу продавцом утюгов и одновременно фронтенд-разработчиком, то создайте отдельное резюме для каждой должности. Объединять не стоит — если кандидат сам не может понять, чем он хочет заниматься, то и работодатель вряд ли станет тратить на это время.

Напишите, сколько хотите денег

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

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

Вспомните всё, что было похоже на опыт

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

Например, прохождение стажировки в настоящей компании тоже считается опытом, даже если денег за это не платили. 

Если начинаете карьеру в новой сфере, укажите только последнее место работы и подробно распишите ваши успехи и достижения. О нерелевантном опыте можно кратко написать в разделе «О себе». Например, что пасли бобров, а теперь хотите работать тимлидом.

Рассказывает Екатерина Новографская, HR-менеджер компании iBrush:

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

И нетленная классика: выберите адекватное фото, где вас хорошо видно, добавьте рабочую почту (немного странно отправлять предложение о работе на почту kiska94735@mail.ru), перечислите списком ваши навыки. И не забудьте написать пару слов о себе: чем увлекаетесь, какие у вас интересы и цели. Также можете указать нюансы, касаемые графика работы, если имеются.

Расскажите о себе

Этот раздел важно заполнить правильно, если совсем нет опыта работы. Здесь важнее то, чего вы хотите достичь, чем то, что уже было.

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

Напишите, что умеете из новой профессии

Укажите основные технологии которыми владеете и пользуетесь в работе. Не указывайте то, что только планируете изучить. 

Например, средняя вакансия для верстальщика выглядит так:

• Умеет делать адаптивную кроссбраузерную оптимизированную вёрстку, совместимую с современными браузерами. В вёрстке использует SVG.

• Идеально знает CSS. Использует препроцессор Sass. Знает флексы. Умеет делать CSS-анимации и использует БЭМ. Знает библиотеку Bootstrap.

• Знает HTML. В работе использует Canvas. Шаблонизирует HTML с помощью PUG.

• Использует Git. Умеет работать в GitHub.

• Может натянуть вёрстку на CMS: Bitrix и Wordpress.

• JavaScript пишет с помощью jQuery, но не чурается ES6.

• Умеет автоматизировать свою работу с Node.js, npm-скрипты, Autoprefixer, Gulp или Webрасk.

• Уверенно владеет Photoshop и Illustrator или знает Figma или Sketch.

• Имеет своё портфолио, инициативный, готов пройти испытательный срок

Конечно, для новичка здесь много непонятных слов и аббревиатур. Ничего страшного. Предположим, вы уже неплохо знаете HTML и CSS, работали с SVG и немного понимаете, как устроен JavaScript. Значит эти навыки и нужно указать, а некоторые пункты, о которых только слышали, перенести в план развития (тем более, выучить их всё равно придётся).

Рассказывает Назир Хасавов, основатель и арт-директор Студии NKH

Очень важен опыт вёрстки. Даже если человек только прошёл курсы, то можно указать в резюме учебные проекты. И обязательно прикладывать ссылки на GitHub и GitHub Pages, чтобы можно было посмотреть на код. Также важно запомнить, сколько времени ушло на проект такой сложности.

Для джуна важно развивать софт-скиллы — умение общаться и работать в команде. Технические пробелы всегда можно подтянуть, но если с человеком тяжело общаться, то далеко на такой телеге не уедешь. Поэтому хорошо бы чуть чуть рассказать о себе. Конечно, краткое описание в полной мере не раскроет человека, но небольшой спойлер уже будет. Часто на собеседованиях умение общаться бывает важнее технической части.

Напишите, где учились

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

Хороший объем — две страницы А4

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

Заполненное резюме должно занимать не больше двух страниц (представьте, что его нужно распечатать с двух сторон листа на А4, как раз поместится). Постарайтесь кратко и ёмко изложить всю необходимую информацию. 

Напишите хоть какое-нибудь сопроводительное

Хорошее сопроводительное письмо — суперсила. «Здравствуйте, прошу рассмотреть моё резюме на вакансию» — тупик.

Сопроводительное письмо должно дополнять резюме, а не копировать его. В идеальном мире в каждую компанию пишут своё письмо. Да, это требует больше времени, но это поможет обратить на себя внимание рекрутёра. Напишите, чем вас заинтересовала вакансия, и чем вы можете быть полезны компании. Только не «помогу приблизить светлое будущее», а «сверстаю лендинги, чтобы они нормально выглядели на телефонах»

Перед отправкой отклика проверьте всё спеллчекером — они сейчас встроены даже в браузер, так что просто не забудьте.

95% выпускников профессий HTML Academy устраиваются на работу не только из-за хорошего резюме. Они учатся профессиональной вёрстке и программированию, прокачивают скорость работы в Акселераторе и проходят оплачиваемую стажировку в «Лиге А.». Ещё мы помогаем выпускникам найти работу даже в небольших городах — то есть делаем всё, чтобы студенты могли заниматься новым любимым делом. Присоединяйтесь, старт профессии «React-разработчик» — 27 апреля.

Как составить резюме, если нет опыта работы

1. Честно напишите, кто вы — имя, возраст, город

2. Фотка с улыбкой — сила

3. Должность должна быть одна. Никаких «маркетолог-мясник»

4. Напишите, сколько хотите денег. Даже если сумма с потолка

5. Если нет никакого опыта, сгодится любой похожий

6. План развития важнее пятёрок в школе

7. Чем больше навыков совпадёт с вакансией, тем лучше. Остальное пойдёт в план развития

8. Образование важнее, чем кажется, но не критично

9. Не больше двух страниц на всё (но растягивать и лить воду тоже не нужно)

10. Сопроводительное письмо помогает. «Прошу рассмотреть резюме» — нет

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

Верстальщик — такой человек, который хорошо разбирается в HTML и CSS и немного знает JavaScript. Ну то есть понимает, как в целом всё работает, но сильно не погружается. При этом бывает непросто выбрать хорошего верстальщика, потому что всех учат по-разному.

Чтобы решить эту проблему, собираем в одном месте опыт десятков собеседований с верстальщиками. Вместе с Дашей Владыко из фронтенд-аутсорса «Лига А.» рассказываем, на что смотреть в тестовом задании джунов и мидлов, и как отличить хороший результат от плохого. Плюс несколько практических советов — например, как выбирать плагины.

На что смотреть в целом

Соответствует ли результат ТЗ? Всё работает? Всё заверстано? Джуну прощаются мелкие недочёты, но он хотя бы показывает что хотел сделать как можно лучше, просто пока не хватает практики. Если сделано спустя рукава, то это тоже видно.

Пример: сверстать «аккордеон»

Соответствие ТЗ: аккордеон завёрстан по макету, нет ошибок в HTML. JavaScript написан без onclick, код для аккордеона можно переиспользовать на других страницах и блоках.

Если аккордеон завёрстан, но при нажатии на кнопку ничего не происходит, то не работает. Для мидла это минус, джуну можно простить, если к внешнему виду и семантике не подкопаться. Джуну также прощается, если JavaScript есть, но в семантике есть ошибки или результат немного не соответствует макету (другие отступы, например, или забыл про уголки).

Предусмотрено ли переполнение? Сильно ли едет макет при добавлении или удалении элементов? Можно ли ввести 4 строки, если в дизайне нарисовано 2? Предусмотрены ли максимальные и минимальные размеры?

Мидлы обычно предусматривают ситуации, когда сайт нуждается в доработке или клиент попросит что-либо поменять. При продуманном переполнении верстка не едет.

Столько плюсов каждому по нраву

Как оформлена сборка? Есть readme? Запускаются таски из gulp? Такие мелочи показывают, есть ли у человека опыт в разработке. Обычно, когда сверстаешь пару проектов, учишься наводить порядок в файлах и умеешь работать с таск-менеджерами. В идеале нужна чистая сборка: всё разложено по папкам, комментарии убраны, лишних файлов нет.

Выделяются ли компоненты? Проект у мидла — «конструктор», где блоки можно менять местами и ничего не ломается.

Как подключаются скрипты и стили? Есть ли инлайн? Есть ли onclick="" или style=""? Джуну какие-то вещи простить можно, мидлу нет.

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

Как реализованы ховеры и адаптив? Это не обязательно, но будет плюсом, показывает опыт и аккуратность. Сразу видно, как человек импровизирует, так как в макете не рисуются разные состояния кнопок. Хорошая импровизация показывает, что человек может заморочиться и сделать «вау» потому что ему хочется так сделать, а не потому что так сказал босс.

Ховеры на сайте «Лиги А.»

HTML

Что с семантикой? Есть ли header/main/footer? Правильно ли построена разметка по макету?

Правильная ли вложенность? Есть ли лишние обёртки? Здесь сразу видно опыт — у новичков бывает много лишних дивов.

Как вставлены картинки? Предусмотрены ли webp и ретина?

Как оформлены векторные элементы? Вектор это точно SVG, а не PNG? В тестовом задании мы обращаем внимание на сжатие SVG (вручную или через таск-менеджеры) и как элементы вставлены в разметку (лучше всего использовать спрайты для иконок, а не псевдоэлементы или img).

Вот что может случиться, если не подумать о графике заранее:

Внеклассное чтение:

• Форматы изображений для веба

• Как правильно вставлять SVG 

Как свёрстана форма? Есть ли ховеры и фокусы? Какая кликабельность у элементов? 

• Как правильно настроить размер области клика

Что сделано для обеспечения доступности? Это не обязательно в тестовом задании, но будет плюсом и хорошим знаком. 

CSS

«Прибит» ли футер к низу экрана? Очень практическая штука, которая показывает опыт кандидата.

Как написана сетка?Используются гриды или флексы? Если сетка кривая, то или человеку всё равно, или он ещё джун.

Как подключаются шрифты? Если как-то странно, например, в каждом font-face в качестве шрифтового семейства прописаны montserrat-thin, montserrat-bold вместо montserrat и указания жирности отдельным свойством, то это джун. Используются ли новые свойства вроде font-display или unicode-range? Они не обязательны, но если есть и они действительно там нужны, это плюс.

• Как подключить и оптимизировать нестандартные шрифты

Используются ли препроцессоры? Это необязательно в тестовом задании, но упрощает разработку.

В JavaScript-коде

Эти требования, в основном, для мидлов. Джуну достаточно знаний HTML, CSS и аккуратной сборки проекта.

Есть ли хардкод? Код можно переиспользовать? Его можно прочитать? Проверьте, нет ли «лапши» и переменных типа a или b123. Простые алгоритмы, а не когда функция вызывает функцию функции. Не должно быть названий классов, которые отвечают за стили.

let a = 1
let b = 2

setTimeout(() => {
    [a, b] = [b, a]
    console.log(a) // 2
    console.log(b) // 1
}, 0)

Странный код для обмена значений двух переменных

Какая версия языка используется?Есть ли единообразие? Есть ли такое, что весь проект на ES5, а потом блок на ES6? Обычно это показатель того, что какой-то блок кода писал кто-то другой.

Пример смешивания:

Как разбит код? Это один огромный модуль (плохо) или есть деление на папки и скрипты, где 1 скрипт = 1 задача (хорошо)? Также не должно быть слишком много файлов, а вызов и обработка функции происходит в одном файле, а не в нескольких.

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

const mailRegEx = /[a-zA-Z0-9]{1}([a-zA-Z0-9-.]{1,})?@[a-zA-Z]{1}([a-zA-Z0-9.]{1,})?[a-zA-Z0-9]{1}.[a-zA-Z]{2,}/;
const PHONEMINLENGTH = 18;

const showErrorIcon = (sth) => {
 const input = sth.target || sth;
 const errorIcon = input.closest('.custom-input').querySelector('.custom-inputerror');
 if (!errorIcon.classList.contains('custom-inputerror--shown')) {
   errorIcon.classList.add('custom-input_error--shown');
 }
};

function IsNumeric(sText) {
   var ValidChars = "0123456789.";
   var IsNumber = true;
   var Char;
   for (i = 0; i < sText.length && IsNumber == true; i++) {
       Char = sText.charAt(i);
       if (ValidChars.indexOf(Char) == -1) {
           IsNumber = false;
       }
   }
   return IsNumber;
}

Как выбрать нормальный плагин. Например, мы ищем слайдер и гугл выдал несколько вариантов:

• https://kenwheeler.github.io/slick/

• https://glidejs.com/

• https://swiperjs.com/

Slick требует jQuery, у нас в проекте он не используется. Вычеркиваем.

Смотрим документацию. У glide она подробная, у swiper тоже. Если бы её не было, мы бы вычеркнули один из пунктов.

Переходим на гитхаб, посмотрим, как давно обновляли репозиторий.

• https://github.com/nolimits4web/swiper - 11 минут назад

• https://github.com/glidejs/glide - 23 дня назад

Оба варианты хороши. Если бы последние обновления были 2-3 года назад, мы бы вычеркнули один из пунктов.

Далее смотрим на вес. glide  ~23kb, swiper ~140kb — значит, одно очко за glide.

Зачем нам плагин? У нас большой сайт с кучей анимаций, где нужно сделать слайдер в слайдере с 3D-эффектом перехода? Берем swiper, он как швейцарский нож, в котором есть почти всё. У нас одна страница с простыми переходами? Берём glide, в нём ничего лишнего.

Пример тестового задания

Сверстать макет (тут у каждой компании будет своя ссылка на фигму).

Требования:

• Шапка всегда закреплена, у неё белый фон;

• Фильтр должен сортировать карточки;

• Кнопка «сбросить фильтр» показывается после того, как выбрали что-нибудь;

• Адаптив на своё усмотрение.

• Нельзя использовать jQuery;

• Возможно использование плагинов JavaScript;

• Использование Gulp или Webpack для сборки будет преимуществом.

С таким заданием будет гораздо проще искать фронтендера — хоть джуна, хоть мидла.

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