Projektowanie wiadomości: jak najlepsze strony z wiadomościami radzą sobie z dużą ilością treści

Gdybym miał swoją drogę, podobnie jak prawie każdy inny projektant stron internetowych, strony internetowe zawsze zawierałyby dość ograniczoną ilość treści, aby zachować przejrzystość i ułatwić komunikację.

Niestety rzeczywiste sytuacje wymagają stron internetowych z ogromną ilością treści. Aby nauczyć się rozwiązywać problemy pojawiające się na tej arenie, przyjrzymy się konkretnej sekcji witryn internetowych, które są być może bardziej przepełnione niż jakiekolwiek inne: witryny z wiadomościami. Jak projektanci z CNN, MSNBC, Fox i inni radzą sobie z układem tak dużej ilości informacji? Dowiedz się po skoku.

Nagłówek i nawigacja

Nagłówek jest absolutnie kluczowym aspektem witryny z wiadomościami. Każdy użytkownik wie po odwiedzeniu strony z wiadomościami, że będzie mnóstwo treści do przesiewania, a jeśli chce czegoś konkretnego, przejdzie bezpośrednio do nagłówka, aby go znaleźć.

Oto nasz pierwszy rzut oka na problem, który nęka nas w dalszej części artykułu: zbyt wiele rzeczy! Jak wspomniałem we wstępie, serwisy informacyjne absolutnie muszą przekazywać wiele informacji, dlatego istnieją. Uporządkowanie wszystkich tych informacji to nie lada wyczyn i każda decyzja, którą podejmiesz, może drastycznie wpłynąć na użyteczność witryny.

Rzućmy okiem na nasz pierwszy przykład. Poniższy obraz pokazuje nagłówek i nawigację dla MSNBC.com.

Jak widać, w pierwszych kilku centymetrach tej strony wiele się dzieje. Na samej górze strony znajduje się około piętnaście linków, które są tylko dla innych stron, wewnętrzna nawigacja znajduje się poniżej i zawiera kolejne dwanaście.

MSNBC używa własnego interesującego spinu w menu rozwijanym dla każdej sekcji witryny pokazanej w nawigacji. Tutaj zobaczysz od pięciu do sześciu nagłówków tekstowych, kilka zdjęć i jeszcze więcej treści prowadzących do innej witryny. Po kilku warstwach nawigacji w końcu docieramy do logo witryny u dołu nagłówka, obok widżetów pogodowych i wyszukiwania.

Myślę, że nagłówek MSNBC jest trochę bałaganu, branding został utracony, a ładunek zawartości dodatkowej jest rozpraszający. Porównaj to z nagłówkiem jednej z najlepiej wyglądających witryn z wiadomościami, jaką znalazłem, CNN.

Mamy tutaj silny, wyraźny branding, pasek wyszukiwania w miejscu, w którym go szukasz, oraz proste menu nawigacyjne bez jednego menu rozwijanego. To menu zapewnia równowagę między minimalnym wyglądem i wystarczającą funkcjonalnością, aby bez problemu dotrzeć do celu.

Fox wybiera trasę podobną do CNN. Jest nieco bardziej zagracony i obejmuje kilka witryn, takich jak MSNBC, ale zakładki pomagają zrozumieć metaforę.

Washington Post zaczął od podobnego pomysłu do MSNBC, ale znacznie lepiej go zrealizował. Jak widać, nazwa strony jest ładna i duża, a po niej widżet pogody.

Najechanie kursorem na nawigację daje duże menu rozwijane, ale zamiast niewygodnego przesuwania zawartości w dół jak w MSNBC, została ona tak skonstruowana, aby ukryć duży obszar „Washington Post”.

Lekcja

„Uważaj na mega-rozwijane menu, które tak naprawdę nie spełniają obietnicy ułatwienia nawigacji w witrynie”.

Myślę, że lekcja polega na tym, aby nie przytłaczać użytkowników od samego początku zaśmieconym nagłówkiem. Nie oznacza to, że nie możesz mieć dużo treści, po prostu uważaj na mega listy rozwijane, które tak naprawdę nie spełniają obietnicy ułatwienia nawigacji w witrynie. CNN udowadnia, że ​​czasami zwykła stara pozioma lista linków i niektóre ładnie ustrukturyzowane białe znaki mogą działać świetnie nawet w środowisku o dużej zawartości.

Polecane historie

Następną rzeczą, o której chcę porozmawiać, jest to, w jaki sposób strony te przyciągają twoją uwagę i kierują ją w stronę tego, co ważne. Każda witryna z wiadomościami ma jedną lub dwie najważniejsze historie, o których wiedzą, że są najpopularniejsze w ciągu dnia i muszą ustrukturyzować stronę, aby odpowiednio je podkreślić.

Moim ulubionym przykładem jest The Huffington Post, który decyduje się na wyróżnienie jednej wiadomości z użyciem ogromnego obrazu i pogrubionego nagłówka, z których oba obejmują całą szerokość pojemnika na strony.

Wystarczy spojrzeć na to, jak czyste i piękne jest to w porównaniu do innych serwisów informacyjnych, które widziałeś. Używanie tego formatu nie jest popularne wśród serwisów informacyjnych, ale nie można nie przyznać, że tutaj działa całkiem dobrze.

MSNBC podąża podobną drogą, ale nie jest tak drastyczny, że zawiera tylko jedną historię u góry strony. Mają jeden duży obraz po lewej stronie z różnymi nagłówkami. Naprawdę podoba mi się podstawowy układ, choć wydaje mi się, że przypadkowe małe nagłówki wrzucane pomiędzy najważniejsze historie znacznie go zaśmiecają.

CNN i Fox wybierają nieco bardziej zagracone podejście, głównie dlatego, że nie byli skłonni poświęcić cennej przestrzeni reklamowej ważnym wiadomościom. CNN ma trzykolumnowy układ z centrum, które jest najszersze, a ostatnim z nich jest przestrzeń reklamowa, po której następuje pasek boczny logowania.

Fox ma jeden duży obraz z trzema kolumnami pod spodem, wszystkie obok szerokiej kolumny po prawej stronie dla przestrzeni reklamowej, giełdowych i informacji społecznościowych.

Lekcja

Na stronie Foxa otrzymuję wiele informacji, co jest świetne, ale moje oczy nie do końca wiedzą, gdzie wylądować i często się odbijają, zanim cokolwiek przeczytam. Obecnie CNN przykuwa moją uwagę kilkoma twarzami, które zawsze są dobre do prowadzenia użytkowników tam, gdzie chcesz.

Uważam jednak, że naprawdę duże obrazy, takie jak te znalezione w Huffington i MSNBC, są naprawdę narzędziem, które pozwala mi zauważyć coś ważnego. Zostało to w znacznym stopniu wzmocnione przez ogromny, odważny tekst nagłówka Huffington.

„Czasami wiele treści uporządkowanych na małej przestrzeni to świetna rzecz”.

Która metoda jest najlepsza dla wszystkich użytkowników, to trudne połączenie. Trzeba tylko zajrzeć do bardzo popularnej listy Craigslist, aby zobaczyć, że duże obrazy nie zawsze są potrzebne, aby przyciągnąć uwagę odwiedzających. Czasami dużo treści uporządkowanych w niewielkiej przestrzeni to świetna rzecz, szczególnie jeśli chcesz mieć szybki przegląd wszystkiego, co ważne.

Świat nie jest miejscem, w którym jedno wydarzenie jest zwykle ważniejsze niż każde inne, więc zrozumiałe jest, że strony takie jak Fox odczuwają potrzebę znacznego podziału tej sekcji. Moja najlepsza rada to przywiązywanie jak największej wagi do kilku naprawdę ważnych rzeczy. Jeśli potrafisz zamienić jedną dużą, polecaną historię, wybierz ją. Jeśli nie, spróbuj utrzymać niską liczbę, w przeciwnym razie nie jest to tak naprawdę „polecana” sekcja, prawda?

Siatka opowieści

W miarę, jak przechodzimy obok nagłówka i polecanej treści, serwisy informacyjne stają się coraz bardziej odmienne, co utrudnia porównywanie ich punkt po punkcie. Jednak w tym momencie zaczyna się prawdziwe wyzwanie. To tutaj projektanci otrzymują górę innych treści i nakazują je zorganizować.

Każda witryna jest podzielona na różne unikalne moduły i sekcje ułożone w różne siatki, ale przekonasz się, że dość popularnym trendem jest podzielenie się na trzy kolumny, aby objąć różne artykuły. Oto przykłady z The Huffington Post, The Washington Post i The Economist, które właśnie to robią.

Posiadanie trzech kolumn ładnie dzieli zawartość, równomiernie lub przy użyciu podejścia o zróżnicowanej szerokości, takiego jak The Economist, w celu uzyskania większej kontroli nad naciskiem. Jednym z głównych problemów związanych z podejściem opartym na trzech kolumnach jest to, że nauczyliśmy nasze mózgi ignorowania trzeciej kolumny! Wszyscy wiemy, że w tym miejscu znajdują się reklamy i inne bzdury, których nie chcemy widzieć, więc w dużej mierze ograniczamy przeglądanie do dwóch pierwszych kolumn.

Może to być złe w przypadku witryn, które faktycznie posypują jakąś ważną kolumnę, ponieważ prawdopodobnie zgubi się w mieszance. Pamiętaj tylko o tej tendencji ze strony użytkowników i upewnij się, że trzecia kolumna nadal nie wygląda na bałagan reklam, gdy przejdziesz do solidnej treści.

Odświeżająca zmiana

CNN ma jedno z lepszych podejść do organizacji treści, jakie widziałem na stronie z wiadomościami. Używają czterokolumnowej siatki kart o jednakowej wysokości zwieńczonej nagłówkiem kategorii. Rezultat naprawdę wydaje się pozbawiony bałaganu typowego dla tych sekcji.

„Gdy wyciągniemy prawie wszystkie obrazy i znormalizujemy treść, rezultat jest o wiele bardziej użyteczny.”

Co ciekawe, kiedy wyciągniemy prawie wszystkie obrazy i znormalizujemy treść, rezultat jest o wiele bardziej użyteczny. W typowej witrynie z wiadomościami po prostu zbyt wiele konkuruje o moją uwagę. Każda historia wydaje się, że stara się krzyczeć głośniej niż ta obok niej, a jej wynik zwykle jest przytłaczający. Z kolei siatka historii CNN jest łatwa i przyjemna do przeglądania.

MSNBC ma również inne podejście. Organizują swoje historie w kategorie i umieszczają je w jasno określonych poziomych polach. Zapewniają one dużą kontrolę w twoich rękach, pozwalając ci wybrać liczbę historii do pokazania, a nawet dają ci kontrolę nad rozmieszczeniem pudeł.

Lekcja

Zauważyłem tutaj, że podobało mi się korzystanie z witryn, które organizowały ich zawartość w wyraźnie zróżnicowane sekcje i kategorie. Ten trzykolumnowy format, choć wypróbowany i prawdziwy, sprawia, że ​​przeglądanie wymaga dużego nakładu pracy i przypomina bardziej przesiewanie bałaganu.

CNN i MSNBC podjęły kroki w celu stworzenia wyraźnej wizualnej separacji między historiami a różnego rodzaju treściami i miały układy, które wyglądały mniej przypadkowo. Jednym z powodów bałaganu w trzech kolumnach są różne wysokości każdego modułu, który ustawia zawartość poziomo i powoduje wiele ruchów gałek ocznych w górę iw dół. Format równej wysokości bardzo pomaga.

Dlaczego to dla mnie ważne?

Większość ludzi, którzy to czytają, nie jest najlepszymi projektantami dla The Washington Post, więc dlaczego te obserwacje są cenne dla tej publiczności? Odpowiedź jest taka, że ​​chociaż nie wszyscy pracujemy na stronach z wiadomościami, wszyscy mówiliśmy naszym klientom przemówienie „za dużo treści”.

Nienawidzimy tego, gdy nasi klienci dają nam mnóstwo rzeczy i wymagają, abyśmy umieścili to wszystko na jednej stronie. Spróbuj, jak możemy się temu sprzeciwić, kilka sytuacji w rzeczywistości wymaga takiego podejścia. Wrzucenie wielu treści na jedną stronę, jednocześnie czyniąc ją użyteczną i atrakcyjną, jest jedną z najtrudniejszych sytuacji, z jakimi spotkasz się jako projektant, jeśli możesz ją pokonać, możesz zaprojektować swoje wyjście z czegokolwiek.

„W razie wątpliwości zazwyczaj należy uprościć”.

Lekcje, których się tutaj nauczyliśmy dzisiaj, można zastosować do każdej witryny, którą tworzysz, gdzie zmagasz się ze zbyt dużą ilością treści. W razie wątpliwości zazwyczaj należy uprościć. Przytnij ten duży, brzydki nagłówek, spróbuj znaleźć jeden lub dwa naprawdę ważne punkty i zmaksymalizować je, a następnie podziel resztę treści na wizualnie oddzielne sekcje, które są łatwe do przeglądania i nie wymagają zbyt dużego przeskakiwania do czytania.

Wniosek

Teraz, kiedy widziałeś moją analizę, co myślisz? Które strony z wiadomościami są według ciebie najbardziej atrakcyjne? Które są najbardziej użyteczne? Czy oba cele mogą być synergiczne?

Zostaw komentarz poniżej i daj nam znać, co myślisz o powyższych informacjach i przykładach.