Сергей Протько

https://github.com/saabi/vminpoly

Да прочитайте вы уже про Single page applications, концепцию "клиент-сервер", REST и т.д. Так же перестаньте думать "страницами". Думайте состояниями. По сути body в html это ваш MainWindow, а там уже творите что хотите. Хотите текст в диве поменять - меняйте. Хотите пол страницы переделать - меняйте.

Рекомендую вам начать с Backbone + Handlebars и плавно перейти на Angular/Ember. А может и вовсе с них начать и переходить на что-то более низкоуровневое (для развития понимания) только при недопонимании концепций этих фреймворков. Если вы знакомы с архитектурой серверных приложений - у вас то же самое будет (приблизительно) на клиенте. Только вместо базы данных будет rest api, раутинг так же, контроллеры так же будут обрабатывать конкретные состояния, добавится нормальный слой представления и возможно viewmodel. MVC изначально для интерактивных приложений создавался а не для request/response.

но последние стати на хабре про его минусы

А вы статьи эти читали? А комментарии? Я работаю с Angular вот уже 2 года и ни разу не сталкивался с "проблемами" изложенными в статьях. Тем более что те проблемы которые на самом деле имеют место быть (слишком много букв надо писать для директив, сложно и т.д. к примеру) решаются либо сторонними модулями либо ждем Angular2. А так складывается впечатление что люди думают что могут взять какой-то фреймворк и он сразу же решит все их самые изощренные задачи.

Ну и да, Angular это не UI фреймворк, это фреймворк для построения приложения в первую очередь. Внутри используйте хоть react.js на тех местах где он подходит лучше (я пока даже не знаю о подобных) хоть backbone (в качестве persistance layer и для моделек неплохо подходит).

что до UI - Foundation, Twitter Bootstrap, а еще интереснее варианты - Google Material Design или еще чего посвежее... Ну или верстайте все сами. Если вы расчитываете на перспективы, то думаю поддерживать старые браузеры вы не будете уже. А значит можно использовать flexbox-ы те же, на которых построить сложный лэйаут не особо сложно.

www.w3.org/TR/wai-aria

но вообще...

div - любые блоки
section - любые блоки, которые объеденены в одну группу
article - любые блоки, которые образуют самодостаточный элемент, их может быть много на странице
aside - что-то второстепенное, не имеющего напрямую связи с основным контентом. Может быть и внутри artice и вообще как хотите.

В целом же считаю что WAI-ARIA и div норм.

А никак. Либо у вас под рукой пачка девайсов (livereload упрощает жизнь) либо боль и страдания.

Все ключевые слова в CSS начинаются с @. Типа @ import, @ media, @keyframes и т.д. В вашем случае @keyframes просто идет с вендорным префиксом.

Там есть примеры на посмотреть. Не думаю что можно еще лучше описать чем на примере. В целом же - google translate в помощ.

а зачем? Может вам в менеджмент?

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

В любом случае попробуйте закончить. Хотя бы верстку сделать а после отдать каким знакомым на ревью (у кого опыта побольше).

БЭМ, less/sass/stylys, jade/haml, автоматизация рутины (gulp, spritesmith и т.д.).

philipwalton.github.io/solved-by-flexbox/demos/sti...

ну или как альтернатива - galengidman.com/2014/03/25/responsive-flexible-hei...

варианты с position:absolute вчерашний день.

Я, кнешн, плохо знаю этот фреймворк

Так зачем вы его используете?

А еще meta viewport плохо знаете....

Смотря чем вы хотите заниматься в дальнейшем. В целом распыляться на слишком много нового не стоит. Максимум одна две новые технологии за раз.

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

Слышали анекдот про HR-ов?

Сидит опытный HR и HR-стажер. Перед ними пачка резюмешек на рассмотрение. Опытный отсчитывает половину стопки и выкидывает в мусор. Стажер в шоке:
- Василий Степаныч, как же так то?
- Ай... Нам не нужны неудачники.

Потому что angular.module('app', []).controller('DemoController', DemoController);

Будущее за теми, кто хотя бы умеет читать википедию.

Для справки, ни MVVM ни MVC не являются шаблонами проектирования. Это схема использования нескольких шаблонов проектирования. Основная идея оных - разделение логики на слои. MVC декларирует разделение на логику представления, бизнес логику и связывающие это все контроллеры. В MVVM же основная идея заключается в более удобном управлении представлением модели. Особенно в случае когда модель может меняться из слоя представления (из UI тобиш, датабиндинги и все такое).

p.s. Помимо MVC и MVVM существует масса других схожих схем, типа MVP, HMVC, PAC...

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

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

Так что лучше держать скрипты и стили отдельно, и инлайнить только то, что на самом деле важно. Например above-the-fold стили или любые другие критичные стили. Из скриптов заинлайнить имеет смысл то, что нужно для инициализации приложения. Скажем загрузчик модулей или что-либо подобное. Но не все приложение.

Госпади какой ужас... Пощадите тех кто будет эту верстку потом поддерживать. Почитайте про модульный CSS, BEM и т.д.

В селекторах вида body .wrapper нет ровным счетом никакого смысла.

Но если вы хотите, рекомендую вам перейти на jade вместо html и stylus вместо less, это почти полностью решит вашу проблему.

Ваш пример на Jade

body
  .wrapper
     .left-box
     .right-box
       p
          span

и Stylus (color взял просто так...)

body
  color: #fff;
  .wrapper
     color: #f00;
     .left-box
         color: #0f0;
     .right-box
       color: #ff0;
       p
           color: #f0f;
         span
           color: #34f;

Как видите - мы просто копируем шаблон jade и... все

Но еще раз хочу заметить - вообще это все очень плохо. Даже less вам не поможет в этом случае нормально организовать структуру стилей. Не соблюдается семантика и т.д. Приоритеты стилей в разнобой - сложно поддерживать...