Test how mobile-friendly your site is.

Post here if your message doesn't fit into another forum but is still about web development. Includes site critiques, web hosting and server questions, helpful software and resources, and more.
Post Reply
User avatar
RSteinwand
Rank VI - Professional
Rank VI - Professional
Posts: 557
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Test how mobile-friendly your site is.

Post by RSteinwand » Mon Oct 17, 2016 7:51 am

Nice front-end for Google PageSpeed Insights:

https://testmysite.thinkwithgoogle.com/intl/en-in
Rick

User avatar
Lou
Rank V - Professional
Rank V - Professional
Posts: 246
Joined: Fri Jul 29, 2005 5:55 pm
Location: CO
Contact:

Re: Test how mobile-friendly your site is.

Post by Lou » Tue Mar 28, 2017 11:35 pm

Old link but thanks Rick. turns out the site of interest is ho-hum
Being a dinosaur, ie no smart phone, ipad nor whatever (well the flip-phone does have a <2" screen.

What are some/a good simulator I could use in development to check what pages look like on the small screen?
Lou
Say what you will about Sisyphus. He always has work.

User avatar
RSteinwand
Rank VI - Professional
Rank VI - Professional
Posts: 557
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: Test how mobile-friendly your site is.

Post by RSteinwand » Wed Mar 29, 2017 7:35 am

Hi Lou,

Try Opera Mobile Emulator. It doesn't have all the features of Chrome for Android, and renders via Opera's older engine, but still does a decent job. FWIW, it hasn't been updated in years.
Rick

User avatar
Albert Wiersch
Site Admin
Site Admin
Posts: 3231
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: Test how mobile-friendly your site is.

Post by Albert Wiersch » Wed Mar 29, 2017 8:11 am

I haven't used it too much but I think Chrome has a nice way of doing this. Open a web page and then right-click on it and go to 'Inspect' or press Ctrl+Shift+I. In the Developer Tools window, press Ctrl+Shift+M. In the browser window there should now be a 'device toolbar' and you can select a device and orientation (portrait or landscape) to simulate what it would look like on that device.
Image
Albert Wiersch

User avatar
RSteinwand
Rank VI - Professional
Rank VI - Professional
Posts: 557
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: Test how mobile-friendly your site is.

Post by RSteinwand » Wed Mar 29, 2017 10:11 am

I already have a mobile friendly site, so I just scrunch the browser to a narrow width of about 300px, which is the same size as a dinky iPhone, checking for problems as I change the width. I might have to add a css @media tag to tweak something below certain widths or add a background image only wider than certain widths.

Changing an existing site to responsive is a tremendous learning project. I find it best to start from scratch with a new template and move your content to it.
Rick

User avatar
Lou
Rank V - Professional
Rank V - Professional
Posts: 246
Joined: Fri Jul 29, 2005 5:55 pm
Location: CO
Contact:

Re: Test how mobile-friendly your site is.

Post by Lou » Wed Mar 29, 2017 7:18 pm

Thanks for the pointer.
Rick, I think you are correct about starting from scratch. That is in fact the intent. After several years of not being able to agree on a "new look" the time has come so I am moving forward anyway. Most of the content is nicely contained in included files isolated for the look and feel template. Well, mostly. The more involved things with DB access, ticket ordering, donations and PayPal interface, are removed from the old page structure.

Will check out the emulator
Lou
Say what you will about Sisyphus. He always has work.

RoyReed
Rank I - Novice
Rank I - Novice
Posts: 15
Joined: Mon Nov 05, 2007 9:27 am
Location: London, UK
Contact:

Re: Test how mobile-friendly your site is.

Post by RoyReed » Fri Apr 07, 2017 9:46 am

I think the Responsive Design Mode in Firefox is even better than Chrome's equivalent. Ctrl+Shft+M launches it (as well as having a button to lauch it from the Inspector dialog).

Firefox-RDM.png
Firefox-RDM.png (56.12 KiB) Viewed 932 times

Post Reply