Съдържание

• Стъпвам
• Метод 1 от 2: Трите основни правила
• Метод 2 от 2: Насоки
• Съвети
• Предупреждения

Проектирането на страхотен уебсайт може да изглежда като обезсърчаваща задача, но стига да имате предвид основните неща, ще намерите процеса интересен и забавен. Става въпрос за нещо повече от добър външен вид! Ще ви покажем основите и някои общи насоки, които да ви помогнат да проектирате уебсайтове, които хората ще посещават отново и отново.

Стъпвам

Метод 1 от 2: Трите основни правила

1. Правило 1:Слушайте клиента си. Може да проектирате „най-великия уебсайт в света в историята на Вселената и не само“, с богато черно, изискани шрифтове и ярки, артистични цветове за сайт, който крещи „изследвайте ме сега!“ За съжаление вашият клиент искаше оранжева лента с меню с ярко розови и оранжеви букви. Уволнени сте и вашият най-добър уебсайт досега - на който клиентът има права - е някъде на резервния си диск, без никой никога повече да го вижда.
   • Проучете фирмената идентичност на вашия клиент. Нека клиентът ви покаже няколко уебсайта, които обичат. Това не само ще ви даде представа какво харесват, но и няколко дизайнерски идеи, за които може би не сте се сетили.
   • Ако смятате, че се шегуваме с оранжевия и розовия уебсайт, помислете за този страхотен, изтънчен сайт:
2. Правило # 2:Познайте аудиторията си и това, което търсят, и адаптирайте дизайна си съответно. Причината хората да имат уебсайтове е, че искат други хора да ги виждат. Тя може да бъде информативна, или търговска, или да забавлява конкретна целева аудитория. Вашата работа като дизайнер е да знаете за кого проектирате и да ги държите на страницата, когато кацнат там.
   • Може да си помислите: „Ако изглежда добре, те ще останат“. Но не е задължително това да е така. Вземете например недвижими имоти. Ето сайт с изчистен, забавен дизайн. Той има много бяло пространство, което придава отворен вид, ярки цветове и модерен широкоекранен формат с връзки на видно място:
   • Сега разгледайте този подход за продажба на недвижими имоти в същия район: претрупани и много заети, скучни цветове и покрити с реклама.
   • Познайте кой работи по-добре за тези, които търсят дом? Да, този, където къщи! Когато хората търсят „домове за продажба в Санта Моника“, не им пука как изглежда сайтът. Те не искат да четат за агента за недвижими имоти или да виждат красиви снимки на града. Те искат да видят къщи.
3. Правило # 3:Слушайте себе си. Разбирате какво иска клиентът и знаете какво търси вашият пазар. Сега най-накрая е време да обърнем внимание на вас, дизайнерът!
   • Изградете шаблон в графичния софтуер по ваш избор. Направете елементите на вашата страница на различни слоеве (за да можете да промените нещата по-късно, без да унищожавате целия шаблон). Тези елементи могат да бъдат:
     • Хедър. Това е елемент, който е еднакъв на всяка страница на вашия сайт. Заглавката се състои от заглавието и логото на сайта, както и връзки към другите части на уебсайта (напр. Информация, Контакт и др.). Визуално и практически това ще свърже всичко заедно. Добра практика е да свържете първия бутон в лентата с менюта обратно към началната страница.
     • Например, нека да разгледаме Apple:
     • Както при повечето неща на Apple, тяхната начална страница има много изчистен, ясен дизайн. Обърнете внимание на лентата с менюта в горната част, с логически теми за всеки бутон, както и поле за търсене - винаги добра идея, ако сайтът ви го поддържа. Сега нека разгледаме целева страница за един от бутоните, iPad, за да видим няколко елемента:
     • Лентата с менюта се променя само чрез затъмняване на бутона iPad.
     • Темата на целевата страница се показва с големи черни букви.
     • Ще се появи ново подменю, за да можете да научите повече за продукта. Ако кликнете върху един от тези бутони, ще видите, че всяка страница предлага ново съдържание в зависимост от темата, но ще бъде идентична по оформление и дизайн.
     • Често пъти всяка основна тема в лентата с менюта ще има различни подзаглавия, които трябва да попълните. Вместо да създавате втора лента с менюта, можете да използвате изскачащи менюта като този пример от Musicians Friend:
     • Странична лента. Това ще се появи на много страници на вашия сайт, но не непременно на всички - контекстът определя. Това обаче е много важен елемент и трябва да бъде внимателно проектиран, за да бъде интуитивен и да не е претрупан. За разлика от лентата с менюта, съдържанието на страничната лента може да бъде много динамично. Вижте тези две странични ленти от продавача на недвижими имоти Trulia Първата е за купувачите:
       
       

Метод 2 от 2: Насоки

1. Проектирайте добър потребителски интерфейс. Позиционирайте различните елементи на уебсайта, като заглавие, странични ленти, лога, изображения и текст, на едно и също място на всяка страница, за да направите вашия сайт навигационен и интуитивен.
   • Запазете една и съща заглавка в горната част на всяка страница. Независимо дали съдържанието на вашия сайт позволява много повтарящи се елементи, уверете се, че горната част на всяка страница е еднаква.
   • Използвайте логика във вашия дизайн. Елементите на една страница трябва да бъдат логически подредени по важност или тема; различните страници на сайта също трябва да бъдат.
2. Създайте последователен стил. Когато оформлението трябва да придаде на вашия сайт структурна последователност, стилът трябва да осигури тематична хармония.
   • Придържайте се към два или три основни цвята и се уверете, че се съчетават добре.
   • Избягвайте да използвате твърде много стилове или размери на шрифта; ако искате да редувате няколко, използвайте ги по същия начин на всяка страница.
   • Използвайте каскадни таблици със стилове (CSS), за да поддържате еднакъв стил и да улесните промяната на елементи в цял уебсайт, без да се налага да ходите на всяка страница поотделно.
3. Увеличете четливостта. За да улесните четенето на текста си, можете да го разделите на по-малки части.
   • Използвайте субтитри и правилно разстояние, за да отделите всяка от частите.
   • Използвайте удебелени букви или различни размери, за да покажете йерархията и важността на темите.
   • Обърнете внимание на това как се отнасяте към текста. Не правете шрифта твърде малък и увеличете разстоянието между редовете, за да улесните четенето на големи парчета текст. Големите петна от текст са по-трудни за четене; разбийте го на по-малки параграфи.
4. Направете уебсайта си универсално четим. Използвайте стандартен HTML и избягвайте тагове, функции и приставки, които са налични само за една марка или версия на браузър.
   • Докато повечето съвременни браузъри и компютри могат да обработват сложни изображения, всичко ще изглежда по-хлъзгаво, ако намалите и оптимизирате вашите изображения за мрежата. Претеглете значението на качеството срещу значението на скоростта.
5. Тествайте уебсайта си. Уверете се, че всяка връзка работи както бихте очаквали и изображенията се появяват правилно.
   • Може да искате да организирате някои потребителски тестове, като накарате членовете на вашата целева аудитория да тестват яснотата и лекотата на използване на вашия дизайн и да предоставят обратна информация за вашия уебсайт.
6. Публикувайте уебсайта си. Купете име на домейн, ако още не сте го направили. Периодично проверявайте дали връзките все още работят и слушайте предложения, които посетителите ви изпращат по имейл.

Съвети

• Въпреки че можете свободно да проектирате оформлението въз основа на вашата лична визия или неща, които сте виждали на други сайтове, може да е по-лесно да си купите готов дизайн.
• Не бомбардирайте посетителя със сладки, специални картинки. Анимацията с флаш, ярки цветове, фонове с шарки и музика, която автоматично се възпроизвежда при зареждане на страници, бяха забавни експерименти през 90-те, но сега те ще изплашат потребителите. Придържайте се към прости фонове, които контрастират с цвета на текста за максимална четливост.
• Винаги можете да използвате CSS, за да оптимизирате разстоянието между абзаците.
• За посетители със слухови или зрителни увреждания можете да субтитрирате видеоклипове, да преписвате аудио и да добавяте съобщение за достъпност. Макар че таблиците могат да бъдат ефективен начин за организиране на информация, посетителите с увредено зрение, използващи софтуер за четене на екрана, може да не чуят материала в правилния ред.
• Позволете на вашите посетители да пестят мастило: използвайте отделен стилов лист за печат на страници.
  • Изключете фоновите изображения, когато задавате параметрите за печат.
  • Използвайте черен текст на бял фон.
  • Премахнете лентата с менюта и ненужните изображения.

Предупреждения

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