Публикувано: Обновено:
Подписали сте договор за сайт. Минават три седмици. Агенцията праща линк: „Готово, вижте“. Отваряте го и менюто не е това, което искахте. Цветовете също. Връщането назад сега струва време и пари.
Основните етапи в разработката на уеб сайт са осем: планиране, структура, домейн и технология, съдържание, дизайн, разработка, тестване с публикуване и поддръжка. Всеки етап дава конкретен резултат. Всеки завършва с одобрение, преди да започне следващият. Така грешката се хваща, докато е евтина.
Тук описваме етапите от гледна точка на клиента: какво получавате, какво проверявате и кога казвате „да“. Те важат за всички уеб сайтове, от лендинг до магазин. Ако правите уебсайт от нулата сами, по-подходящо е ръководството как се прави уеб сайт. Ако търсите изпълнител, екипът на CreateWeb минава през същите етапи с всеки проект.
Кои са основните етапи в разработката на уебсайт
Етапите са осем и вървят в строг ред, защото всеки ползва решенията от предишния. Дизайн без структура се прерисува. Код без одобрен дизайн се пренаписва.
| Етап | Какво получавате | Какво одобрявате |
|---|---|---|
| 1. Планиране | бриф с целите, аудиторията и функционалностите | обхвата на проекта |
| 2. Структура | схема на страниците и скици | списъка страници и менюто |
| 3. Адрес и платформа | избрана платформа и адрес | технологията |
| 4. Съдържание | текстове, снимки, цени | всеки текст преди макета |
| 5. Дизайн | макет за компютър и телефон | визията на ключовите страници |
| 6. Изграждане | работещ сайт на тестов адрес | функциите на тестовия адрес |
| 7. Проверки и публикуване | доклад от проверките, сайт на живо | пускането |
| 8. Поддръжка | обновления, копия, отчети | плана за поддръжка |
В учебниците по информационни технологии етапите често са пет или шест, от проектирането до публикуването и поддръжката. Разликата е само в групирането. Същността е една и съща.
Планиране: как да определите целите и нужните функции на уебсайта
Планирането отговаря на три въпроса: за кого е сайтът, какво трябва да направи посетителят и какви функционалности са нужни за това. Всичко останало следва от тези отговори.
Целевата аудитория решава езика, тона и устройствата. Целта решава бутоните: обаждане, запитване, покупка, записване. Функционалностите са конкретни: форма за контакт, онлайн плащане, резервации, многоезична версия, вход за клиенти.
Резултатът е писмен бриф. В него има бизнес цели, аудитория, конкуренти и списък функции. Проверете дали всяка функция е описана точно. „Форма за контакт“ е неясно. „Форма, която праща запитване на имейла на фирмата и копие на клиента“ е ясно.
Част от брифа е и дефиниране на това, което не влиза в проекта. Това пази и двете страни от спорове по-късно. Какво пише в такъв документ, обясняваме в статията за договор за изработка на уеб сайт.
Избор на домейн, хостинг и технология за сайта
Домейнът е адресът, хостингът е сървърът, а CMS е система за управление на съдържанието, с която сменяте текстовете сами. Изборът се прави по функциите от брифа, не по навик.
Подходящо домейн име е кратко, лесно за диктуване и без тирета, ако може. Повече по темата има в статията какво е домейн. Хостингът зависи от трафика и от платформата. Как се преценява, пишем в ръководството как да изберете уеб хостинг.
За платформите изборът най-често е между три пътя: – WordPress за сайт на фирма, блог и повечето магазини (с WooCommerce); – Shopify за по-големи търговци, които искат готова система за плащания; – Magento или разработка по поръчка за големи ecommerce проекти със сложни интеграции.
Сравнение на системи за управление има в статията как да изберете CMS. Одобрявате технологията писмено. Смяната ѝ по-късно значи нов сайт.
Структура, съдържание и дизайн на уеб сайта
Структурата на сайта е списъкът страници и връзките между тях, съдържанието е текстът и снимките, а дизайнът е как изглеждат. Правят се в този ред, защото дизайнът се прави около реални текстове.
Структура. Получавате карта на сайта: всички страници на един лист. Повече за нея има в статията какво показва картата на уеб сайт. После идват скиците, наречени wireframe. Те показват реда на блоковете без цветове. Проверявате дали всяка начална страница и всяка услуга водят посетителя до целта.
Съдържание. Текстове, снимки, цени, отговори на честите въпроси. Съдържанието на сайта е най-честата причина за забавяне. Започнете го още при планирането.
Дизайн. Дизайн на уеб сайта означава макет за компютър и телефон. Той е ключов елемент от онлайн присъствие на фирмата. Добрият дизайн е интуитивен: посетителят намира бутона без да търси. Уникален дизайн значи макет, направен само за вашия бизнес. Готовата тема не е такъв. UX решенията, тоест как се движи човек из интерфейса, се проверяват още тук. Дизайнът трябва да е съобразен с аудиторията, не с вкуса на изпълнителя. Графични елементи като икони и илюстрации също се одобряват в макета.
Разработка: как се изгражда уебсайт за мобилни устройства и търсачки
Тук одобреният макет става работещ сайт, който е оптимизиран за телефон и за Google от първия ден. Не се добавя по-късно като отделна задача.
Google ползва мобилната версия на сайта за индексиране и класиране. Това пише в документацията на Google за mobile-first индексирането. Затова разработчикът проверява всяка страница първо на телефон.
SEO оптимизация на този етап означава основа в кода: адреси, заглавия, вътрешни линкове, скорост, структурирани данни. Ключови думи за всяка страница се избират още при структурата. Тази основа е част от всяка изработка при нас. SEO като отделна услуга не предлагаме.
Тук идват и интеграциите: плащания, куриери, CRM, аналитика. Получавате тестов адрес, на който виждате сайта, преди да е публичен. Ако изпълнителят няма тестов адрес, питайте защо.
Защо и как се тества сайтът преди публикуване
Проверките хващат грешките, преди да ги види клиент: счупени форми, бавни страници, разместен дизайн на телефон. Без тях първата проверка я прави първият посетител.
Какво се проверява: – всяка форма и всеки бутон, на телефон и компютър; – различни браузъри: Chrome, Safari, Firefox, Edge; – скоростта на зареждане по Core Web Vitals; – HTTPS, пренасочвания и достъп до админ панела; – дали сайтът е достъпен за потребителите с увреждания.
За скоростта има ясни прагове. Според web.dev най-големият елемент трябва да се зареди до 2,5 секунди (LCP). Реакцията на клик трябва да е до 200 милисекунди (INP). Разместването на страницата трябва да е до 0,1 (CLS). Измерва се при 75% от зарежданията. Повече има в статията за Core Web Vitals.
След проверките сайтът минава на истинския адрес. В деня на пускането се настройват Google Analytics 4 и Search Console. При смяна на стар сайт пренасочванията се правят преди пускането. Как, обясняваме в статията за миграция на сайт.
Техническа поддръжка на уеб сайта и актуализация след старта
Поддръжката на уеб сайта е редовна техническа поддръжка: ъпдейти на системата и разширенията, резервни копия, проверки за сигурност. Без поддръжка на уеб сайта той остарява и става уязвим.
Развитието е отделна част. В нея влизат ново съдържание, подобрения по данните от посетителите и обновяване на цени и услуги. Потребителско поведение се вижда в аналитиката: къде хората спират, кои страници напускат. Това показва какво да се подобри.
Актуалност на текстовете също е работа. Стара цена или стар телефон гонят потенциални клиенти. Какво включва поддръжката, обясняваме в пълното ръководство за поддръжка. При нас тя е отделна услуга за поддръжка и струва от 50 до 500 € на месец, по избор.
Как минават етапите при CreateWeb
При нас осемте етапа са групирани в пет и всеки завършва с ваше одобрение, преди да започне следващият. Не пишем код върху неодобрен макет.
- Бриф и анализ. Уточняваме бизнес целите, аудиторията и конкурентите.
- Структура и wireframe. Скицираме страниците без дизайн и решаваме навигацията.
- Дизайн. Макет за компютър и телефон във Figma, с до 3 кръга корекции.
- Изграждане и проверки. Изграждаме сайта на WordPress, WooCommerce или Shopify и проверяваме форми, скорост и съвместимост на тестов адрес.
- Пускане и обучение. Прехвърляме сайта на вашия адрес и показваме как да го управлявате.
Правим сайтове от 2018 г. Екипът е от шестима души и досега е направил над 40 проекта. Работим изцяло онлайн: срещи по видео, одобрения по имейл. Всеки етап има писмен срок в договора, а кодът и данните са ваши. Готови проекти, които можете да отворите, има в портфолиото ни.
Как да изберете подходящ специалист или фирма за изработка на сайт
Изборът на партньор се прави по процеса: питайте как минават етапите и какво получавате на всеки. Добрият изпълнител отговаря конкретно.
Пет въпроса преди подписа: 1. Какъв документ получавам след планирането? 2. Ще одобря ли макета, преди да се пише код? 3. Ще видя ли сайта преди пускането? 4. Колко кръга корекции са включени? 5. Чии са кодът, дизайнът и съдържанието след края?
Ако отговорът е „ще видим“, това е знак за внимание. Още проверки има в статията за оферта за изработка на уеб сайт.
Колко време и средства са нужни за създаване на сайт
Срокът и цената зависят от вида сайт: лендинг страница е около седмица, сайт на фирма 2 до 4 седмици, онлайн магазин 8 до 12. Това са нашите срокове, от одобрения бриф до пускането.
| Вид сайт | Цена при CreateWeb | Срок |
|---|---|---|
| Лендинг страница | от 1 000 € | около 1 седмица |
| Фирмен сайт | 1 500–8 000 € | 2 до 4 седмици |
| Корпоративни сайтове | 1 500–8 000 € | 4 до 8 седмици |
| Онлайн магазин | 3 000–15 000 € | 8 до 12 седмици |
Срокът расте най-често от чакане: на текстове, на снимки, на одобрения. Всяко одобрение, което чака седмица, мести края със седмица. Отделно остават името на сайта (15 до 40 € годишно), сървърът и поддръжката. Подробно за цената пишем в статията колко струва изработката на сайт, а услугата е описана на страницата изработка на уебсайт.
Най-честите грешки, когато правите уебсайт от нулата
Най-честата грешка е прескачане на етап, за да се спести време. Спестеното се връща като преработка.
- Дизайн без текстове. Макетът се прави с примерен текст, после истинският не се събира.
- Неясен бриф. Функциите са описани с една дума и всяка страна ги разбира различно.
- Одобрение „на око“. Дизайнът се гледа само на компютър, а повечето посетители са на телефон.
- Без тестов адрес. Клиентът вижда сайта чак на живо.
- Без план за поддръжка. Сайтът тръгва и никой не го обновява.
Добри практики важат за всички бизнеси, от личен блог до голям магазин: един етап наведнъж и писмено „да“ в края му. Персонализация на функции идва след старта, когато има данни.
Често задавани въпроси
Колко етапа има разработката на уеб сайт?
Изработката обикновено има осем етапа, от планирането и структурата до пускането и поддръжката. В учебниците често са пет или шест, защото някои се групират. При нас са пет групи, всяка с одобрение от клиента. Броят е по-маловажен от реда.
Кой етап отнема най-много време?
Най-често съдържанието и изграждането. Изграждането зависи от функциите: магазин с плащания и куриери отнема повече от сайт с няколко страници. Съдържанието зависи от клиента. Ако текстовете и снимките са готови в началото, целият проект върви към долната граница на срока.
Мога ли да пропусна етап, за да стане по-бързо?
Можете, но обикновено излиза по-скъпо. Пропуснатият бриф води до преработен дизайн. Пропуснатите проверки водят до грешки, които вижда клиент. Ако бързате, по-добре намалете обхвата на първата версия и добавете функциите после.
Какво да подготвя преди първата среща с агенцията?
Подгответе едно изречение за целта на сайта, списък на услугите или продуктите и два или три сайта, които ви харесват. Полезни са и логото, брандбукът и снимки. Ако имате стар сайт, носете достъпа до него и до Google Analytics.
Какво е wireframe и защо се одобрява преди дизайна?
Wireframe е схема на страницата без цветове и снимки. Показва реда на блоковете и бутоните. Одобрява се преди макета, защото преместване на блок в схема отнема минути. В готов макет отнема часове, а в готов код още повече.
Какво получавам след края на проекта?
Получавате работещ сайт, достъп до админ панела и обучение за управление на съдържание. Кодът, дизайнът и съдържанието трябва да са ваша собственост. Проверете това в договора още преди подписа.
Нужна ли е поддръжка след пускането на сайта?
Да, ако сайтът трябва да работи сигурно и бързо. Системата, темата и разширенията получават обновления редовно, а пропуснатото обновление оставя известни уязвимости отворени. Поддръжката включва и резервни копия, за да се върне сайтът при проблем.
Заключение: етапите пазят бюджета ви
Ефективен уебсайт рядко идва от бързане при създаването на сайта. Идва от осем ясни етапа, всеки с резултат, който виждате и одобрявате.
Нашето мнение е, че най-важният етап е одобрението на дизайна, преди да се пише код. Тук промяната струва най-малко, а клиентът за първи път вижда сайта си. Изпълнител, който го прескача, прехвърля риска на вас.
Ако искате да минете етапите с екип, който ги разписва в договора, свържете се с нас.
