Mobile Version of my Website

cookiejay

Hi all,
I've had a play around with a new look for my website (homepage only so far), overall I'm pretty happy with it and want to apply it to all my pages...
However when I checked the mobile version it looks a complete mess, its cutting off half the images, text and background. I've tried altering html, body and page to 100%, tried the @media code yet it makes no difference whatsoever and now I'm starting to regret changing the theme.
This is my last hope to see if anyone knows an easy way of making look half decent on a mobile device.

www.cherishingmoments.co.uk

Thanks and Merry Christmas to everyone!
CJ

denisegoldberg

It looks like you have set up a fixed width for your site - I'd suggest looking at it using different sized browser windows as well. While I have a large monitor I often look at web sites using a browser window that is much smaller than the monitor. Looking at your site in a not full-sized browser window shows that it is cut off there as well as on mobile.

This is a good tool to see how your site looks on different sized devices - http://quirktools.com/screenfly/.

Have you considered setting your site to stretchy? I would recommend trying that before adding code.
http://help.smugmug.com/customer/portal/articles/1222436-can-i-change-the-layout-of-my-smugmug-site-

Once you have the non-mobile viewing of your site to the final point, take a look at http://www.aaronmphotography.com/Customizations/Sitewide/Screen-Width-Customizations.

I jumped into a couple of your galleries and was quite surprised to find that the menu bar disappeared. Without a menu bar and without a breadcrumb your viewer will need to use the back button to choose a different part of your site to view.

I noticed that you are making the Original-sized photos available for viewing. Yes, I know, you have right click protection turned on - but right click protection is merely a tiny stopping point; it is easily bypassed. I'd recommend that you set the largest display size to anything other than Original. (Bigger is better for today's large monitors, but Original is never used as a display size unless the viewer explicitly selects it.)

--- Denise

cookiejay

Hi Denise,
Thank you for your quick and detailed response!

I think I must have been playing around with the settings at the same time you were replying to me.

The site is was set to 'Stretchy', I have also altered the min-width to 1350px now as well, which seems to have resolved my original issue on my homescreen when viewing on a mobile device, phew!

Thank you for pointing out about the header disappearing off the galleries, I had forgotten to apply it to those! Still tinkering around with the theme and the head so will get it up and running before the end of the holidays hopefully.

Hmmm I will take note of what you said about the photo sizes too, will start going through my galleries and adjusting the necessary settings throughout.

Thanks again, will post the finished site up for more comments and feedback.

Happy Holidays.

CJ

denisegoldberg

cookiejay wrote: »

The site is was set to 'Stretchy', I have also altered the min-width to 1350px now as well, which seems to have resolved my original issue on my homescreen when viewing on a mobile device, phew!

That's pretty wide for a mobile device. When I look at your site on my phone (it's a Windows phone) sideways scrolling is enabled, even if I hold the phone in landscape mode. Are you sure that's what you want?

Have you considered using the option to collapse your menu for mobile? It's the last setting on the Menu Basic tab.

--- Denise

Tom Foster

I'm also having similar problems with my site on mobile! Think I might need to go for a whole redesign to sort things out!