Posts Tagged: RWD

The Division of Student Affairs Department of Information Technology has just launched a new site. The site is based upon WordPress and uses a very popular theme called Avada by Themefusion, which is billed as the #1 selling WordPress theme in the world. We selected Avada primarily because it is very responsive. But also because the built-in theme feature set is so robust, that you can do almost any type of design without a large amount of custom CSS work. This makes it a good theme for our departmental customers who want to have a sharp looking site without having to wait for IT to mock it up. The site is also integrated into our departmental Twitter feed so stories go out via social media.

Every developer and designer has those days that no matter what you try or imagine, it just doesn’t work for your responsive site. Your idea may be a great solution for mobile devices but, it is not as user-friendly on desktop and vice versa. You use all of your progressive enhancement knowledge and yes, it is functional but does it really meet the need of the user? Does it really fit with the flow of the site? At times, the answer is no.

Here are a few techniques and plugins that I have found that have helped cure my…well, responsive headache.

We’ve all heard it before: good design is hard. Good web design not only has to look amazing, but it also has to be functional, often without the knowledge of what platform or resolution your design is even going to be used on. Responsive web design – a simple concept at its core – gave web designers and developers the opportunity to account for the unknown. We perfected the use of media queries, installed respond.js to account for the IE holdouts and core concepts were adopted.

The basic structure of responsive design is usually a 3-2-1 pattern. Main content and sidebars are eventually reduced to one long vertical column of information on our phones. And while this is responsive web design, it’s disheartening to think that’s all we can do to make our sites work well on all devices. So I want to challenge us all to design beyond the vertical; to think about the other aspects that go into making a well-designed responsive site.

A few years ago, I was messaging a friend and offered to email him a file, making the assumption he would simply pull it up on his computer when he got home. His response was more jarring to me than it should have been.

“I don’t have a computer.”

The idea that my friend might only get online through his phone did not even occur to me. It should have, because I had already been developing mobile-friendly websites for a little while, but it didn’t. With the evolution of mobile devices and cloud services, more and more people don’t really need a computer on a daily basis.

Due to high demand, the Texas A&M Mobile team is providing another session of the hands-on responsive web design workshop. This training is offered at no charge to A&M System employees. Lunch and training materials will be provided. Please bring your laptop.