Nejlepší postupy pro navrhování webových stránek sociálních zpráv
Jak získáváte denní zprávy? No ... můžete navštěvovat vaše oblíbené stránky a blogy, ale to je neúčinné, protože tyto blogy nemusí mít žádné aktualizace. Možná si je můžete předplatit pomocí RSS , který vám přináší všechny nové články přímo, ale v takovém případě budete muset projít všemi novými materiály a zjistit, co je pro vás zajímavé. Další možností by bylo navštívit stránky sociálních zpráv .
Sociální zpravodajské stránky jsou agregátory odkazů, což znamená, že jejich hlavní funkcí je shromažďovat a sdílet zajímavé odkazy. To může být provedeno prostřednictvím podání uživatele, nebo může být provedeno automaticky systémem. Agregační aspekt je pouze součástí, protože tyto stránky také třídí odkazy. Opět to může být provedeno uživatelským hlasováním nebo nějakým mechanickým algoritmem (i když v tomto případě můžeme skutečně nazvat "sociální" zpravodajskou stránku?). Konečný výsledek je však stejný: nejzajímavější odkazy se dostanou nahoru . Tato konkrétní funkce umožňuje sociálním zpravodajským místům skvělou alternativu k RSS.
V tomto článku předvedu některé ze současných špičkových sociálních zpravodajských stránek, identifikuje trendy a vzory v jejich návrzích a navrhne některé nejlepší postupy, které je třeba dodržovat při navrhování takových stránek. Začněme tím, že se podíváme na čtyři oblíbené stránky sociálních zpráv a uvidíme, jak se jejich návrhy srovnávají.
Digg
Digg je nejoblíbenějším společenským zpravodajským místem a představuje použitelný design, který je často přizpůsoben mnoha jeho konkurenty. Digg používá rozložení dvou sloupců : seznam příběhů vlevo a další věci vpravo, jako je například box 10 nejlepších příběhů. Nahoře Digg zobrazuje seznam kategorií příběhů a přímo pod nimi třídící prvky. Takže uživatel může vybrat kategorii, řekněme ... "Technologie" a pak ji třídit podle "Nadcházející", aby viděl všechny nejnovější příspěvky.
Vrtule
Vrtule je dobrým příkladem místa, které následuje po rozložení Digg. Je to rozložení dvou sloupců se seznamem příběhů vlevo a sekundárním obsahem vpravo , jako jsou nejnovější zprávy o Propeller nebo seznam nejvíce komentovaných příběhů.
Na rozdíl od Digg, vrtule používá horizontální oddělovače čáry mezi každým z příběhů, stejně jako zebra pruhované pozadí, aby byl seznam snadnější skenovat. To může pomoci, ačkoli musím poznamenat, že zebra striping je tradičně používána k ulehčení čtení na více sloupcových tabulkách, zvláště těch s mnoha sloupci. Důvodem je to, že si přejete přečíst část dat ve sloupci, který je daleko od původního štítku vlevo a pomocí průchodu zebra jako průvodce vám pomůže posunout oko napříč bez ztráty stopy řádku . V kontextu vrtule, která má v podstatě pouze jeden datový sloupec, je účinek zebra stripingu diskutabilní.
Reddit je příkladem jiného designu, než je návrh společnosti Digg. Reddit se zaměřuje především na obsah, zejména na titulky. Zaměření je tak silné, že vše odděleně od titulků je minimalizováno a odjíždí, aby se příběhy dostaly na přední sedadlo. Tento minimalistický design umožňuje velmi rychlou spotřebu informací, protože návštěvník může rychle skenovat spoustu titulků a najít zajímavý příběh. Vzhledem k tomu, že Reddit nemá pole popisu, každý příběh zaberá méně místa, takže na obrazovce mohou být zobrazeny další příběhy .
Reddit má také jedinečný prvek na samém vrcholu titulní stránky: náhodný nadcházející příběh. Stejně jako na ostatních společenských zpravodajských serverech se poslední příběhy Redditu nacházejí v sekci "nadcházející". Protože tato sekce má menší provoz než přední strana, některé zajímavé příběhy mohou být ztraceny. Chcete-li tuto nápravu napravit, zobrazí Reddit na první stránce náhodné příběhy, které jim poskytnou krátkou chvíli expozice, která by mohla potenciálně pomoci jejich hnací silou nahoru.
Newsvine
Společnost Newsvine ve svém designu zaujala jiný přístup. Na rozdíl od jiných sociálních zpravodajských stránek, které vypadají jako seznam titulků, používá Newsvine časopis / novinový vzhled . Příběhy jsou doprovázeny velkou fotografií a popisem a v některých případech obsah příběhu lze nalézt také na jeho stránce podrobností / komentářů.
Jedním zajímavým prvkem Newsvine je dopadová teplárna:
Graf zobrazuje dva pruhy: nejčastěji hlasované příběhy a nejvíce diskutované příběhy. Každá zobrazuje sadu bloků, všechny různé barvy a velikosti. Větší bloky znamenají, že je na nich buď více komentářů, nebo více hlasů, v závislosti na grafu, ve kterém jsou. Barva udává věk příběhu - zelená je čerstvá a červená je stará. Tato vizualizace umožňuje jedinečný způsob procházení obsahu ve službě Newsvine .
Nyní se podívejme na některé prvky společného rozhraní, které se nacházejí na webových stránkách sociálních zpráv:
Políčka hlasování
Všechny stránky sociálních zpráv mají určitou metodu hlasování o článcích, s výjimkou webů, které používají automatizované třídící algoritmy k sestavování řad. Tím je volební oblast velmi důležitá. Chcete, aby se dostala natolik, aby se zajistilo, že si lidé nenecháte ujít , ale současně je nutné, aby se dostalo dostatečně dobře do návrhu rozhraní, aby se při skenování seznamů titulků nerušilo .
Zde je několik příkladů volebních polí populárních zpravodajských stránek:
Každá krabička se skládá ze čtyř prvků: hodnost podání, součet hlasů, odkaz na hlasování o příběhu a odkaz na hlasování o příběhu . Většina webů nezobrazuje hodnost a zobrazí pouze součet bodů - to znamená, že se přidaly pozitivní i negativní hlasy. Když mluvíme o hlasování, většina sociálních zpravodajských stránek má způsob, jak hlasovat o příběhu, stejně jako o tom, ačkoli někteří rozhodují, že mají jen jediné tlačítko. V případech, kdy je zobrazeno pouze tlačítko nahoru, odkaz na "pohřbít" (nebo dolů) je příběh obvykle poskytován jinde.
Podrobnosti o příběhu
Každý příběh má víc než jen titul, který je s ním spojen. Příběhy obvykle zobrazují datum, uživatel, který je zveřejnil, stručný popis, odkaz na sekci komentáře a možná i obrázek.
Níže uvádíme několik příkladů oblasti podrobností o podání populárních zpravodajských míst:
Hlasování se často nachází vlevo. To mu umožňuje zůstat v konzistentním místě pro každý příběh. Odkazy na komentáře a další doplňky, například "sdílejte tento příběh", jsou umístěny pod popisem (pokud je k dispozici) nebo nadpisem. Tím, že podrobnosti textu okolo nadpisu šedé detaily ztratí a zaměřit se na titulky , takže skenování seznamu příběhů mnohem snazší, jak naše oči mohou rychle skákat z jednoho na druhý.
Většina sociálních zpravodajských stránek zobrazuje čas jako relativní - např. Před 10 hodinami. To dává smysl, protože lidé chtějí vidět, jak je čerstvý příběh a nemají zvláštní zájem o přesné datum a čas, kdy byly zveřejněny.
Také si všimnete, že některé weby zobrazují doménu, na kterou odkaz na podání vedou vedle jejího nadpisu, obvykle za hranatými závorami. To je užitečné, protože umožňuje návštěvníkům posoudit, jaký druh obsahu by měli očekávat . Pokud se například jako zdroj zobrazí "youtube.com", budou vědět, že jde o video. Významné zdroje jako 'nytimes.com' mohou být také ukazatelem kvality a délky příběhu. Zatímco uživatel bude moci vidět zdroj při pohybu nad linkou, zobrazování po celou dobu pomáhá při rychlém skenování titulků.
Stránkování
Sociální zpravodajské weby mají tisíce nebo v některých případech miliony uživatelských odkazů. Zobrazování všech těchto odkazů najednou je samozřejmě nemožné; musíte zobrazit současně malý soubor, který uživatelům umožní zpracovávat je . Odkazy jsou obvykle rozděleny na stránky pomocí stránkování . Stránkování je způsob rozdělení obsahu na několik stránek a poskytnutí sady odkazů, které obvykle vidíte v dolní nebo horní části stránky, která umožňuje přejít na další nebo předchozí stránku nebo zvolit číslo stránky, které chcete ručně.
Zde je několik příkladů stránkování populárních zpravodajských stránek:
Existují samozřejmě alternativy stránkování. Reddit zobrazuje pouze odkazy na následující a předchozí stránky:
Tato metoda usnadňuje navigaci tím, že nemusíte přemýšlet o tom, kterou stránku chcete, nebo potřebujete najít odkaz "další" - existují pouze dva odkazy, takže většinu času byste chtěli pouze na další stránce. Když to říkáte, dělá to trochu matoucí občas, protože je těžké zjistit, na které stránce jste.
Slashdot načítá více příběhů na požádání. Stačí kliknout na tlačítko "Více" a další příběhy jsou načteny pomocí AJAXu:
Nahrávání věcí pomocí AJAXu znamená, že neexistuje žádná "první stránka", jen příběhy nahoře a příběhy v dolní části.
Bez ohledu na zvolenou stránkování máte několik věcí, které byste měli mít na paměti, abyste se ujistili, že tento prvek rozhraní je použitelný. Oblasti prokliků by měly být velké - neposkytujte jen seznam odkazů, ale přidávejte do každého odkazu atribut CSS padding pro snadnější kliknutí. Zjistěte aktuální stránku jasně pomocí vlastního stylingu - uživatelé potřebují vědět, kde se právě nachází. Nakonec poskytněte odkazy "předchozí" a "další" . Většinu času budou vaši návštěvníci chtít procházet příběhy na další stránce, takže tím, že vytvoříte tyto odkazy, odnesete jakékoli myšlení, které se týká nalezení další stránky.
Komentáře
Konečná věc, kterou budu zkoumat, jsou komentáře. Komentáře jsou důležitým prvkem sociálních zpravodajských stránek, protože umožňují rozhovory o každém příběhu. Webová stránka, na niž odkazuje článek o příběhu, nemusí obsahovat komentáře, takže se jedná o diskusní platformu .
Zde je komentář, jak vypadají na Digg:
Komentáře lze hlasovat stejně jako jednotlivé příběhy. Ovládací prvky hlasování se nacházejí napravo od každého komentáře, jako palce nahoru nebo palec dolů. Nejvýše hodnocené komentáře se dostanou na vrchol seznamu , což znamená, že diskuse vyšší kvality budou vždy na vrcholu a veškeré bezcenné připomínky budou zrušeny.
K dispozici je i další funkce, kterou Digg poskytuje, aby lépe komentoval: závitování. Každá poznámka může spustit vlastní vlákno, pokud na ni odpovíte . Tyto podprocesy jsou "sbalené", ale můžete je otevřít pomocí odkazu s malými odpověďmi v dolní části komentáře podprocesu. Všechny odpovědi jsou pak uloženy pod nadřazenou poznámkou a lze je také hlasovat nahoru nebo dolů. To umožňuje zajímavé odpovědi, které zprostředkovávají vlastní diskuse.
Zde vypadají komentáře Reddit:
Podobné funkce zde: hlasování a závitování. Ovládací prvky hlasování jsou umístěny nalevo od každé poznámky a vypadají jako šipky nahoru a dolů. Reddit umožňuje hluboké navlékání, což znamená, že odpovědi na komentář mohou také obsahovat vlastní sady odpovědí, které se k nim vztahují . Ve skutečnosti to vytváří strom komentářů, protože mnoho individuálních komentářů rozmnožuje větve a dílčí větve odpovědí.
Konečně, uvidíme komentáře Newsvine:
Newsvine má stejnou strukturu jako Digg - každý komentář může být hostitelem souboru odpovědí, ale samotné odpovědi nemohou hostit další odpovědi. To udržuje pohled čistý, ale diskuse se stává trochu tužší . Ať už je to dobrá věc nebo ne, závisí na množství svobody, kterou chcete vidět ve svých diskusích.
Vizuální vzhled se mírně liší. Namísto pouhého přidání levého okraje ke každému komentáři jsou komentáře Newsvine zabaleny do políček. Odpovědi jsou také zabaleny do políček a jsou umístěny uvnitř rodičovského pole. To poskytuje jasný ukazatel vztahů. Newsvine také umožňuje pouze hlasování o rodičovských komentářích.
Myslím, že dva prvky, komentování hlasování a komentování závitů jsou základními složkami, které potřebujete k usnadnění dobrých diskuzí na stránkách sociálních zpráv. Hlasování se chová jako filtr, který odstraňuje všechny komentáře s nízkou hodnotou nebo spam, a dokonce je dokonce odstraní (některé stránky skrývají komentáře s negativními výsledky); a závit umožňuje diskuzi vyrazit do různých oblastí zájmu. Více diskusních oblastí znamená více věcí, o kterých mluvit, a další komentáře - něco, co tuhá struktura jedné vrstvy nebude schopna poskytnout.
Napsal výhradně pro WDD Dmitrij Fadeyev. Řídí blog nazvaný použitelnost Usability Post .
Používáte v současné době sociální zpravodajské weby, abyste získali denní dávku zpráv, a pokud ne, proč ne? Existují věci, které byste vylepšili, nebo funkce, které byste k těmto stránkám přidali?