Ludzie tworzą witryny internetowe z wielu powodów: dotrzeć do szerszej publiczności; sprzedawać, promować lub wyrażać; by uspokoić presję rówieśników. Nowość przestała być powodem około roku 2001. W jej miejsce mamy oczywiście: o oczywiście mam stronę internetową; oczywiście musisz mieć ścianę Facebooka, konto na Twitterze, profil LinkedIn lub tablicę Pinterest; oczywiście wszyscy mamy e-mail.

I oczywiście projektowanie stron internetowych wykorzystuje HTML i CSS - dwa języki, z którymi twórcy przeglądarek i projektanci znajdują wspólny język. Jednak wielu projektantów stron internetowych tworzy niesamowitą różnorodność z tymi samymi regułami językowymi, pytając, czy zamiast tego wpadnie w oczy.

Inni trzymają się tego, co działa.

Ci, którzy postępują zgodnie z konwencjonalną mądrością, używają nie tylko języka, ale i tych samych zdań - w kategoriach internetowych, nie tylko w HTML / CSS, ale w Arial i Georgia, w układach o szerokości 960 pikseli lub podkreślonych niebieskich linkach. Używanie takich konwencji nie jest złe. Ale projektanci, którzy nie decydują się na stosowanie ustalonych wzorców - którzy podążają za konwencjonalną wiedzą bez pytania dlaczego - tracą szanse.

Standardowa struktura

Standardowa, jednopoziomowa struktura ma praktyczne zalety. To proste, a proste jest dobre dla terminów. Co ważniejsze, jest znajome. Zarówno przeglądający strony internetowe, jak i projektanci stron internetowych mają niezobowiązującą zgodę na to, jak działają witryny. Podążając za wzorcem home / services / about / contact, zarówno projektanci, jak i odbiorcy spełniają ich oczekiwania.

Inne pojęcia są tak oczywiste, że łatwo je przeoczyć:

  • Ludzie oczekują, że kliknięcie słowa "kontakt" spowoduje wyświetlenie danych e-mail lub telefonu.
  • Wiedzą, że znajdą link do strony głównej w lewym górnym rogu strony. Oczywiście w połączeniu z logo.
  • Zobaczą oświadczenia dotyczące praw autorskich w stopce, często po lewej stronie, z rocznikiem.
  • Wiedzą, że strony przewijają się w górę i w dół, a nie na boki.

Ponadto, przyzwyczajenie się do wyuczonych zachowań, łagodzi tarcie. Ale projektanci, którzy przestrzegają konwencji, niezależnie od tego, czy sobie to uświadamiają, wzmacniają same konwencje.

  • Kliknij logo i uzyskaj formularz kontaktowy? "Nie tego się spodziewałem."
  • Kliknij link z napisem "czytaj więcej" i uzyskaj płatną ścianę? "Po prostu daj mi artykuł."
  • Przewiń poziomo zamiast pionowo? "To jest dziwne. Czy to jest zepsute?"
  • Najbardziej widoczna grafika na dole strony? "Jest do góry nogami."

Łatwo wyciągnąć oczywisty wniosek: złamać konwencję i ryzyko alienacji ludzi.

Jednak nie wszystkie konwencje są absolutne. Większość stron internetowych przestrzega zasad z własnymi różnicami stylistycznymi. Nie każdy link w każdej witrynie jest podkreślony niebieskim tekstem. Nie każde zdjęcie ma taki sam rozmiar. Nie każdy układ korzysta z tego samego układu kolumn. Ludzie się dostosowują, ponieważ warianty konwencji są same w sobie konwencjami. Ludzie spodziewają się znaleźć dziwactwa między stronami.

W takim razie, w jaki sposób niekonwencjonalne strony internetowe rezygnują z łamania rangi? Ich projektanci wymyślają nowe konwencje, które są łatwe do nauczenia.

Myślenie adaptacyjne

Stare powiedzenie "nie rób tego, co nie jest zepsute" jest dobrą radą, dopóki ktoś nie zmieni definicji "zepsuty".

Od początku internetu projektanci mogli polegać ekrany o szerokości co najmniej 640 pikseli . Ostatnio powszechne jest 1024 piksele i więcej. Począwszy od 2007 roku malutkigadżety umieszczaj strony internetowe w rękach ludzi. Nagle projektuje na 320 pikseli był w modzie .

Ale zmuszeni do zmiany i wyboru do zmiany są różne postawy. Twórczość nie boi się podążać ścieżką większego oporu.

Roberts

The Roberts Group Eksperymenty na stronie internetowej z układem opartym na siatce. Użytkownicy poruszają się po swojej witrynie z "dosłowną mapą witryny". Linki tekstowe stanowią zabezpieczenie dla użytkowników, którzy nie czują się dobrze z siecią.

Jak łamać konwencje

Nie każde ryzyko się opłaca. Większość niekonwencjonalnych projektów internetowych nie zawodzi, ponieważ przerywają wzorce, ale dlatego, że nie przekazują nowych obietnic. Sztuką jest ustalenie, dlaczego powstały konwencje.

1. Umieść link domowy z logo w lewym górnym rogu

Problem: użytkownicy witryny złożonej mogą się zgubić. Niezawodny link do strony głównej działa jako przycisk resetowania witryny.

Konwencjonalne myślenie: każde ładowanie strony zaczyna się u góry strony. Ponieważ większość układów stron internetowych jest przewijana w dół, górna część każdej strony jest najbardziej logicznym miejscem dla niezawodnego przycisku.

Niekonwencjonalne myślenie:

  • Użyj pozycji: naprawiono, aby przycisk strony głównej znajdował się w tym samym miejscu w przeglądarkach użytkowników, a nie tylko w stronie
  • Zachęć ludzi do przewijania treści za pomocą widocznego linku do strony głównej na dole strony
  • Usuń stronę główną na rzecz bogaty pasek nawigacyjny

2. Lista artykułów spowoduje kliknięcie ich tytułów, obrazów lub "czytaj więcej"

Problem: ludzie potrzebują oczywistych wskazówek, aby dotrzeć do informacji, które obiecują tytuły i opisy.

Konwencjonalne myślenie: tytuły i miniatury najlepiej odzwierciedlają treść, którą opisują. Najkrótsza droga do "Chcę przeczytać więcej na ten temat" ma sprawić, by była klikalna. Dlatego możesz klikać tytuły i miniatury.

Niekonwencjonalne myślenie:

  • Nakręć cały zwiastun - obraz, tytuł i opis - który można kliknąć. Łącza o większej powierzchni są dobre dla projektowania mobilnego i łatwe do utworzenia za pomocą CSS
  • Odwróć go do góry nogami: poprowadź jednym lub dwoma atrakcyjnymi zdaniami, a następnie umieść pod tytułem klikalny mniejszy tekst
  • Zamiast "czytaj teraz", pozwól użytkownikom dodawać artykuły do ​​kolejki do czytania w wolnym czasie w wybranej przez siebie kolejności

3. Zaprojektuj szablon przed napisaniem treści

Problem: estetyka, a nie kod lub semantyka, tworzą pierwsze wrażenie strony.

Konwencjonalne myślenie: najpierw zaprojektuj wygląd strony. Pozostaw miejsce na treść.

Niekonwencjonalne myślenie:

  • Używaj typografii i kolorów, aby nasycić samą treść nastrojem, głosem i charakterem. Następnie zaprojektuj elementy, które wzmacniają tę postać, jeśli to konieczne, takie jak tekstury tła i paski boczne.
  • Utwórz tło jako część treści. Zmień kolory na stronie, aby odzwierciedlić nastrój, temat lub funkcję.
  • Ukryj lub zmniejsz informacje paska bocznego, dopóki użytkownik nie zdecyduje się na nie zwrócić.
Stories at Longboard World

Historie w Longboard World nie tylko sprzeciwia się zasadzie "zwiastuny muszą być tekstem", ale uczy się od niej lekcji Fitt's Law przez kliknięcie całej notki.

Wytyczne do zasad

Złamanie publicznego wyuczonego zachowania oznacza zrzeczenie się obietnicy. Konwencje są synonimem zaufania. Najlepszym sposobem na przełamanie ustalonych reguł nie jest ich łamanie, ale ich zastępowanie.

1. Wymień, nie łam się, zasady

Aby zmienić konwencję, musimy szanować, dlaczego stare zasady działały.

  • Wcześniejsze przeglądarki wymagały widocznych linków, dlatego podkreślono klikalny tekst.
  • Linie o szerokości przekraczającej 400 pikseli są trudne dla ludzi do śledzenia linii po linii. Kolumny nie tylko skracają wiersze, ale pozwalają na bardziej poziomą organizację.
  • Bogate w treść strony internetowe stwarzają problemy organizacyjne. Narzędzia wyszukiwania pozwalają ludziom wyszukiwać określone frazy, a nie przeglądać dowolne kategorie.

2. Przestrzegaj własnych zasad

Gdy ludzie kojarzą, powiedzmy, pomarańczowe pudełka z linkami, projekt nie powinien różnić się od tej obietnicy. Za każdym razem, gdy kliknięcie pomarańczowego pola przenosi ludzi na nową stronę, zasada ta zostaje wzmocniona. Każde pomarańczowe pudełko, które w przeciwnym razie spowoduje degradację reguły.

3. Daj mu czas

Zarówno publiczni, jak i niechętni właściciele witryn zyskują zaufanie dzięki ekspozycji. Projekt może pomóc, obniżając krzywą uczenia się - dzięki czemu zasady są jasne.

4. Użyj celów

Konwencje działają. Są łatwe zarówno dla projektantów, jak i odbiorców. Łamanie ich dla dobra zmian nikomu nie sprzyja. Zamiast tego, ponownie przemyśleć problemy.

  • Popularny konsensus jest przeciwny tej ustawie. Jeśli ludzie odwiedzają witrynę, mamy mniej niż jedną sekundę, aby je wygrać. Jak możemy szybko zmienić umysły?
  • Chcemy pokazać ponad 200 zdjęć. W jaki sposób możemy ułatwić nawigację?
  • Nasze produkty są bezpieczne, ale mamy reputację nie dbających o środowisko. Informacje prasowe nic nie znaczą. Jak możemy wykazać autentyczną troskę w podtekście?
  • Mamy nadmiar ekwipunku. Nikt nie kupuje. Jak możemy zmienić to na naszą korzyść?
Evolution of the Web

Ewolucja sieci odważa się złamać "prawą fałdę" przeglądarki, przesuwając się w bok. Animacja na starcie pokazuje użytkownikom, co dostaną do przewijania strony.

W miarę ewolucji projektowania stron internetowych stosowanie się do konwencji jest bardziej ryzykowne niż eksperymentowanie. Gdy publiczność zauważa niekonwencjonalne projekty, które działają dobrze, mobilne lub nie, będą również świadome stron internetowych, które ograniczają się do konwencji z wczoraj. Projektanci, którzy to potwierdzają, mogą poczynić znaczne postępy w tworzeniu lepszych stron internetowych.

Czy łamiesz zasady lub grasz bezpiecznie? Jakie zasady projektowania stron chcesz przepisać? Daj nam znać w komentarzach.

Wyróżniony obraz / miniatura, niekonwencjonalny obraz przez Shutterstock