Unified Ag Solutions (UAS) was in need of a fresh look and a conversion of the existing website’s content from static to responsive. We love our agriculture clients and wanted to create a unique and visually stunning website while keeping their core brand standards in mind.
The project was launched in early August and has received great reviews and a natural search engine page rank bump from the minor code updates we did while building the project. Throughout the process our team keeps in part with our own internal (proven) process. Below are some key items to keep in mind while designing / developing for responsive layouts.
Responsive Web Design / Development Process: 10 Items to Consider
10 | Target Vital Content
Prioritize your message and ensure that the focus of each page is directly correlating with your business goals. A website is a sales / promotional tool that can generate leads… but only if you design it to do so.
9 | Plan Strategy Sessions
While the creative processes are flowing it’s easy to get overwhelmed by each talking point. Plan strategy sessions and itemize each element so you and your team can collectively sift through and organize the data.
- Stay on Task
- Target the Vital Content
- Lead Generation Strategies
- Branding & Creative Direction
- Technologies to Incorporate
- Content Strategies
- Phased Approach to Each Piece of the Web Development Process
- STAY ON TASK & Remember to Keep Stake Holders Informed on Each Milestone
8 | Sketches & Wireframes
Quick sketches can really help identify how each piece of content will fit into the website and also help rule out items that don’t work for your needs. They are quick and easily updated and assist in quickening the pace of project. Finally, remember that when creating a responsive website that you need to create layouts for both the desktop and the smartphone; it’s easy to create big, but going small leads to decisions on how content is handled.
7 | Tablets and Smartphones
Remember, when your designing for the iPad, iPhone, Tablet or other smartphones you need to keep the user experience in mind. Consider different input modalities (tap-friendly menus for instance) and “swipe-friendly” sliders etc.
6 | Testing
Intense and brutal testing on every environment you have at your disposal. We are an Apple (Mac) based firm, but we have a Windows 8 laptop and Android Tablet on hand just for testing. We also utilize services like BrowerStack to supplement our testing equipment and various browsers / operating systems.
5 | User Interface
Not everyone is a savvy user and not everyone has the swiftest internet or the latest browsers. Keep your core audience in mind when developing the site and make sure that your layout and navigational elements can be quickly identified.
4 | Condense Responsive Content Cleverly
Resizing responsive websites in a normal browser can produce mini “Easter eggs” that inspire ooo’s and ahhh’s. Loyal visitors who visit your site from multiple devices will notice your thoughtful nuances. The devil is in the details and multiple small changes can greatly influence the perception of the end user.
3 | Keep Your Brand and Your Brands Personality
Remember, even though the site is responding to the user’s device, keeping touch points, engaging text, recognizable styles and float design remind people why they love your brand.
2 | Web Fonts
You are no longer restricted in the fonts you use. Use your corporate fonts. Be Bold!
1 | Modular Web Design / Development
Build the site with updates in mind. Flexibility is at the forefront of design strategy. Keep the priorities clear and drive the business goals with each adaptation.