Ресурсы:
Справочник по html: webref.ru
Справочник по html: htmlbook.ru
Англоязычный справочник: cssreference.io
27 бесплатных глав и 500 заданий по вёрстке: htmlacademy.ru
Форум по вёрстке html.by
Англоязычный ресурс бога вёрстки Криса Койера css-tricks.com Здесь можно найти всё и на все случаи жизни. И причем это всё работает на чистом CSS.
Бесплатные youtube-уроки: WebDesign Master
Интересный сайт, который демонстрирует возможности CSS: csszengarden.com
На этом сайте при помощи CSS множество верстальщиков создают новое отображение html-страницы.
Англоязычный ресурс: webdesign.tutsplus.com
Бесплатный курс:
На английском языке:
https://internetingishard.com/html-and-css/
Фотошоп для верстальщика
Видео на Ютуб: https://www.youtube.com/watch?v=xXv93EpWeyA&list=PLqZTjT2Z9HyJfnApkpKEOJCZdXY_EbDWD&index=1
Статья на Хабре: https://habr.com/ru/post/272649/
Статья: http://tpverstak.ru/photoshop-dlya-verstaka/
Инструментарий
Текстовые редакторы
Notepad++
Textmate под Mac, E или Intype под win.
Adobe Dreamweaver
FAR+colorer
HTMLPad
TopStyle
PHPStorm
Sublime Text
Zen Coding
Фреймворки
Twitter Bootstrap – готовый набор HTML+CSS+JS популярных UI компонентов.
Приложения по обучению вёрстки
Учебник по CSS – https://play.google.com/store/apps/details?id=ru.webref.csstutorial
Самоучитель HTML – https://play.google.com/store/apps/details?id=ru.webref.htmltutorial
Структура HTML
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'/>
<title>Название страницы</title>
<link rel='stylesheet' href='styles.css'/>
</head>
<body>
<!-- Здесь будет контент -->
</body>
</html>
Блочная модель:
Обязательная к прочтению статья: https://webref.ru/layout/learn-html-css/box-model
Материалы из прямого эфира:
Файл PSD, с которым я работаю –Home
Файлы с вёрсткой, которую мы начали с вами делать – examle
Чтобы открыть верстку, нужно распаковать архив и открыть файл home.html в браузере, либо открыть его в вашем редакторе.
Добавить комментарий