Over 10 years of www.proptechnow.com.au we have tried our best to bring our Real Estate Agent audience the best experience possible for getting information about news and information technology related to their real estate business. We have had some terrible designs (I cannot even look back on some of them) and we have had some good ones. Over the past 3 or 4 years we have tired to simplify the offering and if you look out our website now and took away the content, you would be left just a logo, some advertising and a lot of white space. This is deliberate. Creating a news and information technology website it is all about the reader experience and in this instance content is king. Give business2.com.au a try on your mobile devices and just see how it works!
Responsive Design
To the untrained eye not much has changed, but the infrastructure behind this is a responsive framework – and you will be hearing a lot more about this in coming months and years. A responsive framework allows you the reader to experience the website on any modern mobile device. The content scales to fit the users device. This eradicates the need for a separate site layout for detecting mobile phones and tablet devices. Everything scales down to fit the user device.
Wikipedia Explanation
Responsive Web Design (RWD) essentially indicates that a web site is crafted to use Cascading Style Sheets 3 media queries, an extension of the @media rule, with fluid proportion-based grids (which use percentages and EMs instead of pixels), to adapt the layout to the viewing environment, and probably also use flexible images. As a result, users across a broad range of devices and browsers will have access to a single source of content, laid out so as to be easy to read and navigate with a minimum of resizing, panning, and scrolling.
Costs
The costs can vary greatly and it is best to do this on your next website upgrade.If you are in the planning stage of a new website, talk to your web developer about Responsive Design. If you are getting a personal blog for real estate professionals, then you should insist on it being Responsive.
The Video Above is a Quick Little Intro from http://www.upanupstudios.com
17 Comments
Bill
Hi Peter, I get the importance of responsive design and thanks for the article. I think you are saying b2 is now responsive but I just viewed in my Android mobile and it didn’t respond but showed the full website which requires horizontal scrolling.
Bill
Peter Ricci
Hi Bill
I use android as well, and have no horizontal scoll
Bill
Peter, today the site is responding as it should, sorry about that. Looks good.
Billhttp://www.business2.com.au/2012/08/business2-com-au-goes-responsive/?replytocom=22217#respond
Peter Ricci
Yeah, it was probably some caching in browser 🙂
Andy
Hi Peter,
i am seeing the site re-spond to the broswer, re-sizing itself to fit as i make the browser bigger or smaller. Nice!
Peter Ricci
Thanks Andy
Andrew Blachut
Very useful info Peter, especially as we are considering our tenth major rebuild. I like the idea of responsive as opposed to making individual versions of a site for say a mobile device etc.
Andrew Blachut
Peter Ricci
Thanks Andrew, yes, you will need to make some compromises with graphics etc, but worth the extra effort.
Stephen Neate
Nice work Peter.
Being a huge fan of RWD and having released a few sites based on the core principals, and working on a few different Real Estate sites based on that methodology now. Everything online (slight exaggeration) appears to be about Responsive Design and gaining in popularity faster than previous game changing web techniques and buzz words. (ajax, json, web2.0, html5 etc)
It is good you mentioned in your post that people should be looking into this style for their next re-design / upgrade, although I would go as far to say that over the coming 12 months it will become a necessity. Mobile usage is growing quite rapidly, especially in the Tablet arena. Keep in mind, not all mobile traffic is actually from Smart Phones, a lot is from Tablets, and sites that allow for a touch interface and great resolution photos for a tablet can look spectacular.
There is a great info graphic with heaps of data here http://www.templatemonster.com/infographics/responsive-web-design-interactive-guide.php which is worth at least a curosory glance.
Keep up the good articles.
Peter Ricci
Thanks for the information Stephen, yes there are asome pretty neat templates out there. I tend to stay away from template monster though 🙂
If you are buying a template, look for developers that have a proven track record of upgrades, bug fixes and support.
Peter
Stephen Neate
Agreed about Template Monster, but that info graphic is a great way to explain to RWD in one presentation.
Peter Ricci
Yes true 🙂
Lara Scott
Nice upgrade Peter.
Could have keep my comment from Ryan’s article last week and just copied it here.
Responsive HTML emails are on my horizon just doing some code testing.
http://www.business2.com.au/2012/07/how-the-real-estate-industry-caters-for-mobile-phone-users/#Comments
Peter Ricci
Yes definitely 🙂 Hope your well Lara!
Justin Avery
Great work guys in migrating across to a responsive design.
Just a question around your approach to the media queries…. What was the thinking around tackling the design using max-width over min-width and starting from the larger design?
Peter Ricci
There was no thinking 🙂 Just did it.
Rye
Great responsive design, congrats, however is there a plan to make the comment section “responsive too”/100% width?