SEO архитектура и дизайн на сайт

Уебсайтовете са инструмент за комуникация, който се изработва с определена цел. Те са просто един канал от вашия маркетингов микс, който трябва да достигне до определена целева аудитория. Затова всеки сайт има една целева страница с която ние продаваме нещо, внушаване нещо или предизвикваме аудиторията да направи нещо. Тя е най-важната страница в сайта и ние така трябва да го подредим, че посетителите да се насочват към нея.

seo funia

В SEO оптимизацията е известно правилото на „плоската фуния“ в което се казва, че колкото по-близо до началната страница са вътрешните страници, толкова по-добре. Ако разгледате внимателно картинката по-горе ще видите, че колкото по-навътре във фунията влизат посетителите, толкова по-голям процент от тях отпадат.  

Един добре построен сайт трябва да е така подреден, че до абсолютно всяка страница да се стига на 3 клика разстояние.

Затова е необходимо страниците да са разположени на възможно най-малък брой кликвания от index страницата. За предпочитане е адресът да бъде vashiat-sait.com/prodavan-produkt.html, а не vashiat-sait.com/kategoria1/podkategoria/prodavan-produkt.html. Колкото по-далеч са продуктите от началната страница, толкова по-малко PageRank им се предава.

По принцип най-висок  PageRank имат началните страници на сайтовете. Тъй като с линковете се предава ранг на линкваните страници е добре той да се предаде само на най-важните страници в сайта, а не на всички страници по равно. Това е така, защото ако се предава на много страници PR ще се разпръсне по равно, става пренебрежимо малък и се обезсмисля.

Ако страниците са тухлите  в стената на вашата къща, то линковете са свързващото звено между тях

За това в индекса (фронтпейджа) се поставят линкове към най-важните страници на сайта, а в тях линкове към всички останали вътрешни страници. Така улеснявате търсачката при индексирането и правите всички страница да са достъпни за ботовете. Накрая не забравяйте, че вътрешни връзки трябва да сочат към съответните най-важни страници, за да ги засилят. Може да използвате навигация от типа предишна-следваща страница.  Ето пример за логическа структура на сайт:

сео книга

За да подсилите тези страници, често се използва т.н. Siloing архитектурата. Тя помага за изясняване на важността на ключовите думи и е основен инструмент за оптимизация. Терминът siloing възниква, като начин за групиране на информация, свързана в отделни категории и секции в рамките на един уебсайт. Едно silo или силоз представлява група от тематично свързани страници. С него увеличавате тежестта на определени категории в сайта и ги обособяваме в един силоз или т.н. – silo. Съществуват две стратегии за изграждане на Silo: физически силоз и виртуален силоз

1. Физическото Silo организира информацията от дървото на сайта, като го категоризира по ключови думи и по физически файлове разположени в директории на сървъра, подредени в папки и под папки. Например, ако продавате GSM категориите ще са различните марки, като Самсунг, Нокия, LG и т.н, затова създаваме физическа папка за всяка категория и поставяме връзки към тях в менюто на началната страница на сайта.

2. Виртуално silo – хъб страница. Тази стратегия се използва, когато работим с някоя готова CMS система и не може да си подредим папките на сървъра в искания ред. Налага се да го направим виртуално, като свържем с линкове самите страници по теми и така търсачката да разбере коя е най-важната, според разположението на връзките между тях. Най-просто казано, това е поредица от уеб страници в Интернет, свързани помежду си с хипервръзки. Търсачките смятат хипервръзките за силен сигнал относно значението на обектите. За най-важните си ключови думи направете по една хъб (централна) страница, на която освен текст ще поставите и връзки към всички страници на сайта си посветени на нейната тема. А от тези подстраници направете линкове към главната хъб страница.

В един виртуален силоз, всяка поддържаща страница е свързана с основната категория и също така с другите поддържащи страници за тази категория. Добър пример за тази архитектура са повечето електронни книги, които свързват своите страници с бутон „Предишна и следваща страница “, но всички те са поддържащи на  основната „Заглавна страница”, която има съдържание с линк към всяка една поддържаща страница. Така търсачката ще разбере, че именно тя е най-главна хъб страница.

С виртуалната siloing, страниците не е необходимо да бъдат в същата директория на сървъра. Силоза се установява единствено, чрез използването на връзки. Виртуалното silo е много по-добро от използването на тагове, защото водещата страница може да се оптимизира много по-добре заради мета таговете, заглавието и т.н.

Поддомейн или директория?

Често се задава въпроса как е по-добре да се подредят страниците при създаване на нова тема – в директория или поддомейн? Разликата е, че ако направим директория от рода postvai.com/copywriting активите на тази директория се трупат върху основния домейн postvai.com, а ако направим поддомейн copywriting.postvai.com – активите си остават на поддомейна.

Втория вариант е удачен за използване, когато имате отделен продукт или услуга за която трябва да се създаде нов мини сайт. Търсачката ще третира тази информация,  като отделен сайт, което може да бъде и предимство в определени случай. Те са подходящи за сайтове с множество администратори, като bezplatni.info и start.bg. В този случай трябва да осигурите отделни входящи линкове от други сайтове.

Много важно е, че Google индексира само по един текстов линк от страница. Затова, ако в менюто имате линк към Индекса, търсачката няма да проследи втория в текста към Индекса. За да приеме Google и двата линка  може да използвате следния трик, направете втория линк да сочи към определено място в Индекс страницата, обозначено с котва.

Линкването между страниците трябва да е така построено, че абсолютно всяка страница от сайта трябва да бъде достигната, чрез поне една текстова връзка.

Какви страници трябва да има един сайт?

Ясно е, че за да получим доверието на потребителите, задължително трябва да има добре описана страница „За нас“ и контакти водещи до истински хора. Задължително трябва да определим една или повече целева страница, която да бъде „гвоздеят в програмата“ на нашият сайт.

Задължително трябва да имате карта на сайта (sitemap), това ще помогне на търсачките да се ориентират по-лесно. Най-добре да имате както HTML, така и XML карта на сайта. Втората е предназначена за поставяне във Webmaster Tools. В CMS системите тя се намира на адрес vasia-sait/sitemap.xml. Ако нямате такава може да си генерирате такава безплатно с инструмента на http://www.xml-sitemaps.com/.

Задължителни според нормативната уредба са „Политика за бисквитите“ GDPR и „Декларацията за достъпност“, както и редица други според сферата на сайта.

Макет за дизайн на сайт

Дизайнът зависи от избрания формат или макет на рекламата, който определя разположението на текста и изображенията в рекламното послание. Размера на заглавията, подзаглавията, логото, картинките и останалите елементи в един уеб сайт също влияят на цялостното възприемане и внушение, затова изборът на правилния макет на сайта е от изключително значение за неговия успех.

Изборът на дизайн на уеб страницата трябва да съобрази начинът по който се движи окото на читателите. Затова най-общо има три типа модели, които се използват за тази цел: оформяне на страницата по F-модел, оформяне със Z-модел и оформление на Гутенберг.

Дизайнерите разглеждат тези модели като инструменти, подходящи за различни видове проекти за уеб дизайн. Всеки път, когато моделите се прилагат правилно, те водят до усещане за познатост, прикрепено към проекта за уеб дизайн. Интерфейсът става личен и интуитивен и всичко завършва на правилното място.

Оформление на Гутенберг

Това е оформление, което се прилага към страници с много текстово съдържание, като онлайн списания и други подобни. Оформлението на Гутенберг разделя страницата на 4 квадрата: основна оптична зона – от горе в ляво, силна зона в дясно, слаба зона – отдолу в ляво и терминална зона -долу в дясно.

Диаграма на Гутенберг

Това много прилича на известния в офлайн печата формат „Мондриан“. Кръстен на холандския художник абстрак­ционист, който използва най-простите изобразителни елементи: права линия, прав ъгъл и три първични цвята (червен, жълт и син). Цялостното рекламно пространство се разделя от прави вертикални и хоризонтални линии. Всяка от получените секции е точно предназначена – или за илюстрация, или заглавие, или текст.

Форматът Гутенберг е конструиран по такъв начин, че позволява на окото да се движи странично през страницата, а също и надолу по страницата. Това са движения, които обикновено се наричат “оси на ориентация.” Окото на потребителя пътува от първичната оптична зона до крайната зона през т.н. “ гравитация на четене. ” Именно чрез този метод на пътя на окото се поставят важни елементи, като заглавия и лога. Оформлението на Гутенберг предвижда идеята, че както слабите, така и силните зони всъщност изпадат от пътя “за четене ” и на практика са лишени от всякакъв вид внимание, освен ако не се допълват визуално, като взаимно се подчертават под някаква форма.

F – оформление

Името на това оформление идва от общия модел по който обикновено пътува окото на потребителя при четене на различни форми на съдържание. Това също е много често срещан модел поради навиците за четене на индивиди от западната култура. Това го прави особено подходящ за страници, които са силно запълнени със съдържание и позволява на потребителите да сканират само за конкретни интересни точки, когато е необходимо.

Z- оформление

За разлика от гореспоменатите оформления, Z-модела е по-подходящ за уебсайтове, които обикновено са с по-рядко съдържание по своя характер. Най-добрият пример за това биха били уебсайтове от минималистичен тип, които могат да използват оформлението на Z-модела, за да помогнат да се привлече вниманието само към селекция от функции.

Той използва една от най-често използваните техники в дизайна – подравняването. Човешкото око търси повторяемост във всяка една система и е нормално да се плъзне по ръба на невидимите линии, които си създава, около очертанието на всеки участващ елемент. Така, че ако елементите са подредени хоризонтално и вертикално по определени линии, е по-лесно за наблюдателя да схване систематичността и поредността на показваната информация.

Някои дизайнери предпочитат този метод, защото той дава възможност да се вижда само най-важното им съдържание. Оформлението на Z-модела съдържа същия тип движение на очите, както и оформлението на F-модела. Има обаче едно нещо, което го отличава от другите модели. Вместо да се върне вляво, преди да слезе надолу, окото на потребителя ще отиде наляво и надолу едновременно, преди да тръгне наляво-надясно хоризонтално.

Моделът на Златния триъгълник

Z-моделът също води до това, което се нарича златен триъгълник. Ако вземете първото хоризонтално и първо диагонално движение и след това затворите формата, завършвате с десен триъгълник, чийто десен ъгъл е горният / левият ъгъл на страницата. Тази триъгълна зона в горната част на страницата ще бъде най-видимата област и моделът предполага, че най-важната ви информация трябва да бъде поставена вътре в нея.

Оформления като Gutenberg, Z-модел и F-модел предполагат, че окото на потребителя ще следва естественият си път през дизайна. Това е възможно само при тежки страници, които съдържат много текст и практически никаква йерархия. В крайна сметка е необходимо да отделите време, за да решите точно каква конкретна информация искате хората да виждат и да използвайте поредица от различни фокусни точки, за да им помогнете постепенно и удобно да се движат през вашия уебсайт.

Модел на фокусните точки

Този модел казва, че хората първо ще разгледат най-доминиращия елемент ( елемента или област с най-голямо визуално тегло ) на страницата. В офлайн практиката е известен като „Прозорец“. Тук изображението зае­ма около 2/3 от цялата площ. В този прозорец има един продукт в голям размер. Под него се поставя заглавие на един ред, а текста върви в две колони. Използва се най-често за да се съобщи на потребителя пускането на нова стока или бранд.

Според изследването на професор Колин на тема „Какво кара читателите да четат?“ се оказва, че най-ефективния формат е макетът „Прозорец“ защото погледа на посетителите на страницата, механично слиза и се спира на 1/3 от височината на листа.

Там може да се постави заглавието, което поема вниманието на читателя и го пренася плавно към основния текст.

В Интернет това не е толкова модел, колкото спазване на принципите на дизайна:

  • единство и хармония на всички елементи, като за целта се избира подходящ фон на страницата;
  • пространство, насоченост на движението на погледа – от левия горен ъгъл надолу;
  • пропорция – самата страница може да бъде оформен на принципа на златното сечение 2:3 широчина спрямо височина;
  • доминиране или преднамерен превес на един от елементите;
  • йерархия, равновесие и баланс в размера на изображенията и текста;

С други думи в този модел на дизайнерските елементи разположени на страницата се дават различни визуални тегла, с което се създава йерархия и посока на движение на окото. Доминирането чрез подчертаване на един или повече конкретни елементи като се набляга на тяхното тегло, форма, цвят, плътност или посока на движение създава т.н. фокусна точка. Това е мястото, където повечето хора инстинктивно ще отидат, когато за първи път гледат работата ви. Доминирането ще създаде входна точка на страницата, от която можете да отведете зрителя до други части на страницата. Редът ще зависи от относителните тегла на тези фокусни точки, както и от всички визуални сигнали, показващи къде да търсите по-нататък.

Доминирането също така разчита на контраста. Например, сайтът на Денис Чандлър използва доминацията чрез големия черен шрифт, за да създаде фокусна точка около приветственото съобщение на страницата. Черният шрифт и анимираните пчели веднага ви водят към навигацията и водят по страниците.

Обобщение

Модели като Гутенберг, Z и F предполагат, че има естествен път на окото и са подходящи за сайтове с големи блокове текст и малка йерархия. Моделът на фокусните точки е предназначен за дизайнерски целеви страници, които чрез елементи с различно визуално тегло, очертават пътя на посетителя. Можете да изберете и комбиниран вариант с моделите Gutenberg, F или Z, които да се прекъсват с контрастни елементи.

Логично е, че при липса на други визуални сигнали хората ще стартират в горната лявата част и ще преместят след това погледа си надолу по страницата. Но когато присъстват други визуални сигнали, те винаги ще контролират пътя, който окото поема.

Отгоре на това не трябва да забравяме, че в интернет въжи правилото на обърната пирамида. Още в първата секунда посетителят трябва да разбере най-общо къде се намира. Ако можем да го задържим 10 секунди, той трябва да разбере основното послание на страницата. А ако остане почти две минути, трябва да види и някои странични съобщения, като всичко това подхранва призива за действие.

Източници: