Howto4all.net

Создать сайт на своем компьютере (локально). Эмуляция хостинг-сервера на домашнем ПК

Немного о процессе создания сайта локально на домашнем ПК.
Если Вы новичек, и никогда еще не создавали сайтов, Вас наверное интресует как вообще это делается и какими методами ? … В этой статье немножко попытаюсь об этом написать. Ведь сайты может создавать человек да вовсе не влядеющий программированием или углубленным знанием ПК. Да.. со временем, когда его требования начнут расти он будет понемногу изучать и разбираться во всем этом и повышать свою квалификацию, но изначально это не обязательно.

Например… Если Вы хотите создать свою страничку на которой будет только информация о Вас, немного графики, навигация будет осуществляться только по существующим статическим страницам (файлам), и Вам не нужно регистрировать пользователей – для этого достаточно воспользоваться графическими редакторами сайтов и можно создать сайт у себя на компьютере в отдельной папке и переместив его на сервер он будет работать. Когда же сайт планируется сделать интерактивным, с регистрацией пользователей, страница будет генерироваться в зависимости от параметров запроса, тогда Вам не обойтись уже без специальных средств которые предоставляет WEB-сервер. к таким средствам можно отнести:
SSI (Server Side Includes — включения на стороне сервера — несложный язык для динамической «сборки» веб-страниц на сервере из отдельных составных частей и выдачи клиенту полученного HTML-документа. Реализован в веб-сервере Apache при помощи модуля mod_include. Включённая в настройках по умолчанию веб-сервера возможность позволяет подключать HTML-файлы, поэтому для использования инструкций файл должен оканчиваться расширением .shtml, .stm или .shtm),
CGI (Common Gateway Interface — «общий интерфейс шлюза» — стандарт интерфейса, используемого для связи внешней программы с веб-сервером. Программу, которая работает по такому интерфейсу совместно с веб-сервером, принято называть шлюзом, хотя многие предпочитают названия «скрипт»/сценарий или «CGI-программа». Сам интерфейс разработан таким образом, чтобы можно было использовать любой язык программирования, который может работать со стандартными устройствами ввода/вывода.);
Perl (Высокоуровневый интерпретируемый динамический язык программирования общего назначения, созданный Ларри Уоллом, лингвистом по образованию. Название языка представляет собой аббревиатуру, которая расшифровывается как Practical Extraction and Report Language «практический язык для извлечения данных и составления отчётов». Основной особенностью языка считаются его богатые возможности для работы с текстом, в том числе реализованные при помощи регулярных выражений.)
PHP (англ. PHP: Hypertext Preprocessor — «PHP: препроцессор гипертекста», англ. Personal Home Page Tools (устар.) — «Инструменты для создания персональных веб-страниц») — язык программирования, созданный для генерирования HTML-страниц на веб-сервере и работы с базами данных. В настоящее время поддерживается подавляющим большинством хостинг-провайдеров. Входит в LAMP — «стандартный» набор для создания веб-сайтов (Linux, Apache, MySQL, PHP (Python или Perl)).
ASP (англ. Active Server Pages — «активные серверные страницы») — технология, разработанная компанией Microsoft, позволяющая легко создавать приложения для World Wide Web. ASP работает на платформе операционных систем линии Windows NT и на веб-сервере Microsoft IIS. ASP не является языком программирования — это лишь технология предварительной обработки, позволяющая подключать программные модули во время процесса формирования веб-страницы. Относительная популярность ASP основана на простоте используемых языков сценариев (VBScript или JScript) и возможности использования внешних COM-компонентов.

Если Вы решились на изучение этих средств, то Вам уже необходим для разработки какой нибудь Web-сервер. Основной рынок веб-серверов разделяют между собой Apache и Microsoft IIS. Apache устанавливают на серверах с платформой Unix/Linux, а Microsoft IIS устанавливают на серверах с платформой Microsoft Windows.
Apache HTTP-сервер (сокращение от англ. a patchy server — свободный веб-сервер. С апреля 1996 и до настоящего времени является самым популярным HTTP-сервером в Интернете. По статистике Netcraft, в августе 2007 года он работал на 51 % всех веб-серверов, в апреле 2008 года — на 49 %.
Основными достоинствами Apache считаются надёжность и гибкость конфигурации. Он позволяет подключать внешние модули для предоставления данных, использовать СУБД для аутентификации пользователей, модифицировать сообщения об ошибках и т. д. Поддерживает IPv6.
IIS (Internet Information Services, до версии 5.1 — Internet Information Server) — это проприетарный набор серверов для нескольких служб Интернета от компании Майкрософт. IIS распространяется с операционными системами семейства Windows NT.

Так как чаще всего выбор идет в сторону Apache поэтому у начинающих чаще всего возникает вопрос как установить его на компьютеры с ОС Windows.
На сегодня делается все это очень просто – достаточно установить себе на компьютер TopServer или XAMPP. И начать работать без изучения функционала сервера. Хотя как показывает жизнь – без этого никак. И Вам со временем все равно придется разобраться если не во всем функционалом вцелом, то с отделными его какими-то особенностями.

TopServer – является новой версией бесплатного сервера приложений.
XAMPP — кроссплатформенная сборка веб-сервера, содержащая Apache, MySQL, интерпретатор скриптов PHP и язык программирования Perl, и много дополнительных библиотек которые позволяют запустить полноценный веб-сервер.

Обсудить вопросы по установке и функционированию этих серверов можно по этой ссылке на нашем форуме.

http://berghowto.info/viewforum.php?f=127

Определения терминов взято из wikipedia.org

Комментарии | опубликовано: 19.03.2009 Шталинберг Александр

делаем шаблон HTML документа

Для упрощения работы можно приготовить себе шаблон. Если Вы только начинаете, это не так заметно, а когда нужно создавать чуть ли не каждый день какой нибудь документ, там для эксперимента, или очередного макета, то заново создавать его ой как надоедает. Так как мы народ ленивый, лучше сделать один раз, а потом юзать,так сказать, по накатанной. Я сейчас покажу выложу весь код, а потом разжую что где: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="www.bergsoftplus.com" />
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="css/global.css" type="text/css" media="screen" />
<title>zagotovko</title>
</head>
<body>
</body>
</html> И так по порядку, <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
что такое DOCTYPE , я напишу отдельную статью, сейчас скажу кратко, без него никак. Грубо говоря, он показывает браузеру, как правильно надо обрабатывать HTML код. Особенно сильно реагирует Internet Explorer, наш «любимый браурез» <meta http-equiv="content-type" content="text/html; charset=utf-8" /> это кодировка текста(контента) на сайте я ставлю utf-8. Здесь есть подробнее <meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="www.bergsoftplus.com" /> таак, по порядку, 1 — описание сайта, 2 — ключевые слова, 3 — автор. Ну говорят, что для поисковиков это уже не важно. Но я все равно, по старинке еще добавляю, кто его знает как потом все это перекрутится. <link rel="shortcut icon" href="favicon.ico"> иконка которая будет отображаться на панели вверху, как сделать себе иконку? Вам сюда ;) <link rel="stylesheet" href="css/global.css" type="text/css" media="screen" /> это я подключил файл с СSS стилями. Называется он global.css и находиться он в папке /css относительно файла index.htm. Как по другому еще можно подключить CSS-стили напишу позже.(Ну просто Наполеоновские планы :) ) <title>zagotovko</title> это то что будет отображаться вверху в браузере(заголовок). Совет по SEO-оптимизации: Очень полезно для индексирования в google, чтобы для каждой странички был свой title (заголовок). Еще лучше внятные заголовки с ключевыми словами. <html>
<head></head>
<body></body>
</html> как Вы поняли это обязательные теги, когторые должны присутствовать всегда (!) <body></body> в этом теге уже будет находиться сам макет….
И так как все это будет выглядеть вместе.
Создаю папку проекта(например zagotovka), в ней у меня по умолчанию папки CSS и IMAGES, стили и картинки соответственно.

Вот такая структура, _zagotovka это папка проекта, все файлы должны находиться в ней. Стили я выношу в отдельный файл тут он называется global.css пока это просто пустой файл. Ну и папка для картинок
Потом правда это может перерасти вот в такое, :)

Теперь уже не будете по сто раз делать одно и тоже. Также можно найти программку для верстки и этот шаблон использовать там. Сам я пользуюсь вот этой :)

Комментарии [5] | опубликовано: 18.03.2009 Andrey Gorbatiuk

Mozila, Opera, IE, Safari .... и тд

«мультибраузерность» это наше проклятие, в смысле тех кто верстает. С появлением IE 7.0 жить стало немного легче, уже сегодня я не ориентируюсь на «фанатов» IE 6.0. Но все равно надо быть внимательным, IE очень дотошный, ему все надо показывать очень точно.
К чему я это пишу, если Вы используете какой-либо указанный мною пример и он не работает в IE 6.0, звеняйте, я его игнорю. :)

Комментарии | опубликовано: 16.03.2009 Andrey Gorbatiuk

Рыба в макете, что это и для чего нужна.

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

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

Можно воспользоваться генератором текстов от Yandex . Максимально выбрать подходящую тематику и сгенерить текст.
Некоторые говорят, что лучше все-таки придумывать тексты по тематике, и по возможности смешные(смешное легко запоминается) да и клиент может отвлечься и легче принять макет. А они читают все, даже если это бред. :)

Комментарии | опубликовано: 16.03.2009 Andrey Gorbatiuk