Как выложить сайт на бесплатный хостинг

Как разместить готовый сайт в Интернете

В этой статье мы расскажем о том, как разместить свой сайт в Интернете. Инструкция подойдет тем, у кого уже есть готовый сайт (архив с файлами сайта).

Как разместить свой сайт в Интернете?

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

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

Пока этот архив хранится только на вашем компьютере, о существовании сайта никто не знает. Чтобы сайт появился в Интернете и его увидели другие пользователи, нужно разместить эти файлы в сети. Для этого нужно:

Привязать домен к хостингу.

Разместить сайт на хостинге.

Рассмотрим каждый шаг подробнее.

Шаг 1. Зарегистрируйте домен

Домен — это имя сайта в сети. Слова «домен» и «сайт» часто употребляют как синонимы, хотя это разные понятия. Сайт — это веб-страницы, которые отображаются в Интернете. Домен — это уникальный «адрес» сайта в сети. Если у сайта не будет домена, пользователи не найдут к нему путь и не увидят содержимое.

Чтобы выбрать домен, нужно определиться с доменной зоной и придумать доменное имя. Подбор домена и зоны зависит от целей и направленности сайта. В REG.RU можно выбрать домен в более чем 750 доменных зонах: международных, национальных и тематических. Определиться с выбором помогут инструкции: Как выбрать домен? и Как придумать доменное имя для сайта?

После выбора домена его нужно зарегистрировать. На странице заказа вы указываете контактные данные и выбираете срок регистрации домена — он зависит от доменной зоны. Например, для доменов .RU, .SU и .РФ максимальный срок регистрации — один год. А в международных зонах домен можно зарегистрировать на год, пять или десять лет.

Таким образом, зарегистрировать домен — значит арендовать его на определенный срок. Арендуя домен, вы становитесь его администратором. По истечении срока регистрации домен нужно будет продлить.

После регистрации ваш домен будет отображаться в Личном кабинете REG.RU. Через Личный кабинет вы сможете управлять доменом и менять его настройки.

Если вы зарегистрировали домен, переходите к выбору и заказу хостинга.

Шаг 2. Закажите хостинг

Хостинг — это площадка для размещения файлов сайта. Файлы размещаются на специальных компьютерах — серверах. Серверы постоянно находятся в сети и подключены к бесперебойному электропитанию. Благодаря этому размещенные на них сайты доступны круглосуточно. Таким образом, хостинг — это аренда места и мощностей.

В REG.RU вы можете заказать хостинг под свой проект: виртуальный хостинг, VPS или Dedicated. Самый популярный и простой в работе — виртуальный хостинг. На таком хостинге можно разместить любой сайт: от простого сайта-визитки до интернет-магазина.

• тариф: выбор зависит от количества сайтов, которые можно добавить в рамках одной услуги (от 1 до 70). Определиться с выбором поможет статья: Советы по выбору тарифа хостинга.
• срок заказа (от 1 месяца). Чем больше срок заказа, тем ниже цена за месяц.
• панель управления хостингом: ISPmanager, Plesk или cPanel. Через панель можно управлять настройками хостинга и размещёнными на нём сайтами. Как выбрать панель управления хостингом?

Как разместить сайт, написанный в HTML

После заказа хостинга нужно связать домен и хостинг между собой.

Шаг 3. Привяжите домен к хостингу

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

Домены состоят из букв и символов. Но «машины» понимают только язык цифр. При вводе доменного имени в поисковую строку DNS-серверы преобразуют его в IP-адрес. Затем по IP они находят нужный сервер, а на нём — искомый сайт, и отправляют эту информацию браузеру. Благодаря DNS-серверам в поисковиках отображается нужный сайт и пользователи посещают его.

Чтобы привязать домен к хостингу, нужно прописать хостинговые DNS-серверы (ns1.hosting.reg.ru, ns2.hosting.reg.ru) автоматически или вручную по инструкции: Как привязать домен к хостингу?

Как завести сайт в интернете

Если вы прописали DNS-серверы для домена, приступайте к размещению сайта в Интернете.

Шаг 4. Разместите сайт на хостинге

Есть несколько вариантов, как можно разместить свой сайт на хостинге. Например, это можно сделать через SSH и по FTP. Однако самый простой путь — размещение сайта через панель управления хостингом.

Чтобы разместить сайт через панель управления, нужно загрузить архив с файлами сайта в корневой каталог и импортировать базу данных (если она есть). В зависимости от выбранной панели это можно сделать по одной из инструкций: Как разместить сайт в ISPmanager?, Как разместить сайт в Plesk? или Как разместить сайт в cPanel?

После размещения архива с файлами сайт может быть доступен не сразу. Если ранее вы прописали или сменили DNS-серверы, дождитесь их обновления в течение 24 часов. DNS-серверы обновятся и сайт появится в Интернете.

Теперь вы знаете, как зарегистрировать свой сайт в интернете, и без труда сможете разместить свой сайт.

Получите все необходимые инструменты для быстрого запуска бизнеса в Интернете. В пакет «Быстрый старт» входят домен в зоне .RU, производительный хостинг и SSL-сертификат.

Объясни мне: как опубликовать свой сайт в интернете

Поку­па­ем домен, оформ­ля­ем хостинг, настра­и­ва­ем при­вяз­ку и зали­ва­ем фай­лы. Купа­ем­ся в лучах сла­вы.

Мы хотим сде­лать сайт и опуб­ли­ко­вать его в интер­не­те. К это­му момен­ту мы уже:

• сде­ла­ли стра­ни­цу «О себе» на чистом HTML, кото­рая ста­нет осно­вой для сай­та;
• купи­ли для неё домен mihailmaximov.ru;
• при­об­ре­ли хостинг , что­бы хра­нить там все нуж­ные фай­лы.

А теперь нам нуж­но подру­жить меж­ду собой эти три ком­по­нен­та, что­бы в ито­ге полу­чил­ся насто­я­щий сайт.

В чём суть это­го про­цес­са:

• Свя­зы­ва­ем домен и хостинг. Домен — это назва­ние сай­та, а хостинг — это место, где сайт хра­нит­ся и обслу­жи­ва­ет­ся. Нуж­но ска­зать интер­не­ту: «Этот сайт — это вон тот хостинг». Для это­го нуж­но кое-что настро­ить и на хостин­ге, и на домене.
• Ждём, пока интер­нет узна­ет об изме­не­ни­ях.
• Загру­жа­ем фай­лы наше­го сай­та на хостинг. Гото­во: они доступ­ны миру.

Раз­бе­рём это по частям.

Настройка хостинга

Сей­час у нас есть две отдель­ные услу­ги: домен и хостинг. Нуж­но их свя­зать, что­бы хостинг знал: «Если у меня запро­си­ли сайт с таким-то доме­ном, пока­зать вот такой сайт». Для это­го хостинг нуж­но настро­ить.

Все настрой­ки хостин­га дела­ют­ся в пане­ли управ­ле­ния. Ино­гда она опла­чи­ва­ет­ся отдель­но, ино­гда вхо­дит в сто­и­мость хостин­га. У SpaceWeb она бес­плат­ная, клю­чи от неё при­хо­дят на почту после реги­стра­ции хостин­га. Выгля­дит она так:

Нас инте­ре­су­ет вклад­ка «Доме­ны» — имен­но там дела­ет­ся при­вяз­ка доме­на к хостин­гу. Захо­дим туда и выби­ра­ем «Доба­вить домен». В поле вво­дим имя наше­го заре­ги­стри­ро­ван­но­го ранее доме­на. Эта запись ска­жет хостин­гу: «Когда тебе при­дёт запрос по это­му доме­ну, обслу­жи его»:

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

Если у нас в хостин­ге живёт несколь­ко сай­тов, нуж­но будет задать новую пап­ку. Но так как это наш пер­вый сайт на этом хостин­ге, оста­вим стан­дарт­ную:

Настройка домена

Мы научи­ли хостинг при­ни­мать запро­сы по адре­су mihailmaximov.ru. Но мы не научи­ли DNS-серверы в интер­не­те отправ­лять эти запро­сы на наш хостинг.

Что­бы это про­изо­шло, мы долж­ны рас­про­стра­нить по интер­не­ту новость: «Всем DNS-серверам! Если вам при­дёт запрос на mihailmaximov.ru, отправ­ляй­те его на spaceweb!». Эту рас­сыл­ку за нас сде­ла­ет наш реги­стра­тор доме­нов reg.ru — нуж­но лишь дать ему зада­ние.

Обнов­ле­ние дан­ных DNS может длить­ся от несколь­ких часов до пары суток — за это вре­мя интер­нет обле­та­ет инфор­ма­ция, что у ваше­го доме­на новый хостинг. Пока запи­си не обно­ви­лись, сайт mihailmaximov.ru будет выгля­деть так:

Отправляем файл на хостинг

Что мы име­ем сей­час: домен при­вя­зан к хостин­гу, хостинг готов обслу­жи­вать домен. Но нигде пока нет фай­лов наше­го сай­та. Маши­ны, кото­рые обслу­жи­ва­ют наш сайт, не зна­ют, что долж­но выво­дить­ся по запро­су. Нуж­но загру­зить фай­лы наше­го сай­та на хостинг.

Несмот­ря на то, что сайт мы толь­ко созда­ли, там уже что-то лежит. Раз­бе­рём­ся:

Привет, %username%!

Сегодня многие начинающие веб-разработчики делают большую ошибку, и не одну. Они что-нибудь сверстают, а потом покупают хостинг. Далее покупают домен. Регистрируют и подключают SSL-сертификат. Я, спасаясь от минус-кармы, просто расскажу как не тратить деньги на свои тестовые проекты.

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

Рекомендую для каждого такого проекта создавать новую почту и везде регистрироваться с помощью нее, а не своего личного мейла.

Хостинг

При запросе «Бесплатный хостинг« гугл первым, естественно после рекламы, предлагает 000webhost.com. Это весьма интересный хостинг — пользуясь им уже как два года, я заметил, что там все время меняется разрешенное количество бесплатных сайтов и другие условия, но главное, что он остается самым удобным.

Итак, на сегодня они предлагают:

• 1 бесплатный сайт
• 1 БД MySQL
• PHP Нескольких версий
• Подключение домена
• 300mb места на SSD (был гигабайт, жмоты!)
• FTP

Что делать?

1. Регистрируемся — это просто!
2. Нажимаем «Создать сайт», делаем, что там просят.

Доменное имя

Здесь нет идеального варианта для рабочих проектов. Но мы ведь собираемся заниматься мини-проектами и нам много не нужно — просто любой домен второго уровня. Нам в помощь — Freenom, он также первый в результатах поиска, у него нет аналогов — они всех их купили и получили от некоторых стран монополию на продажу их доменов.

Вот мы и приблизились к проблеме — на www.freenom.com доступны только домены всяких дальних африканских стран, где решили продвигать интернет, бесплатно раздавая свои домены: «.tk«, «.ml«, «.gq», «.cf», «.ga». Естественно, они такие же любители денег, как 000webhost и предоставляют домен бесплатно лишь на 12 мес. максимум, но его можно потом перерегистрировать.

Так что, выбираем.

Последовательность действий #1

1. Регистрируемся — это просто!
2. Идем во вкладочку «Services» сверху, а потом — «Register a new domain».
3. После все подскажет сам сервис.
4. После успешной регистрации домена снова нажмите «Services», а там — «My domains». Не закрывайте эту вкладку.

Последовательность действий #2

1. Снова заходим на 000webhost и видим наш сайт с некрасивым доменным именем третьего уровня (имясайта.000webhost.com). Исправим это.
2. Наводим курсор на красивую картинку — появл. надпись ‘»Управлять сайтом», нажимаем.
3. В левом сайдбаре видим «Инструменты», переходим по ссылке.
4. Интуитивно выбираем пункт «Указать веб-адрес»
5. Тут кнопочка — «+ Добавить домен», жмем!
6. Появляется прекрасное модальное окно, где выбираем первый пункт — будем «припарковывать» наш домен.
7. Вводим «Доменное имя», нажимаем на «волшебную кнопочку» [эту вкладку оставьте в фоне] и идем во вкладку, где оставили Freenom.

Последовательность действий #3

1. Тут, в таблице, напротив домена нажимаем по кнопке «Manage domain».
2. При нажатии на вкладку «Management Tools», появится селект, где нужно выбрать Nameservers.
3. Переключаем «Use default nameservers (Freenom Nameservers)» на «Use custom nameservers (enter below)»
4. Вводим внизу сначала «ns01.000webhost.com», а в следующей строке — «ns02.000webhost.com», а потом — «Change nameservers»
5. Возвращаемся в «Вебхосту» и напротив нашего домена «в ожидании» выбираем в селекте «Управлять» «Проверить сервера имен»
6. Видим что наш домен стал активным, снова нажимаем «Управлять» и привязываем его к нашему имясайта.000webhost.com

«Рак Интернета« — прекрасное альтернативное название — такому прекрасному бесплатному сервису. Я думаю, нам подходит. Кроме того, что CloudFlare защитит нас от DDOS-атак и прокэшиует наш сайт, ускоряя его, они нам подарят бесплатный сертификат. Это очень удобно.

Легко

1. Регистрируемся в CloudFlare, выбирая бесплатный план.
2. Добавляем наш сайт: вам нужно снова пойти и изменить серверы имен во Freenom — удалите старые и поставьте те, что предлагает сервис.
3. Вам сразу предложат настроить SSL, рекомендую пункт «Flexible».
4. В настройках много интересного.

Вместо заключения

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

вашего сайта, на все страницы, вот это:

Таким образом, Вы скроете надоедливое лого 000webhost. Многие движки, например Эгея, магическим образом сами его убирают.

При некоторой сноровке, возможно проделать все эти действия за

45 мин. Так на свет появилась «Пара Строк».

Я не надеюсь, что эта статья сиюминутно принесла вам пользу, но Вы всегда можете поместить ее в закладки на Хабре 🙂 Спасибо за прочтение!

Как опубликовать свой сайт на GitHub Pages

Итак, у нас есть заготовка сайта-портфолио, которую нужно опубликовать в интернете. Для этой задачи используем платформу GitHub. Это популярная платформа для разработчиков, которая позволяет бесплатно опубликовать простой сайт.

Для начала зарегистрируемся на Гитхабе. Откроем главную страницу. Здесь в форме нужно ввести логин, электронную почту и пароль для создания учётной записи. Нажимаем «Зарегистрироваться».

Регистрируемся на Гитхабе

Далее нужно подтвердить свой аккаунт, выбрать тарифный план (для нас подойдёт бесплатный) и затем подтвердить электронную почту.

Регистрируемся на Гитхабе

Итак, мы зарегистрировались. Что дальше? А дальше нам нужно создать хранилище, где будет лежать код сайта. Нажимаем ссылку New repository .

Добавляем репозиторий

Далее нужно выбрать название для хранилища, например my-site , и указать тип репозитория (у нас будет публичный). Обязательно устанавливаем галочку Initialize this repository with a README , а после нажимаем кнопку Create repository .

Создаём репозиторий

Репозиторий создан, теперь нужно загрузить файлы с кодом, для этого воспользуемся веб-интерфейсом Гитхаба. Нажмём кнопку Upload files .

Загружаем файлы

Перетащим файлы в появившееся поле для загрузки.

Загружаем файлы

По правилам, каждое изменение в репозитории мы должны сопроводить кратким описанием, что делает это изменение, например, «загружает файлы сайта». Добавим описание и нажмём кнопку Commit changes .

Добавляем описание

Готово! Сайт-портфолио залит на Гитхаб.

Сайт-портфолио на Гитхабе

Остаётся настроить его, чтобы сайт можно было открыть в браузере. Для этого нужно перейти в настройки репозитория Settings , пролистать настройки вниз до раздела GitHub Pages и в выпадающем списке выбрать ветку main . Изменения сохраняются автоматически.

Настраиваем репозиторий

Давайте теперь попробуем открыть сайт в браузере. Он будет доступен по адресу: [ваш логин].github.io/[название репозитория] .

Ура, сайт в интернете!

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

Редактируем текст на главной странице

Теперь вам нужно заново загрузить эту страницу на Гитхаб, добавив краткое описание, что делает изменение, например, «меняет текст на главной странице». Снова нажимаем Commit changes .

Загружаем изменённый файл

Через несколько секунд изменения появятся на сайте.

Сайт готов!