After months of planning, wireframes, designs, development, copywriting, photography and everything else that goes into a complete overhaul of a 50+ page website the new YellingMule.com is finally live! The previous site had a homepage overhaul in February 2014, but the core of the site was launched in August 2012, so it was well overdue for a redo.
The Internet has changed quite a bit since 2012, so we were excited to start from scratch on the new site. We had a number of goals for the new site:
• Mobile Responsive
• Modern Design
• Video Background
• Innovative Feature Integration
• Organize Services Better
The first goal was something we wanted to do a while ago, but we just didn’t have the time. Mobile responsive sites are a must in 2016, and have been for a while. If your site doesn’t display correctly on mobile devices and tablets you’re losing at least 50% of your visitors. On top of that Google also penalizes you for not having a mobile optimized site, and nobody wants Google working against them.
Knowing that we wanted the site to work flawlessly on mobile we designed the pages in a way that allowed them to reorganize based on the screen size. We also made sure that any mouseovers, drop downs, etc. that we used on desktop had a good alternative for mobile. The toughest part was working all of the example features such as video backgrounds, 3D CSS effects and animations in without making the site seem tacky or difficult to use.
We wanted as many features on the site as possible so we could use it as an example in meetings, but we had to be careful. The video background came easy as we just made it the hero on the home page, with a static photo fallback for mobile that was a screenshot from the video. The next big feature, 3D CSS, was used on the bucket dropdown menus on the homepage. Before we listed these services out, but that gave it a text-heavy feel. On the new site we used icons and the service name, and on mouseover you get a menu of all the services available in that category. Next was animation, which is one that can get out of control and tacky real quickly. We decided to use this for the “Our Process” section, and have the icons and text come in from the side of the page as the user scrolled, which flowed nicely with the story being told on the page. We also used subtle sweeping effects when you mouseover buttons, and rotating text in the footer next to the main CTA for the page.
Once we had a solid design down we moved onto the sitemap and content. We knew we wanted the main menu to remain the same as it was very clean and easy to navigate, but we discovered in focus group sessions that most visitors didn’t know we offered complimentary services to web design such as brand strategy, social media marketing, search engine optimization, etc. We’re a full service digital agency and we wanted that to be clear to anyone who visited the site. To solve this problem we broke our services into four main categories: Strategy, Creative, Development and Marketing. From there we organized all of the sub-services into the appropriate parent categories and added dropdown menus and submenus as needed to make the navigation between the services seamless.
We’re really proud of this new site and are so glad we’re finally able to share it with you. We have another announcement coming in a week or so, but if you pay attention to the details on the new site you’ll be able to figure it out pretty easily.
Check out our other posts about Company News.