Сенсив-Код

Создать сайт самостоятельно с нулевым уровнем подготовки

Для многих обывателей создание сайтов кажется недостижимой задачей из области IT. Но сайты создаются ежедневно, и создаются разными людьми. К созданию сайтов нередко приступают люди, изначально далёкие от вышеупомянутой сферы деятельности. Безусловно, они не сразу становятся профессионалами, т.к. нужно накопить достаточный багаж знаний и опыта, постоянно совершенствоваться и развиваться, — однако с каждым шагом это приближает к такому уровню тех, кто жаждет освоить долгий, кропотливый, но интересный и удивительный путь веб-разработки. С чего же начинаются сайты?

создать сайт самостоятельно

Данный материал описывает базис создания управляемых сайтов (на базе CMS, Системы Управления сайтом), включающий основные ориентиры для размещения сайта в интернете, с использованием шаблонного веб-дизайна.

Статья будет полезна как для т.н. «чайников» (людей с нулевым уровнем подготовки), так и начинающим веб-дизайнерам (с базовыми знаниями HTML и СSS), которые представляют создание сайтов / отдельных веб-страниц, но весьма смутно представляют процесс размещения сайта в интернете. Материал может оказаться интересным для владельцев сайтов (заказчиков веб-услуг), желающих оценить уровень работ по созданию сайта или взглянуть на базовый процесс создания сайтов изнутри. Автор постарается избегать немотивированного использования спец. терминологии и объяснять всё «на пальцах». Между тем, некоторые из устойчивых обозначений пригодятся в качестве наводки для самостоятельного поиска. В любом случае, автор склонен организовать текст в прикладном ключе, с минимумом непонятных тезисов.

Условно, процесс создания сайтов (начинающий уровень) можно представить следующим образом:

  • Регистрация адреса сайта вида «www.mybusiness.ru». Покупка домена (доменного имени сайта).
  • Физическое размещение сайта в интернете. Выбор и оплата площадки для сайта (хостинг-провайдера). Привязка доменного имени.
  • Установка готовых Систем Управления Сайтов (движков) с шаблонным веб-дизайном. Выбор CMS для сайта с учётом обеспечения задач (информационный сайт, интернет-магазин), установка на сервер. Автоустановка CMS. Использование файлового менеджера (FTP-клиента) для перекачки файлов CMS на сервер, ручная установка CMS на сайте.
  • Администрирование структуры и наполнение сайта. Создание разделов, смена логотипа и информации на сайте.
    • Смена одного шаблонного дизайна на другой шаблонный дизайн
    • Установка нового логотипа в шаблонный веб-дизайн
    • Создание разделов сайта
    • Формирование пунктов навигационного меню сайта: привязка разделов к пунктам меню
    • Размещение информации в разделах сайта

Для более продвинутых [создателей сайтов] веб-дизайнеров существует совершенно иной масштаб работ, начиная от смены шаблонного веб-дизайна индивидуальным и заканчивая частичным или полным тюнингом CMS (установка готовых модулей, модульное программирование под индивидуальные требования, общая оптимизация сайта для быстродействия и поисковиков). В данной статье эти темы рассматриваться не будут.

Создать сайт самостоятельно при минимальном владении специальными навыками.

§1. Способ первый. Создать сайт бесплатно (на бесплатном хостинге)

Некоторые начинающие веб-дизайнеры уже ознакомились с сервисом Narod.ru, Narod2.ru (от Yandex), позволяющим создать простой сайт, используя готовые блоки. Другие обратили свои взоры к Ucoz.ru. Оба эти бесплатные конструкторы сайтов предоставляют неплохие инструменты, чтобы создать сайт самостоятельно (даже чуть больше, чем персональную страничку), без владения специальными навыками.

Достоинства бесплатных онлайн-конструкторов сайтов:

  • Действительно бесплатное создание сайта (на бесплатном хостинге и без приобретения домена)
  • Опыт создания сайтов не требуется
  • Создание сайта на основе готовых блоков и макетов
  • Возможность привязки собственного домена первого уровня к поддомену

Недостатки:

  • Поддомен (суффиксы http://mybusiness.narod2.ru, http://mybusiness.ucoz.ru)
  • Регламентированная реклама
  • Ограничения функционала

Бесплатные конструкторы сайтов подойдут для бесплатного некоммерческого информационного сайта. Если вас не смущают недостатки, то на этом варианте можно остановиться и вполне удовлетворительно существовать в интернете. Сайты на Narod2.ru, как детища Yandex`а, прекрасно ранжируются в этом поисковике. Вы даже сможете получать деньги от рекламы, заключив соответствующий договор.

§2. Способ второй. Создать сайт самостоятельно, условно бесплатно — на платном хостинге

Время создания сайта: ~1-2 часа

Сайт в переводе значит «место», т.е. сайт — это некоторое место в интернете, которое находится на некотором компьютере (компьютере хостинг-компании, постоянно подключенном к Сети интернет). Вы можете удивиться, узнав, что на сайте используются те же папки (каталоги), как на обычном домашнем компьютере, как, например, папка «Мои Документы», «Мои рисунки» или любая другая папка. Т.к. сайты обычно размещаются на специально сконфигурированных компьютерах хостинг-компаний, для осуществления доступа к ним используется специальный «Протокол передачи фалов», именуемый FTP (File Transfer Protocol). Осуществляя вход по FTP, вы можете переносить на сайт файлы и папки со своего компьютера, редактировать их. Для такой передачи существуют специальные программы, т.н. файл-менеджеры, или FTP-менеджеры, позволяющие по логину и паролю FTP-доступа, пройти к корневой (и любой другой) папке вашего сайта.

Если вы — веб-программист или начинающий веб-разработчик (с базовыми знаниями HTML / CSS), вы можете создать ряд уникальных веб-страниц, с собственным дизайном и объединённых ссылками, и перенести их на сайт.

§2.1. шаг 1 создание сайта. размещение сайта в интернет: регистация домена и аренда хостинга

Регистратор домена и Хостинг-провайдер — две разные конторы. Если первый позволяет за небольшую плату зарегистрировать на год уникальный домен (доменное имя сайта вида www.mybusiness.ru), то второй осуществляет физическое размещение вашего сайта: файлов, материалов и информации в интернете. Услуги хостинг-провайдера можно сравнить с услугами интернет-провайдера, который предоставляет вам домашний доступ в интернет. Различие в том, что хостинг-провайдер обеспечивает выход в интернет не вашему персональному компьютеру, а вашему сайту.

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

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

Куда идти для регистрации домена для сайта

Известными регистраторами доменов являются r01.ru, nic.ru. Неплохие цены предлагает atname.ru (лично не пользовалась). Стоит оговориться, что многие доменные имена на сегодня заняты, и прежде, чем начинать работу с хостингом и создание сайта, вам нужно определиться с доменом. Нейминг в интернете вещь хитрая. Домен должен быть, по возможности, кратким и запоминающимся; желательно — включать ключевые слова (на латинице), по которым вы рассчитываете продвигаться в поисковиках. После покупки домена сайта, вы получите доступ в административную область своего домена, где сможете редактировать данные, в т.ч., для присоединения домена к какому-либо хостингу. Обычно указываются DNS (сервера хостинга, на котором будут расположены файлы сайта). Пример вида NS-серверов (для хостинга, указанного ниже):

Первичный DNS-сервер: ns1.hc.ru 89.111.177.252
Вторичный DNS-сервер: ns2.hc.ru 79.174.74.74

Куда идти для покупки хостинга

Вы можете найти платный хостинг с наиболее подходящим тарифом (с поддержкой PHP и MySQL). Из русских, обычно я советую hc.ru — довольно безопасный хостинг по приемлемым ценам. Так, хостинг с дисковым пространством 5 Гб, поддержкой Php, MySQL (до 5 баз данных) и возможностью прикрепления 5 сайтов можно получить за 2520 руб. в год (цена указана на момент написания статьи, апрель 2012). Для покупки хостинга вам понадобится пройти регистрацию, выбрать план для заказа и оплатить удобным для вас способом. Современные хостинг-провайдеры принимают большинство электронных платежей, а также работают с банковскими квитанциями.

После оформления заказа, вам будут высланы письма, содержащие данные для доступа по FTP (File Transfer Protocol, протокол передачи файлов), к Панели Управления, где вы сможете создать таблицы баз данных MySQL и закачать CMS.

Частные случаи из практики. В некоторых случаях, вам потребуется создать настройки сервера на хостинге. Если вам попался такой хостинг, вы найдёте у него предоставленную информацию для правильной конфигурации сервера. Например, определение страниц по умолчанию, которые будут выводиться при запросе к корневой или внутренней папке — как правило, указывают перечень: index.html, index.php, index.shtml, index.php3, index.dhtml и т.д. Иногда требуется самостоятельно определить доступ по FTP — логин, пароль и папка, к которой будет осуществляться доступ. На большинстве современных хостинг-провайдеров все эти данные составляются автоматически и высылаются вам по почте.

Детали создания сайтов на хостинге (могут пригодиться). Практически на любом хостинге вы можете создавать несколько FTP-доступов, которые причем могут определять разные уровни (разные папки). На сервере сайта можно установить и использовать несколько CMS. На одном сервере можно держать несколько сайтов (прикрепить несколько доменов), использующих различные движки. DNS-серверы к данным доменам указываются одни и те же, а вот внутренняя конфигурация на сервере должна вести к разным папкам, которые вы зададите (конечно, если вы не хотите отображать одно и то же содержимое на нескольких сайтах). Вас может обескуражить, что корневая папка, являющаяся базовой папкой будущего сайта, может отличаться названием от приобретенного доменного имени, однако никакого противоречия здесь нет: это имя в интернете, при прикрепленном домене и верно указанных настройках, будет расцениваться как синоним основного домена.

§2.2. шаг 2 создание сайта: установка и автоустановка CMS на сайт

Существует несколько способов установить Систему Управления Сайтов (CMS) на свой сайт:

  • Выполнить автоустановку CMS, используя сервис хостинга
  • Выполнить установку CMS, используя FTP-клиент:
    • Предоставляемый хостингом, посредством браузера (Internet Explorer, Mozilla и др.)
    • Установленный на собственный компьютер

§2.2.1. Автоустановка Системы Управления Сайтом (CMS), используя сервис хостинга

Многие современные хостинг-провайдеры предлагают автоустановку популярных Систем Управления Сайтами. В этом случае, вам не понадобится копаться с базами данных MySQL. По сути, не понадобится даже FTP-клиент. Установка произойдёт автоматически: автоматически будет создана нужная база данных MySQL, автоматически перенесены нужные файлы CMS на ваш сайт. Всё, что от вас потребуется при автоустановке CMS: указать логин и пароль для административного доступа CMS (вход в админку), название будующего сайта, email администратора. Обычно автоинсталяция производится в 2-4 «шага». Назначайте требуемые данные и внимательно следите за информацией, описывающей каждый шаг, чтобы не оказаться, как в анекдоте: «Всю перрону обежала, вагону не не нашла».

Для создания информационного сайта, можно выбрать Joomla, для создания блога — WordPress (также подойдёт для создания информационного сайта), для создания форума (PHP BB).

Автоустановка CMS увенчалась успешно? По сути, вы уже создали свой сайт самостоятельно!

После автоустановки CMS, для управления содержимым вашего сайта, пройдите по адресу:

http://mybusiness.ru/admin
или, http://mybusiness.ru/administrator

(где mybusiness.ru — ваш домен). Обычно по этим адресам располагается админка движка. Введите логин и пароль администратора. Перед вами откроется интерфейс Панели Управления, организованный для изменения данных вашего сайта, создания страниц и рубрик, организации пунктов навигационного меню и др. У различных CMS интерфейс выглядит по-разному.

Стандартные опции администрирования сайта позволяют осуществить (как правило, с помощью всего одной-двух кнопок):

  • Смену одного шаблонного дизайна на другой шаблонный дизайн
  • Установку нового логотипа в шаблонный веб-дизайн
  • Создание разделов сайта
  • Формирование пунктов навигационного меню сайта: привязка разделов к пунктам меню
  • Размещение информации в разделах сайта

Подробные инструкции по администрированию в каждой конкретной CMS можно найти в интернете на сайтах поддержки (для популярных движков, действуют русифицированные сайты поддержки).

создать сайт самостоятельно - базовый дизайн

Создать сайт самостоятельно. Базовый дизайн WordPress

Следите за изменениями на вашем сайте в режиме реального времени, используя второе окно обозревателя, чтобы смотреть созданный вами сайт по адресу, который вы укажете на своей визитке: http://www.mybusiness.ru .

«И это всё?» — удивитесь вы, затратив на создание сайта около часа (т.к. оплачивали хостинг и домен между ланчем и обедом ещё вчера) и беспечно радуясь новой игрушке. Однако вы быстро убедитесь, что наполнение сайта незаметно сворует у вас ещё несколько часов, а логотип окажется совершенно не сочетаем с шаблонным дизайном сайта. В поисках платного шаблона, более или менее удовлетворяющего вашим предпочтениям, вы также незаметно убьёте ещё несколько часов. Купив шаблон примерно за 100 у.е., окажется, что он был рассчитан не на вашу версию CMS (а у одной и той же CMS может быть много версий и не всегда совместимых), или он просто встанет криво, или просто не захочет «вставать». Но даже если шаблон удачно и без проблем установится в вашу СMS, вы быстро удостоверитесь, что он совсем не отвечает вашим требованиям (требованиям фирмы), как предполагалось вами в воображении. Не смеюсь, но это правда жизни.

Если же вы — начинающий веб-разработчик, то добро пожаловать в наши ряды и одну из самых интереснейших профессий. Следующие главы данной статьи научат вас работать с FTP-менеджером и осуществлять полный контроль над сайтом и его файлами.

§2.2.2 Установка Системы Управления Сайтом (CMS), используя FTP-клиент

Установка CMS на сайт затребует от нас создания базы данных MySQL и, собственно, копирова

Выбор CMS. CMS — система управления сайтом, — набор скриптов, написанный на языке программирования (самый популярный — PHP), позволяющий произвести создание сайта при установке и настройке на своем сайте. CMS предоставляют возможности публикации ленты новостей, добавления комментариев к публикациям и управления всем содержимым на сайте, включая создание новых страниц, разделов, их редактирования и т.д. В большинстве случаев, все данные хранятся в специальных базах MySQL. Существует огромный выбор CMS, многие из которых можно скачать бесплатно. Кроме того, в интернете есть специализированные сайты, посвященные CMS и обзорам их функциональности в сравнении с другими, что позволяет выбрать CMS по своему усмотрению.

Автоустановка зачастую ограничивает выбор лишь отдельными СMS. В случае создания сайта при непосредственном взаимодействии с сервером (передачи файлов и папок по FTP), мы сами можем выбирать любую CMS, которую хотим видеть в качестве движка своего сайта. Однако прежде, чем устанавливать CMS, нужно создать базу данных MySQL, к которой мы будем подключать. Делать мы это будем через Панель Управления Хостинга.

Хостинг HC.RU, при оформлении заказа, предоставляет на выбор следующие панели управления (пожалуйста, не путайте Панель Управления Хостинга с Панелью Управления CMS — это разные вещи): Панель ХЦ (их собственная панель), cPanel (довольно распространённая мультиязычная панель управления, которую я встречала на зарубежных хостингах), DirectAdmin (также, довольно известная панель управления хостингом).

В Панели Управления Хостинга можно назначать и администрировать базы данных MySQL, домены, а также использовать т.н. «Диспетчер файлов» (обозначение в cPanel) или «Менеджер файлов» (в DirectAdmin), который и есть FTP. Ниже представлен вид DirectAdmin (выделены примечательные объекты управления).

создать сайт - программы создания сайтов - панель управления хостинга

Создание баз данных осуществляется через «Управление MySQL» (DirectAdmin) либо «Мастер баз данных MySQL» (cPanel). Придумайте название базы данных, имя пользователя и пароль к новой базе данных MySQL. Запишите их. Они потребуются при дальнейшей установке CMS на сайт.

Установка Системы Управления Сайтом (CMS), используя FTP-клиент, предоставляемый хостингом

Для того, чтобы загрузить какую-либо CMS, сначала её нужно скачать. Скачайте выбранную CMS на свой компьютер. (Обычно поставляется в архиве Zip.)

Ниже представлен Диспетчер файлов (cPanel). Именно через него мы будем загружать нашу CMS (используя кнопки «Загрузить» [1], а когда архив будет загружен — «Извлечь» [2] — не забудьте выделить архив «мышью»).

создать сайт - установка cms на сайт

После разархивирования, файлы и папки CMS появятся в «Диспетчере файлов».

Перейдите на ваш сайт, используя браузер (Internet Explorer, Mozilla или другой). Перед вами, скорее всего, окажется страница, где вы увидите логотип устанавливаемой CMS и приветствие к установке, с инструкциями дальнейшей установки. Если такой страницы не окажется, и вам выдало страницу от хостинга «Сайт находится в разработке», попробуйте прописать в адресной строке следующее: moy_sayt.ru/index.php. Если и это не дало результата, пропишите в адресной строке следующее: moy_sayt.ru/install/ . Неудачно? Ищите в интернете более подробные инструкции к установке выбранной вами CMS, или найдите в папке вашей CMS файл README и ознакомьтесь с информацией в нём, которая может дать нужные подсказки.

Если вы успешно прошли к странице приветствия установки CMS на cвоем сайте, вам потребуется внести некоторые данные, включающие подсоединение к базе данных MySQL, которую вы создавали. В качестве примера, мною используется WordPress CMS. После сообщений о том, что конфигурационный файл не составлен и предложения о его составлении (отвечайте согласием), WordPress выдаёт следующую страницу (она-то нам и нужна):

создать сайт на базе бесплатного движка

В качестве сервера базы данных чаще всего используется «localhost». Однако, если установщик говорит об ошибке, лучше проверить. Сервер базы данных можно посмотреть через PhpMyAdmin (в верхней строке), зайдя под логином и паролем баз данных. В случае затруднений, обратитесь в службу поддержки вашего хостинга, чтобы помогли вам найти значения для каждого из этих полей. Можете сказать, что вы устанавливаете CMS, и вам нужны данные для подключения к MySQL БД (сокр., от База Данных).

После занесения правильных данных, интерактивный установщик CMS выдаст положительный ответ и скажет: «Установка завершена!» с предоставлением ссылок к публичной части вашего сайта (которая будет видна всем будущим посетителям вашего сайта), и — административной части, в которой вы будете осуществлять администрирование — управление — своим сайтом.

По сути, вы уже создали сайт самостоятельно!

Установка Системы Управления Сайтом (CMS), используя FTP на личном компьютере

Ниже скриншот одного из FTP-менеджеров, — я использую Frigate, — (впрочем, все они довольно похожи друг на друга). Рабочее пространство выглядит примерно так:

создать сайт - ftp-клиент

Как видно на рис., рабочее пространство поделено на 2 части: в левой части отображаются папки собственного компьютера, в правой — папки и файлы сайта. Кнопки в верхнем меню файлового менеджера позволяют копировать (переносить) папки и файлы со своего компьютера на удаленный, редактировать, создавать новые, удалять и т.д.

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

Настройка FTP-менеджера для доступа к сайту по протоколу FTP. Перед вами откроется рабочее пространство, однако в правой его части пока ничего нет. Вам нужно нажать «Добавить новый сайт» или «Add New Site», или кнопку, аналогичную по смыслу. Здесь нужно ввести данные, такие как: логин и пароль FTP-доступа, путь к сайту (путь к корневой папке). В случае сомнений, обратитесь в службу поддержки вашего хостинга и попросите у них эти данные для своего сайта.

создать сайт - работа с ftp-клиентом

Внеся данные, щелкните дважды по установленному полю в правой части рабочей области, обозначающему ваш сайт. Вы попадете к папкам сайта, и щелкнув по корневой папке (скажем, htdocs), вы увидите индексную страницу своего сайта (индексная, от index, т.е. главная страница — скорее всего, в ней значится что-то вроде «сайт находится в разработке») .

После скачивания и распаковки архива CMS, у вас окажется папка выбранной CMS. Для того, чтобы установить CMS на свой сайт, вам надо перенести (копировать) содержмое этой папки в корневой каталог вашего сайта. В качестве примера я взяла CMS — WordPress.

Запустите FTP-менеджер, начните копирование со своего компьютера на удаленный компьютер, в корневую папку своего сайта.

Для копирования, выделите все папки и файлы в левой области рабочего пространства (нажмите на одну из папок, создав выделение, и, удерживая CTRL, продолжите выделение всех папок и файлов). Убедитесь, что в правая область рабочего пространства отображает именно корневую папку вашего сайта. Далее нажмите кнопку «Копировать», или «Copy», расположенную в верхней области.

создать сайт - перенос файлов на сайт

Будет происходить перенесение папок и файлов с вашего компьютера в корневую папку сайта. Это может занять некоторое время.

создать сайт - перенос файлов на сайт

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

создать сайт - перенос файлов на сайт

После успешного копирования, откройте браузер (Internet Explorer, Mozilla или другой) и пройдите на свой сайт. Если вы ещё не создали базу данных MySQL, создайте её через Панель Управления хостинга — описано выше. Заполните нужные поля в установщике СMS, включающие данные по подсоединению к MySQL. Если все данные указаны верно, установщик выдаст положительный результат установки, после чего вы сможете пройти в админку своей CMS, а также видеть публичную часть своего сайта.

По сути, вы создали сайт самостоятельно!

Этот материал опубликован в Сенсив-Код и тегирован , , , , , . Bookmark the permalink.

3 отзывов на Создать сайт самостоятельно с нулевым уровнем подготовки

  1. supermarkettvinternete говорит:

    Залез однажды в сайтостроение. На удивление нет ни одного внятного мануала по написанию сайтов. Что такое DNS

    • N.Volodina говорит:

      DNS — система компьютерных имен (от англ Domain Name System). Но это вы могли и прогуглить. Если говорить о конкретной роли DNS (а точнее, DNS-серверов) в создании сайтов, то в большей степени это касается указания DNS-серверов купленного вами хостинга для доменного имени, чтобы закрепить за последним использование именно этой площадки. Все это описывается в данной статье. Если вы покупаете хостинг с заранее прикрепленным доменом (большинство компаний предлагают домены бесплатно, при заказе хостинга), то такой домен уже будет настроен под ваш хостинг и ничего дополнительно делать не надо. Если вы новичок, и вам трудно вникать в множество значений новых слов, то лучше воспользоваться бесплатным предложением)

  2. Сергей говорит:

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>