Як створити веб-сайт: Посібник для початківців A-to-Z

У цій статті я покажу вам основні кроки у створенні веб-сайту.


  1. Зареєструйте доменне ім’я
  2. Реєстрація на веб-хостинг
  3. Створіть свою веб-сторінку
  4. Перевірте і протестуйте свій веб-сайт
  5. Фінтену і рости

Створити базовий веб-сайт легко. Сама трудова робота не повинна тривати більше години. Зрозуміти свій вибір і вписати їх у вашу ситуацію, однак, нелегкий подвиг.

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

Contents

Чому ви створюєте веб-сайт

Перш ніж ми розпочнемо, важливо спочатку визначити свою мету.

Ми всі знаємо, що веб-сайт може бути важливою частиною вашої присутності в Інтернеті – як суб’єкт господарювання чи фізична особа. Для окремої людини це може бути настільки ж простим, як основний профіль, або настільки ж детальним, як і весь ваш портфель. Для бізнесу це слід розглядати як частину ваших активів і стосуватися вашого профілю, продуктів чи речей, якими ви займаєтесь.

Маючи на увазі чітку мету, ви зможете прийняти краще рішення в дорозі – тобто які платформи використовувати, якими маркетинговими каналами займатися тощо.

Деякі типові причини, чому створюється веб-сайт:

  • Для продажу продукції – Якщо вашою основною метою є продаж товарів, ваш веб-сайт повинен містити вітрини товарів, інтернет-кошик для покупок, захищений шлюз платежів і, бажано, систему продажу.
  • До відображення інформації – Якщо ваша мета – відображення інформації про компанію або особисту інформацію, подумайте про створення простого веб-сайту на одній сторінці на доступній платформі.
  • Ділитися поточними ідеями та досвідом – Блог зазвичай найкращий для користувачів, які люблять писати та ділитися своїми ідеями з усім світом.

Ці причини не повинні бути взаємовиключними. Наприклад, у вас може бути веб-сайт, який поєднує два або більше вищевказаних елементів.

Основні кроки для створення власного веб-сайту

Після того, як ви відсортуєте цілі свого веб-сайту, саме час створити! Для початку вам потрібно спочатку …

1. Зареєструйте доменне ім’я

Що таке доменне ім’я?

Щоб створити веб-сайт, перше, що вам потрібно, – це доменне ім’я.

Ім’я домену – це адреса, яка ідентифікує ваш веб-сайт в Інтернеті. Деякі приклади включають Yahoo.com, Google.com або BuildThis.io (веб-сайт, який ви зараз читаєте).

Де зареєструвати доменне ім’я?

Щоб володіти доменом, вам доведеться зареєструвати його у реєстратора домену.

Реєстратор домену допоможе вам перевірити, чи унікальне ім’я домену, перш ніж дозволяти продовжувати реєстрацію. GoDaddy та NameCheap – два популярні реєстратори домену. Я дуже довго використовую їх для управління своїми доменами.

Як вибрати доменне ім’я?

Вибір доменного імені часто є найважчою складовою, оскільки він не тільки повинен відображати ваш бренд, але ще й бути простим, простим та незабутнім..

Ваше доменне ім’я повинно бути унікальним – ім’я не повинно належати іншій особі чи організації у всьому світі. Загальне правило, яке слід пам’ятати, щоб створити доменні імена:

  • Нехай це буде коротким і легким для запам’ятовування
  • Не використовуйте торговельні назви
  • Перейдіть до .com або .net, коли це можливо
  • Будьте креативними і використовуйте складені або складені слова
  • Спробуйте зробити його ключовим словом релевантним

Раціональні поради

  • Якщо вам важко з’ясувати доменне ім’я, ви завжди можете використовувати генератори доменних імен для ідей. Деякі з найбільш популярних є Wordroid і Lean Search Domain.
  • Якщо ви новачок, радимо зайти в GoDaddy або Namecheap, щоб знайти доменне ім’я. Обидва спрощують покупці та реєстрацію доменного імені для новачків.

2. Підпишіться на обліковий запис веб-хостингу

Що таке веб-хост?

Веб-хост – це великий комп’ютер (він же сервер), який використовується для зберігання файлів, необхідних як частина вашого веб-сайту.

Подумайте про це як про будинок, де зберігаються меблі та побутова техніка – будинок – ваш веб-хостинг і все, що виходить в будинок – це вміст вашого веб-сайту. Вміст веб-сайту, як правило, включає текст, зображення, відео та будь-які інші елементи, які ви вважаєте потрібними.

Які ви можете вибрати в хостингу?

Сьогодні веб-хостинг поставляється в різних пакетах. Традиційно постачальник веб-хостингу бере участь лише в оренді серверів за допомогою базового програмного забезпечення та технічної підтримки. Розміщення веб-сайту за допомогою традиційного хостинг-провайдера зазвичай дешевше та гнучкіше; але потрібно трохи додаткової роботи для налаштування веб-сайту.

На сьогоднішній день компанії поєднують різні послуги разом і дозволяють користувачам створювати, розміщувати та керувати веб-сайтами від одного постачальника послуг. Зазвичай ми називаємо цих компаній будівельниками веб-сайтів або будівельниками інтернет-магазинів. Розміщення веб-сайту на цих “пакетних” платформах зазвичай дорого і менш гнучко; але ви зможете легко створити веб-сайт або інтернет-магазин.

Хостинг-майданчик для початківців

Якщо ви тільки починаєте – базовий спільний хостинг, як правило, досить хороший. Для цього я рекомендую Єдиний план хостингу – який дозволяє розміщувати один веб-сайт за низькою ціною лише 0,80 дол. США / місяць.

Хостинг хостингЄдиний план хостингу – Розмістіть один веб-сайт із 10 ГБ SSD пам’яті та пропускною здатністю 100 ГБ (більше ніж достатньо для початківців) при $ 0,80 / місяць.

Хостинг-платформа для електронної комерції / інтернет-магазини

Якщо ви планували продавати продукцію безпосередньо зі свого веб-сайту (магазин електронної комерції), тоді слід перевірити Shopify Basic (початкова ціна $ 29 / місяць).

Shopify Platforms800 000 магазинів електронної комерції використовують Shopify, включаючи NBA Lakers Store та Tattly.com. Shopify Basic починається з $ 29 / місяць.

Хостинг-платформа для зручних веб-сайтів / малого бізнесу

Якщо все, що вам потрібно, – це простий веб-сайт для демонстрації вашого бізнес-портфоліо та контактних даних, пакетний варіант хостингу може бути правильним. Wix і Weebly – це два розробники сайтів, які мені подобаються – ми пишемо про них багато, і ви можете ознайомитись з нашими відгуками тут – огляд Wix / Weebly review.

Wix як пакетні опціїЗапропонований як онлайн-сервіс, Wix дозволяє вам працювати з візуальним редактором перетягування, щоб створити ваш веб-сайт, навіть якщо ви маєте нульові знання про кодування. План Wix Unlimited починається з $ 12,50 / місяць.

Раціональні поради

  • Доступні різні види хостингу: спільний хостинг, спеціалізований хостинг сервера та хмарний / VPS хостинг.
  • Якщо ви невеликий веб-сайт, дешевше відвідувати спільні плани хостингу. Для великих сайтів рекомендується використовувати або хмарний, або спеціалізований хостинг.
  • Деякі основні якості, які вам слід врахувати перед вибором веб-хоста, – це їх ціноутворення, швидкість роботи сервера та швидкість роботи. Хостинг (для новачків), а також хостинг InMotion і SiteGround (для великих веб-сайтів) – одні з популярних імен.
  • Подумайте про використання будівельника магазинів, наприклад Shopify або BigCommerce, якщо ви плануєте продавати товари безпосередньо зі свого веб-сайту.

3. Створіть свої веб-сторінки

Коли ви підготуєте своє доменне ім’я та веб-хостинг, настав час щось викласти в Інтернет. Щоб створити свої веб-сторінки, ви можете найняти веб-розробника або зробити це самостійно.

Ми детально обговоримо, як передавати тут завдання веб-розробки на аутсорсинг. Вам слід пропустити наступні кроки та перейти на цю сторінку, якщо ви плануєте найняти когось, щоб він розробив для вас веб-сайт.

Для DIYers, ось три простих способи розробки веб-сторінки:

1- Веб-редактор “Що-ти-бачиш-що-що-що-що-що” (WYSIWYG)

Редактор WYSIWYG дозволяє налаштовувати веб-сайт та розробляти веб-сторінки з нуля без необхідності кодування. Він працює так, як звичайний текстовий процесор – ви починаєте з шаблону чи порожньої сторінки, а потім створюєте сторінки свого веб-сайту. Після цього ви заповнюєте їх вмістом і завантажуєте всю папку на свій веб-хост за допомогою програми передачі файлів (FTP).

Для використання цього методу найкраще мати базові навички HTML / CSS та деякі загальні знання про те, як працює Інтернет.

Є кілька веб-редакторів WYSIWYG – деякі безкоштовні для некомерційного використання, а інші можуть вимагати платну ліцензію. Microsoft Expression Web, Веб-дизайнер Google, BlueGriffon, і Відкритий елемент кілька хороших, щоб перевірити.

Для програми FTP – FileZilla і WinSCP є двома найкращими безкоштовними варіантами.

Microsoft Expression - редактор WYSIWYGПриклад – ось скріншот веб-редактора Microsoft Expression Web. Список папок (зліва) – Структуруйте свій веб-сайт за допомогою папок. Редактор (в центрі) – Напишіть і відформатуйте текст тут. Стилі / Панель інструментів (справа) – Стиль та дизайн сторінки за допомогою CSS (необов’язково). Зауважте, що вам потрібно буде створити індекс імені сторінки (.html / .htm / .php / .asp) – він буде працювати як домашня сторінка вашого веб-сайту.

Цей параметр можливий, лише якщо ви використовуєте традиційний хостинг (тобто хостинг). Використання редактора WYSIWYG – це гнучко і весело, якщо вам подобається вивчати веб-кодування … але це не є можливим варіантом для початківців, які хочуть веб-сайт миттєво.

2- Використання системи управління вмістом (CMS)

Сьогодні більшість веб-сайтів створені та керуються за допомогою CMS. CMS має багато переваг з точки зору власника сайту. Вони прості в управлінні, гнучкі в дизайні та розробці, а економічно вигідні (безкоштовно!) – три ключові переваги.

Якщо ви ще не чули про це – WordPress, що працює ~ 33% усіх веб-сайтів в Інтернеті, – це найпопулярніша CMS у світі.

Для тих, хто вибирає звичайний варіант хостингу на кроці №2, ви можете встановити WordPress лише декількома клацаннями миші.

Встановлення WordPress в HostingerОсь як можна налаштувати WordPress на Hostinger. Увійдіть до свого облікового запису Hostinger, перейдіть на веб-сайт > Автомонтажник > WordPress > Налаштування пароля та імені веб-сайту > Встановити.

Ви отримаєте основні рамки веб-сайту, як тільки WordPress буде встановлений. Потім ви можете створити свої веб-сторінки за допомогою шаблону WordPress. Попередньо вбудовані шаблони WordPress є доступний безкоштовно на WordPress.org (офіційний каталог тем). Або ви можете придбати преміум-шаблони у професійних розробників, як Elegant Themes або Artisan.

Діша пояснив, як створити блог або веб-сайт за допомогою WordPress тут. Дотримуйтесь інструкцій, якщо вам потрібна додаткова інформація.

Примітка. Ви не можете використовувати CMS, якщо ви вирішили перейти на платформу “Bundle”, наприклад Wix або Weebly, на кроці №2.

3. Використання конструктора веб-сайтів / магазинів із перетягуванням

Конструктор веб-сайтів / магазинів із перетягуванням – це найпростіший і найшвидший спосіб створити веб-сайт.

Вам не потрібні навички веб-розробки – просто виберіть заздалегідь створений шаблон, візьміть потрібні веб-елементи у конструктора (наприклад, контактну форму, спадні меню, карту Google, кнопки оплати, кошик тощо) та повнофункціональний веб-сайт готовий.

Існує багато розробників веб-сайтів, розкиданих по Інтернету – Wix та Weebly – це два найпопулярніших. І як було сказано вище, Shopify буде чудовим вибором, якщо ви будуєте інтернет-магазин.

Демонстрація Wix

Створення та редагування веб-сайту за допомогою редактора WixРозробка веб-сторінки за адресою в Wix: Меню сайту (зліва) – Керуйте сторінками, вибирайте фон сайту, встановлюйте навігацію по сайту, додайте тексти та посилання, завантажуйте сюди зображення тощо; Вирівнювання (у центрі / зліва) – упорядкуйте та вирівняйте тут елементи веб-сайту; Попередній перегляд (угорі праворуч) – збережіть, перегляньте та опублікуйте свій веб-сайт.

Розробка веб-сайту за попередньо вбудованими шаблонами WixШаблони Wix – у Wix є сотні заздалегідь створених шаблонів (див. Усі).

Shopify demo

Створення та редагування веб-сайту за допомогою редактора ShopifyСтворіть свій інтернет-магазин із заздалегідь створеною темою на Shopify. Меню (зліва) – виберіть теми та додайте сюди елементи магазину (слайди, заголовки, зображення, колонтитули тощо); Попередній перегляд (в центрі / праворуч) – Попередній перегляд магазину тут.

Шопіруйте шаблониShopify пропонує широкий вибір безкоштовних та преміальних тем (див. Зразки).

Демонстрація веб-сайту Hostgator

Gator Website BuilderВикористання програми для створення веб-сайтів Gator – Меню (зліва) – Виберіть сюди теми, додайте сторінки та додайте тут розділ сторінки; Попередній перегляд (центр / праворуч) – переміщення між сторінками у верхній панелі навігації; зберегти, переглянути та опублікувати ваш веб-сайт.

Безкоштовні теми в Gator Website BuilderПовністю налаштовані та чуйні шаблони веб-сайтів, пропоновані в Hostgator Website Builder.

Раціональні поради

  • Переглядайте безкоштовні шаблони сайтів електронної комерції від Shopify, BigCommerce, Wix та Weebly на одній сторінці
  • Покрокові інструкції зі створення веб-сайту за допомогою Wix
  • Дивіться приклади веб-сайтів, створених за допомогою Wix
  • Покрокові інструкції для створення веб-сайту за допомогою Shopify
  • Дивіться приклади веб-сайтів, створених за допомогою Shopify

4. Перевірка та тестування вашого веб-сайту

Після того, як ваш веб-сайт буде готовий – настав час перевірити і перевірити, як він працює в основних браузерах (Chrome, Firefox, Safari, Microsoft Edge, IE 11 тощо), а також на різних розмірах екрана.

Ми можемо запустити ці тести за допомогою безкоштовних інструментів в Інтернеті.

Перевірка розмітки

W3C - Підтвердьте свій веб-сайт, як тільки ви закінчите із створеннямЛегко перевірити розмітку свого веб-сайту Служба перевірки розмітки W3C.

Що таке перевірка розмітки? Мови кодування чи сценарії, такі як HTML, PHP тощо, мають кожен формат, словниковий запас та синтаксис. Перевірка розмітки – це процес підтвердження того, чи відповідає ваш веб-сайт цим правилам.

Тест браузера

Тестуйте свій веб-сайт у різних браузерахПерехресне тестування вашого веб-сайту до 115 різних браузерів за один знімок Знімки браузера.

Екранне тестування

Перевірте свій веб-сайт у різних розмірах екранаВикористовуйте Скриня попередній перегляд веб-сторінки на моніторах, планшетах, смартфонах та інших розмірах екрана.

5. Тонка настройка та вирощування вашого веб-сайту

Опублікування вашого веб-сайту в Інтернеті є першим етапом. Є ще багато інших заходів, щоб забезпечити успіх вашого веб-сайту. Ось кілька завдань для початку …

Тонка настройка швидкості веб-сайту

Google чітко заявив, що швидкість сайту є одним із факторів ранжування. Це означає, що ваш сайт може бути вищим, якщо він швидко завантажується.

Крім того – чим швидше завантажується ваш веб-сайт, тим щасливішими будуть відвідувачі вашого веб-сайту. У незліченних практичних дослідженнях та експериментах доведено, що повільне завантаження веб-сайту може зашкодити користувачеві та вплинути на дохід веб-сайту. Amazon втратив би приблизно 1,6 мільярда доларів доходу, якби його сайт сповільнився ще на одну секунду.

Якщо поточна швидкість вашого веб-сайту повільна, навчитися її вдосконалювати.

Поліпшити видимість пошуку на веб-сайті

Вам не потрібно бути майстром оптимізації пошукових систем (SEO), щоб помітити ваш веб-сайт. Але деякі основні навички оптимізації пошукових систем завжди хороші.

Створіть обліковий запис веб-майстра за адресою Пошукова консоль Google подати свій веб-сайт у Google та виявити будь-які проблеми з SEO. Проведіть базові дослідження ключових слів, а потім оптимізуйте заголовок сторінки та заголовки для основних ключових слів. Реалізуйте розмітку схеми на своєму сайті, щоб вона виділялася на сторінках результатів пошуку.

Для отримання додаткових порад щодо SEO читайте наш посібник з манекенів SEO.

Впровадити HTTPS

З тих пір, як Google Chrome почав мітити HTTP-сайти “Не захищено”, сертифікат SSL став великою справою. Щоб переконатися, що ваш веб-сайт “довіряють” користувачам, HTTPS-з’єднання є обов’язковим.

Додайте основні сторінки

Жоден два веб-сайти не є однаковим, оскільки вони можуть слугувати іншим цілям та / або функціям. Однак на кожному веб-сайті є три стандартні сторінки: індекс (домашня сторінка), інформація про сторінку та сторінку контактів.

Домашня сторінка

Домашня сторінка часто є першим місцем, куди більшість відвідувачів завітають після приземлення на ваш веб-сайт. Ваша домашня сторінка повинна пропонувати правильний крок та залучати відвідувачів глибше до вашого сайту.

Приклад веб-сайту - HausПриклад – домашня сторінка Haus має чітке меню навігації та дизайн у стилі галереї (що ідеально підходить для вітрини товарів).

Про сторінку

Про сторінку – все про те, щоб створити звіт із відвідувачами. Це дозволяє вам представити себе та дати детальну інформацію (ну?) Про свій веб-сайт. Зазвичай рекомендується включати фотографії людей, які володіють та керують веб-сайтом.

Приклад веб-сайту - Bulldog SkincareПриклад – Сторінка про Бульдог Skincare надсилає приємне та незабутнє повідомлення.

Контактна сторінка

Важливо спілкуватися зі своїми користувачами та потенційними клієнтами. Звідси – сторінка контактів. Включіть усі можливі канали зв’язку (профілі соціальних медіа, форми контактів, електронна адреса тощо), щоб переконатися, що ваші відвідувачі зможуть зв’язатися з вами.

Приклад веб-сайту - SurvicateПриклад – сторінка контактів Survicate прекрасно оформлена з великими полями форми, чіткими закликами до дії; і складається з усієї необхідної інформації.

Розширюйте свою охоплення на платформах соціальних медіа

На вашому веб-сайті також має бути присутність на платформах соціальних медіа, на яких більшість цільової аудиторії тусується. Для BuildThis.io це означає Facebook та Twitter. Для інших це може бути LinkedIn, Tumblr або Pinterest.

Ось кілька порад з маркетингу соціальних медіа для початківців.

Додати фавікон

Ви бачили лист “Б“У жовтому колі, який з’явився зліва на вкладці веб-переглядача? Це відоме як “фавікон”. Як і логотип, фавікон – це менший візуальний елемент, який представляє веб-сайт.

Favicon – це чудова маленька техніка брендингу, яку власники веб-сайтів часто не помічають. Якщо це звучить як ви – скористайтеся цим безкоштовним генератором фавікону, щоб допомогти вам.

Створіть поширені запитання про веб-сайт

Чи можете ви зробити свій власний веб-сайт безкоштовно?

Ви можете створити безкоштовний веб-сайт, використовуючи безкоштовний веб-хостинг на зразок пропозицій 000Webhost або за допомогою безкоштовного плану, запропонованого деякими розробниками веб-сайтів. Наприклад, Wix пропонує безкоштовний план з обмеженими ресурсами, який підходить для невеликих веб-сайтів із невеликим обсягом.

Як створити веб-сайт для свого бізнесу?

Розробники веб-сайтів є ідеальним способом для малого бізнесу створити власні веб-сайти, не потребуючи аутсорсингу. Ці параметри не вимагають технічних знань і часто пропонують заздалегідь розроблені шаблони, які можуть бути корисними > Натисніть тут, щоб почати.

Який найкращий розробник веб-сайтів?

“Найкраще” – це суб’єктивний термін – те, що найкраще для нас, може бути для вас не підходящим. За рівнем популярності – Squarespace – найпопулярніший розробник веб-сайтів з 22% частки ринку. За ними слідують WiC та GoCadral GoCentral на другому та третьому місці відповідно.

Чи можу я створити веб-сайт у Google?

Google пропонує розробник сайтів як частину своєї лінійки продуктів G Suite. Ціни починаються від $ 5,40 / користувача / місяць.

Як створити PDF з веб-сайту?

Якщо на вашому комп’ютері встановлений зчитувач Adobe, ви можете створити PDF-файл із веб-сторінки bt, натиснувши CTRL-P. У меню друку, яке відкриється, виберіть вихід у PDF та збережіть файл.

Зроби це, зараз!

Тепер ви знаєте більш ніж достатньо для створення та створення успішного веб-сайту. Настав час викласти свої знання на роботу. Почніть зараз і скачуйте Інтернет!

* Переклад: EN ID

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map