Jumping fonts on pa...
 

Subscribe now and choose from over 30 free gifts worth up to £49 - Plus get £25 to spend in our shop

[Closed] Jumping fonts on page load (causing inconsistent UI behaviour)

28 Posts
21 Users
0 Reactions
149 Views
Posts: 8019
Full Member
Topic starter
 

There is an annoying issue at the moment where the fonts take so long to load that the user is being sent to a page other than the link the clicked on due to the page height jumping as the fonts load.

Looking at the source there are way, way too many JS, CSS and fonts being loaded. Do you really, really need 18 weights of Montserrat? 72 JS files and around 32 CSS files, many of which are not minified. Yeah the files are locally cached however there is still a cost of discovering this and loading from cache so many times (not to mention it being crap for an empty cache load).

Fonts, since these are coming from Google why not 1. cut the number used and 2. get rid of the Javscript loader and replace with the CSS link version and combine all fonts as a single request (worth reading https://www.grayboxpdx.com/blog/post/4-tips-to-faster-loading-google-fonts).

JS could something like YUI compressor ( https://yui.github.io/yuicompressor/) be used as part of the build and release process to minify and combine the JS and CSS files into a far fewer number.

None of these are difficult or time consuming changes but are ones that would make the user experience better.


 
Posted : 25/07/2019 10:01 am
Posts: 1602
Full Member
 

Can't help but agree with the above - god only knows how bad it is for people who have to put up with the ads too - it's unusable on anything but wi-fi at the minute


 
Posted : 25/07/2019 11:39 am
Posts: 4454
Full Member
 

have an issue with the text changing when i load a page, is that the same thing? its done it for ages


 
Posted : 25/07/2019 11:44 am
Posts: 0
Free Member
 

Yep, been like that since the "upgrade".

Anyway, it works fine on Drac's iPad and tech can't reproduce the problem so it must be something at your end.


 
Posted : 25/07/2019 11:46 am
Posts: 4421
Free Member
 

It's probably that the CSS stylesheet (which styles the page - including font) is loading too slowly. So you see the page unstyled, try to click on it and then the stylesheet loads changing the font and consequently the link position.

STW towers need to get more hamsters for the servers. Or possibly grease the bearings on their hamster wheels as they're sticking.


 
Posted : 25/07/2019 11:47 am
Posts: 6208
Full Member
 

Things like u-block origin let you disable javascript and remote fonts for a specific site.
It's definitely faster when you do that 😉 but you lose things like the editor icons for quoting etc. (cos they are actually fancy font characters, not images).


 
Posted : 25/07/2019 11:48 am
Posts: 12026
Full Member
 

@nixie all what you said up there eh?
But yeah, I have that problem particularly on my mobile phone. Sometimes launch a thread that's 3 or 4 removed from the one I intended.


 
Posted : 25/07/2019 12:22 pm
Posts: 7581
Free Member
 

This site is terrible for it on Android (Pixel phone). The page appears to load, I click the thread I want to view and then I'm taken somewhere else. It's been like this for a couple of years and doesn't happen on any other site. I'm well aware, though, that complaining about faults like this will get you nowhere so I've not bothered before.


 
Posted : 25/07/2019 12:28 pm
Posts: 21525
Full Member
 

So it's not just me.

I thought the random thread selector was a "feature".


 
Posted : 25/07/2019 1:07 pm
Posts: 13806
Free Member
 

Yeah, I get that too,


 
Posted : 25/07/2019 1:09 pm
Posts: 0
Free Member
 

All of the above for me on Android. Works fine on the wifes iPhone for some reason so maybe that is why Drac can't replicate it......................


 
Posted : 25/07/2019 1:12 pm
Posts: 17303
Free Member
 

Just be thankful you don't have a Singletrack mug.

When it unexpectedly jumps out of the way just as you pour boiling in .....


 
Posted : 25/07/2019 1:13 pm
Posts: 3491
Free Member
 

Lolz at the thought anyone cares about UX on here.
If they did they should probably start at UI101, Things like consistent navigation.


 
Posted : 25/07/2019 1:13 pm
Posts: 8019
Full Member
Topic starter
 

@andybrad yeah that's the issue.

It has always happened to an extent but never caused issues like it does now.

I understand the technical reasons as I've fixed it on sites I work on in the past. This site is a particularly bad example though. I think the bulk of the issue is using JS to load the fonts, switching to the alternative method would I suspect solve it mostly.

Planning to try and block the fonts on my phone as it makes the site very hard to use.


 
Posted : 25/07/2019 1:15 pm
 IHN
Posts: 19857
Full Member
 

causing inconsistent UI behaviour

This implies there's a baseline of consistent UI behaviour.


 
Posted : 25/07/2019 3:15 pm
 DezB
Posts: 54367
Free Member
 

They're displayed long enough to get a screenshot

[img] [/img]


 
Posted : 25/07/2019 3:21 pm
Posts: 4028
Full Member
 

Yeah get this on my android phone, really annoying.


 
Posted : 25/07/2019 3:31 pm
 kcal
Posts: 5448
Full Member
 

Even get it on Chrome on Windows 10 beefy desktop machine. So lord know what it must be like on a mobile. I don't think I see it so badly if at all on native OSX Safari browser.


 
Posted : 25/07/2019 3:53 pm
Posts: 77687
Free Member
 

I've flagged this up for Tech's attention. Cheers.


 
Posted : 25/07/2019 4:46 pm
Posts: 8019
Full Member
Topic starter
 

Thanks cougar.

I've seen it on my work desktop as well but as the change to the page size is less (due to more screen real estate) the effect is not as pronounced. Doesn't move enough to cause mis clicks.


 
Posted : 25/07/2019 5:07 pm
Posts: 43552
Full Member
 

Sometimes launch a thread that’s 3 or 4 removed from the one I intended.

Moar page clicks!

Yep, been like that since the “upgrade”.

And already reported, so this..

I’ve flagged this up for Tech’s attention. Cheers.

is likely to have little effect. But, hey, praise be. We have useless red activity indicators.


 
Posted : 25/07/2019 5:28 pm
Posts: 13594
Free Member
 

I just block 3rd party fonts using a script blocker, pages load much faster as they just default to browser fonts. Also utterly consistent look and feel 😉


 
Posted : 25/07/2019 6:21 pm
Posts: 8019
Full Member
Topic starter
 

Was any sort of timescale indicated?


 
Posted : 25/07/2019 6:21 pm
Posts: 17303
Free Member
 

Was any sort of timescale indicated?

New forum coming in 2010


 
Posted : 25/07/2019 6:29 pm
Posts: 8019
Full Member
Topic starter
 

That late, thought it was 2005.


 
Posted : 25/07/2019 6:57 pm
Posts: 77687
Free Member
 

Was any sort of timescale indicated?

No, I didn't ask, and if I knew then I probably wouldn't share that information.


 
Posted : 25/07/2019 7:31 pm
Posts: 12026
Full Member
 

I’ve had a reply from the boss, this is being addressed in the next site update.

Wicked!


 
Posted : 25/07/2019 8:43 pm
Posts: 28550
Free Member
 

No, I didn’t ask, and if I knew then I probably wouldn’t share that information.

Bit selfish of you, some of us have to plan ahead to fill the three months we won't be able to access this place. 🙂


 
Posted : 25/07/2019 9:45 pm