Как да проектираме уебсайт (със снимки)

Съдържание:

Как да проектираме уебсайт (със снимки)
Как да проектираме уебсайт (със снимки)

Видео: Как да проектираме уебсайт (със снимки)

Видео: Как да проектираме уебсайт (със снимки)
Видео: 5 изпитани средства за профилактично почистване на канали 2024, Ноември
Anonim

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

Стъпка

Част 1 от 2: Създаване на дизайн на сайт

Проектиране на уебсайт Стъпка 1
Проектиране на уебсайт Стъпка 1

Стъпка 1. Решете дали искате да използвате създател на уебсайт

Изграждането на уебсайт от нулата изисква подробно разбиране на HTML кода, но можете да създадете сайт с помощта на безплатна хостинг услуга като Weebly, Wix, WordPress или Google Sites. Създателите на уебсайтове са много по -лесни за начинаещите дизайнери, отколкото HTML.

  • Ако решите да кодирате сами, трябва да научите HTML и CSS кодиране.
  • Ако не сте склонни да отделите време и енергия за създаването на свой собствен уебсайт, можете да наемете дизайнер на уебсайт. Дизайнерските услуги на свободна практика варират в широки граници, някои такси на час, а други на проект, с общ диапазон от милиони до десетки милиони рупии.
Проектиране на уебсайт Стъпка 2
Проектиране на уебсайт Стъпка 2

Стъпка 2. Създайте карта на сайта

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

Ще ви бъде по -лесно да визуализирате страниците на вашия сайт, като създавате груби изображения, а не само сенки

Проектиране на уебсайт Стъпка 3
Проектиране на уебсайт Стъпка 3

Стъпка 3. Използвайте интуитивен дизайн

Въпреки че новите идеи обикновено са интересни, основните проекти трябва да следват тези общи насоки:

  • Опциите за навигация (например множество раздели за различни страници) трябва да се поставят в горната част на страницата.
  • Ако използвате иконата на менюто (☰), тя трябва да е в горния ляв ъгъл на страницата.
  • Ако използвате лентата за търсене, поставете я близо до горната дясна страна на страницата.
  • Полезни връзки (например връзки към страници „Информация“или „Свържете се с нас“) трябва да са в долната част на страницата.
Проектиране на уебсайт Стъпка 4
Проектиране на уебсайт Стъпка 4

Стъпка 4. Бъдете последователни

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

  • Например, ако използвате мек цвят за началната си страница, не използвайте ярък цвят на следващата страница.
  • Обърнете внимание, че използването на ярки или сблъскващи се цветове, особено динамично показвани (или движещи се) цветове, може да предизвика гърчове или епилептични припадъци при малцинство потребители. Ако решите да използвате такъв цвят, не забравяйте да включите предупреждение „риск от припадък“преди въпросната страница.
Проектиране на уебсайт Стъпка 5
Проектиране на уебсайт Стъпка 5

Стъпка 5. Добавете опции за навигация

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

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

Проектиране на уебсайт Стъпка 6
Проектиране на уебсайт Стъпка 6

Стъпка 6. Използвайте съвпадащи цветове

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

Ако сте объркани, започнете с черно, бяло и сиво

Проектиране на уебсайт Стъпка 7
Проектиране на уебсайт Стъпка 7

Стъпка 7. Помислете за минималистичен дизайн

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

  • Повечето създатели на уебсайтове предлагат „минималистична“тема, от която можете да избирате, когато създавате уебсайт.
  • Минималистичната алтернатива е „брутализъм“, който използва по -груби думи, ярки цветове, удебелен текст и минимална графика. Има много по -малко потребители на брутални дизайни, отколкото минималисти, но ако съдържанието е подходящо, този дизайн може да бъде добър избор.
Проектиране на уебсайт Стъпка 8
Проектиране на уебсайт Стъпка 8

Стъпка 8. Приложете уникални опции

Елементите с решетка и права линия са безопасен избор, но някои уникални стилове ще добавят личен щрих и ще отделят вашия сайт от останалите.

  • Не се страхувайте да премахнете тенденцията, като поставите асиметрични елементи на сайта или използвате подредени елементи, за да създадете многопластов вид.
  • Въпреки че елегантните квадратни елементи с остри ръбове (известни като презентация на базата на карти) са по-малко желани от меките, заоблени елементи.

Част 2 от 2: Максимизиране на ефективността на сайта

Проектиране на уебсайт Стъпка 9
Проектиране на уебсайт Стъпка 9

Стъпка 1. Възползвайте се от опциите за оптимизация на автомобила

Мобилните браузъри носят повече трафик от браузърите за настолни компютри. Това означава, че вниманието, което обръщате на мобилната версия, трябва да бъде поне същото като разработката на сайта за настолни компютри. Повечето уебсайтове за автоматично създаване вече са направили версия на автомобил, но имайте предвид следната информация за мобилни сайтове:

  • Уверете се, че бутоните (например връзки към сайта) са големи и лесни за докосване.
  • Избягвайте функции, които не могат да се видят на мобилни устройства (напр. Flash, Java и т.н.).
  • Помислете за създаването на приложение за кола за вашия сайт.
Проектиране на уебсайт Стъпка 10
Проектиране на уебсайт Стъпка 10

Стъпка 2. Не включвайте твърде много снимки на страница

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

По принцип зареждането на страница трябва да отнеме по -малко от четири секунди

Проектиране на уебсайт Стъпка 11
Проектиране на уебсайт Стъпка 11

Стъпка 3. Добавете страница „Контакт“

Може да забележите, че повечето сайтове предоставят страница „Свържете се с нас“, която съдържа информация за контакт (като телефонен номер и имейл адрес). Всъщност някои сайтове предоставят автоматизиран формуляр за запитване на тази страница. Страницата „Контакт“е директна линия за комуникация между посетителите на сайта и вас, което означава, че е и решение на въпроса или разочарованието на посетителя.

Проектиране на уебсайт Стъпка 12
Проектиране на уебсайт Стъпка 12

Стъпка 4. Създайте персонализирана страница 404

Когато посетител пристигне на определена страница, която не е създадена или не съществува, ще се появи страница „Грешка 404“. Повечето браузъри предлагат вградена страница 404, но можете да персонализирате как изглежда тя от настройките на създателя на уебсайта. Ако искате да създадете персонализирана страница 404, въведете следните данни:

  • Смешни и забавни съобщения за грешки (напр. „Поздравления, попаднахте на страница с грешка!“)
  • Връзка към началната страница
  • Списък с връзки, които посетителите обикновено виждат
  • Изображението или логото на вашия сайт
Проектиране на уебсайт Стъпка 13
Проектиране на уебсайт Стъпка 13

Стъпка 5. Въведете лентата за търсене, ако е възможно

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

Лентата за търсене също е много полезна, когато посетителите искат да търсят общи термини, без да се забъркват в произволни страници

Проектиране на уебсайт Стъпка 14
Проектиране на уебсайт Стъпка 14

Стъпка 6. Обърнете повече внимание на началната страница

Когато посетителите отиват на началната страница, те трябва да са разбрали същността на темата на вашия сайт. Освен това всички елементи на началната страница трябва да се зареждат бързо, включително опциите за навигация и изображения. Началната страница също трябва да предоставя следните аспекти:

  • Подканваща фраза (например бутон за щракване или формуляр за попълване)
  • Лента с инструменти или меню за навигация
  • Приканващи графики (като плътна снимка, видео или множество снимки с допълващ се текст)
  • Ключови думи, свързани с услугата, темата или фокуса на вашия сайт
Проектиране на уебсайт Стъпка 15
Проектиране на уебсайт Стъпка 15

Стъпка 7. Тествайте сайта си в различни браузъри и платформи

Това е много важно, тъй като браузърите обработват аспекти на уебсайт по различни начини. Преди да популяризирате вашия сайт, опитайте да го отворите и използвате в следните браузъри на платформи Windows, Mac, iPhone и Android:

  • Google Chrome
  • Firefox
  • Safari (само за iPhone и Mac)
  • Microsoft Edge и Internet Explorer (само за Windows)
  • Браузърът по подразбиране на някои телефони с Android (Samsung Galaxy, Google Nexus и др.)
Проектиране на уебсайт Стъпка 16
Проектиране на уебсайт Стъпка 16

Стъпка 8. Поддържайте сайта актуализиран

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

Съвети

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

Внимание

  • Повечето сайтове за създатели са безплатни, но ако искате да използвате свой собствен домейн (например „www.yourname.com“вместо „www.yourname.wordpress.com“), ще трябва да плащате месечна или годишна такса.
  • Избягвайте плагиатството и научете всички закони за авторското право. Не включвайте произволни изображения от интернет или структурни елементи без разрешение.

Препоръчано: