At the recent Vancouver Web Design Meetup event attended by over 250 people, a panel of five industry web development experts discussed the latest trends in the rapidly changing fields of web design & development. Here are their recommendations.

Strategy

An effective website is almost impossible without proper planning and a strong manager to move things along.

Things to consider when planning your new website are usability, SEO, scheduling, budgets, and people involved (whether it’s a single contact or a committee).

Goal-setting

Determine your design goals. Try to relate your reason to measurable goals such as:

• Increasing sales
• Increasing traffic
• Increasing time spent on site
• Improving site ranking in search engines
• Increasing leads
• Increasing social media engagement

Create a SWOT (Strengths, Weaknesses, Opportunities and Threats) analysis and recognize any opportunities where you can do better.

Look internally to identify strengths and weaknesses, such as:

• Budget
• Timeline
• Personnel
• Technology

For opportunities and threats, look externally:

• Market conditions
• Social trends
• Competitors
• Industry trends

B2B goals will obviously be different than B2C goals. A B2B business could prioritize raising brand awareness and lead generation, while a B2C business may be more interested in customer retention and engagement.

Evaluate competitors’ websites instead of those outside of your business’ industry.

Define the Customer Journey

In 2017 39% of companies found mapping and understanding the customer journey to be more challenging than the previous year.

Consider polls, analytics, surveys, focus groups & interviews. You will need to do research by talking with management, staff, and your customers.

Organize and craft your web content to support the journey.

Who Are You Conversing With?

When you are writing content for the web you are engaging in a conversation.

Ask yourself a lot of relative questions:

• Who uses your website?
• Why are your visitors visiting your website?
• What are your visitors trying to accomplish on your website?
• What questions are your customers asking?
• What problems do your customers need solved?
• How many audience types are you speaking to?

If you can answer these questions succinctly, the better you can help your target audience.

Leverage Your Unique Selling Proposition

What differentiates your business, products and services? Celebrate your unique selling proposition (USP) in your copy. If you can articulate your USP you will help your visitors understand and remember your offering. Your goal is to always build brand awareness.

UI/UX

Navigation/UI

Less menu items with clear titles make it easier for your visitors to follow the desired journey. Aiming for simplicity, instead of 7 menu items, consider 3 or 4.

Usability experts are recommending we reduce the use of the hamburger menu. It hides your menu items from your visitors resulting in more time spent trying to figure out where they want to go and how to get there.

Develop your navigation so your audience does not have to think about choices for too long. Make your navigation dead simple for your visitors.

Wireframes/UX

Wireframing is a low cost, rapid iterative design technique that offers design insight early.

Benefits include:

• Managing risk
• Allows testing and feedback
• Promotes inclusivity
• Increases stakeholder buy-in
• Improved user experience

Before you wireframe, establish default screen size resolutions. Start small and work your way up to bigger sizes. Use analytics from the past year to help you decide. 

Choose a level of fidelity for your wireframes:

Low fidelity allows an easy quick glance as to how the structure of the website will look ignoring things like copy and navigation titles.

High fidelity includes more realistic UI elements, filler copy and some visual design (ie typography hierarchy)

Digital Marketing

Search Engine Optimization

Google owns 79% of the search market space, BING & Yahoo make 12%, and the rest is split between Baido, Duck Duck Go, and others.

Managing SEO

• Google Keyword Planner
• SEOBook for free SEO tools
• Google Webmaster Tools Verification
• BING Webmaster Tools Verification
• Monitoring your rankings will require a paid tool.

SEO Resources

• MOZ Beginners Guide to SEO
• SEOProfiler Paid SEO Tool

Social Media

Social media is an effective way to drive traffic to your site. Much like Google for search engines, Facebook is the market leader for social media. Small budgets can yield big results. Picture and video ads perform better for all content.

Managing Social Media Marketing

• Install any necessary tracking codes.
• Ensure your website has social media sharing enabled.
• Research your target demographics & determine what they use.
• Create a Facebook for Business page, decide on a budget and boost a picture or video ad.

Escaping the Walled Garden

Some examples of walled gardens: Facebook, Amazon, Google.

These walls make it more difficult for businesses to reach their key market. They want you to pay but the best ROI is in organic marketing. Know the limitations and risks of the platform you are using. Diversify your marketing efforts, as all good marketers do. The primary purpose is to drive traffic to your site.

Amazon

• Amazon does not allow you to reach your audience directly, limiting repeat sales.
• Amazon features products from your competitors on your own product pages.
• Limited ability to upsell, cross sell or resell.
• Limited ability to remarket.
• Unable to attain buyer information.

Facebook

• Facebook has limited the reach of company pages to encourage businesses to buy ad space on their platform.

Google

• Google frequently changes algorithms especially during critical market opportunities such as Black Friday.
• Organic results are getting pushed further down the page due to: more & larger ads, rich snippets, maps, location results, etc.
• On page optimization, linking, customer engagement and traffic are all required for effective positioning.

Conversion Optimization

Conversion optimization means talking to your target audience and engaging them to take an action.

• Purchase
• Call
• Fill out a form
• Sign up for an email newsletter

First apply best practices for conversion optimization and then A/B testing.

It is normal that conversions can decrease on new site launches.

This is usually the result of a redesigned website that answers the users’ questions, meaning they don’t need to contact you. Google typically applies a temporary penalty when a large number of changes are made on a website.

Conversion Tracking

Google Analytics allows you to manage conversions across a wide variety of segments and filters. Proper tracking requires setting up goals in the Google Analytics backend. These could be related to revenue, inquiry, or engagement or you can set custom goals.

Google Analytics allows you to see how well each of your marketing channels are affecting traffic, sales, calls, or online bookings.

Design

Sketch Out Your Ideas

Some find it easier and quicker to sketch out their ideas before jumping into wire-framing. This allows you to talk through your process while using sketches to develop your ideas.

Typography

Remember to consider how your typography will scale on different sized screens.

Mobile First

Design for smaller screens first, then add more features and content for bigger screens which is known as progressive enhancement.

Responsive design is not just about the layout and the grid, but also how fonts, image optimization, animations and plug-ins respond to the user’s behavior and the device they are using.

Gradients and Vivid Colour

Gradients and vivid colours are being used on “flat” designs in order to let them pop more. Know your colour theory and make use of primary, secondary, tertiary colours.

Image Selection: Authenticity is the new King

Stock images are easy to find and cheaply attained, but the major drawback is that they are very generic and used frequently by other businesses. Businesses are starting to move away from stock images in order to portray authenticity, originality and personality.

Hire a professional photographer or illustrator if budget allows. Your visitors can tell the difference between stock photos and original content.

Content for Effective Websites

Language

Purchase decisions are weighted to emotional responses.

Get out your thesaurus for this exercise and experiment with verbs. Instead of “taste” you can use “savour”, instead of “do” you can use “experience”.

Microcontent

Microcontent is scan-able, comprehensible, stand-alone, mobile friendly messages. They will make sense when removed from original context.

Connect with readers but don’t forget search engines. Headings, sub-heads, decks, bullets, buttons, links do the heavy lifting.

Write for Slices and Cards

Page slices and cards can flow together to tell a story or complete a journey. Each ‘card’ should be comprehensible without deeper descriptive copy. Think about it like writing billboards for a story that should conclude with a conversion.

Video Content

Video is incredibly popular, and effective, however it is important to use as supplemental to your traditional content. 

Videos should be short and relevant to your goals. Make sure you include text to support the video, which helps with SEO.

Optimization of Assets

Anything you use as an asset in your design must be optimized. Here are some things you should take into consideration that will help optimize your website:

• Choose a good web host, you pay for quality.
• Compress everything – images, code, even typography
• Merge & Version Control
• Off-load larger assets to other web services

To help offload larger assets look to separate hosts for images, videos, CSS, Javascritp etc. Use established platforms, such as YouTube, to host your videos. These services are already optimized and will deliver your content to visitors quickly.

Testing

Performance is essential. A speedier website increases conversions, improves usability and improves search engine ranking. Test your website on not only popular browsers & platforms, but the browsers & platforms that are being used by your visitors.

Once the new site is live for 30 days, review the performance/conversions on the different platforms & browsers. Improve the user experience on low performers

Talk to a Website Specialist Today

Book a free consultation and learn how Graphically Speaking can help add value to your business.