Upgrade from v16.0 to v16.1 Mobile Variant Rendering change in behavior

**Initiostar** · 08 March 2019, 04:50 PM

I have observed a variant rendering issue that has crept in with v16.1 across all my mobile variant websites. Variant set 480px to 780px. When I open any of my websites from my mobile (e.g. [URL="https://www.initiostar.co.uk"], the initial rendering of that website appears to try to fit it to the maximum 780px, before resetting itself back to the correct width. Maybe just my mobile, but not sure.

As I load each page from a menu page, it appears to jump to a larger setting before reverting to the correct width for my mobile. I did not notice this behavior at v16.0 and I have no idea why this is happening.

I have found v16.1 workarounds for all other changes (bugs), but this one has me stumped!

Any help welcome,

Thanks,

Gary

Another example to show same behavior [URL="https://www.yewhitehartgs.uk"]

**gwpriester** · 08 March 2019, 05:11 PM

I looked at your site on my iPhone and it fills the screen but I did not notice any resizing.

Did you do your navigation buttons on layers? And if so did you do anything different. Your buttons work very well and I have been having a lot of problems with mobile site buttons.

**Initiostar** · 08 March 2019, 06:26 PM

Thanks for checking this out; will see if anyone else experiences the issue.

The menu buttons are on the same layer, each button (text and button shape) are grouped with a separate link to its corresponding page (not a navigation bar), with the hamburger linked to the menu page. In future, I might need to group the text and button as a single image (via web properties), if the button has a solid fill. That was the case with a v16.1 test I did today (attached). The golf site https://www.yewhitehartgs.uk uses a mini navigation bar, which is the same for its desktop site. Happy to drop this into a small '.xar' file if anyone wants to see how it was done.

**xtom** · 08 March 2019, 07:46 PM

I think this is how it has always behaved. So if your mobile screen size is a bit smaller than 480px the browser zooms the page to make it fit to the screen width. It's probably not jumping from the 780 to 480 variant, just 480 down to whatever screen size you're using although I could be wrong and don't have v16.1 - I'm on v15 and had a client complaining about this "jumpy" zoom behavior after the page loads. So I spent some time messing about with it and ended up using a size of 375px instead of 480px which is a match for a range of apple iphones and this was also what the client was also viewing on. Seems there aren't as many 480px wide mobiles other than the big samsung notes so I think it might be better to default to a size closer to the majority and let is zoom in/out from there. I'd like to see it do the zoom prior to loading the page content or earlier but I'm guessing it must be only able do it when fully loaded and it's probably up to the browser when it does it.

**gwpriester** · 08 March 2019, 07:48 PM

I have the menu button link to a Menu layer and have individual buttons that link to other pages. But on my iPhone at least, the buttons are not always that responsive.

**gwpriester** · 08 March 2019, 08:04 PM

I think spacing the buttons out helped. This is the mobile site I was having problems with www.NormaLibman.com

There is a problem with the feature to export buttons that are not designated to export as one image and I believe this is known and is being addressed.

It was there in v 16 and for a while I just thought it was my problem.

**Initiostar** · 08 March 2019, 10:00 PM

I found spacing between mobile buttons is super-sensitive. For my sites, I decided to create a separate menu page which takes very little time to load. Looked at Norma Libman on my mobile and it worked fine. I believe the issue with v16.1 is: if you do not use single image, any text in that group does not appear to render. Cannot be sure, but have yet to fathom out what the thinking is behind the design change. What exactly does render a group, as separate images and single image achieve?

**gwpriester** · 09 March 2019, 12:45 AM

Cannot be sure, but have yet to fathom out what the thinking is behind the design change. What exactly does render a group, as separate images and single image achieve?

As I understand it the issue is live text which is rendered better than bitmap text at 96dpi. So a button with text will be exported as the button shape as a bitmap or if the button shape is supported in CSS as a vector description of the shape, and the text will be exported as text. I expect this to be resolved shortly.

**Initiostar** · 09 March 2019, 01:50 PM

Thank you for your help; finding these forums a great support resource.

**Acorn** · 09 March 2019, 01:53 PM

Originally Posted by gwpriester

As I understand it the issue is live text which is rendered better than bitmap text at 96dpi. So a button with text will be exported as the button shape as a bitmap or if the button shape is supported in CSS as a vector description of the shape, and the text will be exported as text. I expect this to be resolved shortly.

To add to Gary's analysis - if the graphics were further given a filename="value" then the overall NavBar would be made up of text and a few images and not the many dozen prev16.1 produced across pages.
I doubt Xara had this in mind.

Acorn