mobile site is always too large, then rescales?!?!

[wfcentral]

I even tried loading some default templates directly from Xara to make sure it was not something I did... look at this site in your mobile browser. http://themes.xara.com/v11/activate

When the site first loads on my phone it is too wide to fit the screen, so part of site is not visible... then, a second or so later it rescales the page to fit the screen.

I understand it is probably detecting the screen width and such, but on my Wordpress Responsive sites there is no such delay. I'm trying to convince a new client to go with Xara for their site, but they are asking why every page loads TOO BIG and then scales down. Even after you have visited the page and come right back to it there is this issue.

Comments?

[Acorn]

The site you linked to is a responsive site that changed presentation at 480 and 960 px.

If you are designing for a smaller window, you probably need to add a third width Variant.

On my tablet, it fits immediately for landscape or portrait orientation and I do not get any delay.

What phone browser is being used?

Acorn

[wfcentral]

I'm using Chrome on a Galaxy Note 4, but my client will be viewing it on an ipad and an iphone.

[tofio]

I'm using Chrome on a Galaxy Note 4, but my client will be viewing it on an ipad and an iphone.

Direct Answer: Because it uses JavaScript on page-load instead of CSS media rules like everyone else.

[Acorn]

Direct Answer: Because it uses JavaScript on page-load instead of CSS media rules like everyone else.

Not disagreeing with you but http://blog.restive.io/posts/4887492...-vs-restive-js has an interesting slant on this.

Also, Xara does offer up xr_all.css with @media styling.

I think that responsive sites check the viewport width and the browser type and gracefully move through CSS to jQuery to best present the variants.
Most sites these day are multi-platform and JavaScript-heavy so you are going to get this Flash of Unstyled Content (https://en.wikipedia.org/wiki/Flash_of_unstyled_content) on occasions, regardless of the web generator.

I've never had or held an iPhone/Pad so I daren't guess how compliant their browsers are for handling CSS3, which I believe introduced @media rules.

Acorn