Найти в Дзене

Подготовка к верстке

В прошлых статьях я уже ознакомил вас с языком гипер текстовой разметки HTML5 так-же с языком таблицы каскадных стилей CSS3. Из этого мы поняли что html5 дает команду браузеру что показывать в окне т.е. содержимое. А CSS3 придает стили и позиционирование на самом сайте.
В этой статье подведем итоги а в следущей статье начнем уже верстать полноценный сайт с адаптацией.
Первое:
При создании сайта

В прошлых статьях я уже ознакомил вас с языком гипер текстовой разметки HTML5 так-же с языком таблицы каскадных стилей CSS3. Из этого мы поняли что html5 дает команду браузеру что показывать в окне т.е. содержимое. А CSS3 придает стили и позиционирование на самом сайте.

В этой статье подведем итоги а в следущей статье начнем уже верстать полноценный сайт с адаптацией.

Первое:

При создании сайта может создаваться много файлов с разными расширениями, это могут быть медиа материалы, html файлы, css файлы ну и по минимуму js файлы (Содержит програмный код я зыка java script). Так же когда будем создавать движок (CMS) то в этой куче фаилов добавятся PHP файлы (Содержат програмный код языка PHP). Опоследних двух будет описание в следующих других статьях.

Поскольку файлов может оказаться большое колличество а в базе данных это все храниться в одной папке с определенным адресом. То все эти файлы будут там выглядеть в хаотичном порядке и в принципе если набрать правильный адрес файла в браузере то можно будет получить к нему доступ что не положительно сказывается о защите.

Поэтому рекомендую файлы определенного типа хранить в отдельно созданной папке

вот так это должно выглядеть на компьютере или на вашем локальном сервере.

№1 Вид проводника Total Comander, показывает что все содержимое храниться в папке partner.

№2 Так выглядит содержимое папки.

favicon = Содержит картинки фавикона вашего сайта.

images = Все возможные медиа материалы.

js = Java Script файлы, об этом будут отдельные статьи.

style = Там храняться файлы формата css

№3 Файл index.html который создавали ранее. Содержит все команды для сервера или браузера. Этот файл всегда должен быть на одном уровне со всеми остальными папками и никогда не должен помещаться в какую другую папку. Так как, вы обращаетесь на сайт с определенным адресом вы указываете путь именно к этому сайту, папке содержимого. Сервер в свою очередь перейдет к этой папке и будет там искать файлы либо index.html либо index.php и прочесть его. Если сервер не найдет или не прочитает данные одного из файлов index, то сервер выдаст ошибку.

Второе:

У верстальщика должны быть инструменты.

Начнем с браузеров. Должно быть на компьютере находиться минимум 3-4 браузера . Чтобы можно было проверить создаваемый сайт на разных браузерах, тем самым делая его кросс браузерным. Но для работы лучше один браузер выбрать а на остальных проверять на коректнось отображения.

Текстовый редактор. В компьютере есть стандарртный блокнот, в принципе и он подходит для работы. Но можно и другие редакторы выбрать для удобства работы.

Так же если вы будете верстать по psd макетам то вам понадобится и графический редактор.

Для локального создания сайта вам будет достаточно вышеперечисленное.

Кто только-что начал заниматься версткой, чтобы нормально научиться верстать, нужно как минимум сделать штук десять статичных сайтов и штук пять адаптивных. Ну и самое главное не бойтесь сделать ошибки, будет хорошим уроком находить их и исправлять.