Responsive web design – the buzz word in web design is an approach to web development in which a site is crafted to provide an optimal viewing experience on devices ranging from desktop computer monitors to mobile phones.  Instead of designing separate websites for devices of various screen sizes, this method allows you to design a single site and optimize it for various devices. Given the rapid adoption of tablets and smartphones — and the fact that users currently seem to prefer reading their news on the mobile web rather than in apps – it is not surprising that responsive website layouts are gaining popularity and it’s likely will continue to do so even more in 2013.

There are three key technical features involved in responsive web design: media queries and media query listeners, a flexible grid – based layout that utilizes relative sizing and flexible images and media resized through cascading style sheets or CSS.  More simply, a responsive web design uses “media queries” to figure out what resolution of device it’s being served on. Flexible images and fluid grids then size correctly to fit the screen. If you’re viewing this article on a desktop browser, for example, try making your browser window smaller. The images and content column will shrink and then the sidebar will disappear altogether. When visiting a homepage, you might see the layout shrink from three columns, to two columns, to a singular column of content.

The key point is adapting to the user’s needs and device capabilities. Suppose a mobile user will be viewing your site on a small screen. Taking the user’s needs into account doesn’t just mean adapting your content to the screen size. It also means thinking about what that mobile user will require first when visiting your site and then laying out the content accordingly. Maybe you’ll present the information in a different order. Don’t assume the user won’t need access to all the site information because she’s on a mobile device. You might need to change the fonts or interaction areas to respond better to a touch environment. All these factors influence responsive web design.

At the same time that mobile devices are changing the display landscape with more and more small screens, at the other end of the spectrum desktop displays are also getting larger and larger. Having to serve both segments shouldn’t stop designers from being innovative on either.

The benefits are obvious: You build a website once and it works seamlessly across thousands of different screens.  For publishers, it offers the simplest way to reach readers across multiple devices. For users, it ensures a great experience on every no matter what device you are viewing on.

Non-profit websites want to engage both donors and volunteers. So it is critical that any non-profit organization or business take into account the considerations that will do so when designing their websites.

The primary goal of any non-profit site should be to make it easy for site visitors to learn about the non-profit’s cause.  The site must communicate what it is that your organization is doing immediately through the use of images and text.

Second only to communicating the cause, it should be abundantly clear what action site visitors should take to contribute to the cause. Be sure to incorporate primary calls-to-action such as “Donate” or “Volunteer” — and make them easily visible and actionable.

Don’t forget to include quick links to more information about the non-profit and key figures in the non-profit — One of the most visited pages on any website is the “About” page and this is even more true for visitors to a non-profit.

Show visitors using text, video and images that positive action is taking place — Use design elements to communicate the positive impact your non-profit has already made on your cause.  Donors and volunteers want to know that their time and money is going to be well-spent.

The design should allow media contacts to find the information they need quickly and easily — Media coverage is an important tool for spreading information about your non-profit and the cause.

Lastly, utilize social media and blogs.  Using these mediums as part of your design to get the word out can be as vital for a non-profit as it is for for-profit businesses.