Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Основы создания сайта своими руками


Основы создания сайта своими руками

Выпуск 4

Здравствуйте!

Приветствую Вас на страницах рассылки "Основы создания сайта своими руками"!

Итак, дорогой подписчик, как и обещала, переходим к практике. Чтобы создать сайт понадобится многое. Но прежде всего, как Вам наверное уже известно, нужно знать язык HTML.

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

Приступим!


Что такое HTML?

Если Вы заинтересовались созданием сайтов, то уже знаете, что для этого требуется знать язык HTML. Но что такое этот HTML, так уж ли страшен он на самом деле? Как и где его использовать? Что понадобится для освоения HTML? Разберемся…

Аббревиатура HTML по-английски расшифровывается как HyperText Markup Language, по-русски это означает язык разметки гипертекста.

Самое главное – не путать его с языком программирования. HTML – это НЕ язык программирования!

Когда Вы выходите в Интернет, то для просмотра web-страниц запускаете специальную программу – браузер. Браузеры бывают разные. Кто-то пользуется InternetExplorer, кто-то Opera, кто-то Mozilla, но суть одна: без браузера сайты в Интернет посмотреть невозможно. Так вот, чтобы на компьютере каждого пользователя Интернет-страничка выглядела так, как задумал ее создатель, странички эти пишутся на языке HTML.

С помощью специальных кодов указывается, что, как и где будет расположено.

Например, я хочу сделать такую страничку:

Здесь  находится мой логотип logo.gif

Здесь по центру - заголовок Моя страничка

Далее текст, два параграфа, выровненные по левому краю Текст параграфа

Здесь ссылка Ссылка на другую страницу index2.html

Здесь, по центру находится таблица Таблица

Примерно так, кажется, понятно объяснила. Вы представили, как будет выглядеть моя страничка?

А чтобы это было понятно и браузеру, нужно вместо тех слов, которые я написала курсивом, поставить специальные коды. Вот эти специальные коды называются тэги. Вы наверняка их видали! Да, да, это те самые непонятные слова вот в таких скобочках < >.

Если теперь я то же самое напишу с использованием тэгов, то это будет выглядеть так:

 <img src="logo.gif" width="100" height="30"  >

<h1 align="center">Моя страничка</h1>

<p align="left">Текст параграфа.</p>

<p align="left">Текст параграфа.</p>

<a href="index2.html">Ссылка на другую страницу</a>

<table width="70%" border="1" align="center">

  <tr>

    <td>Таблица</td>

  </tr>

</table>

На первый взгляд страшно непонятно, но на самом деле, если знать, что обозначает каждый тэг, все довольно просто. Любой документ имеет заголовок, параграфы, списки, таблицы и т.д.  А HTML позволяет отметить, где в документе должен быть заголовок или абзац при помощи тэга HTML. То есть, выполняется разметка документа.

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

Что понадобится еще? Это зависит от того, как Вы будете создавать свой сайт.

Чтобы создать сайт, можно действовать двумя способами.

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

Во-вторых, можно использовать специальный HTML-редактор. Какой редактор выбрать – зависит от пристрастий каждого автора.

Специализированные HTML-редакторы обладают полезными функциями и возможностями, облегчающими написание HTML-кода. Вот некоторые из возможностей таких редакторов: раскраска тегов, поддержка макросов, поддержка различных кодовых таблиц, подсветка синтаксиса, проверка орфографии, проверка ссылок. Примеры таких редакторов: 1stPage, SimpleHTML, HomeSite и другие.

Другая группа редакторов – визуальные редакторы. Такие редакторы работают с использованием технологии WYSIWYG («Что видишь, то и получаешь»).  К ним относятся программы FrontPage и Dreamweaver. В этих редакторах HTML-код создается автоматически самой программой, пользователю остается заниматься только оформлением страницы. Используя эти программы можно создать сайт, даже не зная языка HTML. В многочисленных публикациях можно встретить различные мнения о применении таких редакторов, причем прямо противоположные. Кто-то уверяет, что WYSIWYG-редакторы это бесполезная вещь и призывает писать HTML-код только руками. Другие уверяют, что HTML Вам совсем не пригодится, и призывают создавать сайты с только помощью WYSIWYG-редакторов.

Я не призываю Вас бросаться в крайности и совсем забросить изучение HTML и пользоваться только Dreamweaver, или наоборот, не признавать ничего, кроме Блокнота. Нет, мне кажется, нужно разумно использовать все имеющиеся возможности.

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

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

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


Мой эксперимент с web-страничкой

Суть эксперимента в следующем: как я уже писала, web-страничку можно изготовить несколькими способами. Можно написать в Блокноте, создать с помощью редактора (я делала в Dreamweaver), а так же, теоретически, можно изготовить и в Word, а потом сохранить документ как web-страничку, а затем убрать лишний html код  средствами программы Dreamweaver. Для примера возьмем структуру и содержание странички, описанное в сегодняшней статье.

В начале пойдем самым простым, но и нерациональным путем (не делайте так никогда!): создадим этот документ в текстовом редакторе Word и сохраним его как web-страничку. Создаем, сохраняем. Смотрим, что же получилось? Размер нашего файла, назовем его Моя страничка1.html - 7 317 байт.

Как известно, программа Word создает очень много лишнего и совершенно не нужного HTML кода. Чтобы от него избавится, можно воспользоваться специальной функцией в редакторе Dreamweaver. Итак, открываем наш файл Моя страничка.html в Dreamweaver, нажимаем меню Команды - Очистить Word HTML. Сохраняем очищенный документ как Моя страничка2.html. Смотрим размер полученного файла - 1 891 байт! Неплохо!

Теперь создадим ту же страничку в Dreamweaver. Сохраняем по именем Моя страничка3.html. Размер файла получился 652 байта. Еще лучше!

Теперь напишем то же самое, только ручками, в Блокноте. Этому файлу дадим имя Моя страничка4.html, смотрим его размер - 474 байта. Вот так.

А размер, между прочим, имеет значение. Ведь чем меньше размер html-файла, тем быстрее он загружается у пользователя, и тем лучше для всех. Потому что никто не будет ждать загрузки страницы слишком долго!

И еще один шаг. Возьмем файл Моя страничка3.html, созданный в Dreamweaver, открываем его код и чистим вручную все лишнее. Конечно, лишнего не так много, но некоторые тэги можно смело удалять. Сохраняем очищенный файл под названием Моя страничка5.html и смотрим его размер - 480 байт. Почти такой же, что и созданный в Блокноте.

Какой из этого следует вывод? В настоящее время существует множество способов создать сайт без знания языка HTML. Но пренебрегать изучением HTML не нужно! Чтобы контролировать ситуацию, чтобы иметь полное управление над своим сайтом - без знания HTML не получится! Что тут сказать - цифры эксперимента говорят сами за себя. Так что учитесь!

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

Так что подписывайтесь, это совершенно бесплатно! Форма подписки находится на странице http://site.myneo.info/

А я на этом завершаю свой выпуск. До встречи!


На этом все.

Хотите задать мне вопрос? Пишите! mail@myneo.info

Автор рассылки Наталия Багаева


В избранное