Bugbash en weghalen zwarte balk - Development-iteratie #152

In deze iteratie hebben we verschillende verbeteringen doorgevoerd, waaronder het weghalen van de zwarte balk onder het menu en metadata toevoegen aan de uitgelichte berichten op de frontpage. Daarnaast hebben we een bugbash gehouden om kleine issues te fixen.

Geen zwarte balk, geen slogan

We hebben onlangs de keuze gemaakt om iets meer ruimte te pakken voor content door de onderbalk van het menu weg te halen. Deze onderbalk nam verticaal 34 pixels ruimte in beslag en dat is net zoveel als één headline op de frontpage, bijna net zoveel als een regel in de prijstabel of 1/3 van de hoogte van een item in de productenlijst. Kortom, we krijgen er een iets hogere informatiedichtheid op de site voor terug.

Wat is er dan gebeurd met de slogan "Wij stellen technologie op de proef"? Die is alleen nog (deels) zichtbaar in de tabtitel van je browser. De slogan werd al geruime tijd niet meer gebruikt in onze marketinguitingen en daardoor verliest hij z'n kracht. De Twitter- en Facebook-tellertjes zijn ondergebracht in de footer.

Relevante snelkoppelingen in de ankeilers

Sinds de release van de vorige iteratie tonen we uitgelichte artikelen in een nieuw jasje. Deze stijl biedt de ruimte om relevante koppelingen te tonen, naast de knop van het artikel zelf. Het is nu mogelijk voor de redactie om naast losse topics ook een compleet forum te koppelen, bijvoorbeeld het "Videokaarten & Beeldschermen"-forum. Daarnaast zorgen we ervoor dat er automatisch een koppeling met de Pricewatch wordt gemaakt op basis van de gekoppelde producten. Hiervan krijg je in de Pricewatch een overzicht te zien, zodat je dit niet meer zelf hoeft te verzamelen. In de toekomst zullen we nog meer soorten koppelingen mogelijk maken om meer van Tweakers te kunnen tonen.

Uitleg van filters weergeven op mobiel

We tonen in de desktopview al enige tijd tooltips bij filters voor de bezoekers die niet precies weten wat een bepaalde specificatie inhoudt. Op mobiel hadden we deze mogelijkheid nog niet en als je niet weet wat het betekent, is het lastig te bepalen of het desbetreffende filter relevant voor je is. Nu kun je ook tijdens het filteren op je mobiel meer lezen over een specificatie en daardoor betere keuzes maken.

Bugbash

We hebben aan het begin van de sprint een community-bugbash gehouden, waarin we kleine issues gefikst hebben die door de community gepost waren. Wat hebben we zoal gefikst?

• Dubbele knop 'Beoordeling schrijven' weghalen voor het schrijven van een V&A-beoordeling.
• De bevestiging duidelijker maken als je de winactie aan je voorbij laat gaan.
• Duidelijker maken als winkels niet aan je filterinstelling voldoen in de prijslijst.
• Oude berichten in een sticky ook een rode datum geven.
• Aboschildjes zichtbaar maken in het Forum bij een te lange gebruikersnaam.
• Kleuren per karmatype i.p.v. per aandeel in je karmaverdeling.
• Lazy-loading ook toepassen in voorbeeldweergave van je reactie op het Forum om data te beperken.
• Ongelezen dm's in trash tellen niet meer mee in je notificatieteller.
• 'Veiling' onderdeel maken van de link naar een advertentie.
• Prijsdalingen met een producttitel over twee regels (of meer) goed weergeven op mobiel.
• Reactieoverzicht op mobiel goed weergeven (responsive gemaakt).
• Link naar moderatie FAQ toegevoegd aan moderatie pop-up.
• Bier-icoon toevoegen aan reactie en frontpage - ':9B' maakt

Tot slot

44 69 74 20 77 61 73 20 6d 69 6a 6e 20 6c 61 61 74 73 74 65 20 2e 70 6c 61 6e 20 65 6e 20 69 6b 20 77 65 6e 73 20 6a 75 6c 6c 69 65 20 61 6c 6c 65 6e 20 76 65 65 6c 20 70 6c 65 7a 69 65 72 20 6d 65 74 20 64 65 20 74 6f 65 6b 6f 6d 73 74 20 76 61 6e 20 64 69 74 20 70 72 61 63 68 74 69 67 65 20 70 6c 61 74 66 6f 72 6d 2e 20 49 6b 20 7a 69 65 20 6a 75 6c 6c 69 65 20 76 61 73 74 20 6e 6f 67 20 77 65 6c 20 6f 70 20 64 65 20 4d 4f 41 4d 20 6f 66 20 6f 70 20 65 65 6e 20 61 62 6f 64 61 67 20 3a 29

Reacties (82)

Voor wie zich afvraagt wat de hex reeks betekent

Dit was mijn laatste .plan en ik wens jullie allen veel plezier met de toekomst van dit prachtige platform. Ik zie jullie vast nog wel op de MOAM of op een abodag

[Reactie gewijzigd door P1nGu1n op 26 maart 2019 14:34]

Ga jij ook weg?

Jij was sneller dan mijn edit Maar veel succes!

Thnx!

5375636365737320656E20626564616E
6B7420766F6F7220616C6C652062696A
64726167656E

Graag gedaan

voor de mensen die niet weten hoe dit van die "gekke letters en cijfers" omgezet is naar tekst?
Het origineel is in hexadecimaal en dat heeft @P1nGu1n omgezet naar tekst. Dit kun je gemakkelijk via een breed scala aan sites doen door bijvoorbeeld een google search te doen "from hex to text". Vanaf daar is het de cijfers/letters copy pasten en tadaaaaaa

Bedankt voor je werk! Ik erger mij hier trouwens wel een beetje aan bij de nieuwe balk https://gyazo.com/80d9727d960341f544c31fb82b2a9d49
De overloop boven aan is net niet lekker vloeiend

[Reactie gewijzigd door NickyVDP op 26 maart 2019 15:50]

Is ook uit te zetten met custom CSS. Ik heb die hele knop weg gewerkt.

Volgens mij bedoel je dat de ronding dan nog net iets verder door mag lopen naar rechts? Ik gok dat het neerkomt op 1 of misschien 2 pixels. Ik geef het door.

@Zvennn Kan het kloppen dat deze bugbash invloed heeft gehad op de breedte van topic warnings? Voorheen waren deze even breed als het quick reply veld, nu net zo breed als forum posts.

edit: Had nog een pagina open met oude breedte, vergeleken met de nieuwe lijkt deze custom CSS (vergeten dat ik dat gebruikte)
.bar.warning.topicwarning {
width: 618px;
margin-left: 164px;
}
sinds vandaag niet meer te werken.

edit2: Verplaatst van custom CSS naar Stylus addon, werkt weer.

[Reactie gewijzigd door Raven op 26 maart 2019 18:56]

Gelukkig heb je het zelf kunnen vinden anders had ik mij suf gezocht haha

@Zvennn Er is nog meer verandert (dan wel stuk gegaan) sinds gister. Ik zit nu haast te denken dat de custom CSS feature op T.net om de een of andere reden gestopt is met werken. Als ik alles verplaats naar browseraddon Stylus dan werkt het weer.

Custom CSS staat nog wel geactiveerd in de karmastore

In de broncode moet je een verwijzing kunnen vinden naar https://tweakers.net/ext/customcss.dsp?[getal] - als je die link opent zie je dan je eigen CSS? Zoniet, helpt een harde refresh dan? En als dat niet werkt, helpt het als je een kleine wijziging maakt in je custom CSS en opslaat?

Ik zag in ieder geval zo gauw geen fouten in je CSS; bij mij werkte het gewoon.

Ik zie bij een net gerefreshte tab deze staan: https://tweakers.net/ext/customcss.dsp?1553674745 , dus het wordt wel geladen.

Daarna de code van het smaller maken van de TW weggehaald uit Stylus en weer naar custom CSS, nu werkt het wel

edit: Met die code althans...

[Reactie gewijzigd door Raven op 27 maart 2019 10:49]

Ik ga het doorgeven, Custom CSS zou gewoon moeten blijven werken nml

@Zvennn 2c 20 76 65 65 6c 20 73 75 63 63 65 73 20 65 6e 20 70 6c 65 7a 69 65 72 20 62 69 6a 20 77 61 74 20 6a 65 20 68 69 65 72 6e 61 20 67 61 61 74 20 64 6f 65 6e 2e

QmFzZTY0IHpvdSB2ZWVsIGNvbXBhY3RlciB3YXMgZ2V3ZWVzdCBvbSBqZSBlaW5kLXNwZWVjaCBpbiB0ZSBzY2hyaWp2ZW4uLi4u

Klopt, maar ik dacht, hexadecimaal is toepasselijker voor een designer

Ik snap wel dat je geen genoeg kon krijgen van de kleur codes! Als het kon had ik de hex-codes in UBB-code tabellen gehangen. Dat zou denk ik best een kleurrijk geheel zijn geweest en zeker ook een leukere puzzel. Het aantal tekens van de tekst/reacties moet dan wel deelbaar zijn door 3, anders komt het niet uit. En het lezen zou denk ik best een tijdrovend klusje zijn geweest...

Ja het moet wel een beetje te doen zijn, anders neemt niemand de moeite haha. Maar wel een leuk idee van de kleuren. Had wel gekund namelijk

Als men dan toch bezig is.. verwijder dan gelijk ff die vreselijke grote foto's op de frontpage!

Installeer een CSS extensie met:

.fpAnkeiler.news.fullWidth, .fpAnkeiler.review.fullWidth {
height:140px;
}

.fpaImage.review{
top:-70px;
}

.fpaMeta, .inBetweenContent {
display:none;
}

[Reactie gewijzigd door SuperflipNL op 26 maart 2019 15:22]

Bedankt voor het delen, dit maakt de FP weer een stuk overzichtelijker

Als je nog meer CSS code wilt voor Tweakers, stuur maar een DM oid.
Mijn Tweakers frontpage ziet er zo uit. Heb ook wat CSS code voor compactere weergave van reacties.

Toevoeging aan de verbeteringen/aanpassingen:

Als je wil modereren, dan is de tekst aangepast.

Kies score
Beoordeel objectief om nuttige en minder nuttige reacties te scheiden.

Hoe dan?
Lees voor je gaat modereren, eerst de Moderatie FAQ[

Je hebt helemaal gelijk! Die heb ik over het hoofd gezien (in onze backlog) dat deze bijgewerkt is.

Geen probleem, waarschijnlijk komt het door die traan in je rechter ooghoek
Veel succes met wat je gaat doen!

Ja m'n toetsenbord is ook meteen aan vervanging toe door al dat zoute water Thnx!

Wat leuk, in de vorige .plan had ik het al over de zwarte balk > TheTinusNL in 'plan: Vernieuwde frontpage - Development-iteratie #151'. Goed om te zien dat die nu eindelijk weg is.

In mijn reactie beschreef ik nog wat meer.
Wordt er nog verder aan gewerkt?

[Reactie gewijzigd door TheTinusNL op 26 maart 2019 16:17]

Misschien gewoon solliciteren voor de functie van UX Designer, en dan kan je he-le-maal los
https://tweakers.net/plan...igner-userresearcher.html

UX staat hoog op mijn interesselijstje... echter die 38 uur wordt nogal lastig combineren met een voltijd universitaire bachelor, maar anders... oh en eerst nog even aan de eisen voldoen

Veel succes in ieder geval met wat komen gaat Sven.

Wellicht is dan een stage iets voor je

We hebben onlangs de keuze gemaakt om iets meer ruimte te pakken voor content door de onderbalk van het menu weg te halen. Deze onderbalk nam verticaal 34 pixels ruimte in beslag en dat is net zoveel als één headline op de frontpage,

Dweil mij maar op. Eerst worden er krankzinnig grote plaatjes geïntroduceerd die praktisch alle headlines van het scherm duwen (en waar half Tweakers nu Custom CSS tegen gebruikt) en dan gaan we een juichstemming creëren omtrent 34 pixels

De nieuwe plaatjes zijn niet hoger dan de oude plaatjes.

Liegen is niet netjes Kees.

Screenshot van 10 februari 2019 (links) en 24 maart 2019 (rechts) naast elkaar: https://imgur.com/1jfIoXM

Dat plaatje rechts is duidelijk iets hoger dan de oude plaatjes.

PS Die adblock melding komt van web.archive.org.

[Reactie gewijzigd door Drardollan op 26 maart 2019 16:30]

42 65 64 61 6e 6b 74 20 65 6e 20 68 65 65 6c 20 76 65 65 6c 20 73 75 63 63 65 73 73 2c 20 53 76 65 6e 21

47 72 61 61 67 20 67 65 64 61 61 6e 21

Zwarte balk weg? Die was hier allang weg
Custom css FTW!

Jij en vele anderen inclusief mijzelf Maar we moesten het wel eerst even testen.