Кроссбраузерные сайты?
caniuse.com - тут сведения о поддержке разных селекторов.
Идем на dribbble.com - находим интересненький макет. Скажем этот.
Потом скачиваем Bootstrap. Вся документация здесь. Примеры кода, сниппеты здесь, здесь, здесь и здесь. Листаем, смотрим код, модифицируем, разбираемся, изучаем.
Заводим аккаунт на codepen.io, смотрим код классных вещей, добавляем в избранное, модифицируем, изучаем.
Потом хотим научиться верстать адаптивно. Бутстап - удобный инструмент. Но иногда хочется чего-то большего. После верстки парочки макетов на бутстрапе самое время изучить флекс. (Пример - круто, не правда ли?).
Ссылки - раз, два, три, четыре. Рекомендую первую ссылку + видео. Также рекомендую подписаться на блог Пепелсбея - там много интересного.

Дам небольшой списочек, что нужно освоить: "flex layout, multi-column layout, calc, 3d-transformations, filters, multiple backgrounds, viewport units, iconic fonts, + и ~ в связке с input:checked, counters, keyframes, :last-nth-of-type, less, stylus/styl, sass, csscomb, autoprefixer".

P.S. Не рекомендую видео Попова.

В поиске по сайту можно найти много интересного

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

Попробуйте курсы от специаласта. Потом уже умные книги, опыт и статьи на хабре.

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

Html Academy неплохой онлайн сервис, отлично преподнесен материал

Лучший опыт - практика.