There sure are some exciting things going on this year in the wonderful world of www. We’ve summed up ten of these most prominent trends we’re seeing—some of these trends are subtle, some are pretty bold. Let’s jump right in.
1. The “mobile menu” icon—not just for mobile anymore
The “Mobile menu” icon (also referred to as the “hamburger” icon) is now being used for desktop with a slide-out a side menu. We love the cleaner layout of having a minimal menu and the innovation to do something a little different from the status-quo-horizontal-top-nav. My suggestion would be to know your audience, however, before implementing this. People who typically browse the web from their smart phones would be privy to this menu and know what to do. A higher percentage of the older population is probably not (though not always true… my parents now regularly surf the internet on their iphones). Also, it takes one more click to see the menu and therefore the page that one is looking for—typically not the best for conversion (the more clicks it takes to get somewhere, the more you’re likely to lose someone). But if you’re wanting to take a risk and switch things up a little, check out a great example here: organize.org
2. Taking Parallax to the next level
Parallax is when the background image moves at a different pace than the foreground image upon scrolling down or up a page. This technique started to become popular in 2013 and blew up in 2014—it was everywhere. While this technique is now seen as standard on newer websites in 2015, creatives are taking it to the next level with not only different paced layers, but also more involved animations on the scroll. Check out lighthousebrewing.com by Leap for a great example of this functionality.
3. Mobile responsive = many different screen sizes to test
There’s no longer a “1 size fits all” for mobile-responsive design. There’s now approximately 10+ different mobile and tablet screen sizes that have to be accounted for when considering margins, font sizes, and columns on a mobile version of a website. Is this a developer’s worst nightmare? You bet. It can take up to 5x’s longer to develop a website. In the words of Napoleon Dynamite’s brother… “I love technology…”
4. Say good-bye to the one page scrolling site
If you have just one main service or product that you want to promote via a microsite, a one-page scrolling site works great. However, as creatives are starting to figure out, if you have multiple services and/or products that you would like to showcase on your website, they should each have their own page with its own url structure and page title for SEO purposes. Google bots look for these properly titled url structures and page titles when identifying search results for key words.
5. “Smarter” websites that convert website visitors into leads
The typical “brochure” website is becoming a thing of the past. As the cost for relevant keywords and social media advertising is on the rise, so increases your marketing budget. And if you’re paying top dollar to get the right kind of traffic to your website, you-best-be-sure that your website is converting this traffic into leads. If not, 2015 is the time to figure out why. Web conversion best practices have been a topic of much research and development here at Shovel—check out a case study of ours here: shovelcreative.com/project/remodel-works
6. Form field fun
Who loves filling out forms? Let me hear it—no one! Except for the sign-up form on Prezi—I had a chuckle after “Great name!” showed up after typing in my last name. For every entry, the form “spoke” back to me with a fun line of text. I think (and hope) this is a sign of things to come—more interaction and pizzazz with otherwise mundane long forms to fill out. Check out the Prezi form here: prezi.com/signup/enjoy
7. Card based design
Card Based Design is exactly what it sounds like—lots of “cards” on a single page with snippets of information on them. This is a great way to display tons of information at one time—sorted by the user’s interests and preferences. Google and Twitter have both moved to Cards—check out the Google example here: google.com/landing/now/#cards and learn a little more about Twitter cards for developers here: dev.twitter.com/cards/overview
8. Material design
With the digital age upon us, people are craving real, tangible objects. The solution? Well… besides possessing real, tangible objects… designers are creating graphics to look 3D and tangible—i.e. icons, buttons, illustrations, etc.—by use of shadows, highlights, and layering. Here are some examples of material icons by Michael Cook that we’re digging: materialup.com/posts/material-kids-app-icons
9. Re-thinking buttons
Designers be getting cray-cray with buttons this year. The typical color change of a button on the rollover may be a thing of the past. For example, if you check out polymer-project.org/0.5 and click on the “Get Polymer” button, the direction of the shadow movement over the button differs depending on where you click on the button. A simple idea? Yes. But this type of movement (coined as “transitional effects”) opens the door for oh-so-many creative possibilities.
10. Color—Rainbow Brite is back
Though color palettes are always dependent on the personality and voice of a particular brand, be prepared to put your sunglasses on for some of the more progressive web campaigns of 2015—because they will be oh-so-bright and colorful with primary palettes and unlikely color pairings. Check out a campaign here by some of our favorites, Sagmeister & Walsh to catch the drift of what I’m saying: sagmeisterwalsh.com/work/project/frooti
In summary for 2015 web trends, be prepared to see some of your expectations get shaken up a bit from what you’re used to. This year is a time for play and discovery—things we love here at Shovel. So just like Mr. Rogers would do, take off those work shoes and put on your sneakers… it’s time to have some fun.
Shovel Creative is a graphic design and web development agency dedicated to creating attractive and effective print and web materials, specifically focused on conversion and lead generation. To learn more about our process and how to work together, please contact us here.