A Review of 8 Responsive Web Design Trends that Defined 2015

By Lucas D. Arnatt, Web designer

When I started web designing back in the fall of 1997, “web patterns” were really just emerging and becoming established as the tried and true foundations of successful design. When I worked with a media company in 1999 in downtown Calgary, we focused on building scalable websites, meaning websites that would expand out to larger screens, with our base resolution width of 640px. Building and testing all of those resolutions was about as much fun as trying to get ANY site to work properly in Netscape 3 or IE 3! But there is also such a joy felt when all of the pixels lined up as they should.

There are a lot of trends on the Web in design. Each year a particular font or effect will make its way through newly created (or redesigned) sites. But behind the fads remain a lot of common sense design approaches that are still valid today.

With the wide variety of mobile screen resolutions to contend with, CSS3 and above have been a godsend to designers, providing a fluid and manageable way to control different layout versions of the same content.

So now in 2015, we are enjoying the freedom of mobile technology and design seems to be evolving at a similar pace to provide the best user experience possible.
Check out this interesting article by Jeremy Girard  about 8 responsive web design trends that defined 2015.

I am including the 8 trends below, but please note these are my comments, not Jeremy’s, below each numbered title:

These 8 trends include:

1. Captivating storytelling

Yes, if one thing all media teaches us is that it is the story that matters. It engages, it conjures up images in the imagination and it can sell any idea if done well enough. Girard notes that it is important to tell the story above the fold. Many designers may focus on just making sure the main navigation, logos, and titles are above the fold, but making sure the immediate impact and engagement with the story’s characters is strong enough to stick. He also notes that making the story easy to share for the reader is of utmost importance in this day and age of social media audiences.

2. Less is more

This is one of our company’s design mantras for both print and Web. Keeping design clean and properly spaced can in itself define a website’s subtle, but powerful, presence as an authority in its niche. Quantity is relative to a certain degree when it comes to a successful website, as we have seen all varieties of content length and page counts from simple video sales pages and landing pages to extensive articles on super-specific topics.

You have to first define the need of the user, what it will take to convince them to trust you and then provide the solution based around what you can give them. This is why video sales letters are so popular and successful; they provide everything above the fold, simply, cleanly and effectively.

3. Patterns everywhere

Girard notes that with the advent of responsive web design, new patterns have begun to emerge. This is definitely true, including new ways to compact navigation, image scalability, hierarchy control of content blocks all making sure the User Experience is first and foremost. Google has started to penalize sites to some extent that are not considered “mobile-friendly”. Here are some layout patterns from Google’s developer website.

4. Card layouts

This type of layout made popular by Pinterest focuses on one block of content. For example, a product, a single photo (meme), etc. that can be more easily arranged among other similarly composed content blocks. This facilitates the Millenial ability to share content across social media channels.

5. Hidden menus

As I mentioned before, navigation has had to adapt to small screens, so long horizontal menus are sculpted into small square icon capsules that you can pop open when you need to. A click to get to any navigation isn’t ideal, but it is a relatively small price to pay for an otherwise intuitive solution.

Girard mentions that some argue against these menus for that very reason of having to make an extra click (if they recognize the new menu icon at all) and that they are less used than visible full menus. Yes, but as with any new pattern, it will take the global audience a relatively short time to adapt as more and more web sites use this type of navigation.
6. Big hero images versus no hero images
A hero image spans the full width and height of a user’s screen creating instant impact and strong visual engagement (or strong repulsion if the image backfires). They are part of the evil parallax designs that (to me) are all bark and no bite. Google always is stressing the importance of quality content.

Don’t get me wrong, I can see the appeal of parallax designs to both designer and client. It’s BIG, it’s BRANDING IN YO FACE BIG. But how useful is it to the end user if they struggle to find the content they are looking for, scrolling (seemingly) forever down the page, loading full screen image after full screen image separated by a minimum of a 60px heading that says something impactful, but meaningless at the same time all the while taking ages to load as all of the “content” is strung together as some contrived story that trails off to a basic footer with a massive phone number in a 300px font at the bottom: “CALL ME!” It can also be a lazy way to optimize for multiple screen resolutions simply because there is very little content to contend with.

Girard compares the advantages of Big hero images and No hero images. Both have their place of course and I agree that 2016 will continue to see both used judiciously aaaand not so much.

7. Rethinking advertising

He makes a good point that, as advertising on a website revolves around ad size and placement, the need for responsive web design challenges this static approach. Girard doesn’t give a solution here for this new need, but I think that we can simply look at how Social Media giants are developing solutions. They do incredible amounts of testing across many demographics so any design company or marketing team can benefit just from keeping up with, and making use of, the likes of Facebook, LinkedIn, Twitter, etc.

8. Improved workflow

With all of the challenges of scalable responsive design facing a designer, I have to say it is nice that this challenge is being met by advanced prototyping design software that allows for quick and easy multi-platform development.
Girard refers to UXPin, which looks like a great solution for designers in 2016.

He also offers some “next steps” at the bottom of the page, which you should definitely check out.

The user experience of any web presence in 2016 will still depend on the key elements of quality content backed by strong, supportive design elements and frameworks that allow the message to be conveyed consistently and effectively.

Learn more about responsive, mobile-friendly web design.

Get a free, no-obligation website audit that takes into consideration these factors (and more), or if you are starting a new website or branding project,  just fill out this request form.


The Essential Art of Logo Design

I will venture to say that anyone can create a logo. Now, since I am a logo designer, you might think this is a BB-gun shot to the foot (ouch.), but I cannot deny the truth. We are all creative, we all have artistic potential in some form or another, and I have to say that if you can draw an original shape then you can make a logo. Here’s the “However”… however, we can also admit that some logos seem to carry more power than others, more attraction, more recognition. If there is some magic in logo design, it is the ability of a designer to convey this magical meaning from her client’s corporate office all the way to the other side of the world, where someone who speaks a different language, has been born and raised in a totally different environment, can still connect with this logo and receive its initial meaning.

Go to Google and search “logo design” (in quotations so you’ll see only results for that search term) and you will be faced with 8 million search results and pelted with ads claiming “6 logos for $50!” and “Build your own logo using our software!”  Some claims are worthwhile, of course, such as “unlimited revisions” and “money back guarantee”, claims that are needed to create that initial trust and confidence to choose that design company.
So how much should a logo cost your company? First define cost:

  • A logo is made to represent your company and its philosophy and spirit, so what worth is your first impression?
  • The style of a logo is best made as timeless as possible, so trendy styles are okay, but the very essence of the logo needs to be able to be seen and interpreted in plain black and white – from there effects and styles, colours and positioning can be changed.
  • How transferable is the logo design? Will it transfer well from one medium to another? From business card to golf shirt to vehicle signage to newspaper ads to TV and travel mugs? If your logo is not built to be transferable then you’ve wasted a lot of time and money on a design that will continue to take more time and money to make work across different media.
  • Cost is also defined by originality of the design since there are obviously logos everywhere, so having a logo designed from scratch for a singular purpose brings out a unique perspective and a new, valuable identity.

So cost is less about how much money it cost initially to create the logo, but more importantly, is the cost of NOT getting the logo made properly the first time. Some of the most powerful and recognizable logos are also the simplest in design – they allow for space, for imagination, for communication to flow between the intender and the intendee. A logo is needed if you want a single vision for your company. A logo is needed if you want your company to grow and prosper because we (humans, consumers) all need focal points to help each other find the way through life. The ones that help the most will prosper the most.

Perhaps anyone can create a logo because all logos are already created and we simply unveil them through the creative process and then tag them with “TM” and claim them as “ours.” But the more you can define the nature of your own life’s purpose and that of your company’s the more you will see its creative nature becomes realized. Is a logo ever a finished product? No, because it is always being defined by what it represents, it is always being projected upon and used to project on others and what that projection is will, in some degree, continue to shift. This is not bad, nor good, but a logo needs to maintain the paradox of a fluctuating fixture – a constant for change.

BlindDrop Design Inc. offers full creative media development for Corporate Identities (yes, including logos), Graphic Design services, Web Video production, along with Web design, development and  managed WordPress hosting. Please contact us if you would like more information about any of these professional services.

Five Key Ways to Market Your Calgary Business

Here are five fundamental ways to market your business on the web and on the street:

1. Get properly branded – getting a professional logo design is a great start, but it is also critical to plan your branding, which is based on the customer experience and how your company is interpreted by the customer from near and afar. Get a logo and business card at the minimum and during this process work through basic marketing factors such as demographics, culture, sales region and budgeting for advertising.

2. Develop a custom Web presence – Once you have the branding planned and established you can move this onto the Web by getting a custom site that supports your branding and business model. Ideally, you will secure  a domain, website and domain-based email addresses. The site should reflect the corporate identity, provide essential information about your company and also provide service to generate sales. If e-commerce is not a suitable fit for your company’s services, you can use a custom form to direct and define sales, or use an online chat system to connect with your customer directly.

3. Market your Web presence Online – this includes having an active website, email list and any active submissions to groups, help sites or forums. You can also increase traffic and sales by actively managing your SEO (Search Engine Optimization) and SEM (Search Engine Marketing) campaigns each week. Examples of this are commenting on blogs, getting back links to your site and running paid advertisements in search engines and directories. The more focused and niche-based your campaigns are online, the better results you will have. But, keep in mind that you need to research what people are looking for and balance those results with what you’d like them to see.

4. Market your Web presence Offline – this is the only way you can attract people to your online business when they are not at their computer. Look at any magazine from the early 1990’s (if you can find one) and I wager it will be nearly impossible to find ads with web addresses in them. These days classified ads, newspaper ads, posters, uniforms, video, tv, vehicle signage, stationary and pretty much any media channel is used by businesses to promote their Web presence. If your website is e-commerce enabled, then your offline marketing efforts can drive direct sales to your company just by handing out a business card. The customer may never call your number, but they may well purchase something from you with nothing more than a good first impression.

5. Be Consistent and be Professional
– in all cases, whether online or offline, be consistent with your branding and communications. Being professional does not mean being overly conservative, but it does require conscious attention to details. For example, simple typos in an introductory letter or a broken link on your website can detract from the overall image of your company. Make sure you follow your initial branding plan and mission statement and triple-check any published items that cannot be easily changed.