Mac SEO Blog

Responsive Website Design (RWD) is the headline feature of the new EverWeb version 2.8 that many of our users have been eagerly waiting for. Whilst some will be familiar with RWD, its concepts and methodology, there will be many who will be dipping their toes in for the first time. RWD offers a different approach to web design that can create a wealth of possibilities for your website. However, RWD can also be difficult to conceptualise and implement across all devices so can become a frustrating experience.

This post is designed to give you a background to Responsive Web Design: What is it, what it is not, when to use it in your website design and when not to as well as the advantages and disadvantages of using RWD. Knowing more upfront about how RWD works will help you more easily develop great responsive websites in EverWeb!

What is Responsive Website Design?

Wikipedia quotes Responsive Web Design as

“an approach to web design which makes web pages render well on a variety of devices and window or screen sizes”

In essence, Responsive Web Design allows you to create one page design that can be used on any device browser from mobile through to large desktop. Responsive design means that the pages you create will automatically adjust to the size of the browser it is being viewed upon. This is a wonderfully simple concept, but does require a different way of approaching website page design. When comparing it to the ‘traditional’ way of making websites where you have to create a desktop page and a corresponding mobile version, there are some advantages and disadvantages to be aware of…

Advantages of Responsive Web Design

• Your website design is automatically scaleable on any device.
• Google and other search engines likes responsive websites and ranks RWD websites higher in search engine ranking results
• Promotes website design unity across devices
• Requires only one website that caters for all devices
• May reduce development and maintenance time, cost and effort

Disadvantages of Responsive Web Design

• Conceptually difficult and difficult to learn.
• Constrained design approach. Typically not a good tool when creating free form websites
• Can be costly in development and maintenance.
• Page loading times can be slower than for ‘traditionally’ designed websites.

Expectations of Responsive Website Design

Responsive Website Design can make developing fully scaleable websites quick and easy if you have the right experience and knowledge. However, there are times when building a responsive website may not be the right choice and using a ‘traditional’ website design is actually better, particularly when a ‘free format’ design approach is required.

It is recommended that you try a small test website project before developing a new RWD website project or redeveloping an existing ‘traditional’ website. In this way you will learn more about how RWD works in general and how it is works in EverWeb.

If you want to redevelop an existing ‘traditional’ style website bear in mind that it will need to accommodate responsive design methods. Invariably, some design compromise will be needed which may also have advantages and disadvantages. Do not expect your existing design to look, and/or function, in exactly the same way when redeveloped as a responsive website.

RWD Development Time, Cost and Effort

It is worth investing some time and effort in experimenting to see what is, and is not possible, with RWD in EverWeb. There is a learning curve, which can be quite steep for some as RWD often requires a different approach and way of thinking than you may be used to.

Understanding the basics of EverWeb itself gives you a good start as responsive design capabilities have been integrated seamlessly in to the product. Our post blogs and YouTube videos will also help guide you on all of EverWeb’s responsive design features and how to use them using real world examples.

Responsive Design in EverWeb

Responsive design is structured so that objects always use the full width of the page. Full width objects are like containers that hold their own content. These ‘containers’ are stacked from the top of the page downwards, one under the other. As the page is resized in a browser, the objects within the container automatically scale and reorganise themselves within the container as its horizontal and vertical dimensions change to properly fit within the browser window.

Some objects, such as the Responsive Row widget, can only be a full width object. Some objects such as TextBoxes, shapes, images and some widgets can be either be a full width or non-full width object. Some objects, such as the Facebook Like and Live Photo widgets, can only be non-full width objects.

Next…

In the next post related to responsive website design in EverWeb, we start to build a responsive website in EverWeb.

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Flipboard

YouTube

Twitter handle @ragesw