Как сделать сайт. Часть 2. HTML и CSS.

Автор: . 10 Июль 2011 в 22:28

Start Up

Часть 1, Часть 3

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

А знать нужно, как минимум, две вещи: HTML и CSS.

Не “желательно“, не “не помешало бы“, а обязательно нужно знать.

Что такое HTML?

Абсолютно все сайты в интернете, все веб-страницы созданы с помощью  HTML (HyperТext Markup Language).

HTML не является языком программирования, как считают некоторые, HTML  – это язык разметки гипертекста.
Тоже не совсем понятно?
Почему,  не текста, а гипертекста, например?

Потому что гипертекст – это не просто текст, а  текст поделенный на смысловые блоки (фрагменты, элементы) – абзацы,  заголовки, ссылки и пр.

Размечается гипертекст с помощью так называемых “тегов”. Тег – это “ключевое слово” ( “название”, идентификатор), который “определяет”, как будет выглядеть и располагаться на странице тот или иной элемент (кусок текста). Для каждого элемента текста – заголовка, ссылки, картинки и других, существует свой тег.

Например тег <title> определяет заголовок документа: <title>Как сделать сайт</title>;

Тег <p> определяет абзац: <p>Чаще теги употребляют парами, чтобы отметить начало и конец  куска текста.</p>

Но бывают и одинарные теги, такие, как тег <br>
-  тег переноса строки.

В общем, надеюсь, примерно понятно.

HTML  – это только язык разметки. И язык очень простой. Для знакомства с основными тегами и принципами разметки html-страницы достаточно 2 -3 часов, чтобы накрепко освоить “язык” нужна, максимум, неделя.

CSS (Cascading Style Sheets) – каскадные таблицы стилей.

В настоящее время таблицы стилей являются неотъемлемой частью любого современного сайта и работают они в неразрывной связке с html.

Роль HTML – структурировать содержимое страницы, т.е. разбить его на смысловые блоки (заголовки, параграфы, списки, таблицы, формы и пр.). CSS же применяется для оформления и форматирования содержимого той же страницы, т.е. с помощью CSS вы можете все эти блоки расположить  на странице, как и где вам угодно, а также придать им любое оформление – размер, цвет, шрифт, фон и т.д. Причем возможности CSS очень широки.

Такое вот формирование веб-страницы с помощью HTML и CSS называется вёрсткой.

Я даже не собираюсь тут рассуждать на тему – какая вёрстка лучше, табличная или блочная (div верстка). Если где-то вы ещё наткнетесь на такие рассуждения, то посмотрите на дату публикации, наверняка она будет давняя.

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

Вёрстка же производится с помощью блочных тегов div и каскадных таблиц стилей CSS.

Ну и теперь ответ на вопрос, зачем же все это нужно знать?

Как минимум затем, чтобы уметь, хотя бы, отредактировать бесплатную “тему” оформления, отысканную вами в интернете и установленную на ваш сайт, созданный “за один день” на бесплатном же движке WordPress.

Ну, а как максимум, открою вам секрет, что при умелом использовании  CSS, а также применении некоторых, очень полезных функций программы Adobe Dreamweaver (безусловно, самой лучшей программы для создания сайтов) можно создать практически полноценный сайт.

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

Потому что при создании CMS-систем, и WordPress в их числе,  используются не только HTML и CSS, но также и языки программирования, самый популярный из которых PHP, а также базы данных и различные скрипты.

В общем, понятно куда расти?

Похожие статьи:

  1. Как сделать сайт. Часть 1. Динамический, интерактивный сайт.
Рубрики: Тех.поддержка

Обсуждение
Отзыв Юрий 11 Июль 2011

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

Отзыв Александр Ветров 11 Июль 2011

Интересная, подробная нужная информация!

Отзыв Азамат 12 Июль 2011

Познавательно. По поводу HTML., CSS очень классные уроки Попова. Сам пока ничего не пименял, но в ближайшем будущем обязательно.

Отзыв Ольга 12 Июль 2011

Согласна с Юрием. Информация из числа полезных.

Отзыв Дмитрий (Emris) 13 Июль 2011

Несомненно информация полезная, но недостаточная! Продолжение будет? Обязательно подпишусь на рассылку))

Отзыв Элла 14 Июль 2011

Дали простое и понятное определение, стало чуточку ясней.

Отзыв Дмитрий (Emris) 14 Июль 2011

Ольга, я подписался на рассылку. Жду продолжения. И вопрос. А стоит-ли самому ваять сайт, если есть WordPress который накрывает практически все нужды вебмастера? Хотя конечно языки знать надо, чтобы можно было что-нибудь оперативно поправить в своем сайте.

Отзыв Gashkova 15 Июль 2011

Дмитрий, я думаю, что не стоит, причины я попыталась изложить в третьей части статьи. Тем более, для того, чтобы сделать нормальный сайт придется серьезно поучиться.
Но для того, чтобы свободно обращаться со своим сайтом (или сайтами), сделанном на каком-нибудь движке, выпускать рассылку, создавать продающие страницы для своих продуктов, да мало ли что еще, по- моему убеждению, нужно знать хотя бы в базовом варианте html, css, php, работу в каком-нибудь графическом редакторе. Все это на самом деле совсем несложно, но зато дает море уверенности, будит фантазию, вы увидите, что многие вещи можете делать сами совершенно легко и быстро, не прибегая ни к чьей помощи. То что вам неинтересно или сложно, можно отдавать на аутсорсинг. Но если вы сам себе капитан, базовые знания все равно нужны.

Ваш отзыв