Какие есть книги по HTML и CSS в которых поэтапно создаётся сайт?

Question

[PRAIT]

Прошёл не один курс по HTML и CSS уровень знания выше новичка.
Сейчас провожу разбор полётов и обнаружил что не совсем понимаю как сверстать макет с psd ( Интернет магазин ).
Подскажите пожалуйста пособие, в котором разбирается поэтапная вёрстка именно сайтов на реальном примере ( возможно многостраничных ) желательно какая - нибудь книга.

Answer 1

[xmoonlight]

1. Создайте пустую структуру страницы в HTML.
2. Пропишите основные стили по-умолчанию (цвет фона, цвет и размер шрифта и т.д.).
3. Разметьте сетку нужных блоков в PSD
4. Создайте эти блоки внутри пустой структуры (наполните пустой белый "лист" блоками), используя HTML-теги и CSS стили для правильного отображения всей страницы (согласно макету в PSD).
5. Profit!

Answer 2

[Александр Гримашевич]

Сайт - это не только HTML, CSS. Современный сайт - это PHP (либо CMS либо фреймворк чаще всего) и много Javascript. Поэтому осваивайте PHP, JS, HTML, CSS. Последний рекомендую использовать не в чистом виде, а писать с помощью препроцессоров: SASS, LESS прочие. Исходя из этого вытекает еще один инструмент - Gulp (либо аналог) для сборки ресурсов, в частности для компиляции SASS например.

Comments

[ⓒⓢⓢ]

Сейчас провожу разбор полётов и обнаружил что не совсем понимаю как сверстать макет с psd ( Интернет магазин ).

Современный сайт - это PHP

тогда уже сразу напишем часто используемые слова, чтобы создать только фронт для сайта (не говоря уже о бэке)
html\pug, css\scss\less\styl, js\ts, es\style\doc linter, unit\e2e testing, webpack\babel, vue\react\angular
и совсем запутаем человека, который учится верстать - зачем ему на текущем этапе пэхэпэ и всё остальное?

[Александр Гримашевич]

Потому что это основа, на одном хтмл/цсс далеко не уедешь.

[PRAIT]

JRK_DV, Поддерживаю, выше написано не по теме.

Answer 3

[Даниил]

Я понимаю, возможно не корректно, но если нужно делать макет, который делается в PS, то нужно наверное видосы смотреть на ютубе. Причем есть полным полно для новичков и уже опытных от начала и до конца. Тоесть начинается от PSD макета, заканчивая финальной выгрузкой на CMS и откладкой кода так сказать.

Answer 4

[snap44]

примерно так, только с фотошопами всякими еще придется поработать.