|
Ръководство за разработка на Web сайт
Процесът на разработката на Web сайт включва от 4 етапа:
- Планиране
- Проектиране
- Създаване
- Поддържане
За всеки от тези етапи, можете да използвате ръководство, което да Ви помогне при разработката.
Етап Планиране
Когато се проектира един сайт, трябва да се вземат под внимание следните задачи:
- Да се анализират потребителите
- Да се анализират конкурентите
- Да се изработи стратегията на сайта
- Да се определи съдържанието
- Да се проучат възможните средства и технологии
- Да се направи план за разработването на сайта
Планиране: Анализ на потребителите
- Определете ясно целта, която искате да постигнете.
- Определете типа на потребителите на сайта. Ако е необходимо потърсете и мнение от колеги.
- Потърсете мнение от потенциялни потребители, използвайки техники като въпросници, интервюта, анализ на задачите, потребителски групи и разработка на сценарии
- Дефинирайте профила на вашия потребител
- Проучете конкурентите си – може да имате повече конкуренти, отколкото предполагате
- Направете оценка на сайтовете на конкурентите си, за да можете да направите своя сайт по–добър.
- Прегледайте други публикации по вашата тема и помислете за уникалнии стойностни черти, който само вашия сайт може да предложи.
- Определете вашата стратегия възможно най-ясно и подробно, за да може да реализирате чрез нея по-ефективно вашите цели
- Убедете се, че всяка страница от сайта отговаря на стратегията ви.
- Направете такава стратегия, в която има баланс между вашите цели, нуждите и вкусовете на потребителя, слабите и силните страни на конкурентите ви и наличните ви средства.
- Поставете си измерими цели
- Определете съдържанието, така че да реализира вашите цели и своевременно да бъде интересно за потребителите.
- Планирайте съдържанието, използвайки уникални и подходящи web технологии - потребителите ще оценят вашия сайт, ако представите информацията по начин, който не може да се срещне в другите медии.
- Използвайте адреси, които ще позволят на потребителите да намерят лесно вашия сайт.
- Планирайте съдържание, което ще се визуализира добре в потребителските браузери
- Помислете за технологиите, които ще използвате: HTML, фреймове, CSS, скриптови езици, JAVA аплети и др.
- Изберете технологиите, които най-добре биха реализирали целите ви.
- Уверете се, че имате уменията и ресурсите, за да използвате избраните технологии.
- Уверете се, че потребителите могат да използват тези технологии.
- Планирайте времето за разработка така, че да спазите изискваните срокове.
- Планирайте бюджета.
- Оформете екипа, който ще работи.
- Осигурете потребителска среда, за да получавате обратна връзка и за да можете да подобрите ефиктивността.
Планиране: Анализ на конкурентите
Планиране: Изработване на стратегия
Планиране: Определяне на съдържанието
Планиране: Проучване на средствата и технологиите
Планиране: План за разработване
Етап Проектиране
За да се проектира web сайта, трябва да се вземат под внимание някои важни черти на:
- Структурата
- Общият дизайн
- Текста
- Графичният изход
- Навигацията
- Фреймовете
- Включете потребители, за да ви помогнат да дефинирате потребителско-ориентиран дизайн на вашия сайт.
- Създайте диаграма, показваща зависимостите между отделните елементи в сайта.
- Използвайте хоризонтална, а не вертикална йерархия, тъй като така потребителят ще може по-лесно да се върне в началото, ако се загуби .
- Проектирайте сайта така, че да бъде достъпен за възможно най-много потребители. За целта осигурете поддръжка от повече браузери.
- Включете начална страница в сайта, която да съдържа въведение в съдържанието на сайта.
- Осигурете всяка информация да бъде на три стъпки от главната страница - иначе потребителите могат да изпуснат важна информация.
- Осигурете всяка страница от сайта да бъде достъпна от главната - директно или индиректно.
- Ограничете големината на страниците в сайта до екран и половина - иначе потребителя ще загуби контекста на информацията.
- Включете името на сайта в заглавието на всяка страница.
- Заглавието на всяка страница трябва да бъде уникално и подсказващо съдържанието страницата.
- Включете дата на последна редакция на страницата, за да може потребителя да прецени актуалността й.
- Включете информация за контакт, така че потребителите да могат да изкажат мнението си.
- Направете адреса на сайта ви (URL) колкото е възможно по-къс, за да се избегнат грешки при писане
- Предоставете търсене в сайта ви, за да подобрите достъпа до информация, особено в случаите на голям и сложен сайт
- Задавайте подходящи заглавия.
- Разположете важната информация в началото - така потребителят може да я прочете веднага и да продължи за повече детайли.
- Използвайте връзки, за да добавите по-подробна информация.
- Използвайте внимателно цветовете, за да може текста да се чете лесно на избрания фон. Убедете се, че има добър контраст между текста и фона. Най-добре е фонът да има цвят с ниска интензивност, за да не дразни очите.
- Избягвайте да използвате цветен, подчертан текст, за да не си помисли потребителя, че това е връзка.
- Използвайте bold текст, за да наблегнете на по-важна дума или фраза, но не го използвайте за цяло изречение, тъй като става трудно за четене.
- Използвайте Times New Roman и Arial шрифтовете.
- Не използвайте повече от 3 различни шрифта в сайта, тъй като текста ще стане труден за четене.
- Използвайте ляво подравнен текст, а не дясно подравнен или центриран.
- Проверете четливостта чрез използване на различни монитори и влияете на четимостта с различни фактори като шриф и големина на шрифта, цветове, контраст.
- Изхождайки от създадения профил на потребителя на сайта, проектирайте сайта в стил, който съответства на вкуса на потребителите.
- Използвайте празни пространства, за да облекчите страниците и за да обърнете вниманието на аспектите в дизайна – заглавия, графики, ...
- Представете своето съобщение ефективно и избягвайте безпорядъка.
- Обръщайте внимание на новата или променената информация - използвайте това означение - НОВО!!!
- Ограничете хоризонтално информацията на страница до 480 пиксела.
- Ограничавайте големината на страниците до 50 Kb , а на графиките до 30 Kb, защото така те ще се зареждат по–бързо. Ако имате по-голяма страница - помислете как да я разделите на няколко по-малки.
- Тествайте графичния дизайн.
- Решете дали ще използвате икони или текст за връзките. Опитните потребители имат склоност да разчитат повече на иконите, отколкото на текстовите етикети, тъй като те се възприемат по-бързо. От друга страна - да се използват икони, които ясно показват значението си не е лесно и потребителите често разчитат на етикетите, докато "научат" интерфейса. Следователно връзка, която съдържа и икона, и етикет ще задоволи и опитните, и начинаещите потребители. Ако използвате текст във вашите връзки - използвайте го минимално, но така че потребителя да разбере смисъла на връзката. Може да използвате скриптови езици, за да създадете текст, който се появява, когато потребителя премести мишката върху иконата.
- Информирайте потребителите за тяхното положение в сайта - осигурете лесен достъп до съдържание, от което може да се достигне всяка друга информация, винаги осигурявайте бърз начин за връщане в началната страница.
- Не използвайте за връзка цяло изречение, а само най-подходящата му част. Избягвайте връзки от типа " Click here ".
- Избягвайте връзки към външни страници, тъй като потребителят може да не се върне към вашата.
- Проверете дали всички връзки работят правилно и дали потребителите лесно и бързо могат да достигнат до цялата информация.
- Тествайте навигацията на сайта, за да разберете дали потребителя може да намери лесно информация.
- Използвайте фреймове в горната и в лявата област за навигация и идентификация. Ако връзките са икони - навигационната област може да бъде в горния фрейм, а ако са етикети - в левия.
- Използвайте навигационния фрейм, за да информирате потребителите за текущото им положение.
- Избягвайте да използвате скролиране в тези два фрейма.
- Осигурете версия на вашия сайт без фреймове.
- Премахнете фреймовете от всички външни връзки.
Проектиране: Структура
Проектиране: Общ дизайн
Проектиране: Текст
Проектиране: Графичен изглед
Проектиране: Навигация
Проектиране: Фреймове
Етап Създаване
При създаване на сайт, трябва да се вземат под внимание следните задачи:
- Подготовка за създаване
- Осигуряване на съвместимост с браузърите
- Създаване на картинките
- Използване на каскадни стилове
- Финални тестове
- Пускане на сайта
- Създаване на файловата структура на сайта и конвенция за имената на файловете
- Установяване на метод за контрол на версиите
- Генериране на образци на страниците
- Отделяне на съдържанието от интерфейса
- Използване на относителни връзки вместо абсолютни, тъй като те са по-лесни за създаване и преместване
- Създайте алтернативни версии за поддръжка на повече браузъри
- Използвате средства, за да определите коя версия на сайта да изпратите на съответния потребител - например можете да използвате скриптови езици като JavaScript или CGI, за да откриете версията на браузъра, нивото, което поддържа на JavaScript и т.н.
- Създавайте картинки, които ще се зареждат бързо – GIF са за предпочитане пред JPEG, защото са по-малки
- Създавайте картинки, които ще се виждат добре на повече монитори
- Създавайте картинки в най-подходящия формат
- Намалете размера на файловете с картинки чрез намаляване на цветовете
- Използвайте GIF, които могат да се зареждат на постепенно
- Запазвайте картинките за разрешаваща способност, подходяща за потребителските монитори
- Използвайте алтернативен тескт за всички картинки
- Дефинирайте стиловете глобално
- Дефинирайте спецификацията колкото е възможно по-високо в йерархията на наследяването и нека елементите по-ниско в йерархията да я наследят
- Използвайте абсолютни и относителни стилови спецификации, за да избегнете ръчното определяне на стил
- Когато прецифицирате шрифт, задайте желан, алтернативен и по подразбиране.
- Дефинирайте ясни правила за форматиране чрез CSS, така че разработваюите сайта да могат да ги спазват.
- Проверете дали имате ясни съобщения за грешка
- Прехвълете сайта на сървер, върху който да го тествате
- Направете тестване за качеството
- Направете тестване на използваемостта
- Тествайте в клиентска среда, за да видите как ще изглежда сайта при потребителите
- Прехвърлете сайта на сървера, от който ще бъде достъпен за потребителите
- Направете тестове за качеството и производителността
- Направете копие на сайта, от което да можете лесно да го възстановите при срив на сървера
Създаване: Подготовка
Създаване: Съвместимост с браузърите
Създаване: Картинки
Създаване: CSS
Създаване: Финални тестове
Създаване: Пускане
Етап Поддръжка
В етапа поддръжка на сайт, трябва да се вземат под внимание следните задачи:
- Администриране
- Реклама
- Обратна информация от потребителите
- Актуализирайте сайта редовно, за да може потребителите да проявят отново интерес
- Насочете вниманието на потребителите към промените в съдържанието чрез част "What's New"/”НОВО” или графични елементи, които индикират нова информация на страницата
- Проверявайте връзките редовни, корегирайте и изтривайте неработещите
- Следете използването на сайта
- Поставяйте ключови думи в meta информацията, за да дадете възможност на потребителите да открият вашия сайт чрез търсещи машини
- Анонсирайте вашия сайт в подходящи групи по интереси
- Рекламирайте вашия сайт на големи сайтове – сайтове като Yahoo и Netscape например предлагат начини да рекламирате при тях вашия сайт
- Рекламирайте чрез други медии, например списания, радио, телевизия
- Предложете на потребителите начин за връзка с вас и начин за получаване на обратна информация, например e-mail, въпросник, книга за посетителите на сайта
- За да поддържате добри взаимоотношения с потребителите на сайта, отговаряйте им, когато изразяват отношение по сайта
Поддръжка: Администриране
Поддръжка: Реклама
Поддръжка: Обратна информация от потребителите
Проверете готови ли сте
Етап Планиране
Планиране: Анализ на потребителите
|
|
Дефинирали ли сте целта на вашия сайт?
|
|
|
Дефинирали ли сте потенциалните потребители?
|
|
|
Получили ли сте мнение и информаця от потенциалните потребители?
|
|
|
Направили ли сте профил на потребителя?
|
Планиране: Анализ на конкурентите
|
|
Проучихте ли конкурентите?
|
|
|
Оценихте ли сайтовете на конкурентите си?
|
|
|
Проучихте ли други представяния по вашата тема и помислете за уникалнии стойностни черти, който само вашия сайт може да предложи?
|
Планиране: Изработване на стратегия
|
|
Дефинирахте ли стратегия?
|
|
|
Проверихте ли дали всяка част от вашия сайт поддържа стратегията?
|
|
|
Дали вашата стратегия е добре балансирана, отчитайки какви са вашите потребители, конкуренцията, а също и с какви ресурси и възможности разполагате?
|
|
|
Дали сте си поставили измерими цели?
|
Планиране: Определяне на съдържанието
|
|
Определихте ли какво е информационното съдържание, което вашите потребители намират като най-интересно, и което максимално ще ви помогне за постигане на целта?
|
|
|
Планирахте ли как да поднесете съдържанието използвайки максимално особеностите и предимствата на web технологиите?
|
|
|
Планирахте ли как да форматирате съдържанието с цел да бъде коректно показано от различните браузери които потребителя може да използва?
|
|
|
Получихте ли адрес за вашия сайт, който потребителите да запомнят и намират лесно?
|
Планиране: Проучване на средствата и технологиите
|
|
Обмисляхте ли всички възможни технологии които може да използвате?
|
|
|
Избрахте ли най-подходящата за вашите цели тейнология?
|
|
|
Сигурни ли сте че имате познания и ресурси за да реализирате избраната технология?
|
|
|
Проверихте ли дали потребителите могат да използват тази технология?
|
Планиране: План за разработване
|
|
Разработихте ли подробен план във времето за вашия проект?
|
|
|
Планирахте ли подробно как ще се използват наличните ресурси?
|
|
|
Привлякохте ли всички членове на колектива за работа по проекта?
|
|
|
Планирахте ли тестове с потребители за получаване на обратна връзка и подобряване на проекта?
|
Етап Проектиране
Проектиране: Структура
|
|
Проектирахте ли потребителски-ориентирана структура за вашия сайт?
|
|
|
Създадохте ли диаграма?
|
|
|
Направихте ли за всяка страница от диаграмата списък с нейните елементи и връзки?
|
|
|
Проектирахте ли йерархиите в широчина вместо в дълбочина?
|
Проектиране: Общ дизайн
|
|
Проектирахте ли сайта така, че да бъде достъпен за възможно най-много потребители?
|
|
|
Включихте ли начална страница?
|
|
|
Осигурихте ли всяка информация да бъде на не повече от три стъпки от главната страница?
|
|
|
Осигурихте ли всяка страница от сайта да бъде достъпна от главната - директно или индиректно?
|
|
|
Ограничихте ли големината на страниците в сайта до екран и половина?
|
|
|
Включихте ли името на сайта в заглавието на всяка страница?
|
|
|
Включихте ли уникално заглавие на всяка страница, подсказващо нейното съдържание?
|
|
|
Включихте ли дата на последна редакция на страницата?
|
|
|
Включихте ли информация за контакт?
|
|
|
Сигурни ли сте че всяка страница има свой адрес (URL)?
|
|
|
Избягнахте ли използването на препинателните знаци в адресите?
|
|
|
Използвахте ли само малки букви в адресите?
|
|
|
Запазихте ли адресите къси?
|
|
|
Използвахте ли по-съдържателно съобщение отколкото "доработва се (under construction)"?
|
|
|
Осигурихте ли време за отговор от 1 секунда за страница и 1/10 от секундата за бутоните?
|
|
|
Предоставихте ли средство за търсене в сайта ви?
|
Проектиране: Текст
|
|
Спазихте ли стандартите на вашата организация за използване на шрифтове?
|
|
|
Създадохте ли подходящи заглавия?
|
|
|
Разположихте ли важната информация в началото?
|
|
|
Използвахте ли връзки, за да добавите по-подробна информация.?
|
|
|
Използвахте ли цветове, с които текста да се чете лесно на избрания фон?
|
|
|
Избягнахте ли използването на цветен, подчертан текст?
|
|
|
Избягнахте ли използването на големи букви повече от една дума в текста?
|
|
|
Използвахте ли bold текст, за да наблегнете на по-важна дума или фраза?
|
|
|
Проектирахте ли с използването на шрифтовете по премълчаване в браузера?
|
|
|
Използвахте ли повече от максимално допустимите 3 различни шрифта?
|
|
|
Използвахте ли ляво подравнен текст?
|
|
|
Осигурихте ли начин за отпечатване на група свързани страници?
|
|
|
Проверихте ли дали текста е верен и пълен?
|
|
|
Проверихте ли четливостта?
|
Проектиране: Графичен изглед
|
|
Спазихте ли изискванията за дизайн на вашата организация?
|
|
|
Проектирахте ли така че да се виждат графиките?
|
|
|
Проектирахте ли сайта в стил, който съответства на вкуса на потребителите?
|
|
|
Използвахте ли празни пространства, за да облекчите страниците и за да обърнете вниманието на аспектите в дизайна – заглавия, графики и др.?
|
|
|
Постигнахте ли последователна визуална идентичност?
|
|
|
Представихте ли информацията ефективно и избягвайки безпорядъка?
|
|
|
Обръщате ли внимание на новата или променена информация?
|
|
|
Ограничихте ли хоризонтално информацията на страница до 480 пиксела?
|
|
|
Ограничихте ли големината на страниците до 50 Kb?
|
|
|
Тествахте ли графичния дизайн?
|
Проектиране: Навигация
|
|
Представихте ли еднообразни икони или текст за връзките?
|
|
|
Информирате ли винаги потребителите за тяхното положение в сайта?
|
|
|
Проектирахте ли връзките така че да имат ясни функции?
|
|
|
Ограничихте ли връзките до по-малка част от цяло изречение?
|
|
|
Придържате ли се към стандартните цветове на връзките в браузера?
|
|
|
Избягнахте ли връзки към външни страници?
|
|
|
Избягнахте ли използването на твърде много връзки в страница?
|
|
|
Използвахте ли връзки с подходящи имена?
|
|
|
Сравнихте ли текста на връзката със страницата до която се отива?
|
|
|
Сигурни ли сте че връзките се забелязват лесно в контекста?
|
|
|
Осигурихте ли данни за точния размер и формат на графиката-цел?
|
|
|
Разполагате ли с връзка към страница съдържаща само текста за разпечатване?
|
|
|
ВКлючихте ли адреса на страницата във варианта за отпечатване?
|
|
|
Проверихте ли че всички връзки работят правилно?
|
|
|
Тествахте ли дали потребителя може да намери лесно информация?
|
Проектиране: Видео
|
|
Осигурихте ли потребителите с телевизионно качество на видеото и звука?
|
|
|
Осигурихте ли начини за управление за потребителите?
|
|
|
Информирахте ли потребителите за вида и обема на видео материалите?
|
Проектиране: Фреймове
|
|
Използвахте ли фреймове в горната и в лявата област за навигация и идентификация?
|
|
|
Дали елементите в навигационния фрейм са разположени еднообразно?
|
|
|
Използвахте ли навигационния фрейм, за да информирате потребителите за текущото им положение?
|
|
|
Избягвате ли да използвате скролиране в навигационния и идентификационния фрейм
|
|
|
Осигурихте ли версия за отпечатване?
|
|
|
Осигурихте ли версия на вашия сайт без фреймове?
|
|
|
Премахнахте ли фреймовете от всички външни връзки?
|
Етап Създаване
Създаване: Подготовка
|
|
Създадохе ли файловата структура на сайта и конвенция за имената на файловете?
|
|
|
Установихте ли метод за контрол на версиите?
|
|
|
Генерирахте ли образци на страниците?
|
|
|
Отделихте ли съдържанието от интерфейса?
|
|
|
Използвахте ли относителни връзки вместо абсолютни?
|
Създаване: Съвместимост с браузърите
|
|
Създадохте ли алтернативни версии за поддръжка на повече браузъри?
|
|
|
Използвахте ли средства за откриване версията на браузъра, за да определите коя версия на сайта да изпратите на съответния потребител?
|
Създаване: Картинки
|
|
Създадохте ли картинки, които ще се зареждат бързо?
|
|
|
Създадохте ли картинки, които ще се виждат добре на повече монитори и браузери?
|
|
|
Създадохте ли картинки в най-подходящия формат?
|
|
|
Намалихте ли размера на файловете с картинки?
|
|
|
Използвахте ли картинките многократно?
|
|
|
Използвахте ли GIF-картинки, които могат да се зареждат постепенно?
|
|
|
Запазихте ли картинките за разрешаваща способност, подходяща за потребителските монитори?
|
|
|
Използвахте ли алтернативен тескт за всички картинки?
|
Създаване: CSS
|
|
Дефинирахте ли стиловете глобално?
|
|
|
Използвахте ли стилове навсякъде където е възможно?
|
|
|
Дефинирахте ли спецификацията възможно най-високо в йерархията на наследяването?
|
|
|
Използвахте ли абсолютни и относителни стилови спецификации?
|
|
|
Зададохте ли желан, алтернативен и шрифт по подразбиране?
|
|
|
Дефинирахте ли ясни правила за форматиране чрез CSS?
|
Създаване: Финални тестове
|
|
Има ли ясни съобщения за грешка?
|
|
|
Прехвърлихте ли сайта на сървер, върху който да го тествате?
|
|
|
Тествахте ли сайта за качесто (QA)?
|
|
|
Тествахте ли използваемостта?
|
|
|
Наблюдавахте ли как потребителите работят със сайта?
|
|
|
Тествахте ли в среда на потребителите?
|
Създаване: Пускане
|
|
Прехвърлихте ли сайта на сървера, където ще работи?
|
|
|
Направихте ли тестове за качество и производителност след прехвърлянето?
|
|
|
Направихте ли резервно копие на сайта?
|
Етап Поддръжка
Поддръжка: Администриране
|
|
Актуализирате ли сайта редовно?
|
|
|
Насочвате ли вниманието на потребителите към промените в съдържанието?
|
|
|
Проверявате ли връзките?
|
|
|
Следите ли версиите?
|
|
|
Следите ли използването на сайта?
|
Поддръжка: Реклама
|
|
Поставяте ли ключови думи в meta информацията?
|
|
|
Анонсирате ли вашия сайт в подходящи групи по интереси?
|
|
|
Рекламират ли ви на големи сайтове?
|
|
|
Рекламирате ли чрез други медии?
|
Поддръжка: Обратна информация от потребителите
|
|
Осигурено ли е получаване на обратна информация от потребителите?
|
|
|
Отговаряте ли на потребителите от които получавате обратна информация?
|
|
