Does Your Website Work Across Devices?

My general advice to my clients is not to create a separate mobile site unless there is a compelling reason to do so. I build and maintain WordPress sites and there are a lot of themes that adapt well between stationary and mobile screens.  It is even easy to search themes by that specific feature. I have checked out many of the mobile-ready WordPress themes on both my smallish Android phone and my Nook Tablet and they look good. I also find that most of the time, I end up clicking on the "full site" link on mobile sites because the mobile version just doesn't provide the info I am looking for. 

-Eva

Hi, Jayne.

This recent post on NetSquared might shed some light on things, as it covers some of the basics of responsive design in conjunction with WordPress. It also links to a another good post about the basics of responsive design in general. These are both by Bari Samad, digital communications consultant at TechSoup.

Incidentally, we also recently asked our Facebook friends what sort of mobile strategy, if any, they have for their websites. Here's what they said.

Does your org have a mobile strategy for its website? Is it considering responsive design?

Jayne,

If you want a starting point you could checkout Foundation at http://foundation.zurb.com/

I strongly recommend learning the basics of SASS http://sass-lang.com/ and jquery http://jquery.com/ as starting advanced skills that you will need to use to do this.

You will also need to start thinking about Adaptive Images as well, as you not only have small iphone3 dislays but the "retina" displays that expect high quality images http://adaptive-images.com/ is a solution with several technical issues, but shows the mechanics of what you need to do.

Good luck

Yeah, again - I just don't have time to learn to be a web designer/programmer. I've always maintained my own web site, and been able to keep it accessible for people that don't have the latest, greatest computers and browsers, or that use assistive technology. But I think all the mobile tech is more than I can address by myself... and there are SO many people accessing web sites almost exclusively by smart phones rather than devices with large screens - I know I'm frustrating folks by not having a web site they can review with such easily.

Something for nonprofits to consider....

Found this recently:

MobLab Tip o' the Day from Greenpeace - @MobilisationLab on Twitter:

This post from Mashable gives you some of the quick and easy tools at your disposal for getting that mobile look for your site: 

• If you don't want to start from scratch, there are templates you can choose from goMobi
• If your focus is your landing page, Landr is one tool to check out 
• If you're after simple, easy but also customizable, there's DudaMobile

Read the full post at Mashable: 7 Tools for Creating an Optimized Mobile Website 

Has anyone tried any of these tools for your nonprofit, library, school, government agency, etc.? How did you like it?

Yea I have problems with that often. Most of the

time when I'm on my iPhone, I have to click on mobile sites

because the regular website isn't compatible on a mobile phone.

One way you can make your web page well suited for the

iPhone is by degrading your actual web page. Anything beyond XHTML basic

will be great. It's important not to make anything too tiny and

also to use JavaScript carefully and hide them to make it easier to navigate.

-Rehanuma

There are some great tutorials on YouTube if you got a few hours and follow them then you should have no problem getting a responsive website up and running

Another great responsive/screen viewer I've found was http://lab.maltewassermann.com/viewport-resizer/ It's set up so you just have to drag the box to your website's tab and it will allow you to see the sizes on a variety of devices. 

In terms of building responsive and fluid websites, it is actually a lot easier than you think. You just need to get the basics down, but if that isn't your case there are plenty of other great ways to build a site to be viewable across all browsers and screen sizes. Some of the quick fixes would be to build off of a framework such as Wordpress, Foundation, or Twitter Bootstrap. As for the basics of understanding how a screen responds and learning responsive, I've recently stumbled across this blog post that explains it pretty well.

http://thirdsectortoday.com/2014/03/05/demystifying-responsive-web-design/

Cheers, hope this helps!

-Ty Stelmach

We recently made our website responsive using html 5 and as it is not used much yet, we are unable to track the errors in a proper way. Here is our website crgsoft.com

Can someone suggest me some tool that can help me in finding the issues related to html?

First things first, the site looks great, executed very well!

The only major problems I saw while scaling is the widths or max-widths of some of your items (mainly the nac) drop down too low to display the nav as one list, instead it shows it as 2 rows.

ie (this is how I see the nav on most computer screen sizes): This can be fixed through the total width of the navigation.

cloud  data center  solutions  resource

about us

The other main problem I saw was the blurb you have in the header image that says "Get your business apps instantly..." seems to have been made on top of the image in Illustrator or Photoshop, so not only are you losing readability, you also lost a good chance as some free content oriented SEO. I would recommend putting that in through code instead, so when Google crawls your site, it can pick it up as index-able information.

A great site to use to check is: https://www.responsinator.com/

That's just my 2cents, good luck on your endeavors!

-Ty Stelmach 

Sonaliverma,

I haven’t found much on error tracking for HTML5 but check this out: HTML5 For Web Designers lists software developer Henri Sivonen’s HTML5 validator https://validator.nu/ as a  full-featured option.

Source: http://html5forwebdesigners.com/today/index.html

Let me know if this helps!

TyStelmach,

Thanks for the responsive screen viewer links, and for the sound website advice! You seem to know a few things about web building and design. Any chance you can fill out your profile with your experience and interests? We’re planning an expert Q&A in the Design and Web Building branch for Wednesday 12/17 and it would be great if you could join! Keep an eye on the forum for details!