Index 2: F Grade és ami utána van

Whereas most designers start with mock-ups, Sharp developed and coded 50 working versions of the site, experimenting with various column widths, layouts, and ways of presenting the pictures. "From the beginning, we were aware that if we were going to get somebody to spend all this time putting together a collection, at the very least, the collection had to be beautiful," Silbermann says. As Sharp puts it, "The grid was everything." His final version displayed interlocking images of a fixed width--192 pixels--and varying heights. When new images were pinned, the entire site would rearrange itself, meaning that users rarely saw the exact same home page twice. (Can Ben Silbermann Turn Pinterest Into The World’s Greatest Shopfront?)

Hétfőn hajnalban az első benyomásaimat írtam le az indexes változásokról. Most egy kicsit részletezőbben, egyszersmind unalmasabban szeretném összefoglalni egy nap használata után még egy körben az észrevételeimet. 

Mindenekelőtt a hétfő reggeli állapothoz képest (8 megabájtos nyitóoldal) valamelyes javult a helyzet. Sikerült optimalizálni a nyitóoldalon 2 megabájtot. Ez még így is négyszer-hatszor olyan nehéz oldal, mint egy átlag médiaszájté. Mert ugye az Index eredeti, valamint az "Index 2" oldala egyszerre töltődik be, ami azt idézi elő, hogy eszement mennyiségű kép, javascript töltődik le, és ráadásul nem is mindig a legoptimálisabban

Nem véletlen, hogy a YSlow-nál az új Index a legrosszabb, vagyis az F besorolást kapja

Erre írta sycko a Google+-on, hogy 

Grade F. tulragozni ezt nem lehet. (ez az elso F-es site amit latok, meg a tudodmelyik site is D). (...) a dupla cimlap tartalmi hatasat (...) szamomra felmerhetetlen. a fetch as googlebot tool eredmenyet erdekes lenne megnezni. valoszinuleg x meret utan egyszeruen nem fog foglalkozni a bot az oldallal, tul nagy a merete. de h ez okozhat-e barmit azt passzolom.
ha google mernok lennek, biztos nem orulnek, h 3-4 megas html-t kell a robotomnak letoltogetni es csak 300 kbyte a hasznos tartalma. (a jquery-t pl meg mindig haromszor toltik le, ketszer minifyolva, egyszer pedig a la nature, a 91kbyteos verziot)
eddigi tapasztalataim alapjan a 27 masodperc korul oldal betoltes hosszutavon biztos, h negativ hatassal lesz a site pontozasaban. overlay: ha sitemap engine jol mukodik, akkor tul nagy baj nem lehet. talan. a seo idaig se volt fontos. ezutan se lesz.

Az bizonyos, hogy a Google azokat az oldalakat szereti, amit a felhasználók értelemszerűen, könnyedén és nyűglődésmentesen tudnak használni. Bár az átirányítások tényleg jól lettek megoldva, ezzel együtt túlságosan elbonyolódott az Indexnél az url-kezelés. Egyre nehezebb lesz kontroll alatt tartani, hogy a sitecsoport mely részei is képezik az értéket, és melyek rendelődnek alá a jól teljesítő oldaltípusoknak. Máshogy fogalmazva: honnan lehet megtudni, hogy mi az érdekes az Indexen?

Nézzük, hogy az Index egészen pontosan mit ad ezért a 6 megabájtnyi oldalért. Vagyis: miből áll ez az Index 2, ami miatt az egész navigációs struktúrát megbonyolították most a site-on:

Kb ötven darab extra blogpostajánlóból. 

A címlapon is van ugyanennyi. Vagyis az Index mostani címlapja csak blogpostokból kábé 100 darabot ajánl egyszerre. Ha hozzávesszük az ennél több cikkajánlót, és az ezekhez tartozó képeket, valamint a mindenféle egyéb nagyméretű oldalelemeket, akkor érzékelhető, hogy az Index egy hatalmas és befogadhatatlan linktengerrel várja a címlapra látogatókat. Érdemes lenne lemérni, hogy ez a dupla oldalas címlap milyen gyorsan, milyen gyakran változik, és vajon az olvasók ebből mennyit észlelnek. 

Szerintem az Index tart afelé, hogy linkmegosztó oldallá alakuljon. És dizájn szempontból lehet, hogy érdemesebb lett volna kisebb szövegméretekkel, kisebb képméretekkel, sűrűbb layouttal megjeleníteni ezt az elképesztő mennyiségű tartalmat. 

Ha már dizájn. Érdekesnek tartom, és az én szememet speciel egyre jobban zavarja, hogy úgy vezetnek be újabb és újabb dizájnelemeket, hogy közben a régi dizájnelemeket is megtartják. Én biztosan holisztikusabban gondolkodtam volna a dizájnról, és ha már több körben hozzá kell nyúlni, ráadásul sok változást is át kell rajta nyomatni, ésszerűbb lenne egy határozott, egységes és következetes dizájneszköztárból felépíteni a site minden oldalát, szegletét, funkcióját. Mert most kb itt tartunk:

indextipo.jpg

A duplahasábos újítás mellett a másik figyelemfelkeltő változtatás az overlay cikkelőnézet. Ha csak ízlés kérdéséről lenne szó, annyival letudnám, hogy a weben megszokott és bevett navigációs folyamatoktól idegen, kifejezetten zavaró megoldás. Nem csak az Index esetében van ez így, hanem a sokkal világosabb vonalvezetéssel készült USAToday.com esetében is. Hogy a rengeteg korábbi microsite-ot ne is említsem, ahol ugyanezzel próbálták meg érdekesebbé tenni az amúgy érdektelen tartalmat. Meg persze az Apple, ami a Readert azért hozta be, hogy egy kicsit odapiszkáljon a számára érthetetlen webnek: "peruse pages from the clean, uncluttered, ad-free Safari Reader." Köszi, Apple. Menj vissza iOS-t meg iCloudot hegeszteni. Ping.

Az emberek böngészőfüleken, klikkeléseken, visszagombokon, egyértelmű wireframe-eken szocializálódnak a weben. Főleg ha a felület tengernyi tartalomból áll.

Arról nem is beszélve, hogy ma már nem az overlayben egységesített reader layout az érdekes, hanem az olyan, a layout és a tartalom dinamikáját jobban megragadó megoldások, mint amire mostanában az egyik érdekes példa a SilkTricky. Vagy épp a Mountain Dew oldala

silktricky.jpg

De még az ilyen megoldások sem arra vannak kitalálva, hogy több száz tartalmat megjelenítsenek egy dupla oldalon. Azt szokták mondani, hogy manapság a jó webdizájnnak legalább annyira ismérve a megfelelő optimalizálás, a frontend oldali átgondoltság, mint a grafikai vagy UI munka. 

Az átgondoltatlan és indokolatlan javascriptdömping nem csak a site optimalizálását és kezelhetőségét, hanem továbbfejlesztését is megkeserítheti. 

Hogy egy kicsit visszacsatoljak az előző postomhoz: azt kellene 2013-ban eldöntenie az Indexnek, hogy szakítani akar-e az újság énjével, és elindul-e a linkmegosztó oldalak irányába vagy sem. Ha elindul, akkor egy alaposabban átgondolt, és a mennyiségi tartalomfogyasztást jobban támogató layoutban és dizájnban kellene gondolkodniuk, és egyszersmind szakítani a médiás nagyképes, nagyfelületes ajánlókkal. Ha viszont újság akarnak inkább maradni több száz nem újságos tartalom közepette, akkor egy sokkal erőteljesebben hierarchizált, és talán egy időpillanatban jelentősen kevesebb, ám jobban szerkesztett és többet frissülő újság koncepciójához kéne megjelenést varrni. 

Az Origo is hamarosan megújul. Számukra adott most a helyzet, hogy határozott és átgondolt víziót mutassanak az identitáskeresésben ragadó Indexhez képest. 

A Zindexet meg rendbe kell rakni. Gyors, kipucolt, optimalizált, átgondolt. A mostani meg legyen az eldobható prototípus.

Címkék: reader overlay index redesign index 2 origo redesign
2013.01.08. 01:21. írta: hírbehozó

Kommentek:

A hozzászólások a vonatkozó jogszabályok  értelmében felhasználói tartalomnak minősülnek, értük a szolgáltatás technikai  üzemeltetője semmilyen felelősséget nem vállal, azokat nem ellenőrzi. Kifogás esetén forduljon a blog szerkesztőjéhez. Részletek a  Felhasználási feltételekben és az adatvédelmi tájékoztatóban.

8Mb? Te atya világ, akkor ezért gondolkodott annyira rajta a telefonom. Ha nem lenne mobil verziójuk kijelenthetném, hogy innentől nem nagyon olvasnék indexet.
Ez hogy betölti egyből a második oldalt is, teljes agyrém. Én és a webfejlesztés két különböző dolog, de meg lehetett volna ezt elegánsabban oldani.
Arról nem is beszélve, hogy nekem az egész valamiért akad, iszonyat lassú. Még meg is szoknám ezt az overlayt, ha nem lenne ilyen borzasztó gyenge az összehatás.
és vajon mobil eszközön miért nem lehet nagyítani? pl. ipaden sem, de androidon sem.
Sajnos egyetértek: ez így most egy egyre növekvő, egyre nehézkesebb és heterogénabb katyvasz. Ráadásul a blog-oldalon az alap kategorizálási eszközök (lásd még rovatok) is elvesztek. Annyira azért nem öröm a trutymóban gázolni, ha valaki mondjuk csak a receptekre, belpolitikára vagy cickókra kiváncsi és kurvára nem érdeklik a lol-macskák, vagy a feng-shui. 

Sajnos, úgy tűnik, elkerülhetetlen, hogy ne menjen át mindenki ugyanazokon a fázisokon: layerezés, javascript-mérgezés, kismillió apró bizbasz. Aztán amikor már minden megvolt, meg a csömör és a szétrobbanthatlan állandóan fagyó kódspagetti is, akkor jön a letisztulás, mint mondjuk a Guardian appja, amely pl. számomra máig példaértékű. De addig még hosszú az út, és rengeteg ötlet fog támadni, amit még mindenképpen bele kell zsúfolni.
@Alwares: a két oldal betöltése azért is fájdalmas, mert látszólag csak a felesleges sliding animáció kedvéért van így, tehát magas árat fizetnek egy annyira nem menő vizuális trükkért.

@vtec: a head-ben van egy olyan viewport beállítás, ami 1x-esre (azaz a készülék pontos méretére) fixálja a zoomot. Ezt csak akkor illene így csinálni, ha a fejlesztő biztos benne, hogy mobilra optimalizálta az oldalt és a usernek nem érdemes zoomolnia. Ebben az esetben 1x-esre kellett volna belőni, de zoomolás lehetőségével.
Breaking news: a címlapok és a cikkoldalak kiszolgálását is gatyába ráztuk. Viszlát, 8 MB, viszlát, döcögős szkroll. És holnap ilyenkorra még megy lejjebb. Egy ideális világban körülbelül most nyomnánk meg az élesítés gombot, most tart ott a site desktopon, hogy még vannak bugjai, de alapvetően oké. Hogy ezt miért nem lehetett kivárni, azt a Gergő tudja, de nem érdekli, és igaza is van, hiszen olvasóként engem sem érdekelne (és nem is tudnám).

A dizájnra vonatkozó észrevételekkel nincs vitázni valóm, a usabilityre elmondtam, hogy minden, ami eddig működött az Indexen, azonos logika szerint működik ezentúl is. Lett egy új nézet, ami szerintünk jó (egyébként pontosan ugyanaz, mint volt, mínusz egy darab, nem kattintott hasábnyi tartalmi ajánló és hirdetés, nem hittem, hogy 1000 pixel szemét fog hiányozni), és ugye ez is csak a szimpla klikkolásra van, hiszen új tabban nyitással, ahogy az advanced userek szoktak olvasni, nem változott egyáltalán semmi, teljes oldalakat szolgálunk ki. Az ilyen illetők akkor tudják meg, hogy csináltunk valamit, ha olvasnak Webisztánt.

Miniepilógus: a projekt sikerét nyilván a számok mutatják majd meg, amiknek idő stabilizálódni és trendet rajzolni. De úgy látszik, hogy már tegnap szignifikánsan több blogot olvastak sokkal többen, mint eddig. Mindezt úgy, hogy tegnap és ma az Index még dögletesen lassú volt és nehézkes. Ma estére rázódott a rendszer úgy össze, hogy nagyjából olyan, amilyennek szeretnénk, és harmada alá vágtuk a címlapot adatmennyiségben.

Pár napig olvasgassátok nézegessétek, hátha összeáll a kép. Az volt a célunk, hogy egy minden eddiginél zajmentesebb, tisztább Index-szel, és egy minden eddiginél könnyebben olvasható és navigálható közösségi tartalommal kezdjük 2013-at. Nyilván mi járunk jól, ha sikerül, de alapvetően az olvasónak és a bloggernek kell jobban éreznie magát ahhoz, hogy sikerüljön. Erre hajtunk.
iszonyatosan zavaró ez a felbukkanó ablakos cikkmegjelenítés! a nagykép rovatnál nem is működik. ekkora szart még sosem nyomott ki magából az index.
@Alwares: @vtec: @markusbird:
Az ember azt hinné, hogy a zemberek most állnak át épp mobil eszközökre erre mit csinálnak ezek? Direkte megsz****ják őket.
Nexus en 7 collon nem tudom elolvasni
Arnova egymagos 10 colloson behal a zandroid
Napi egyszer betöltöm, kimerül.az 500 megás limitem, másnak meg 200 van.
Szóval bravó! Welcome to the new mobile world..
Az indexnek az volt eddig a szerencséje, hogy szinte az egyedüli mondjukhogy normális és naprakész HÍRportál volt. Ha felbukkanna valami nem magyar nemzet meg nem népszava hírportál, szerintem nekik annyi lenne..
@Nínó Karotta: nézzétek meg légyszíves tabletekkel is! Zoomolni még mindig nem lehet, anélkül meg használhatatlan. Nem vagyok hajlandó mobil nézetbe kapcsolni 7/10 collon, ja hogy ott se lehet zoomolni ;)
breaking: már csak on demand tölt be az index2.
@goldengiccs: a naykép is menni fog. Kösz a türelmet.
ha nagyon zavar a layer... hát görgess le.
"Meg persze az Apple, ami a Readert azért hozta be, hogy egy kicsit odapiszkáljon a számára érthetetlen webnek: "peruse pages from the clean, uncluttered, ad-free Safari Reader." Köszi, Apple. Menj vissza iOS-t meg iCloudot hegeszteni. Ping.

Az emberek böngészőfüleken, klikkeléseken, visszagombokon, egyértelmű wireframe-eken szocializálódnak a weben. Főleg ha a felület tengernyi tartalomból áll."

ez csacskaság. :)

ha megnéznéd, h 2010. közepén mekkora volt az installált safarik alatt az átlagfelbontás, valszeg azt látnád, h jellemzően túl nagy, ahhoz, h a wireframe-ekből kitúrt tartalmat a legvégén kellő fókusszal elolvasd. így abszolút reveláció volt megklikkelni a readert 10ből 8szor, nálam (1920*1200) pl. csak ezért volt fenn win7 alatt a safari, amióta meg már nincs új, wines verziója, minden platformon readability, de annyira, h bookmarkolás helyett is már jó ideje a pin tabolt reading listre teszek ki bármit, amit el akarok olvasni, mert ez akárhonnét megnyílik, és spec. fb-n is csak readabilityvel osztok meg..

a silktrickyt én nem rángatnám ide, hiába érdekes :), egész addig tuti nem, amíg nem akad legalább 1db index kaliberű portál, aki már használja..

az overlayben egységesített nézettel prezentált blog.hu-s tartalom olvasói szempontból teljesen rendben van (engem is az adott tartalom érdekel, nem a kapcsolt dolgai), karotta érvelése itt tökre védhető, az a szándék nem védhető, h ezt megpróbálja a bloggereknek mint jóság eladni, ez két külön tányér. adjon share-t, mint a google, ne lehetőséget arra, amivel valszeg úgysem lesznek képesek élni a bloggerek..

ipad (4.2.)1-en zéró futó alkalmazás mellett elsőre megdőlt a safari, másodjára már nem, de rendesen görgetni így sem lehet; persze ezért van fent rajta az opera, ami meg egykedvűen rágcsálja, ilyen az, amikor kellően puha anyag bélel régi, rossz vasat.. :)