Система “Вёрстка сайта с нуля 2.0“

Любой сайт состоит из набора Web-страниц. На странице мы видим текст, ссылки, формы, изображения, различные тени, закругления блоков и п рочие графические элементы. При этом Web-страница является интерактивной: текст мы можем выделить, форму мы можем заполнить, изображения можем сохранить к себе на компьютер. Но ещё до создания Web-страницы её внешний вид рисовал дизайнер, по сути, это была раньше просто картинка, самая обычная картинка, на которой была нарисована вся страница сайта. Безусловно, она не была интерактивной, Вы ведь не можете открыть фотографию с текстом и скопировать его? Так вот процесс преобразования изображения страницы в Web-страницу и называется вёрсткой.

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

Таким образом, если Вы хотите заниматься сайтостроением, первое, что Вам необходимо освоить – это HTML и CSS, а также научиться с их помощью верстать сайты.

Раздел №1. Введение

Раздел состоит из 3-х видеоуроков:

1. Как проходить курс?
2. Что такое вёрстка и каковы её задачи?
3. Как выглядит Web-страница изнутри?

Просмотрев этот раздел, Вы узнаете, как наиболее эффективно проходить курс, узнаете более подробно про вёрстку, а также про её критерии качества. Так же Вы познакомитесь с исходным кодом Web-страницы, и сможете уже понять, из каких частей она состоит и как они между собой взаимосвязаны.

Раздел №2. Изучаем HTML

Раздел состоит из 15-ти уроков:

1. Установка редактора
2. Создание первой Web-страницы
3. Добавление заголовков
4. Теги для текста
5. Добавление списков
6. Добавление изображений
7. Добавление ссылок
8. Организация контента на странице
9. Элемент iframe
10. Таблицы
11. Формы
12. Добавление видео
13. Добавление аудио
14. Добавление favicon
15. Мнемоники в HTML

В данном разделе Вы получите всё необходимое, что Вам нужно знать по HTML, с упором именно на последнюю 5-ю версию этого языка. Вы узнаете, какой редактор лучше всего использовать для написания HTML-кода, получите все знания по тому, как выводить самый разнообразный контент на странице, научитесь правильно проектировать структуру страницы, согласно стандартам HTML5 и многое-многое другое.

Раздел №3. Изучаем CSS

Если HTML отвечает за разметку Web-страницы, то CSS отвечает уже за внешний вид. И в данном разделе, состоящем из 14 уроков, Вы его отлично изучите:

1. Основы CSS
2. Как подключить CSS
3. Подключение шрифтов
4. Внешний вид текста
5. Единицы измерения
6. Селекторы
7. Внешний вид списков
8. Внешний вид блоков
9. Задание фона
10. Градиент
11. Обтекание блоков
12. Позиционирование блоков
13. Анимация
14. Трансформации

15. После прохождения раздела по CSS у Вас уже будет полный багаж знаний для успешной вёрстки сайтов любой сложности. Однако, без практики Вам будет сложно, поэтому чтобы упростить процесс обучения, были записаны следующие два раздела.