Як створити сайт (з ілюстраціями)

Створення сайту-це відмінна можливість поділитися зі світом своїми ідеями і думками. Але якщо ви раніше цим не займалися, Створення сайту може здатися бентежить. Всі ці http-точка-щось-там, &#lt;tag this=""&#gt; і &#lt;tag that=""&#gt;, спроби помістити зображення або текст між ними... Ця стаття допоможе вам дуже швидко вникнути в деталі.

Частина1З 4:

Розробка веб-сайту

Пошукайте натхнення. Подивіться на сайти з відмінним дизайном і визначте причину їх успішності. Як правило, вона полягає в розстановці інформації, ресурсів, посилань і сторінок так, щоб користувач без праці міг знайти їх і використовувати. Для розробки дизайну власного сайту, погляньте на схожі сайти, щоб зрозуміти, як розташувати різні типи контенту.
- Не намагайтеся стрибнути вище голови.
- На першому місці у вас повинна стояти простота доступу до інформації. Якщо певна частина інформації прихована, зробіть так, щоб доступ до неї був логічний і простий в розумінні.
- І взагалі, чим простіше дизайн і чим менше сторінок, тим краще.
Виберіть тему і мета. Якщо ви вже вирішили, про що буде ваш сайт, пропустіть цей крок. Якщо ідей немає, ось кілька порад, які можуть вам допомогти. Для початку зрозумійте, що в Інтернеті сидять мільйони людей, і у багатьох з них є сайти. Якщо ви поставите перед собою завдання зробити щось, чого не було раніше, то ви ніколи не зрушите з мертвої точки.
- Яка думка першою приходить вам в голову, коли ви думаєте про Інтернет? Електронна торгівля? Музика? Новини? Соціальні мережі? Блоги? Все це хороші теми, щоб почати.
- Ви можете створити сайт, присвячений улюбленій музичній групі і організувати чат, в якому відвідувачі зможуть її обговорювати.
- Ви можете створити сторінку для своєї родини, але тоді вам варто бути вкрай обережним. Інтернет просто кишить неприємними особистостями, а викладена інформація про вашу сім'ю може в кінцевому підсумку бути використана проти вас. Встановіть парольний захист на сімейний веб-сайт.
- Якщо ви не можете жити без новин або хочете створити щось менш фільтроване, ніж звичайні ЗМІ, створіть сайт з відкритими стрічками новин від Reuters, BBC, AP та іншими. Створіть свій власний агрегатор новин (що раніше було прийнято називати незвичайним ім'ям «газета») і виводите в ньому всі новини в цифровому вигляді.
- Якщо ви вмієте красиво писати, можете створити блог і писати в ньому все що завгодно, і залучати щомісячних читачів!
Складіть план. Створення сайту зажадає від вас часу і грошей, тому встановіть обмеження по обох пунктах і приступайте. План не обов'язково повинен бути великою, складною таблицею або химерною графічною презентацією, але ви як мінімум повинні знати, яку мету він буде виконувати для вас і ваших відвідувачів, який контент ви збираєтеся там розміщувати, а також якою буде планування сторінок.
Подбайте про контент. існує безліч різних типів контенту, причому багато хто має свої особливості. Ви повинні з'ясувати, що найкраще підходить для вашого сайту і ваших потреб. Ось деякі пункти, які варто взяти до уваги:
- Магазин. якщо ви хочете продавати речі, вам потрібно з'ясувати, як зробити їх доступними для продажу. Якщо на продаж у вас є порівняно невелика кількість речей, розгляньте варіант з розміщенням заявки в існуючому магазині. Society6, Amazon і Cafepress-визнані інтернет-магазини з можливістю продавати різні предмети і встановлювати свої власні ціни.
- Медіа-контент . Ви хочете демонструвати відео або музику? Ви хочете викладати особисті файли у себе або де-небудь в іншому місці? Youtube і SoundCloud-чудові приклади медіа-хостингу, але ви повинні переконатися, що дизайн вашого сайту дозволяє їм правильно відображатися.
- Зображення . Ви фотограф або художник? Якщо ви плануєте викладати оригінальні зображення на своєму сайті, можливо, Вам варто використовувати формат, який здатний уберегти їх від крадіжки. Щоб максимально ускладнити їх скачування, зображення повинні бути відносно невеликими або прихованими за певним Flash-кодом.
- Віджети . Це міні-програми, які працюють на вашому сайті, допомагаючи вам відстежувати відвідувачів, відвідувані ними сторінки і їх місце розташування. Ви також можете знайти віджети для нотаток, календаря та інших функцій. Подумайте, які функції можуть виявитися корисними (головне переконайтеся, що завантажуєте віджет з довіреного джерела).
- Контактна інформація . Чи хочете ви розмістити на своєму сайті контактну інформацію? Для вашої власної ж безпеки, гарненько подумайте, яку інформацію варто робити публічною. Ні в якому разі не розміщуйте свою домашню адресу або номер телефону, ці дані можуть бути використані для крадіжки вашої особистості. Якщо у вас немає робочої адреси, ви можете завести поштову скриньку або спеціальну адресу електронної пошти для людей, які бажають з вами зв'язатися.
Намалюйте блок-схему. для більшості людей сайт починається з головної сторінки. Це сторінка, яку всі бачать, коли вперше заходять на www.вашсайт.com. але куди вони будуть переходити з цієї сторінки? Якщо ви витратите якийсь час на те, щоб придумати, як користувачі будуть взаємодіяти з Вашим сайтом, потім вам буде набагато простіше при створенні кнопок навігації і посилань.
Включіть в план призначені для користувача пристрої і ситуації. з недавніх пір смартфони та планшети стали неймовірно популярним пристроями для роботи в Інтернеті, і сайти необхідно проектувати спеціально під них. Якщо ви вирішили зробити сайт, який би витримав випробування часом і був доступний для максимальної кількості відвідувачів, зробіть різні версії свого сайту для різних пристроїв, або використовуйте універсальний дизайн, який би сам підлаштовувався в міру необхідності.

Частина2З 4:

Створення сайту

Виберіть метод і інструмент для створення сайту. коли у вас буде готова ідея і план її реалізації, наступним пунктом йде вибір способу створення сайту. Всіх варіантів незліченна безліч, а люди будуть пропонувати вам купити те чи це «чудове» додаток укупі з іншими речами, які «обов'язково повинен мати» ваш сайт. Однак реальність така, що існує всього кілька відмінних засобів для створення веб-сайтів, і лише один з них якнайкраще підійде вашій ситуації і потребам.
Створіть сайт самостійно. це перший варіант. Якщо у вас є програма для створення сайтів, на зразок Adobe Dreamweaver, створити сайт з нуля буде не так вже й складно. Для цього вам доведеться навчитися кодувати, але не панікуйте! HTML тільки виглядає складним, але це лише на самому початку, вам досить трохи освоїтися, а далі все піде як по маслу.
- Плюси: програма створення дизайну веб-сайту спрощує процес його створення, дозволяючи вам переміщати зображення, Тексти, кнопки, відеофайли і все, про що ви тільки можете подумати без необхідності розбиратися в HTML. Багато програм створення дизайну дозволять вам навіть створювати сайти, адаптовані під смартфон або планшет. Якщо ви хочете створити простий сайт для особистого використання, краще способу не знайти.
- Мінуси: незважаючи на те, що вникати в HTML не обов'язково, якесь навчання вам все ж доведеться пройти. Якщо ви дуже поспішайте, цей спосіб може вам не підійти. Найбільший мінус полягає в тому, що без досвіду в графічному дизайні ви можете створити сторінку, неприємну для очей. Для зниження такого ризику існує велика кількість безкоштовних шаблонів в самих програмах, а також в Інтернеті, проте не варто забувати про свої обмеження, якщо такі є.
Використовуйте систему управління вмістом (CMS). це варіант номер два. WordPress є відмінним варіантом для створення веб-сайтів. Він допоможе вам легко і швидко створити веб-сторінки і повідомлення в блозі, налаштувати меню, Додати і управляти коментарями користувачів і надає на вибір більше тисячі абсолютно безкоштовних тем і плагінів. Drupal і Joomla-теж хороші варіанти CMS. Після установки CMS ви можете управляти сайтом в будь-якій точці планети, де є доступ до Інтернету.
- Плюси: продукт дуже простий у використанні і і легко встановлюється , має безліч опцій налаштувань для новачків, а також досить складні і для досвідчених користувачів.
- Мінуси: не всі теми настроюються і безкоштовні.
Створення сайту з нуля. це третій варіант. Якщо ви вирішили створити свій сайт з нуля, почніть з використання HTML і CSS. Ви можете розширити свої знання HTML і додати більше можливостей і деталізації свого сайту. Якщо ви створюєте Професійний сайт, ці інструменти дозволять вам досягти того рівня, який вам знадобиться в будь-яких бізнес-починаннях:
- CSS означає "каскадні таблиці стилів". CSS дозволяє додати гнучкість в оформленні стилями HTML і полегшує внесення основних змін в оформлення сайту (шрифти, заголовки, колірна схема) в одному місці, з поширенням цих змін на весь сайт.
- XHTML-це мова для створення сайтів, стандартизований W3C. він майже ідентичний HTML, але має більш суворі правила розмітки інформації. В цілому це призводить лише до незначних змін при написанні коду.
- Придивіться до HTML5. Це п'ята редакція основного стандарту HTML, яка незабаром замінить поточну версію HTML( HTML4), а також XHTML.
- Вивчіть скриптову мову, що виконується на стороні клієнта, наприклад, JavaScript. Це дозволить додати на сайт інтерактивні елементи, наприклад, графіки, карти, та інше.
- Вивчіть скриптову мову, що виконується на стороні сервера. PHP , ASP з JavaScript або VB Script або Python здатні змінити відображення сайту для різних користувачів і дозволить створювати або редагувати форуми. Використання цих мов також дозволить зберігати інформацію про людей, які відвідують сайт: їх логіни, налаштування, а для комерційних сайтів також тимчасові «кошики» зі списком покупок.
- AJAX (асинхронний JavaScript і XML) – це технологія, що дозволяє використовувати скрипт, що виконується на стороні клієнта із запитом інформації з сервера без необхідності оновлення сторінки сайту, що часто значно скорочує час очікування відвідувачем і впливає на його враження про сайт, хоча і підвищує трафік. Це прекрасне рішення для комерційних сайтів і сайтів з великою кількістю відвідувачів.
Найміть фахівця. це четвертий і останній варіант. Якщо ви не плануєте самостійно займатися дизайном і вивчати мови програмування і протоколи (особливо якщо мова йде про складний сайт), то наймання фахівця стає кращим рішенням. Перш ніж зробити це, попросіть поглянути на портфоліо і уважно прочитайте відгуки.

Частина3З 4:

Тестування сайту і його запуск

Зареєструйте доменне ім'я. якщо ви обмежені в засобах, є варіанти покупки дешевого доменного імені . Виберіть доменне ім'я, яке легко запам'ятати і проговорити. Якщо ви використовуєте доменне ім'я, що закінчується на". com", підвищений трафік вам забезпечений, але більшість простих Імен вже зайняті, тому проявіть фантазію.
- Зверніть увагу на Network Solutions, GoDaddy або Register.com для пошуку і вибору ідеального доменного імені для вашого сайту. Wordpress також пропонує можливість використання їх домену третього рівня, наприклад, mywebsite.wordpress.com. але якщо ім'я, яке ви вибрали, також доступне як. com, ви побачите відповідне повідомлення при вході в систему.
- Ви можете зареєструвати доменне ім'я, якщо воно не закріплено або вільно для покупки онлайн на спеціальних сайтах. Перед покупкою дорогого доменного імені, непогано б отримати юридичний і фінансовий поради.
Обстежте свій сайт. Перед тим як запустити сайт, ретельно його перевірте. Більшість програм створення веб-дизайну мають можливість тестування сайту без необхідності його запуску. Перевірте код на наявність відсутніх тегів, битих посилань, оптимізації пошукових запитів і дизайнерських недоліків. Всі ці фактори можуть вплинути на трафік і доходи вашого сайту. Ви також можете безкоштовно і в лічені хвилини згенерувати повну карту сайту для пошукових систем, на зразок Google.
Протестуйте свій сайт. закінчивши Створення сайту, протестуйте його зручність і простоту використання. Ви можете попросити друзів або членів сім'ї перевірити сайт. Дайте їм певне завдання, наприклад, відредагувати свій профіль або купити светр з вовни альпака на сторінці з акціями. Сядьте поруч з ними і спостерігайте, як вони переміщаються по сайту, але не допомагайте їм. Можливо, ви знайдете області, в яких потрібно оптимізувати навігацію або пояснити інструкції. Крім цього, для проведення користувацького тесту різних типів взаємодії у конкретних груп населення Ви також можете скористатися чимось на зразок zurb.com. при тестуванні веб-сайту дуже важливо не забувати про різні платформи і переконатися, що веб-сайт відкривається на смартфонах і планшетах, а також на настільних комп'ютерах.
- Складіть список всього, що викликає у користувача труднощі або не є інтуїтивно зрозумілим.
Запустіть сайт! виберіть веб-хостинг і завантажте ваш сайт. Хостинг може мати опцію завантаження файлів по FTP, або ви можете завантажити собі на комп'ютер програму для завантаження файлів по FTP, наприклад, FileZilla або CyberDuck. Якщо ви найняли фахівця для розробки сайту, він цілком здатний зробити це за вас (але все ж не забувайте задавати питання, щоб мати уявлення про те, що відбувається).
- Майте на увазі, що існують способи розмістити сайт безкоштовно .

Частина4З 4:

Оцінка сайту

Уточніть концепцію. якщо ви робите це заради грошей, які ідеї можуть принести більше прибутку? Які ідеї вимагають більше вкладень? Які ідеї здаються гідними втілення? Раз вже робота над сайтом забирає у вас час, виберіть ідею, що викликає в вас більше ентузіазму (для більшої вигоди і практичності).
Визначте цілі і працюйте над їх досягненням. створений вами сайт може існувати заради забави, прибутку або для всього відразу. Знаючи, чого очікувати від сайту, Вам буде легше його спроектувати, а також зібрати і проаналізувати результати.
Будьте готові до конкуренції. прості контентні сайти вимагають менше вкладень, але через те, що будь-хто може зробити контентний сайт, конкурентів у них достатньо. Щоб отримувати прибуток від подібного сайту, ви надаєте інформацію і отримуєте прибуток завдяки рекламному трафіку, наприклад, через Google AdSense . Для оптимізації оголошень AdSense ви повинні цілеспрямовано скласти контент, щоб він був цікавий і приводив більше відвідувачів на сайт. Використовуйте певні ключові слова і терміни, які користувачі вводять в пошукових запитах. Тільки не перестарайтеся, інакше постраждає контент сайту, а користувачі навряд чи це оцінять.
Будьте готові до відповідальності. сайти електронної торгівлі, що продають товари, вимагають до себе більше уваги і обслуговування. Вам потрібно буде продумати відправку товарів, знижки, податки, безпечний протокол обміну даними SSL, поповнення запасів товарів, а також все інше, про що повинен піклуватися власник будь-якого магазину. Зворотній зв'язок і розгляд скарг вкрай важливі при продажу товарів онлайн. Багато компаній також надають покупцям підтримку по телефону, яку, при необхідності, ви можете передати стороннім постачальникам послуг.
- Якщо метою є тільки додатковий дохід, ви можете продавати продукти третіх осіб через партнерські програми, що дозволить вам заробляти без інвестування в продукти і турботи про їх відправку.
Визначте цільову аудиторію і ринок, який хочете охопити. яку категорію людей Ваш сайт буде обслуговувати? проведіть маркетингове дослідження , щоб дізнатися більше про вашу аудиторію. Ось що вам потрібно знати: чим вони займаються? скільки їм років? які їхні інші інтереси? Вся ця інформація зробить ваш сайт більш корисним. Однак не варто припускати, що ваш сайт буде зачіпати тільки одну групу – завжди звертайте увагу на тенденції, здатні зацікавити інші групи людей, щоб ви могли догодити їх інтересам заради нових можливостей.
Проведіть дослідження ключових слів. це необхідно, щоб зрозуміти, чи шукають користувачі теми, що відносяться до Вашого сайту, а також для вивчення ваших потенційних клієнтів. Наявність актуальних ключових слів на сайті також дозволить йому отримати більш високі позиції в рейтингу пошукових систем . Інструменти від Google (наприклад, Google.com/trends/ і Google.com/insights/search/ ), Overture та інші сторонні програми дозволяють спростити процес дослідження ключових слів.
- Розподіліть вибрані ключові слова по тексту, але так, щоб сам зміст не постраждало.
- Створення сторінок, оптимізованих під пошукові системи, допоможе людям знаходити ваш сайт, а це набагато важливіше дизайну. Що хорошого в сайті, який ніхто не бачить?
Реклама. коли сайт буде запущений, вам потрібно якось залучити відвідувачів, так дайте їм знати про це!
- Відправте ваш сайт на індексацію основними пошуковими системами. Ви можете зробити це самостійно або скористатися послугами спеціальних сайтів.
- Розкажіть друзям. Постійно нагадуйте про сайт в twitter. Додавайте інформацію про сайт в оновленнях статусу на Facebook, публікуйте скріншоти на Flickr, додайте посилання на нього в свій профіль на LinkedIn. Важливо робити це скрізь і всюди. Чим більше відвідувачів буде у сайту, тим краще.
- Використовуйте e-mail адресу з вашим доменним ім'ям. Відвідуйте інші сайти, які доповнюють ваш (але не конкурують), пропонуйте обмінюватися посиланнями або гостьовими записами в блозі. Пишіть конструктивні коментарі в блоках і форумах і залишайте посилання на сайт в підписі.
- Використовуйте контентний маркетинг. Створення SEO-оптимізованих статей і розміщення їх на інших сайтах іноді є корисним способом створення зворотних посилань на ваш сайт. Це може допомогти вам підвищити рейтинг сайту в пошукових системах, а також завжди бути в курсі оновлень пошукових систем, що часто впливає на SEO стратегії і може зробити їх марними або навіть знизити рейтинг вашого сайту.
Забезпечте якісний контент і обслуговування. перш за все, слухайте своїх читачів і клієнтів, вчіться на їх досвіді у використанні вашим сайтом.
- Приймайте всерйоз конструктивні коментарі. Інші члени команди, шанувальники та друзі можуть підказати нові ідеї для спрощення навігації.
- Думайте про ваш цільовий ринок або аудиторію: про їхні потреби, їх розчарування, їх обставини. Намагайтеся зробити їх життя легше і більш інформованою.

Поради

Люди часто поспішають. В середньому, у вас буде від 3 до 7 секунд, щоб привернути погляд користувача, тому вкрай важливо, що відвідувачі вашого сайту побачать першим. Щоб скоротити час завантаження сайту, не перевантажуйте його важкою графікою. Використовуйте стиснення, де це можливо. Використовуйте помітні технології JavaScript, Flash, Streaming Audio/Video та інші економно і тільки якщо це дійсно важливо для представлення сайту.
Якщо ви наймаєте фахівця для написання коду складного сайту, майте на увазі, що програміст і дизайнер – це різні професії. Більшість ефектних сайтів були створені із залученням фахівця з графічного дизайну. Для створення складного сайту особливо корисно буде найняти хорошу команду: дизайнери проектують зовнішній вигляд і представлення сайту; програмісти роблять всю внутрішню частину, щоб сайт працював; маркетологи позиціонують сайт і піклуються про його релевантності в пошуку; а контент-менеджери створюють вміст.
Якщо ви продаєте якийсь продукт, який користувачі знайдуть через пошукові системи, переконайтеся, що вони відразу ж побачать Його, коли зайдуть на ваш сайт. Чим більше відвідувач робить кліків, тим імовірніше те, що він піде на інший сайт.
Знайдіть популярні сайти і використовуйте їх в якості зразка, навіть якщо вони не дуже-то поєднуються з вашим. Що вони роблять правильно? Що цікавого в їх відображенні, змісті та навігації по сайту? Включіть відповідні аспекти того, що ви дізнаєтеся від перегляду цих сайтів в свій власний сайт, адаптуючи під свої вимоги.
Почніть з простих речей, розвивайте їх і шукайте способи вдосконалення, навіть якщо початковий результат буде... не дуже. Не намагайтеся вникнути в усі відразу.
Якщо ви плануєте продавати продукти через свій сайт, Ви повинні мати безпечний спосіб приймати платежі кредитними картками. Ви можете відкрити комерційний рахунок, з якого будуть списуватися комісії за транзакції, або використовувати безкоштовні платіжні сервіси, на зразок PayPal. Завжди уважно читайте інформацію, надруковану дрібним шрифтом. Майте на увазі, що багато кредитних фондів вимагають гарантії у разі втрати або пошкодження відправленого товару (також зверніть увагу на страхування).

Попередження

Ніколи не обманюйте довіру відвідувачів. Поважайте їх особисту інформацію. Спам, докучливі спливаючі вікна, недоречна реклама зіпсують вашу репутацію. Одним із способів завоювати довіру є чітко сформульоване Положення про конфіденційність. Розмістіть помітне посилання на положення про конфіденційність на кожній сторінці сайту, а також скрізь, де запитується особиста інформація відвідувача. Розмістіть справжню контактну інформацію. Якщо вам необхідно розмістити рекламні оголошення на сайті, поясніть відвідувачам причину і покажіть, що докладаєте максимальних зусиль, щоб зробити їх відвідування приємним. Тільки чесно!
Якщо ви використовуєте контент з іншого сайту, будь то зображення, код JavaScript або щось інше, отримайте дозвіл і додайте оригінальне джерело. Якщо ви цього не зробите, на вас можуть подати до суду.
Запам'ятайте: ніколи не видаляйте дані про свій аккаунт (логін, пароль і так далі). Якщо у вас не буде даних, і ви їх забудете, у вас не більше буде можливості далі працювати з сайтом. Що ще важливіше, нікому не кажіть ці дані (за винятком адреси сайту).
Не захоплюйтеся особливо «новітніми віяннями» маркетингових сайтів. Деякі поради бувають корисними, і до них варто прислухатися, але більшість не варті і гроша. Маркетинг - це не наука, а тривалий і постійно мінливий експеримент. Ви найкращий суддя того, як працюють (або не працюють) ваші стратегії просування. Найдієвіший підхід з усіх, це прислухатися до ваших відвідувачів і вчитися на їхньому досвіді.