Дизайн и верстка / HTML Web-верстальщик

Front-end developer Полная занятость

Если в детстве вашими любимыми книгами были всякие энциклопедии, вы мастер раскладывания пасьянсов, обучались игре на каком-либо музыкальном инструменте (ну, кроме треугольника), считайте, что тест на развитие структурного мышления пройден. Осталось уточнить, что вам известно про деланье сайтов и, возможно, именно ваши руки будут приложены к созданию нашего любимого Человече.
Возраст, пол, образование: не важно
Главное:
опыт от года,
отсутствие страха при взгляде на список требований и тестовое задание,
полное выполнение вышеназванного,
уверенность в себе на собеседовании.
Категорически приветствуется:
чувство юмора, здоровый перфекционизм,
знаниеHTML, CSS, JavaScript и чего-нибудь из Ruby, Python, PHP или Perl,
умение читать по-английски и чёткая дикция по-русски,
опыт и/или желание работы в команде.
Помимо этого, станут большим (просто огромным) бонусом знание следующих слов (и, желательно, их значений):
Redmine, Trac, FogBugz, JIRA, Acunote, Мегаплан… Опыт в любой подобной системе станет прекрасным доказательством ваших навыков командной работы.
Git. Или, хотя бы, SVN. И в целом, VCS. ;)
MVC и ООП. Или хоть что-то из двух.
RIA, Comet, Socket. А если Вы написали какое-нибудь RIA самостоятельно, то Вы уже почти приняты.
Веб-фреймворк. В частности, Ruby on Rails, Django, Symfony, Zend — представление о том, как они работают, даёт 100 очков.
JS-фреймворк. Если вы писали что-нибудь сложнее TODO-приложения наSammy.js, Backbone.js, Spine.js, Knockback.js, Broke.js, Fidel.js, Ember.js (SproutCore 2.0), JavaScriptMVC, Ext JS, KnockoutJS, AngularJS, YUILibraryили чём-то подобном, срочно приезжайте. Или мы приедем за вами.
CSS-фреймворк. Blueprint, Compass или Nib станут отличными компаньонами для Вас на собеседовании.
HTML-шаблонизаторы. Haml, Slim, ERB (Erubis), Twig, Smarty, Jinja2, Jade, Moustache, Textile, Markdown… Да даже просто Wiki сослужит Вам хорошую службу.
CoffeeScript. Мы так любим кофе. Чего и вам желаем.
DSL для CSS. Sass, Scss, Less — будет прекрасно понимание механизмов работы mixin, CSS-переменных и прочих кавайных вещей.
Инструментарий JavaScript. jQuery, Prototype или что-то подобное знать настоятельно рекомендуется. Кроме случая, когда Вы — Гуру низкоуровненого JS, и пишете код, совместимый со всеми браузерами, вплоть до Netscape Gold и IE4 включительно.
Node.js. Будет просто круто, если вы писали что-нибудь на нём и наExpress, Geddy, Autodafe или чём угодно схожем. Очень, очень круто.
JSON — нужно понимать его с полускобки. YAML тоже не будет лишним.XML подразумевается. А MessagePack определённо сыграет Вам на руку.
TCP/IP, DNS, HTTP (S), SSH… Нет, сисадмин нам не нужен. :) Но такие знания не будут лишними и для веб-технолога. Как минимум стоит понимать отличия URL от URI и иметь представление о REST.
DOM, XHTML, DHTML. Понимание этих понятий станет таким же существенным плюсом, как и способность назвать 10 отличий междуStrict и Transitional будучи разбуженным посреди дня. Посреди 1 января.
SEO. Ваша великолепная вёрстка должна быть приятна не только людям и валидаторам, но и (а может, и в первую очередь) поисковикам.
Web 1.0/2.0 — знать и понимать, что это такое. Web 3.0 — знать и понимать, что никто не знает, что это такое. Semantic Web — знать и понимать, что это не Web 3.0, но тоже очень важно. А круче всего — иметь собственное мнение по всем этим вопросам.
БЭМ. Или что угодно подобное. Хоть какая-нибудь идеология. А в идеале — своя собственная, любимая, но при этом адекватная.
HTML5. Куда же без него? :) Без него теперь и в дворники не берут.
И самое главное. Никто у нас не знает всего этого одновременно, чего и от вас не требуем. :) Но хотя бы иметь представление, о чём идёт речь в каждом из пунктов очень стоит. Правда. Очень.
А теперь тестовое задание.
Теория
На дворе 2014 год. У вас задание сверстать полный редизайн сайта.
Что такое progressive enhancement и graceful degradation? При чем здесь Modernizr?
Валидно, семантично или работоспособно? Что важнее?
Что такое типографика и зачем она нам сдалась?
Какую вёрстку предпочитаете: табличную, блочную, гибкую, сеточную или что-то ещё?
Float: добро или зло?
Windows, Mac или Linux?
Rebel or Empire?
Практика
Сверстайте резиновый блок с круглыми уголками и с тенью при наведении, чтобы фон страницы можно было менять не трогая блок.
Возможно ли это сделать без картинок? А в IE7? А в Opera 9?
Со звёдочкой: сверстайте пост, оформленный пятью оттенками зелёного (заголовки, текст, фон, автор, дата, рамки — что угодно). Но сделайте это так, чтобы зелёный цвет задавался только в одном месте, и при изменении зелёного на синий в этом месте, все оттенки становились оттенками синего. Sass использовать можно. :) Кстати, шрифт заголовка поста должен быть нестандартным и работать в максимальном количестве браузеров. Никаких картинок, разумеется. Сможете ли вы к такому посту организовать нестандартную рамку с разными уголками, не меняя HTML страницы? В каких браузерах? А без JS?
Со звездищей: напишите чат. Да, вот так просто. Только чтобы он работал на WebSockets, когда они доступны, и откатывался до FlashSockets — когда нет. Никаких фреймов. Серверную часть можно взять любую готовую, но если вы напишете свою на Node.js или EventMachine, то вы просто не оставите нам выбора.
Напишите пример сайта с боковой панелью, которая на мобильном телефоне “уезжает” в подвал (без JavaScript, конечно же)
Напишите команду с использованием jQuery, которая заставит все ссылки, ведушие за пределы сайта, открываться в новой вкладке/окне. Перехода по ссылке при этом быть не должно. А после клика по такой ссылке чтобы рядом с ней появлялась галочка.
Организуйте выпадающее меню без использования JavaScript. Можно ли сделать, чтобы оно появлялось не сразу, а постепенно — через прозрачность, и если да, то где это может работать?
Создайте сайт из трёх страничек, переход между которыми не вызывает перезагрузку страницы. Данных должно передаваться как можно меньше. А URL при переходе — меняться, и при заходе на любой из них, пользователь должен попадать туда, куда намеревался.
Напишите простой сайт из двух страничек — на одной должен быть калькулятор, на другой — генератор случайных чисел. Единственное условие: он должен работать оффлайн (в Хроме) и запоминать последние результаты после закрытия браузера даже при выключенных куках (во всех топовых браузерах — но совместимость со старыми станет огромным плюсом).
Со звёздочкой: что такое ООП? Своими словами.
Со звёздочкой: выскажите своё мнение о перспективах Dart.
Со звёздочкой: опишите детально концепцию Web Components и взаимосвязь между её элементами.
Со звездищей: расскажите о хотя бы трёх способах наследования в JavaScript.

Описание вакансии

Загрузить резюме (doc, docx, pdf) Max.: 2MB
Файл не выбран