Development

A finger touches a technology related graphic
Web Design & Development

How To Quality Assess (QA) Your Website

/

Learning to pay attention to detail is not always easy!

So your web developer has built you a beautiful new website and has asked you to make your final review in preparation for going live. What should you look for?

As part of any good web development agency’s process, your site should have already gone through a vigorous internal quality assessment (QA) process and there should be scarcely a problem for you to find at all. Still, even the most talented and diligent web developers are still human and might miss something once in a blue moon, so it’s a good idea to do your due diligence and double check. Besides, this is your website, so you need to make sure you’re proud to show it off.

Things to Look For:

Accuracy to Original Design: Compare the original design that you approved to the end product to ensure that the coded version is true to the website design you love. Keep in mind that some adjustments may have been discussed along the way, but you should know about them and there shouldn’t be any surprises. Are the font styles right? Do bulleted lists look the way you expected them to look? If you have any rollover effects, make sure they’re working beautifully.

Images: Look at the images on your site and make sure they are picture perfect. Check for any lingering watermarks and ensure your images look the way they should and have aesthetically pleasing spacing around them.

Content: Check that you have all of the pages you need for your debut, and that all have proper grammar, spelling etc.

Menus and Links: Click on all of the menu items and links to make sure they all go where they should and that there are no pages with content missing. Links may also include PDFs and other documents you are offering for download from the website and email addresses for contact purposes. You can check that links open either within your site window, or open a new window as you specified.

Email Forms: Fill out your own email forms to make sure all of the fields are correct and working well. Then check your email for the results to ensure that you actually get the submission that the form is supposed to send.

Browser Check: Check your website on multiple browsers. Depending on what level of design and programming you purchased, older or less common browsers may have some compatibility issues, however be sure to check your website on the most common players: Internet Explorer 7 or above, Safari, and FireFox.

Privacy Policy: Did you know you are required to have a Privacy Policy? Many web developers will use a standardized version on your site, but make sure it’s there. If you are collecting any sensitive information, check to see you require more specific language.

Testing: If you have any e-commerce or custom system components, test them! Try processing a payment and be sure it gets into your bank account as set up through your third party payment gateway. Keep in mind that if you put through a charge, you’ll have to go back and refund your own money later.

An Exception to the Rule:

Search functionality: This is one of the few features of your site that may not yet be working when you first see it. Currently many systems search functionality is connected to Google, so it won’t be operational until your site goes live and has been seen by Google. This is good! You want Google to index your permanent domain, not the development URL used by web developers to build your site. Even after you’re live, the site search will be set up, but you won’t see any results until Google indexes your site. Still, in the days and sometimes weeks after you go live, it’s a good idea to go back and check it.

Sometimes Excellence is Better than Perfection

Your website is an extension of your business and needs to represent your quality and sterling reputation, but it will never be finished and most likely it will never be perfect. Your site will never be finished, you will always be nurturing and building it alongside your business. Once you have assured yourself that nothing is broken or missing and that it is in line with your vision, it’s time to set it free. A wise web developer once said that once your site is as good as or better than your existing site, get it live!

fireworks
Digital Marketing, Web Design & Development

Get your website live now!

/

Stop being a perfectionist and change!

The newest Treefrog website went live on January 23rd, 2015, after months of being worked on in the background. The simple fact is – the website has a few broken links and some spelling mistakes. It has some  errors in terms of dates and it may have a picture missing here and there. It’s going to take us months to get the site perfect. And you know the thing about perfection.

But this is the point of the new world order of the world wide web. Pay attention to the following;

  1. This new website is already better than the old website.
  2. This new website will take time for search engines to properly index.
  3. We have a CMS on the site, so changes are going to happen quickly.

So we made the call to set the site live, with all of its pimples and imperfections. We know that Google and the world will be happy to see the changes we have made and be happy that we strive for perfection. It isn’t perfect. But we aren’t forgetting about it. A website, like all good works of art, is never complete. We are going to continuously put energy into making it better.

“Google likes to see change. Google likes the fact that your website is a constant work of improvement.”

So have no fear that we won’t complete your website, and setting it live (within reason) before all of the bubbles have been pushed out of the wallpaper of perfection.

Your website needs to go live at exactly the moment you can say “this website is already better than our last one”. And your ranking on search engines will actually be better if you send it live and tweak it as you go.

Let loose your fear and click the big red button of life! Over the next few weeks, you can still make it perfect, and you will have made great strides towards your search engine ranking goals.

Honeycomb with a bee
Hosting & Infrastructure, Web Design & Development

Understanding Website Hosting and Domains

/

Domains, hosting, registrar… you may know that these terms have something to do with a website, but what do they mean, and why should you care?

Do you know where your website is hosted? Who hosts your email? Who hosts your domain and where is that domain registered? Do you know who the administrative and technical contacts are within your company?

If you have been involved with a new website migration or build, you probably will have heard of the terms domain, hosting and registrar. But few people actually know what these things are, or why they are relevant to a website.

We’re going to try to break these things down a bit. Keep in mind that this is a complicated topic, so we’ll be using general terms and in some cases over-simplifying. Hopefully you’ll at least understand the basics once we’re done.

The main terms we’ll concentrate on are: Domain Registrar, Domain Name Server, Email and Website Hosting.

So what do these things mean? First of all, it helps to think of these terms in a hierarchical format.

Keep this structure in mind as we continue. Notice that we’ve arranged these in a top-down hierarchy.

At the top: The Registrar

It all starts at the top with the domain registrar. The domain registrar handles the registration of your website domain name, specifically what comes after the “www”.

It’s always important to make sure you know who has control of your domain, and that a reputable company is handling the renewal process. Domain names come up for renewal every few years, depending on the renewal plan. The last thing you want is to find out that you had unknowingly allowed your domain to expire.

In this same way, the registrar will handle the sale of multiple associated domains, for example .com .ca and .net versions of your website, or even similar URLs, like www.bakesale.com and www.bakesales.com

These companies have varying renewal policies for domains rentals. Keep in mind that you never actually “own” the domain, you continually rent them. Sometimes the registrar will set the renewal process to be automatic so that you don’t receive a notice every year; they’ll set it to renew automatically for 5 or 10 years. They’ll also have transfer policies in the event that you want to move your domain to another registrar.

Examples of Domain Registrar companies are: Treefrog, Tucows, GoDaddy, Network Solutions and NetFirms.

In the middle: The Domain Name Server (DNS)

Without getting too involved, a domain name server (DNS) is a massive database that stores website IP addresses and their associated “names”, in order for people to find sites on the Internet.

Brief explanation: each website has its own unique IP address, which is a set of numbers and periods. A domain name server translates those numbers into plain English. As opposed to seeing 234.543.345, we see the much prittier www.website.com.

Domain Name Servers handle website as well as email requests. Again, instead of having to remember some random string of numbers, the Domain Name Server allows you to send an email message to “somebody@website.com” and the servers handle all the necessary redirecting behind the scenes.

Examples of Domain Name Server companies are: Tucows, GoDaddy, Google, OpenDNS and Network Solutions.

At the bottom: Email/Website Hosting

Email and website hosting is on the bottom of the food chain in terms of access and control. These are on the same level in our diagram because technically they are not contingent on one another.

Email and website hosting can technically be handled by two different companies, but are often handled by the same one. A client can choose to migrate their website to another hosting company, and keep their email where it is. It is not necessary to host your website and your email in the same place.

Hosting a website basically means storing all of the website data: pages, files, images, and everything that would accept and serve up requests from users.

In the same way, email hosting entails storing all of the email messages and email files for that domain.

Even though website hosting and email hosting are on the same line in our diagram because they are not dependent on one another as far as permissions go, they are two very different entities. They operate on two completely different protocols—which is something that often confuses people, especially now that there are so many web-based email services like Gmail. Something to keep in mind: the Internet is the network; the World Wide Web and email are services used within it.

Now that we know a little bit more about the different pieces and what they are dependent on, let’s create a scenario.

“Knowing this information will help save time if you are getting into a website migration or new website build.”

Registering Your Domain

So you want to register your domain. This usually means that you have selected a website domain that you want to register (such as www.thiswebsiterules.com) and you’re ready to make it legit. By the way, don’t waste your time trying to register www.thiswebsiterules.com—it’s already taken.

Treefrog is a domain registrar, so we can handle this for you, or you can go through one of the examples of registrars listed above.

Normally you will need to assign an administrator, as well as a technical contact for your domain. Each contact is affiliated with an email address. It is very important to keep track of which email addresses are associated with these contacts. Sometimes people leave businesses and their email addresses are never changed. However this is the address that will receive notices about the domain expiration. If no one is getting those emails, then you could potentially miss the registration deadline, and your domain could legitimately be up for grabs.

The technical contact is normally the person who will handle technical questions regarding the domain. For example, someone notices that your DNS, website or email has stopped working, someone might look up your technical contact information and send that contact a notice. Again, keep track of who this person is. Sometimes critical notices are sent to this email address, and you want to make sure nothing gets missed.

Transferring domains

Some registrars will have made you confirm an agreement prior to getting on board, in which case you will need to know the details of that agreement before proceeding.

If a web agency (like Treefrog, for example) is going to be taking over as your domain registrar, then we will need access to the usernames and passwords for the accounts affiliated with your website. We’ll need to know the administrative and the technical contacts (where applicable) so that we can coordinate the transfer.

Alternatively, if we are going to be your DNS company, but you wish to remain with your current registrar, then we will need to know:

  • Who the registrar is
  • Who the administrative and technical contact are from your company for the associated domain
  • What the passwords and login information is in order to access the registrar information and properly set up the Domain Name server settings.

Hosting your Website and email

Some companies want to have their website hosted with one company, and their email hosted somewhere else. This can happen if the company is launching a new website, while their email has been with the same company for years and they are uncomfortable moving it.

Know Who is Who

In an ideal situation, Treefrog would handle all four of these components. It is only ideal in the rare case that there’s an issue, so we don’t have to go to any other source; everything is housed in one place. It’s not necessary that we handle everything, and we’re very clear about the freedom our clients have to host their email, website, or DNS anywhere they choose. The only thing is, we should know who is hosting these components at the outset of a project, to save confusion.

Knowing this information will help save time if you are getting into a website migration or new website build. We suggest compiling this information and knowing where to get access to it, in the event that there’s ever an issue with domain expiration, or hosting issue, or perhaps you have an IT person leaving and they know all this stuff; you have to be able to get access to this information efficiently.

We suggest having a quick cheat sheet somewhere accessible that contains your Domain Registrar, your DNS provider, your website and email hosting company, plus all your administrative and technical contacts, and the usernames and passwords for each level. Keep this in a safe place. Even if you personally don’t know all the technical details about your website, this will be a great starting point.

Close up of a keyboard, but instead of an enter key, there is a green accessibility key
Digital Marketing, Web Design & Development

AODA: Making Your Website Accessible to People with Disabilities

/

You may already be aware of the Accessibility for Ontarians with Disabilities Act. But are you aware that it will have an effect on how websites are developed?

The goal of the Accessibility for Ontarians with Disabilities Act (AODA) is to make Ontario and Ontario-based organizations fully accessible to people with disabilities, and that includes websites and digital content.

According to Statistics Canada, 13.7% of Canadians aged 15 or older have a disability. Additionally, the Canadian population is aging. StatsCan found seniors accounted for a record high of 14.8% of the Canadian population in 2011, up from 13.7% in 2006.

AODA states all privately held or non-profit organizations in Ontario with more than 50 employees must ensure their websites and digital content conform to World Wide Web Consortium’s Web Content Accessibility Guidelines (WCAG) 2.0. There are three levels of the WCAG 2.0 – Level A, Level AA, and Level AAA. Your organization’s site needs to be WCAG 2.0 Level A-compliant today.

By January 1, 2021, all public organizations and companies with more than 50 employees must meet WCAG 2.0 Level AA. WCAG 2.0 Level AA includes captioning for both live and pre-recorded video and audio available online.

Find Out How AODA Relates to Your Business

The timeline for your organization to be AODA-compliant depends on the size and nature of your business or non-profit entity.

The timeline for implementation is complex because the law deals with many facets of business, of which website accessibility is one. To give you an idea, here’s a PDF created by the Government of Ontario that gives a timeline detailing requirements and compliance deadlines.

The Government of Ontario website features a wizard you can use to find out what category your organization belongs in, and which gives you a sense of the deadlines that directly affect your business.

What You Can Do Now

When you’re developing your website strategy, consider implementing the following functionality:

  • Write your content in clear language that is easy to understand
  • Use strong contrast for text on backgrounds to make it easier to read
  • Provide alternate text for images and captions
  • Mark decorative images — images that have no direct relevance to an article — as null text Tag: (alt=“”)
  • Ensure that your website is navigable with a keyboard
  • Provide text transcriptions for audio recordings
  • Provide text transcriptions and captions for videos
  • Avoid blinking images or potential seizure-inducing visual elements
  • Use clear link text (instead of “click here”, describe the link and its content)

WCAG 2.0 Accessibility Will Improve Your Site SEO

Search Engine Optimization (SEO) is the practice of making your site discoverable on the web via search engines. It’s an involved process that involves leveraging your content so that Google takes notice of your site.

Complying with WCAG standards ties in with good SEO practices. For example, alternative text tags should describe images in the context of the article in which they are placed. The description shouldn’t just be a bunch of keywords stuffed into a text field at random. These tags are read aloud by screen readers. They need to make sense. Plus, Google likes it better when they do.

The more you make your site accessible, user-friendly and transparent, the higher your rankings will be. In other words, the more accessible you make your website to people with disabilities, the more Google will acknowledge your credibility.

AODA is Already Law: The Time is Now

If you factor in accessibility measures to your site at the outset of the project, the process will be far easier. There are guidelines and accessibility checklists available you can use to test your site’s compatibility.

AODA will encourage businesses to make their websites more accessible to potentially millions of additional users, making the internet a much more accommodating place for the millions of people with disabilities in Canada, and around the world.

For more information about AODA-compliant websites and how Treefrog can help, get in touch with us.

PLEASE NOTE THAT THIS IS NOT A LEGAL DOCUMENT, AND SHOULD NOT BE RELIED UPON FOR LEGAL ADVICE.

More Resources:

Web Content Accessibility Guidelines (WCAG) 2.0

WebAIM’s WCAG 2.0 Checklist for HTML documents

WebAIM Introduction to Web Accessibility 

Close up of green leaves
Digital Marketing, Web Design & Development

The Importance of Good Website Navigation

/

You’d never go on a hike without a compass or a map. No one has to tell you that you’d be in serious trouble if you walked for hours in dense woods or mountainous terrain without knowing where you were or where you were going.

When it comes to websites, the navigation system acts like a road map to all the different areas and information contained within the website. If it’s clear, easy to follow and understand, visitors will stay and have a good experience, which ultimately leads to more business for you. We’re going to clarify exactly what considerations we employ to ensure your site’s navigation helps exceed your company objectives. At the same time we’ll show you some stellar examples of these essential elements coming into play.

What makes good website navigation?

First off, do keep in mind there is no one-size-fits-all strategy. Although, three factors should always be considered;

  • your business
  • your goals
  • your audience

These elements will all affect your strategy, which is basically how you are going to get people to engage with you. A great example of this is social media. If your target audience is seniors, it’s highly unlikely likely that Twitter and Instagram are the best ways to engage with them.

Ask yourself: “What experience do you want the user to have?” Then use this information to shape and guide your navigation. In other words, not being rigid with conventions is vital to bear in mind. As a general rule, simple is best. For example, less clutter in terms of menu structures, calls to action and design allows anyone to find their way around speedily and effortlessly. Consistency is another crucial point. Consistency in navigation is about a consistent user experience throughout the site – if it doesn’t change too much, the user can always find their way around, or back to where they’ve already been if they wish. Your viewer will feel comfortable and calm as opposed to overwhelmed and irritated.

Hillside Veterinary Clinic is a great example of these factors working together. If your beloved pet isn’t well, the last thing you want is to have to hunt around the site to find the help you need. The clear, logical layout speeds up the viewer’s search – with the added bonus that they will likely return to the site because it’s such a pleasure to use.

Conversion Point

Your page’s ultimate goal is a conversion. In other words, converting visitors/leads into customers. Success hinges on conversion. The prospect must be able to convert quickly into a visitor, and the visitor must be able to convert quickly into a lead, an applicant, a customer, a donor, or a subscriber. The odds of converting a visitor into a legitimate prospect or customer go up significantly when that visitor arrives at a website that is “conversion ready,” which means that behaviour up to the point of arrival strongly indicates a propensity to convert. When and how conversion occurs varies from one organization to another. A conversion point is reached via calls to action and the menu structure.

Call to Action

A call to action is a line of text that prompts your visitors, leads, and customers to take action. It is, quite literally, a “call” to take an “action.” Examples include: buy now, download file, get a coupon, register for an event, sign up for newsletter, hear a sample, get a quote, etc. A good call to action will create a sense of urgency (“offer ends tomorrow”) and therefore entice people to actually take an action from your content. Having calls to action throughout a site will enable users to be led clearly and directly to registration or purchase pages.

Menu Structure

The menu structure guides people to what they want to find and what you want them to find. Menus are typically found along the top or the left-hand side of a page, with the logo at the top left and secondary components where it makes sense for the individual design. This is not a rigid web convention but rather a guideline.

The F pattern is a proven, dominant web copy reading pattern that roughly resembles the letter F. Studies have found that users’ main reading behaviour was fairly consistent across many different sites. The pattern has the following three components:

  • Users first read in a horizontal movement, usually across the upper part of the content area. This initial element forms the F’s top bar.
  • Next, users move down the page a bit and then read across in a second horizontal movement that typically covers a shorter area than the previous movement. This additional element forms the F’s lower bar.
  • Finally, users scan the content’s left side in a vertical movement. This last element forms the F’s stem.

A superb example of where the navigation lends itself well to the content is The Briars. In order to accommodate all of the various services they offer, a more complex menu structure is beneficial for different types of visitors. This adaptive site balances a top menu for browsing along with boxes which link quickly to specific services. In other words, viewers can find their way to a specific service directly or enjoy exploring the different R & R options that are available to them.

“Use clear and stimulating yet brief language – make each word fight for its right to be on the page. Remember the “need for speed” and try to minimize links & distractions.”

Site Content

Writing for the web is different from writing for other means. Ensure that the keywords (the phrases and specific terms that a target audience is likely to use when searching for a product or service) appear in text copy on your site. Also, use several headings and sub-headings throughout each page because users typically scan a page for information as opposed to reading it word for word like a book. Use clear and stimulating yet brief language- make each word fight for its right to be on the page. Therefore, remember the “need for speed” and try to minimize links & distractions.

The 3-Second Rule

Three seconds is the average time a visitor will give your page to learn what it’s about and what they’re expected to do. Fail this test, and your visitor will leave. Here are some tips to keep their attention;

  • use white space, bold text and bullet points to help visitors scan to get a sense of what the page about and decide if it’s something they’d be interested in reading,
  • use compelling images and photos that back up the content,
  • use well designed graphics to make the look professional.

MeCreo 3D blends technical terms with a fun, creative flair. The content engages the readers’ imagination while still representing the company as trusted experts in their field. The result is a site which screams both innovation and technology along with ingenious uniqueness.

Remember, your page’s ultimate goal is a conversion. With this in mind, your marketing efforts may result in beautifully crafted pages and creative copy, but if most of your visitors are leaving without converting and you don’t know why, or worse, you don’t even know it, you’re navigating your marketing world at your own peril.

Scroll to Top