Aanpassing weergave nieuwsberichten

Na de introductie van de vernieuwde layout van Tweakers.net een week geleden was de meest gehoorde klacht van gebruikers het ontbreken van een overzicht van alle headlines op de frontpage. Daar konden we ons na enkele dagen wel wat bij voorstellen: in de dagelijkse praktijk bleek het zelfs voor ons onhandig dat niet al het nieuws van de dag in één oogopslag gevonden kon worden. Hierdoor leek de frontpage leger dan hij eigenlijk was, en bleef nuttige content verborgen voor geïnteresseerde lezers.

Om hieraan tegemoet te komen is de frontpage per direct op een aantal punten aangepast: Alle headlines van alle channels worden als vanouds in de middelste kolom weergegeven. Door middel van een kleine gekleurde bullet wordt aangegeven in welk channel een bericht thuishoort. Het ontbreken van een bullet geeft aan dat het bericht alleen in Main staat. Op Tweakers.net/nieuws worden de complete nieuwsberichten uit alle channels onder elkaar weergegeven. Uit de titelkleur is af te leiden tot welk channel het bericht behoort.

Vanuit elk bericht kun je doorklikken naar het vorige en volgende bericht. Indien dat een sprong naar een ander channel (en dus een gewijzigde layout) inhoudt is de desbetreffende link in grijs weergegeven en staat het juiste channel er voor genoemd. Bij het navigeren wordt getracht zo weinig mogelijk layoutwisselingen toe te passen: Klik je vanuit een bericht dat in Pro staat naar een bericht in Pro én Main, dan blijf je in de Pro-layout.

Met deze wijzigingen hopen we een hoop mensen tegemoet te komen. In de komende weken gaan we door met het verder verbeteren van de site aan de hand van alle door de gebruikers gegeven input.

Reacties (98)

Die rode kleur is weer anders dan de drie kleuren oranje-rood die gebruikt worden voor de channels en main. Nog een kleur erbij...

Een voorstel zou kunnen zijn om bij actieve/nieuwe items de link direct in de kleur van het channel weer te geven. De hover is dan underlinen. De oude items zijn gewoon zwart en daar is de hoverstate dus underlinen + de kleur van het channel.

Want nu zou je haast weer denken dat de rode kleur staat voor een bepaald channel in plaats van een actief item. Maar ja, allemaal kleurtjes maakt het allemaal weer zo druk en dus 'elk voordeel heb zijn nadeel'.

We willen allemaal zien welke items nieuw zijn sinds het laatste bezoek. Maar ik denk dat we ook niet allemaal kleuren rood moeten willen hebben zodat we niet meer weten welke kleur nu wat betekend.

Een ander voorstel. Doe wat met de normaal grijze tijd. Maak die bij een actief item zwart waardoor evengoed duidelijk is dat het een actief item betreft. Het is dan niet de oude vertrouwde kleur rood. Maar wat is nog oud en vertrouwd tegenwoordig met de nieuwe layout

Ik heb vanmiddag verschillende mogelijkheden geprobeerd en wat mijn inziens het beste werkt voor de tracker en ook esthetisch het meest verantwoord is, is het gebruiken van een opvallende kleur voor de tijd en zwart voor de titel. Alles rood maakt een overdadige indruk. Met alleen de tijd in de channelkleur zijn nieuwe items ook goed herkenbaar. Hetzelfde principe kan ook gebruikt worden voor de headlines op de frontpage. De linkjes in de channelkleur weergeven zal vermoedelijk een kerstboomeffect veroorzaken wat ook niet direct wenselijk is.

Het is nu eenduidig tussen de tracker en headlines, het ziet er prima uit!

zo te zien is er iets met je advies gedaan. in de tracker van got, reacties etc aan de linker kant staan nu de tijden in felrood aangegeven als ze nieuw zijn.
is helemaal perfect zo, netjes tweakers
edit: ik zie dat ze de channel kleuren ook toegepast hebben. hulde voor de snelle verwerking

[Reactie gewijzigd door jpiwf op 13 juni 2007 18:02]

Het heeft inderdaad veel weg van hetgeen ik hierboven aangaf. En het is ook goed dat het in de tracker zo wordt doorgevoerd. Ik zou echter ook voor een dergelijke systeem kiezen binnen de headlines tabel op de frontpage zelf

Hoewel dit een goede verbetering is kleeft hier nu wel een nadeel aan. Nadat je geklikt hebt op een Core/Pro/Life item wil je weer terug gaan naar de index waar je vandaan komt. Veel zullen dat doen door op het T.net logo te klikken, nu kom je echter terecht op de Core/Pro/Life pagina, terwijl ik zelf zou verwachten terug te komen op T.net zelf. Ik zie ook geen andere manier om direct terug te komen op T.net zelf...

Misschien dat hier ook nog naar gekeken kan worden?

(Mijn excuses voor het geval als dit dubbel is genoemd, ik heb het hele topic niet doorgelezen)

Ik denk dat we er in de huidige opzet inderdaad beter voor kunnen kiezen om het logo altijd naar de mainfrontpage te laten verwijzen. In de huidige opzet zijn de channels minder 'sterk' en onderscheidend dan in de oorspronkelijk visie. Dit heeft ook gevolgen voor de wijze van navigeren.

nee hoor, je bent de eerste die dit zegt. (hoewel de reactie van ran.con er op lijkt)

Maar je hebt nog wel gewoon de mogelijheid om 'vorige' te kiezen in je browser (veel mensen hebben daar een snelkoppeling voor op de muis), of op het 'main' labeltje klikken rechtsboven.
Dat is inderdaad wel iets meer klikwerk. ;-)

ja vind het ook lastig dat je niet naar tweakers.net zelf terug gaat. Heel onhandig. Wel blij dat het weer mogelijk is om alle nieuws items in 1 keer te zien. En vond het oude systeem om van nieuws-item naar nieuws-item te gaan door te klikken op de vorige-volgende nieuwsitem link ook handiger. Nu staan er soms 3 links onder het nieuwsbericht en sla ik soms iets over. Moet ik nog op frontpage gaan kijken of ik effectief alles doorlopen heb.

Misschien is het handig om mainartikelen toch ook een bullet te geven, die onregelmatige lege ruimtes op de FP staan best vreemd eigenlijk. [/pietjezeikveelmodus]

Daar is inmiddels voor gezorgd.

Misschien een idee om die bullets wat dieper op de materie in te laten gaan dan alleen op channel?

Meer á la hoe het op de vorige frontpage was?

Er is al aangegeven dat er te veel categorieën zijn om daar allemaal gekleurde bullets aan te hangen. Daarom is dus gekozen alleen het channel visueel herkenbaar te maken.

Bullets voor elke categorie is in de huidige opzet niet haalbaar. De channelkleurtjes geven ook een aardige indruk over het onderwerp of de context waarin een onderwerp geplaatst dient te worden. Iemand die vooral geïnteresseerd is in consumentenelektronica kan dat nieuws er nu makkelijk uitpakken door naar items met een oranje bullet te kijken, zo ook voor pc-hardwarenieuws. Het bedrijfsnieuws heeft meestal Pro als belangrijkste channel en kan op die manier ontweken worden door gebruikers die niet geïnteresseerd zijn in bedrijfsnieuws.

De bullets waren juist afgeschaft omdat er zoveel categoriën zijn dat de bullets niet meer overzichtelijk waren, dacht ik, dus om nu weer dat systeem te gebruiken...

@Femme: W00T

Wat Civil zegt dus...

[Reactie gewijzigd door Proto op 12 juni 2007 20:32]

sjonge.. dit gaat wel heel rap hoor
Dit lijkt idd wat mooier.
(wat een mooi gezicht al die worshippy's : - )

En het wordt nog beter

Sluit ik me bij aan
Verder echt top deze verbetering! Nu alleen nog een andere kleur voor ongelezen headlines en t.net NG is op alle punten beter dan vroeger

Is de meuktracker eigenlijk ook verschillend tussen de verschillende channels?

Ja, en hopelijk is dat de volgende punt die men (terug)verbetert. Om vier pagina's door te moeten spitten voor alle nieuws met dubbele regels is namelijk net zo irritant voor meuk.

Ik vraag me ook af waarom er met al dat 'web 2.0' geweld er niet is gekozen voor echt dynamische layout in de breedte, het is nu 1024x768 i.p.v. 800x600, dat is nog steeds een verspilling bij moderne resoluties. Als je toch in 800x600 wil lezen kun je je browservenster nauwer maken, maar omgekeerd kan het alleen serverside.

De huidige opzet is te krap voor 800x600 lijkt me.

neej hoor, alleen de rechter kolom is te breed...
NOG iets meer dhtml en je kunt dat aanpassen, of de keuze maken delen dan maar weg te laten, of meer info in de linker kolom (roll-outs maybe?)

Inderdaad. Ik zou juist graag hebben dat de breedte van de linkerkolom dynamisch is. Nu kan je meestal net niet lezen wat er staat (omdat het laatste deel van de text wegvalt)......

bah die veranderingen ook altijd, ik was net gewend aan de nieuwe manier, ik mis mijn twee headline's op de frontpage

nee grapje, goed dat T.net zo snel weer veranderd, getuigt van flexibiliteit. Goede zaak.

edit:
Zie ook dat de links de kleur krijgen van hun eigen catogorie als je erover heen hovered, ook handig

[Reactie gewijzigd door Geert.H op 12 juni 2007 17:38]

Het is nu wel zo dat je, wanneer een artikel óók in een channel maar tevens in Main staat (non-channel-exclusief), je naar dat channel gaat... zo worden de channels meer gebruikt (althans in mijn browse-praktijk). Tegelijkertijd verminderd daarmee het idee dat je op een channel thuis bent. Niet voor niets is dit een aanpassing en niet een oorsponkelijk idee van de t.net NG.
Daarbij wanneer er vier vorige/volgende linkjes onder een artikel staan (ik gebruik die dingen toch al nooit btw) omdat het artikel vanuit main gezien toevallig tussen twee artikels van een ander channel valt... kan ik me voorstellen dat mensen de logica niet snappen.

Toch vind ik het al met al een goede aanpassing, omdat het vanuit je eerste binnenkomst op t.net gezien gewoon een stuk overzichtelijker is. En de eerste indruk is het allerbelangrijkst en bepalend voor de tevredenheid van je bezoekers. En dus ook voor mijn tevredenheid.

Edit: laat ik mij dan maar bij alle reageerders hier voegen:

[Reactie gewijzigd door ram.con op 12 juni 2007 17:35]

Super aanpassing!

Nu mis ik eigenlijk nog maar 1 ding: de linkjes naar het volgende en vorige artikel onder de reacties. Dus niet alleen er boven, maar ook er onder. Ik lees eigenlijk vaak alle reacties en wil daarna pas door naar het volgende artikel. Nu moet ik eerst naar boven scrollen en dan op volgende drukken. (In de "oude" tweakers layout, was dit er wel bij artikelen, maar niet in de meuktracker. Nu is het er helemaal niet meer...)

Oh ja! Ook nog... als je een artikel bekijkt met meerdere pagina's, dan staat onder elke pagina de inhoudsopgave. Echter, tussen de middelste bullets is altijd extra whitespace. Ik denk dat dit nog komt omdat in de oude layout, er twee kolommen waren met bullets, nu is dat er nog maar één. Maar netter lijkt mij om alles onder elkaar te zetten?

De volgende/vorige linkjes onder de reacties gaan we regelen.

Bedoel je met de opmerking over de inhoudsopgave de ruimte tussen het paginanummer en de paginatitel?

Super van die reacties!

Wat ik bedoelde met de inhoudsopgave... is iets dat ik nu niet weer kan vinden. Misschien komt dat omdat ik op het werk ben nu met IE en dat het alleen in Firefox is te zien, of ligt het aan het verschil in resolutie. Wat ik bedoel is dat als je een review hebt van meerdere pagina's dan heb je een inhoudsopgave onder elke pagina. Ik zag deze een paar keer dat de inhoudsopgave onder elkaar staat, ipv in 2 kolommen zoals normaal. Als ik dit weer zie, maak ik er wel even een screenshotje van en laat ik het wel ergens weten.

Ja, leuk hoor, maar door die aanpassing valideert de pagina niet meer als HTML 4.01 strict:

class=" class="life""

is niet helemaal correct volgens mij, maar lijkt me niet al te ernstig om recht te zetten, toch?

En nog een niet bestaande tag '<wbr>' in Reviews & .plans: het bericht over het VNU-Karttoernooi.

Desondankt ben ik erg onder de indruk dat een site van deze omvang zich volledig aan de web standaarden houd!

[Reactie gewijzigd door Anoniem: 70267 op 15 juni 2007 13:46]

Dat met die class hoorde inderdaad niet zo. Het probleem is opgelost.

De <wbr>-tag wordt op sommige plekken gebruikt als 'zero-width space' om aan te geven dat een woord op een bepaald punt afgebroken mag worden door de browser. Deze tag is inderdaad invalid. Een alternatief is de het unicode zero-width space karakter, maar die wordt verkeerd weergegeven in IE6.

&shy; heeft in dit geval ook geen zin (als het al zou werken)

Misschien een lege <span>?

Edit: duh...

[Reactie gewijzigd door Anoniem: 70267 op 15 juni 2007 20:53]

Ziet er super uit. Terug alles mooi in 1 lijst, bedankt

Valt het niet te overwegen om rond alle links dat kadertje weg te moffelen (stippelijn-kader wanneer je een link selecteert) ? Het valt op dat er in de nieuwe layout nogal duchtig gebruik gemaakt is van display: block en die dingen als dat kadertje er rond komt.

De blocklevel elementen zijn het gevolg van het gebruik van ellipsis voor het client-side afkappen van titels zodat ze op één regel passen. Hier valt niet zoveel tegen te doen vrees ik.

Het gebruik van blocklevel elementen is op zich geen probleem, dat wordt vaak gebruikt om gewoon nog maar ervoor te zorgen dat een link in een lijst gehovert wordt van links tot helemaal rechts; niet enkel de effectieve tekst (wat hier dus eveneens de situatie is). Nadeel daaraan is dat die kadertjes ook zover doorlopen, maar als ik me niet vergis haal je die weg door outline: none; te gebruiken in de css-code van de links.

Dat kadertje is echter voor mensen met een handicap heel handig als ze door de pagina heen tabben op zoek naar de juiste link om verder te navigeren. Zonder die outline is moeilijk te zien welke link op dat moment gefocust is.

Dus vanuit het oogpunt van toegankelijkheid zou ik geen outline: none; toepassen.

't is me ook opgevallen dat de text van de artikels nu breder gemaakt is. maakt het in een keer een pak rustiger om naar de kijken

een hele verbetering

Waar zie je dat ?

Nieuwsartikelen hebben gewoon nog een smalle kolom. Tenzij je ze bekijkt op de nieuws pagina.

Reviews hebben wel een bredere kolom voor de content. Maar dat was ook al zo.