http://habrahabr.ru/post/251231/



Новый видеокурс по созданию адаптивного одностраничного сайта и посадке на CMS WordPress. В процессе обучение рассмотрены такие моменты, как проектирование интерфейса, создание скетча, адаптивная верстка и подключение Front-End плагинов, посадка на WordPress и создание опций шаблона. При разработке темплейта учитывалась возможность дистрибуции и распространения темы.

Материалы на GitHub: https://github.com/agragregra/wordpress-landing-page-lesson
Демо фронтенда: http://dev.webdesign-master.ru/_wp_html/

Видеокурс:

Первый урок:

• ru.wordpress.org — Собственной персоной
• elementary.io — Спасибо за логотип :)
• getbootstrap.com — Адаптивная сетка
• jquery.com — Популярнейший javaScript Framework
• stocksnap.io — Сервис качественных бесплатных фотографий для веб-дизайна
• wireframe.cc — Отличный сервис для скетчинга
• gist.github.com — Сервис для хранения полезного кода
• inkscape.org — Векторный редактор SVG
• linea.io — Тонкие векторные иконки
• fortawesome.github.io — Векторные иконки. Использовали для соц. сетей
• codepen.io — Много интересного кода. Спасибо за Sandwich :)
• pixelcog.github.io/parallax.js — Параллакс эффект
• dimsemenov.com/plugins/magnific-popup — Респонсив попап менеджер
• github.com/malihu/page-scroll-to-id — Плагин навигации по Landing Page
• imakewebthings.com/waypoints — Триггер для скролла
• daneden.github.io/animate.css — Анимация элементов на странице
• mixitup.kunkalabs.com — Сортабельные анимированные плитки в портфолио
• bourbon.io — Коллекция миксинов для SASS
• sass-lang.com — Препроцессор SASS
• koala-app.com — Компилятор для препроцессоров
• fontsquirrel.com/fonts/raleway — Бесплатный шрифт для нашей темы
• sublimetext.com — Редактор для фронт-енда
• jetbrains.com/phpstorm — Редактор для бэк-енда
• formspree.io — Отправка заявок с сайта

Спасибо за внимание к материалу.