Clever_Coyote

От общего к частному:
"Носорог"
Крокфорд
"Шаблоны" Стефанова -- отличная вещь
МакКоу на данный момент, наверное, подустарел, но, как минимум, Backbone поможет освоить.
"Оптимизацию" Закаса можно прочесть последней, или где-то в середине.

Вот по быстрому накидал:
HTML:
<div class="wrapper"></div>
CSS:

body,html {
  width: 100%;
  height: 100%;
}

.wrapper {
  width: 100%;
  height: 100%;
  transition: background 1s;
  background: none;
}

JS:

(function (w, d) {
	w.onload = function () {
		var wp = d.querySelector('.wrapper'),
        colors = ['yellow', 'red', 'green', 'blue'],
        ln = colors.length;
    
    var changeColor = function (i) {
      if (i < ln) {
        setTimeout(function () {
          wp.style.cssText = "background: " + colors[i] +";"; 
          i++;
          changeColor(i);
        }, 2000);
      } else {
        changeColor(0);
      }
    };
    
    changeColor(0);
  };
}(window, document));

Это на чистом js, его легко можно заменить на jQuery.
Рабочий пример.

Maxim

• Определитесь какие товары Вы будете продавать на своей landing page
  
• Целевая аудитория, кому нужен Ваш товар
  
• Какие фишки у Вашего товара и что стоит выделить
  
• Определитесь что Вы хотите получить: продажи, регистрации, звонки
  
• Какие контакты должны быть на сайте
  
• Какой Вы хотите внешне landing page? Если есть страницы которые Вам нравятся, ссылки на них. Вот большая подборка landing page.
  

Запишите это все к ТЗ.

Посмотрите:
Как нельзя делать сайты. Открытый доступ к статист...
Гай Кавасаки «10 способов привлечения внимания от ...

На хабре почитайте:
Создаем landing page: чек-лист для новичков
Landing page, которая работает
Устройство минималистичных посадочных страниц
Как сделать самую лучшую посадочную страницу: чеклист из 50 пунктов
Каждому по Landing Page. Наболевшее
7 основных принципов юзабилити для интернет-магазинов
Продающий дизайн интернет-магазина. Часть 1. Аналитика
Продающий дизайн интернет-магазина. Часть 2. Элементы интерфейса
Продающий дизайн интернет-магазина. Часть 3. Дизайн элементов

Но как бы странно это не звучало, не совсем представляю, к кому идти за "помощью"?

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

Когда Вы знаете что хотите и написали подробное ТЗ, идти Вам к дизайнеру за шаблоном, а потом к вебразработчику за сайтом под ключ. Вместо одного вебразработчика, можете обратится сначала к верстальщику, а потом к программисту. Быстро сайт Вам могут сделать на CMS, либо на фреймворке. Можете например взять wordpress, под него много готовых бесплатных плагинов и тем, может и под свой landing тему найдете и скачаете, а не будете делать с нуля. :)

Если денег на дизайн и разработку landing page у Вас маловато, то лучше воспользуйтесь готовыми решениями типа ecwid, до 10 товаров там бесплатный тариф, а сэкономленные деньги лучше пустите на рекламу и нагон трафика на Ваш landing.

Берите ноду, на ней тоже уже все есть готовое в NPM, не меньше, чем на RoR, но не подсядьте только на "все из коробки", главное определиться для со стеком технологий и адхитектурой, это важнее, чем язык, сейчас разрабатывают больше даже на фреймворках, нежели на языках. Определитке задачи для себя, что Вы хотите решать на ноде, что писать, для чего использовать: обычные сайты или CMS, SPA-сайты сайты или SPA-приложения, Rich-приложения, адаптированные под мобильные или будете заниматься только backend и работать в команде с кем-то, кто будет писать frontend. Нужно выбирать все в комплексе, СУБД, фреймворк для браузера, серверную ОС, варианты хостинга. Я рекомендую такой стек: CentOS, Node.js, MongoDB / PostgreSQL, React. Какие ссылки советую:
1. Моя статья на Хабре - habrahabr.ru/post/204958
2. Мой ответ на вопрос по фреймворкам для ноды тут на Тостере - Подсоветуйте фреймворк для node?
3. Видео-уроки по node.js - learn.javascript.ru/nodejs-screencast
4. Про Impress - habrahabr.ru/post/247543
5. Разнообразные ответы по поводу выбора языка - Актуальный язык программирования

Судя по всему с ЯП вы вообще не знакомы, но ориентируетесь на фронтенд, так что JS (хотя без оглядки на фронтенд посоветовал бы в качестве первого языка python). Если не знаете хотя бы основ js, учить jQ ни в коем случае не начинайте, ничего хорошего не выйдет.
Далее можно окунуться во что-нибудь серверное, но к тому времени вы и сами будете знать к что вам нужно, и не факт, что это будет php.
Чтоб не плодили лишние вопросы, вот вам сразу учебник - Дэвид Флэнаган - JavaScript. Подробное руководство...

И так, с чего начать обучение:
1.Самый низкий порог вхождения у языка PHP. Начинайте именно с него
2.Изучите популярные CMS: WP, DLE, Joomla и т.д. Очень много заказов есть типа "Создать сайт", причем экзотики в 2 из 3 проектах не нужно. Здесь минус в том, что школоты тут полно и цену они сбивают весьма сильно...
3.Далее категория заказов "А можно ли сделать вот так". Сводится все это к разработке/переработке модулей на все тех же CMS. Нужно учить PHP + API этих самых CMS. Возьмите один движок и копайте по нему в эту область, не рвитесь сразу за всеми. Порог вхождения тут тоже не велик, но здесь больше голодные студенты обитают
4.Когда перерастете уровень дополнений/модулей, переходите к фреймворкам. Сейчас самый популярный Yii. Фреймворк позволяет Вам делать какие-то уникальные приложения, которые достаточно тяжело реализовать на готовых системах. Здесь ценник по существеннее, чем в первых двух, т.к. школота в силу своих умственных способностей сюда влезть не может.

Теперь расскажу как вообще этому обучаться на своем примере. Я делаю так:
1.Открываю тоненькую книжечку по языку(листов 100, не более), смотрю на основы
2.Делаю примеры из этой книжке в IDE/блокноте. Это дает мне определенную базу
3.Далее у меня есть список из примерно 20 задач(любую методичку по программированию откройте), которые я всегда делаю на новом языке. Это позволяет мне "привыкнуть" к новому коду и начать изучать стандартную библиотеку языка
4.Затем я начинаю брать низкобюджетные заказы на фрилансе по этому языку
5.После этого начинаю учить самый популярный фреймворк языка, опять же на низкобюджетных проектах.
6.Сделать с 12-15 проектов я могу уже браться за что-то более менее серьезное с почасовой оплатой на фултайме.

Вот это мой путь. По срокам - базу я себе нарабатываю за 1,5-2 месяца, на это время у Вас должна быть какая-то "подушка".

P.S. надеюсь помог. ))

Лень двигатель прогресса. Хороший пример - принцип DRY - Don't repeat yourself. Я весьма подозреваю что вы стараетесь соблюдать этот принцип когда делаете макеты или чем вы там занимаетесь. Так же я весьма уверен что вы хотя бы пытались чуть автоматизировать рутину своей повседневной работы. Так же у вас могли быть ситуации когда вы переиспользовали какие-то элементы. Мало ли.

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

• организация стилей, то есть держать все в одном файле не удобно особенно когда проект длится годами
• Дублирование стилей и селекторов. По мере развития проекта появляются какие-то снипиты которые можно реюзать. Так же у вас может появиться масса однообразных селекторов отличающихся лишь немного. При модульных подходах вложенности редко имеет место быть но все же имеет. Но не будем забывать что большинство фигачит селекторы просто так. В итоге если мы переместили блок или переименовали класс какого-то блока нужно отредактировать еще массу селекторов.
• Привязка размеров и параметров к другим стилям, например у вас в стилях задана ширина блока, от нее зависят другие параметры, отступы для других блоков и т.д. Да, в css3 появился calc для этого но это было относительно недавно и только с недавних пор можно почти без опаски использовать эту штуку.
• Таблицы стилей, как и HTML ориентированы на удобный разбор этого добра машиной, но не человеком. Человек же существо ленивое и как-то вот лень лишний раз скобку поставить или точку с запятой. Просто лень.

Есть так же хорошее правило, или идея если хотите.... Если код можно сгенерить - его лучше сгенерить. То есть для решения всех выше перечисленных проблем придумали препроцессоры. Они как бы были и раньше всех этих scss/less/stylus но как-то не решали всех проблем и т.д. Что в итоге было предложено (перечисляю в том же порядке что и в списке выше).

• У CSS есть такая штука как @ import. Но не очень круто импортировать сотню стилей в продакшене. Стоит сделать так что бы все стили были склеены при сборке проекта. Эта идея в итоге развилась и если разработчик использует это дело правильно, можно зайти в любой файл со стилями и увидеть список всего от чего зависят эти стили. Какие стили подключаются и т.д. Причем один файл с зависимостями может быть подключен в нескольких файлах а препроцессор сам разберется как и куда все вставлять сгенерив максимально оптимизированный по структуре файл. А разработчик получил четкую структуру файлов и возможность быстро найти где что и от чего зависит.
• С селекторами проблему предложили решить наиболее логичным вариантом. Если у нас есть вложенные селекторы, то имеет смысл определять их внутри блока этого селектора. Это существенно упрощает поддержку стилей. Так же для управления снипитами и прочим добавили миксины - эдакие параметризованные или нет функции которые выплевывают шматок CSS. До появления штук вроде autoprefixer это был единственный способ писать поддерживаемые стили, использовать плюшки CSS3 и вообще новые плюшки и не сойти с ума от префиксов. Префиксы это только пример, там могут быть самые разные штуки позволяющие грамотно производить реюз стилей
• Проблему зависимостей значений стилей друг от друга решили... собственно самым очевидным способом - переменные. Это удобно, легко поддерживать и в умелых руках это мощный инструмент. Нужно поменять базовые цвета - не нужно лазить по 100500 блоков и править значения руками, можно поправить переменные и все будет хорошо.
• Насколько я помню SCSS/LESS не стремились решить эту проблему. Какие-то решения образовывались сами собой с течением времени. В плане минимализма и выразительности пожалуй сейчас самая крутая штука это stylus.

Что в итоге произошло. В один прекрасный момент какие-то там рубисты придумали SCSS (они вообще не любят все что не в стиле ruby в плане минимализма и выразительности). Затем чуваки подумали и сказали, SCSS это круто но почему-то они используют синтаксис знакомый именно Ruby разработчикам а не обычные для CSS конструкции. В итоге реализовали LESS, причем его уже реализовали на javascript, что с наличием node.js позволило это все добро еще на одной платформе собирать. А так как под эту платформу и так плодили препроцессоры оно удачно вписалось.

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

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