My new site isn't adjusting for iphone


(Tdot) #1

I created a site a few years back using RW5 and the Inhabit theme.
For the most part, it adjusted perfectly, on its own, to both desktop and phone.

Here is the original site: www.seesuite.tv

I recently recreated it from scratch using RW7 and the Affinity theme.
I assumed the resizing wouldn’t be an issue but when I published the site
I realized that it looks horrible on the phone. Instead of resizing to become smaller, everything
stayed the same size and just re-shifted into bad alignment.

Here is the new site I just published www.seesuite.ca

I didn’t do anything all that different from the original site, with the exception of using RW7 and Stacks3.
Other than that, just regular text boxes.

No idea why this happening and your help is greatly appreciated.

Thanks


(Lisa Sandler) #2

The new site, with the .ca looks ok to me on iphone, except for the obvious box of text at the bottom that looks like it’s an image, not text.


(Tdot) #3

What I’d like is for the site to look like a shrunk-down version of the desktop site - which my original site accomplished. I just want everything to shrink and fit, instead of simply realign.

I’m pasting a picture here to compare what the two sites look like on my phone. (just want to make sure we’re seeing the same thing)

As you can see on the right, the title text (as with all the text on the site) has remained large.


(Lisa Sandler) #4

oh. Well, the one on the right is what a responsive website should do. I’m guessing the old theme was not responsive and that’s why it stays the same on mobile.


(Nick Wilcox-Brown) #5

I agree with @LSPhoto here - non-responsive sites simply shrink on iPhones. The problem is that on some other devices, they just become unreadable. Mobile first is a new way of working and with a bit of thought, can really look good. This may seem painful, but it does mean that sites work on all devices. The preview function ( Edit / Preview button) in RW is a great way of getting an idea of how changes will look on different devices.

If this idea pains you, check out the viewing percentages for the site on different devices - mine is normally 50%+ on mobile devices, most of which need that responsive design.


(LJ) #6

You seriously don’t want a shrunk down site unless it is minimalist with little content and designed for a small width on desktop. On your old site, the menu is hard to read and click, the text is too small and if you have any links, buttons or forms they will be a pain.

Responsive does bring some minor challenges but these can be tweaked to leave you with an attractive, accessible site. Stick with the new responsive site and if there’s anything you don’t like - throw questions to the community


(Tdot) #7

Appreciate all the advice here. Sounds like responsive is the way I should be going - just need to make some adjustments. Thanks!


(Tdot) #8

Can you explain what you mean by “check out the viewing percentages…”?
Is this something I can do/set within RW or do I check this on the phone itself?

Thanks


(Nick Wilcox-Brown) #9

Look at your web stats from Google Analytics, StatCounter or similar and you will see what percentage of viewers is using what operating system, browser and many other useful measures of your visitors.


(Tdot) #10

oh ok understood. Thanks again


(Nick Wilcox-Brown) #11

Pleasure. Mobile first is harder work for a start but well worthwhile in the longer term. Finally too there are tools in RW to allow you to preview your site.

If you go to Safari > Preferences > Advanced > Show Develop in Menu bar you can then view a website in Responsive mode and chose the platform. Great tool!