Nasycenie w projektowaniu stron internetowych
Z biegiem lat, projekty internetowe i układy wzrosły w złożoności. Jednak, podczas gdy nasza praca staje się coraz bardziej dopracowana i interaktywna, odchodząc od statycznych układów pudełkowych, które dominowały w latach 90., główny cel się nie zmienił.
Widoczność jest tak samo ważna dla projektantów jak zawsze. Chodzi o to, by skupić uwagę użytkownika na treściach, które pomagają sprzedawać towary i zachęcać do subskrybowania, a także pomagają stronom internetowym zdobywać stałych czytelników.
Coraz częściej ludzie korzystają z gotowych rozwiązań, dlatego ważne jest zapewnienie stronom internetowym wystarczającego rozróżnienia i osobowości w celu rozwijania zainteresowań użytkowników.
W końcu cały punkt strony internetowej ma być unikalny, nie podążać za innymi lub oferować nadający się do użytku, ale ogólny i pozbawiony życia układ. Mając to na uwadze, przyjrzyjmy się, w jaki sposób przymus nadużywania pewnych konwencji i wzorców projektowych może pozytywnie lub negatywnie wpłynąć na użytkowników.
Nasycenie i uczulenie
Na początek przyjrzyjmy się dwóm kluczowym zmiennym w działaniu. Nasycenie, którego nie należy mylić z terminem związanym z kolorem, odnosi się do wszechobecności pewnych narzędzi, technik lub projektów w całym Internecie. Weźmy na przykład, jak rozpowszechnione są reklamy Google i jak niektórzy projektanci umieszczają je na swoich stronach internetowych.
Z drugiej strony, uczulenie odnosi się do stopnia, w jakim użytkownik jest narażony na kontakt z narzędziem, techniką lub wdrożeniem. Można powiedzieć, że byliśmy tak przyzwyczajeni do oglądania reklam online, które przystosowaliśmy do filtrowania ich jako nieistotnego szumu w tle, a czasami fizycznie je odfiltrowywaliśmy.
Coraz częściej natrafiamy na reklamy, które wykorzystują animację, dźwięki i żywe kolory.
Podczas gdy niektóre implementacje, takie jak reklama, można powiedzieć, że umniejszają wartość treści, inne mogą być bardzo korzystne, jeśli są używane wielokrotnie i konsekwentnie, na przykład miniatury obrazów w portfelach. Ponieważ nasycenie i desensytyzacja może być zarówno dobra, jak i zła, zasadniczym problemem, z którym stykają się projektanci, jest ustalenie, jak i kiedy przestrzegać konwencji.
Nasz przemysł opiera się głównie na konwencjach. Jeśli nie używamy CMS-a lub szablonu, używamy frameworków i inspirujących stron internetowych. Opieranie się na konwencjach projektowych może wynikać z obawy, że jeśli nie zastosujemy zmian kulturowych i trendów, zostaną one uznane za nieaktualne lub ich zrozumienie użyteczności zostanie zakwestionowane. Ale to dalekie od prawdy.
Powielanie projektów lub używanie ogólnych konwencji może być łatwiejsze, ale ogranicza możliwości kontaktu z użytkownikami na poziomie emocjonalnym, czego nie należy lekceważyć.
Przy tak wielu frameworkach i silnikach CMS, to cud, że musimy coś zbudować.
Przyjrzyjmy się niektórym korzyściom, jakie konwencje mogą przynieść stronie internetowej i przeanalizujmy niektóre poważne pułapki, które mogą doprowadzić do podjęcia decyzji o konkretnym layoucie lub ponownym przemyśleniu danej funkcji.
Przeanalizujemy także kilka praktycznych rozwiązań, które pomogą Ci uniknąć sytuacji, w której Twoja witryna wygląda i wygląda jak miliony układów, które nie mają prawdziwej unikalnej propozycji sprzedaży (USP) lub trafności.
Dobra strona nasycenia
Podstawowym uzasadnieniem stosowania nasyconych elementów w projekcie jest uznanie, jakie zapewnia użytkownikom. Trendy i wzorce zapewniają nie tylko proste rozwiązania dla funkcji, które chcemy zaimplementować (takie jak menu nawigacyjne), ale mają wyraźne zalety użyteczności, ponieważ zapewniają użytkownikom znane punkty odniesienia na stronie.
Systemy nawigacyjne stają się coraz bardziej złożone, ale mogą też być dość eleganckie.
Nasycenie może wnieść wartość edukacyjną do doświadczenia. Zapewniając konwencje dla użytkowników, nasycenie zmniejsza z czasem krzywą uczenia się witryny internetowej.
Zastanów się, jak przywykliśmy do rozwijanego menu; jeśli nigdy nie widziałeś tego narzędzia, możesz nie zauważyć, że unoszące się nad nim narzędzie wyświetli dodatkową listę elementów. Takie wspólne elementy mogą mieć mniejszą wartość empatyczną lub wyjątkowość, ale pomagają użytkownikom w szybkim wykonaniu zadań.
Nawigacja Mystery-meat stwarza problemy dla użytkowników. Znajomość powinna poprzedzać estetykę.
Staramy się brać za pewnik rzeczy, które widzimy każdego dnia. Jak często, na przykład, bierzesz pod uwagę technologię stojącą za sygnalizacją świetlną? Zjawisko to można również zastosować do projektowania stron internetowych.
Wraz ze wzrostem poziomu nasycenia trendu stajemy się bardziej zaznajomieni z jego funkcją i wpływem na nas. W konsekwencji stajemy się zdolni do mentalnego ignorowania go, dopóki nie będziemy potrzebować go używać. Niebezpieczeństwem jest "przeglądanie zombie", o czym rozmawiamy później.
Użytkownicy zwykle koncentrują się wyłącznie na treści i mogą przegapić komunikat projektu.
Stabilność jest kolejnym powszechnym efektem konwencji projektowych. Kiedy coś zostało zaimplementowane raz po raz, najprawdopodobniej przeszło kilka iteracji testowania, analizy i doskonalenia, a jako takie zyskało na wartości.
Dodatkowo, ponieważ skuteczność konwencji, takich jak menu rozwijane, została mocno zbadana, możemy stworzyć scenariusze użycia, aby określić, czy i jak będą one odpowiednie dla określonego układu.
Wiemy, że użytkownicy oczekują, że zostaną przekierowani z powrotem do strony głównej po kliknięciu logo.
Zła strona nasycenia
Podczas gdy wszystkie te punkty pokazują, że nasycenie może być korzystne, tak jak w każdym aspekcie projektu, istnieje odwrotna strona, która powinna sprawić, że pomyślisz dwa razy, zanim skoczysz na modę. Pierwszym z tych problemów jest nadużycie.
Dla tych z Was, którzy pamiętają epo- koje projektowania Web 2.0, kiedy wszystko było błyszczące i skośne, sieć pełna była bezsensownych projektów, zarówno profesjonalnych, jak i osobistych. Wszyscy kopiowali to, co uważali za popularne, więc trend stał się tak powszechny, że stracił swoją wartość w morzu klonów.
Era projektowania Web 2.0 wymknęła się spod kontroli, w wyniku czego ucierpiała innowacja układu.
Poza nadużywaniem nasycenia, kolejną przeszkodą jest bezmyślność, która czasami otacza nasycenie. Gdy implementujemy taką funkcję, jak menu nawigacyjne, odwiedzający powinni rozpoznać wiele jej elementów na stronie.
Ale co się stanie, jeśli narzędzie nie działa zgodnie z oczekiwaniami? Na początku może wydawać się to banalne, ale trendy ograniczają naszą zdolność do innowacji, a założenia użytkownika mogą utrudniać rozwój sieci.
Użytkownicy oczekują działania po kliknięciu przycisku, więc funkcja musi być reaktywna.
Oprócz tych czynników jednym z największych argumentów przeciwko szablonom i nasyconym funkcjom jest to, że nie są one ukierunkowane na potrzeby określonej grupy odbiorców.
Jedną z cech charakterystycznych ręcznie robionej strony internetowej jest to, że została zbudowana (miejmy nadzieję) z wymaganiami odwiedzających na samym rdzeniu. Podczas gdy strony internetowe mogą uciec z wyglądem ogólnym, projekty, które są pięknie wykonane, zwiększą wartość strony internetowej i wzbogacą lub uzupełnią treść.
Możesz wyraźnie powiedzieć, że ta strona została stworzona dla grupy docelowej: dzieci.
Ostatnim problemem jest wpływ nasycenia na odwiedzających. Kiedy układy stają się rutyną, użytkownicy mogą z łatwością ominąć nowe komponenty, które zakładają podczas poprzedniej wizyty.
Ten stan psychiczny, znany jako "przeglądanie zombie", przejawia się, gdy użytkownicy nie zauważają obiektów, które podświadomie lub świadomie uważają za nieistotne. Jest to szczególnie problematyczne w reklamie; wielu użytkowników blokuje reklamy z rozszerzeniami przeglądarki lub unika patrzenia na nie, nawet jeśli reklamy mogą być pomocne.
Chociaż opcje filtrowania mogą być pomocne dla użytkowników, mogą również utrudnić znalezienie informacji.
Rozwiązania dla projektantów
Pierwszym rozwiązaniem, które wydaje się dość oczywiste, jest wprowadzanie innowacji, a nie kopiowanie tego, co istnieje.
W niektórych przypadkach najlepszym rozwiązaniem będzie po prostu nie wyważanie koła; Dostępność galerii inspiracji, skryptów wycinania i wklejania, silników CMS i szablonów układów raczej sprzyja preferowaniu szybkiego projektowania, niż ręcznego, oryginalnego wykonania.
Nawet jeśli korzystasz z gotowego rozwiązania, możesz je ulepszyć lub spersonalizować dla swoich odbiorców.
WordPress może (i powinien) być wysoce dostosowany do tożsamości osoby lub firmy.
Drugim rozwiązaniem jest ustalenie, czy funkcja generyczna służy konkretnemu celowi. Idea projektowania z myślą o celu istnieje od wielu lat i chociaż użytkownicy nadal domagają się zwiększenia poziomu interaktywności i kontroli na stronie internetowej (daleko od ery statycznych projektów), powinniśmy umieścić element na stronie tylko wtedy, gdy użyteczność przewyższa koszty jej istnienia; nie powinno na przykład przyciągać uwagi z innych treści. Każdy obiekt powinien służyć użytecznemu celowi, nawet drobnym elementom, takim jak linki "Pomiń", które pomagają czytnikom ekranu.
Usuwanie niepotrzebnych funkcji pozostaje popularne, ponieważ wszyscy uwielbiamy przejrzysty interfejs.
Prostota i cel, jakim jest skierowanie oczu użytkownika na przydatną zawartość, jest podstawą dobrego projektu. Aby uniknąć nadmiernego nasycenia, musimy zachować ostrożność podczas dodawania obiektów do strony (a zwłaszcza nie powtarzać tego wielokrotnie) i nie być zbyt entuzjastycznie nastawionym na "ładowanie funkcji".
Wiemy, że przeciążenie użytkowników zmusi ich do cięższej pracy, aby przejść przez stronę; a im więcej rozproszeń, tym większe ryzyko utraty ważnych treści. Projektanci muszą być wyczuleni na potrzeby użytkowników, zmniejszać krzywą uczenia się i maksymalizować widoczność treści.
Dobre i złe przykłady
W pierwszym przykładzie poniżej wiele energii wyraźnie poszło na konwencję bilansującą i oryginalność. Zwróć uwagę, jak układ o stałej szerokości, wyśrodkowane i dobrze widoczne logo oraz znajome elementy spotykają się na stronie bez przeciążania użytkownika. Podczas przewijania jest wymagane, interfejs oferuje unikalny spin, z subtelnym zawisie kwitnie, wyborów typograficznych i starannie zorganizowane zdjęcia profilowe.
Jedynym prawdziwym minusem jest to, że niezorientowani użytkownicy mogą nie być w stanie łatwo zidentyfikować ikon wizualnych. Nawigacja Mystery-Meat jest zawsze dużym ryzykiem.
Układ tego drugiego przykładu jest prawdopodobnie mniej unikalny niż pierwszy. Mimo to nadal zapewnia dobre wrażenia z uwagi na krótką charakterystykę interakcji użytkownika: logo i menu nawigacyjne znajdują się tam, gdzie się ich spodziewasz; strona internetowa odpowiada konwencjonalnym terminom dotyczącym elementów portfela (chociaż w tym przypadku przestrzeń ekranu jest raczej marnowana); a przyciągające wzrok infografiki zachęcają użytkowników do przewijania strony.
Alternatywny pasek przewijania jest dość interesujący. Wielu projektantów zdaje się je przyjmować, próbując przejąć większą kontrolę nad estetyką strony. Ale z powodu mniejszego klikalnego regionu, ten układ może być bardzo niedostępny dla użytkowników z niedoborami motorycznymi i jest sprzeczny z powszechnym trendem używania domyślnej przeglądarki. Jest to anty-wzór i jest dobrym przykładem niewłaściwego wyboru projektu.
Ta ostatnia strona internetowa to prawdziwy przykład "czego nie robić". Jak widać, próbując ułatwić użytkownikom, strona główna MSN nie jest oryginalna i nie przedstawia wyraźnie jej treści.
Logo, pole wyszukiwania i łącza do ikon są renderowane w zadowalający sposób, ale gdy użytkownik przewija się w dół, strona staje się coraz bardziej zagracona w wyniku ściśle upakowanych konwencji.
Istnieje zbyt wiele opcji menu nawigacyjnego, co prowadzi do zamieszania; może wystarczyłoby menu rozwijane. Dodatkowo reklama zajmuje jedną szóstą strony, w ten sposób przejmując uwagę użytkownika. Co więcej, gdy poruszamy się w dół, strona jest rozproszona dzięki pokazom slajdów, blokom zawartości z zakładkami i setkom przepełnionych linków. Jest to nadmierne nasycenie w najlepszym wydaniu: zbyt wiele dostarcza się zbyt mało oryginalności lub celu.
Nasycenie i równowaga między konwencją a oryginalnością będą zawsze w dużej mierze odzwierciedlone w designie.
Wraz z rozwojem sieci pojawią się nowe standardy i konwencje. Chcemy uniknąć tworzenia projektów, które są tak różne, że dezorientują użytkowników, ale musimy zachować element wyjątkowości w naszej pracy, aby uniknąć szufladkowania odwiedzających.
Każda strona internetowa będzie miała własne wyzwania i potrzeby, a odpowiedzialność projektanta będzie polegać na powstrzymywaniu się od generycznego "anty-doświadczenia" szablonów i przywrócenia innowacji do ich pracy.
Wyłącznie napisany dla WDD przez Alexander Dawson. Jest niezależnym twórcą stron internetowych, autorem i twórcą oprogramowania rekreacyjnego, specjalizującym się w standardach internetowych, dostępności i projektowaniu UX. Oprócz prowadzenia firmy o nazwie HiTechy i pisanie, spędza czas Świergot , Fora serwisu SitePoint i inne miejsca, pomagając potrzebującym. "]
Co myślisz o nasyceniu projektowaniem stron internetowych i jak radzisz sobie z tymi wyzwaniami na swoich stronach internetowych? Podziel się swoimi przemyśleniami poniżej ...