Layout hele website plots gewijzigd

[Real]

Na bijna driekwart jaar de Tweakers website beeldvullend te hebben kunnen gebruiken op een tablet, verandert zojuist (ergens tussen 09:30 en 10:00) de layout in een soort mobiele versie met extreem veel witruimte links en rechts.

Hebben jullie iets aan de layout verandert zojuist, want dit is bijzonder onbruikbaar op tablets.

[Raven]

Same here in verschillende desktopbrowsers, moet nu de browserwindow verbreden om desktop layout weer te krijgen, maar dan krijg ik links en rechts van de posts veel ongebruikte ruimte en maak ik de window iets smaller (wat ik voorheen had) krijg ik nóg meer witruimte naast de posts. Helaas is de knop om desktop layout te forceren al lange tijd weg

[ Voor 16% gewijzigd door Raven op 06-12-2022 10:07 ]

[Real]

Raven schreef op dinsdag 6 december 2022 @ 10:02:
Helaas is de knop om desktop layout te forceren al lange tijd weg

Die heb ik wel, maar doet niks meer.

[ppeterr]

Nou, echt perfect veel ruimte om het vol te prakken met bol.com zooi.

Ik zeg doen

[Raven]

Voor de beeldvorming:

[Marvellanius]

Thanks voor 't melden, er is vanochtend wat gereleased dat hier invloed op heeft, maar ben wel even benieuwd welke resolutie(s) dit nu op gebeurd, dan kan ik even kijken of hier iets aan gedaan kan worden
edit: Naast resolutie, zou ik ook graag de scherm-oriëntatie vernemen

[ Voor 14% gewijzigd door Marvellanius op 06-12-2022 10:22 ]

[Raven]

@Marvellanius De verandering lijkt op de desktop rond de 1000px breedte te gebeuren, hoogte browserwindow is 1000px. Scherm is 1920*1080, horizontale oriëntatie.

[gambieter]

Op een Pixel 3a (1080 breed) zie ik het. Onbruikbaar zonder zoomen, zo'n 1/3e van het scherm is gedwongen witruimte.

[Marvellanius]

@Raven ik denk dat dit specifiek komt door het gelijktrekken van breakpoints in onze styling (we hadden een aantal verschillende breakpoints rond dezelfde breedtes); er was vóór vanochtend een 1000px horizontale breakpoint, welke nu gelijkgetrokken is met de 1080px horizontale breakpoint. Ik ga deze aanname onderzoeken en kijken of hier een simpele oplossing (die niet de change volledig revert) kan formuleren

[eric.1]

Zo te zien gaat het om de 767 <= n < 1080 layout die niet echt lekker schaalt voor de bovengrens van die range.

[ Voor 5% gewijzigd door eric.1 op 06-12-2022 10:38 ]

[Real]

Marvellanius schreef op dinsdag 6 december 2022 @ 10:30:
Ik ga deze aanname onderzoeken en kijken of hier een simpele oplossing (die niet de change volledig revert) kan formuleren

Het is natuurlijk aan jullie en niet aan mij, maar waarom zou je niet de hele verandering terugzetten?

Je hebt nu een probleem voor (een belangrijk deel? alle?) gebruikers, dat maar blijft voortbestaan terwijl jij aan het debuggen bent.

Lijkt erop alsof het niet goed getest is en dan is ook weer de vraag: wat is er dan nog meer niet getest?

Maar nogmaals: het is aan jullie. Voor mij is het hooguit irritant.

[Marvellanius]

Real schreef op dinsdag 6 december 2022 @ 10:46:
[...]


Het is natuurlijk aan jullie en niet aan mij, maar waarom zou je niet de hele verandering terugzetten?

Je hebt nu een probleem voor (een belangrijk deel? alle?) gebruikers, dat maar blijft voortbestaan terwijl jij aan het debuggen bent.

Lijkt erop alsof het niet goed getest is en dan is ook weer de vraag: wat is er dan nog meer niet getest?

Maar nogmaals: het is aan jullie. Voor mij is het hooguit irritant.

Je maakt een terecht punt, de reden is dat de uiteindelijke aanpassing wel wenselijk is en daarmee pogen we (mits niet de hele website er uit ligt) altijd forward te fixen.
Ik ben nu naar 2 verschillende oplossingen aan het kijken:

• ipv 1080px voorlopig 1000px hanteren (niet geheel wenselijk gezien toekomstige aanpassingen)
• vanuit het huidige uitgangspunt, zorgen dat er voor landscape 1000px - 1080px het scherm beter benut word

edit: de correcte (niet markdown) list-syntax gebruikt

[ Voor 4% gewijzigd door Marvellanius op 06-12-2022 11:05 ]

[EDIT]

Ook bij de footer lijkt er op mobiel iets niet helemaal goed te gaan. Vivaldi 5.5/Chrome 106

[gws24]

In ieder geval is het nu op een 2560x1440 scherm (desktop) gewoon irritant aangezien ik normaal twee vensters naast elkaar heb staan die gelijkwaardig zijn verdeeld. Pas als ik het window iets groter maak verdwijnt het probleem maar dan is er dus overlap.

[Marvellanius]

gws24 schreef op dinsdag 6 december 2022 @ 11:17:
In ieder geval is het nu op een 2560x1440 scherm (desktop) gewoon irritant aangezien ik normaal twee vensters naast elkaar heb staan die gelijkwaardig zijn verdeeld. Pas als ik het window iets groter maak verdwijnt het probleem maar dan is er dus overlap.

[Afbeelding]

Dit is wel wat vreemd aangezien hier in ieder geval de 1080+ breakpoint gebruikt zou moeten worden (2560/2 > 1080) en krijg ik ook niet gereproduceerd.

EDIT schreef op dinsdag 6 december 2022 @ 11:15:
[Afbeelding]
Ook bij de footer lijkt er op mobiel iets niet helemaal goed te gaan. Vivaldi 5.5/Chrome 106

Goed gespot! Hier is een fix voor onderweg

[gws24]

Marvellanius schreef op dinsdag 6 december 2022 @ 11:49:
[...]

Dit is wel wat vreemd aangezien hier in ieder geval de 1080+ breakpoint gebruikt zou moeten worden (2560/2 > 1080) en krijg ik ook niet gereproduceerd.

Even wat gespeeld en de verandering vind plaats bij het gaan van 1297 naar 1298 pixel breedte van de window. Firefox 107.0.1 op windows 10 trouwens.

edit: ook even getest om custom css er wat mee te maken had maar dat lijkt geen effect te hebben. Als ik uitlog en ook in een andere browser (chrome) blijft het probleem optreden.

[ Voor 17% gewijzigd door gws24 op 06-12-2022 12:11 ]

[jota]

@Marvellanius Fix werkt hier Vivaldi Browser 5.5.2807.42

[Yorinn]

Hier lijkt ook iets stuk. Het QR-veld valt buiten het vak.
Dit is op Chrome voor iPad in portrait stand met en zonder custom CSS aan.

[pimlie]

@Marvellanius Zou er een opt-out kunnen worden toegevoegd voor die tablet style? Ik wil graag op mijn portrait full hd scherm graag tegelijkertijd zowel de tracker als mijn username met notificaties zien.

Het lijkt tevens ook niet mogelijk om the tracker persistent weer te geven. Na elke F5 is de tracker weer gesloten

[NotSoSteady]

Marvellanius schreef op dinsdag 6 december 2022 @ 10:20:
Thanks voor 't melden, er is vanochtend wat gereleased dat hier invloed op heeft, maar ben wel even benieuwd welke resolutie(s) dit nu op gebeurd, dan kan ik even kijken of hier iets aan gedaan kan worden
edit: Naast resolutie, zou ik ook graag de scherm-oriëntatie vernemen

Ik gebruik op mijn MacBook meerdere spaces en daar is het ook helemaal verpest. Eerder prima te gebruiken, maar nu verdwijnt de sidebar automatisch en is alles op de frontpage in elkaar gedrukt.

[New Yorker]

Pricewatch is niet meer bruikbaar als je op mobiel horizontaal gebruikt met desktop mode. Winkels zijn niet meer leesbaar en productnamen zijn niet meer te zien.

[ Voor 77% gewijzigd door New Yorker op 06-12-2022 13:41 ]

[gws24]

@Marvellanius Ik ben er denk ik achter waarom bij mij het >1080 ook gebeurt. Als je mijn screenshot bekijkt zie je dat ik een zoomniveau in FF gebruik van 120%. Zodra ik dat terug schroef naar 110% is het wel goed:

[teacher]

Kan dit teruggedraaid worden?

ipad heeft ineens witruimte, teksten lopen door iconen, chromebookje is 1/3 van de breedte wit. Zelfs mn DM's kan ik nu niet meer lezen omdat de tekst "achter" de witte balken valt.

[ Voor 46% gewijzigd door teacher op 06-12-2022 13:37 ]

[Marvellanius]

Yorinn schreef op dinsdag 6 december 2022 @ 12:06:
[Afbeelding]

Hier lijkt ook iets stuk. Het QR-veld valt buiten het vak.
Dit is op Chrome voor iPad in portrait stand met en zonder custom CSS aan.

Deze is nu gefixt, thanks voor het melden!

[New Yorker]

En het is weer terug

[LankHoar]

Het is hier nog niet gefixt. 1080p met de laatste Firefox.

[Marvellanius]

teacher schreef op dinsdag 6 december 2022 @ 13:28:
Kan dit teruggedraaid worden?

ipad heeft ineens witruimte, teksten lopen door iconen, chromebookje is 1/3 van de breedte wit. Zelfs mn DM's kan ik nu niet meer lezen omdat de tekst "achter" de witte balken valt.[Afbeelding][Afbeelding]

Dit zou nu ook gefixt moeten zijn; daarnaast neemt de content tot het 1080px breakpoint nu weer de volledige schermbreedte in beslag

[Real]

Marvellanius schreef op dinsdag 6 december 2022 @ 14:37:
[...]
Dit zou nu ook gefixt moeten zijn; daarnaast neemt de content tot het 1080px breakpoint nu weer de volledige schermbreedte in beslag

Wat was er nu misgegaan voor zover je kan overzien?

Testen?

[Marvellanius]

Deels testen - alle mogelijke values tussen de breakpoints uitputtend testen voor iedere pagina (en idealiter op verschillende machines/configuraties) is niet triviaal.

Huidige 'oplossing' is om de pagina-content het grid in principe te laten negeren, maar hier zullen we in de toekomst nog wel op gaan itereren.

[teacher]

Marvellanius schreef op dinsdag 6 december 2022 @ 14:37:
[...]


Dit zou nu ook gefixt moeten zijn; daarnaast neemt de content tot het 1080px breakpoint nu weer de volledige schermbreedte in beslag

thanks!!

[FurrBeast]

Ik heb ook last van deze issue.
Echter op mobiel, Z Fold3, zie onderstaand:


Content valt van het scherm. Ingeklapte modus uiteraard.

[ Voor 6% gewijzigd door FurrBeast op 07-12-2022 08:11 ]

[MisterJD]

FurrBeast schreef op woensdag 7 december 2022 @ 08:10:
Ik heb ook last van deze issue.
Echter op mobiel, Z Fold3, zie onderstaand:
[Afbeelding]

Content valt van het scherm. Ingeklapte modus uiteraard.

En dat is precies wat ik met Safari op iPhone ook heb.

[FirePuma142]

Marvellanius schreef op dinsdag 6 december 2022 @ 15:03:
Deels testen - alle mogelijke values tussen de breakpoints uitputtend testen voor iedere pagina (en idealiter op verschillende machines/configuraties) is niet triviaal.

Huidige 'oplossing' is om de pagina-content het grid in principe te laten negeren, maar hier zullen we in de toekomst nog wel op gaan itereren.

Wellicht kun je met Browserstack e.a. automatiseren, handmatig is geen doen.

[AW_Bos]

Nieuwe updates op Tweakers
Alhoewel het nog niet goed kijkt te gaan bij een aantal.

Komt er nog een 'Iteratie' artikel hierover online? Ik ben altijd benieuwd naar hoe & wat bij zulke updates.

[crisp]

MisterJD schreef op woensdag 7 december 2022 @ 09:39:
[...]

En dat is precies wat ik met Safari op iPhone ook heb.

Een oudere SE toevallig?

[MisterJD]

crisp schreef op woensdag 7 december 2022 @ 10:38:
[...]

Een oudere SE toevallig?

Nee op de iPhone 12. Want ik dacht eerst dat het bug was in safari, maar op andere sites geen probleem.

[crisp]

MisterJD schreef op woensdag 7 december 2022 @ 10:55:
[...]

Nee op de iPhone 12. Want ik dacht eerst dat het bug was in safari, maar op andere sites geen probleem.

Da's vreemd, want die zou een viewport width van 390 css pixels moeten hebben wat breed genoeg zou moeten zijn.

[MisterJD]

crisp schreef op woensdag 7 december 2022 @ 11:39:
[...]

Da's vreemd, want die zou een viewport width van 390 css pixels moeten hebben wat breed genoeg zou moeten zijn.

Sinds ik deze iPhone heb, staat het scherm op grotere tekst (ingezoomd) ingesteld, aangezien de letters voor anders te klein zijn. Heb er anders dan ook nooit last van gehad. Op standaard heb ik nergens last van.

[ Voor 4% gewijzigd door MisterJD op 07-12-2022 11:56 ]

[aap]

MisterJD schreef op woensdag 7 december 2022 @ 11:55:
[...]

Sinds ik deze iPhone heb, staat het scherm op grotere tekst (ingezoomd) ingesteld, aangezien de letters voor anders te klein zijn. Heb er anders dan ook nooit last van gehad. Op standaard heb ik nergens last van.

Goede observatie! Ik had hier ook last van op mijn iPhone 13 Pro: aan de rechterkant vallen wat letters weg. Maar ik heb inderdaad 125% lettergrootte ingesteld. Als ik het terugzet naar 100%, dan past het wel.

Voorheen zag het er ook prima uit op 125%, want dat heb ik al zolang geleden ingesteld dat ik al vergeten was dat ik het gedaan had.

Zoom 100%

---

Zoom 125%

[crisp]

aap schreef op woensdag 7 december 2022 @ 14:17:
[...]

Goede observatie! Ik had hier ook last van op mijn iPhone 13 Pro: aan de rechterkant vallen wat letters weg. Maar ik heb inderdaad 125% lettergrootte ingesteld. Als ik het terugzet naar 100%, dan past het wel.

Voorheen zag het er ook prima uit op 125%, want dat heb ik al zolang geleden ingesteld dat ik al vergeten was dat ik het gedaan had.

Zoom 100%

[Afbeelding]

---

Zoom 125%

[Afbeelding]

Ah goeie, dan kom je inderdaad uit op 390/1.25=312. Daar moeten we dus ook rekening mee houden.

[Real]

crisp schreef op woensdag 7 december 2022 @ 14:27:
[...]
Ah goeie, dan kom je inderdaad uit op 390/1.25=312. Daar moeten we dus ook rekening mee houden.

Ondertussen snap ik nog steeds niet wat toch het idee achter al deze aanpassingen.

De layout was toch prima? Dan wordt gisterochtend ineens een verandering doorgevoerd en pas als jullie één voor één reacties krijgen worden er her en der aanpassingen gedaan.

Dan weet je toch min of meer zeker dat er op veel meer plekken een probleem is? Alleen merkt niet iedereen dat op en zal ook niet iedereen feedback geven, laat staan dat iedereen dit topic volgt.

[crisp]

Real schreef op woensdag 7 december 2022 @ 14:34:
[...]


Ondertussen snap ik nog steeds niet wat toch het idee achter al deze aanpassingen.

De layout was toch prima? Dan wordt gisterochtend ineens een verandering doorgevoerd en pas als jullie één voor één reacties krijgen worden er her en der aanpassingen gedaan.

Dan weet je toch min of meer zeker dat er op veel meer plekken een probleem is? Alleen merkt niet iedereen dat op en zal ook niet iedereen feedback geven, laat staan dat iedereen dit topic volgt.

We werken langzaam toe naar een meer grid-based layout. De nieuwe bèta-frontpage is daar al op gebaseerd, en die willen we uiteraard tzt naar productie brengen. We dachten dat we de grid-setup al konden releasen zonder alteveel side-effect, maar dat laatste viel dus wat tegen...

[Real]

crisp schreef op woensdag 7 december 2022 @ 14:38:
[...]
maar dat laatste viel dus wat tegen...

Helder. En eerlijk is eerlijk: hoewel je niet alle feedback zult krijgen die je misschien nodig hebt, krijg je bij een website als deze natuurlijk wel heel snel feedback

Ik gaf denk ik min of meer realtime door dat er iets misging.

[Boeryepes]

Weet niet of ik hier goed zit maar sinds, ik meen gisteren, past de rechter uitlijning niet meer in mobiele view op ios (X, versie 16.1.1).

De laatste paar karakters op elke regel vallen net buiten het scherm:

[Marc H]

Ik heb sinds de wijziging ook het probleem dat tekst over de rand van het scherm wegvalt. Samsung a50, resolutie 2340 bij 1080, chrome.

Ik kan ook niet links<->rechts scrollen of zoomen om de tekst helemaal zichtbaar te maken.

Hiervoor had ik geen problemen.

[Marvellanius]

Voor de issues met mobiele resolutie is zojuist ook een release gedaan; dit zou de meeste 'content verdwijnt rechts van het scherm'-issues op moeten lossen

[Marc H]

Yeeeay!

Inderdaad, bij mij is het opgelost. Tnx

[MisterJD]

Hier op de iPhone 12 ingezoomd werkt het nu ook weer perfecto.

[Boeryepes]

Top en dank