Файлы сайта

Что физически из себя представляет любой сайт

Сайты мы просматриваем через браузер. Браузер это такая программа для просмотра сайтов. Наиболее распространены такие браузеры, как Internet Explorer, Mozilla FireFox, Opera, Google Chrome, Safari и другие.

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

Значит фраза "создать сайт" конкретно означает, что Вам надо сделать файлы страниц этого сайта. В самом простейшем случае Вам надо просто написать содержимое этих файлов и сохранить их под своими именами в нужных папках, как, например, Вы пишите какие-нибудь текстовые файлы в программе Word и сохраняете их под какими-то разными именами. Для каждой страницы своего сайта Вы пишите свой файл и сохраняете его под своим оригинальным именем. Отличие от простого набора файлов заключается в том, что в тексте некоторых этих файлов страниц стоят ссылки на другие файлы страниц сайта, ведь все страницы Вашего сайта должны быть связаны друг с другом ссылками, чтобы можно было перемещаться по разным страницам сайта.

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

Сначала посмотрим, какие файлы могут быть еще на сайте, кроме файлов страниц.

Чаще всего это файлы картинок и фотографии. Они имеют расширения только jpg, gif и png (в отличие от файлов страниц, которые имеют обычно расширения htm, html, php и др.). Причем изображение gif-файлов может периодически меняться. Файлы картинок и фотографий являются вспомогательными, они нужны для вставки их на страницы сайта. На одну страницу сайта может быть вставлено несколько файлов картинок, в том числе и несколько раз одна и таже картинка. Один и тот же файл картинки может использоваться для вставки на разное число страниц сайта.

Далее могут быть файлы-архивы, которые предназначены для скачивания их посетителями сайта по ссылкам на страницах сайта. Обычно эти файлы имеют расширения zip и rar, но, в принципе, могут иметь и другие расширения.

Файлы музыки (которые запускаются сами при открытии страницы или при нажатии на нужную кнопку на экране), файлы видео, файлы флэш-роликов и т.п.

Файлы скриптов. Скрипты это программы. Отличие от обычных программ, которые Вы запускаете в операционной системе Windows у себя на компьютере, состоит в том, что скрипт представляет собой некоторый текст, который написан на каком-нибудь языке программирования и который можно читать в каком-нибудь редакторе текстов (если, конечно, Вы знаете этот язык программирования). Файлы обычных программ на Вашем компьютере (имеют расширения exe и com) имеют двоичный формат и поэтому их невозможно читать в текстовых редакторах. Там Вы увидите только абракадабру.

Служебные файлы типа robots.txt, .htaccess и др., необходимые для работы сайта.

Прочие, типа favicon.ico, style.css и др. для дизайна.

Теперь посмотрим устройств файлов страниц.

Когда вы пишите какой-то текст в текстовом редакторе, то он у Вас обычно как-то отформатирован. У Вас в тексте есть абзацы, "красные" строки, заголовки, набранные крупным шрифтом, какие-то слова набраны жирным шрифтом или курсивом или подчеркнуты, в строго определенные места вставлены картинки, где-то стоят пропущенные пустые строки и т.п. Так вот, текст в файле страницы сайта тоже должен быть отформатирован. Но в отличие от файлов текстового редактора, в файле страницы сайта все символы форматирования Вы видите явно.

То есть, например, где начинается текст выделенный жирным, там на самом деле стоит значек начала жирного текста, а там, где жирный текст должен закончится, там стоит значек конца жирного текста. А сам текст между этими двумя значками написан как обычный. Эти значки являются командами браузеру начать отображать на экране браузера следующий текст как жирный и закончить отображать текст жирным шрифтом. Или, например, там, где должен начаться новый абзац, там перед текстом Вы должны поставить значек нового абзаца, а там, где абзац заканчивается, там Вы должны поставить значек конца абзаца. Браузер поймет, что в своем окне он должен показать текст между этими двумя значками в виде абзаца. Эти форматирующие значки называются тэгами. Обычно они бывают парными, один открывающийся, а другой закрывающийся. (Но существует и несколько одинарных тэгов.)

На самом деле, обычный файл, созданный каким-нибудь текстовым редактором, имеет тоже подобную структуру. Например, файлы, созданные программой Word, имеют подобную структуру. Но так как эти файлы воспринимает только одна программа Word, то нам не приходится разбираться во внутренней разметке этих файлов. А с файлами страниц сайта ситуация другая. Во-первых, эти файлы должны воспринимать все браузеры, всех производителей. А, во-вторых, в файлы страниц сайта можно вставлять тексты специальных программ. Эти программы называются скриптами. Выше уже говорилось, что в отличие от обычных программ в виде файлов, которые запускаются в операционной системы Windows, скрипты представляют собой тексты на каком-нибудь языке программирования (обычно на JavaScript или PHP). Вот эти самые тексты (скрипты) и нужно уметь вставлять в нужное место файла страницы. Поэтому приходится разбираться с устройством файлов страниц.

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

Набор правил, по которым расставляются тэги форматирования в файле страницы сайта, называется язык HTML. На самом деле, HTML это НЕ ЯЗЫК ПРОГРАММИРОВАНИЯ. (Его называют языком разметки страниц.) Чтобы изучить HTML совсем не обязательно быть программистом или иметь склонность к программированию. Если Вы когда-нибудь делали форматирование какого-нибудь текста в текстовом редакторе и у Вас после этого текст выглядел красиво и ровно, то никаких трудностей в освоении HTML у Вас не будет. Потому что расставить на нужных местах нужные тэги, это тоже самое, что и форматировать текст в редакторе. Только другими методами.

Существует много разных учебников по HTML. Их полно и в книжных магазинах в бумажном виде и в Интернете в электронном виде. Я рекомендую бесплатный электронный учебник, встроенный в хэлп бесплатного HTML-редактора HtmlPad FisherMan. В хэлпе этого редактора встроена целая куча разных учебников и справочников по построению сайтов. Советую перейти по ссылке на статью про этот редактор и там найти ссылку для бесплатного скачивания этого редактора.

В принципе, создавать и редактировать страницы сайта можно и с помощью, так называемых, визуальных редакторов. При этом знать язык HTML не нужно. Это примерно, как работа в обычном текстовом редакторе. Вы визуально видите все Ваше форматирование сразу на экране, как будто бы просматриваете страницу в браузере. Один из таких визуальных редакторов это наш старый знакомый Word от компании Microsoft. Любой вордовский файл можно сохранить не в виде текстового файла с расширением doc, а в виде html-файла с расширением html. Но, на самом деле, программой Word для создания страниц своего сайта никто не пользуется. Дело в том, что html-файлы, созданные через Word получаются очень огромного размера, они очень долго загружаются в браузер. У таких файлов очень сложная структура. Поэтому очень трудно там попоправить какую-нибудь мелочь. Чтобы что-то исправить, нужно всегда иметь копию файла в doc-формате, где надо вносить изменения и сохранять файл страницы и в doc и в html. Но самое плохое то, что поисковые системы, такие как Яндекс и Гугл очень плохо индексируют html-файлы созданные Вордом. Значит, если весь Ваш сайт будет состоять только из страниц созданных через Word, то Вы рискуете тем, что в выдаче поисковых систем, страницы Вашего сайта или совсем не будут появляться или будут очень далеки от начала списка. Поэтому я не советую для создания страниц Вашего сайта пользоваться универсальными редакторами.

Но есть и специализированные редакторы для создания и редактирования html-страниц своего сайта. Самые распространенные это DreamWeawer и FrontPage. Редактор DreamWeawer от компании MacroMedia более универсален для любых браузеров. Редактор FrontPage от компании Microsoft, разумеется более ориентирован на создание html-страниц максимально совместимых с их браузером Internet Explorer. Поэтому, если создавать страницы сайта через FrontPage, то в других браузерах сайт может выглядеть криво. (Но для Internet Explorer это будут идеальные страницы.) Поэтому редактор DreamWeawer более предпочтителен. Бесплатно скачать его можно здесь. (Из двух предложенных режимов скачивания выберите бесплатный режим скачивания без отправки SMS.)

Можно ли пользоваться только редактором DreamWeawer и совсем не знать HTML? В принципе, для создания очень простых сайтов, действительно можно пользоваться этим редактором и не знать HTML. Это такой примитивный любительский уровень сайтов. Особенно, когда Вам нужен статичный сайт из десятка страниц и простой навигации между ними. Если Вам потребуется что-то более сложное, то визуальный редактор может с такой задачей не справиться, особенно, если Вам нужны не статические страницы, а динамические. Вообще, запомните, что в сайтостроении все нестандартные вещи пишутся только "руками" на уровне HTML-кода. В визуальный редактор заложены только самые стандартные возможности. Хотя, для начинающего сайтостроителя и этих возможностей бывает более чем достаточно.

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

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

Наконец, есть еще одна очень важная вещь в структуре html-страниц. Это связь между разными страницами Вашего сайта. Для перехода с одной страницы сайта на другую применяются ссылки. В любом учебнике по HTML эта тема всегда очень подробно рассматривается. поэтому останавливаться на ней не будем. Замечу только, что когда планируете структуру своего сайта, то надо продумать, на каких страницах должны стоять ссылки, которые ведут на другие страницы. Это называется разработка навигации сайта. Обычно навигация по сайту делается в виде меню, но может быть и в виде гипертекстовых ссылок прямо в тексте страниц.

------------------

Автор статьи: Евгений Миронов.

[0] На какую тему создать сайт
[1] Файлы сайта
[2] Где физически находится сайт в Интернете
[3] Где логически находится сайт в Интернете
[4] Методы изготовления сайтов
[5] Основы раскрутки сайта
[6] Советы по оформлению сайта