24

Aug

2011

How to Approach a Pet Website Redesign

As the web evolves and new styles and techniques materialize, the process of keeping a website up to modern standards can be an arduous one. How do you know a common practice these days won’t go out of style in two years? A site could be considered dated if not maintained properly.

Many websites may end up being redesigned because the company’s goals weren’t clearly defined, leaving them with a hodgepodge of random information or a beautiful design at the expense of substance. In this case a re-haul may be necessary. This article will cover the important stages of a website redesign. Here at Atticus Pet Design Studio we plan from the outset, creating memorable designs for our clients that align with their business strategies.

Here are some top reasons to redesign your pet website:

  • Your design looks out-dated  –  Your pet website might have been all the rage in 2002. But the internet world changes quickly. Make sure that your site stays current with the fast-pace of technology.
  • Your site hasn’t evolved with your pet business growth – You set up your webpage when your business started, but now you’ve grown and expanded. Be sure your webpage evolves with your business. If you’ve upgraded your products or services then keep your site current with all the changes.
  • It’s not user friendly – If your site is hard to navigate visitors will click away. Internet searchers are not patient people. They won’t waste their time with a poorly planned site.
  • It’s not getting traffic – You need to rethink your SEO if you’re not getting enough visitors. Effective keyword marketing can make a lonely site popular. If you don’t understand search engine optimization consider consulting a professional.
  • It doesn’t connect with your visitors – Does your site look like there’s a real person connected with it, or a faceless company? Do you clearly explain to visitors how you can help them and how they’ll benefit from your products and services?
  • It’s boring – Let your website have personality. Write with a personal voice that relates to your target audience. A technical site will obviously need to be written in a different style than a dog bakery webpage or comic book web store. Show some excitement about your products.
  • It gets traffic but doesn’t make any sales – If you’re not getting any sales then there could be several problems with your site.
  • It doesn’t build your list – Your page should have an easy way for visitors to join your mailing list. Have them sign up to receive your newsletter or a free ebook.

Analysis

To get a clear handle on what needs to be changed, an analysis of your existing site is performed. It’s after we do this analysis that we discover the clear goals you’re trying to achieve. This study can be achieved through examining the following aspects:

Leads/Sales

  • Is the website frequently updated with content, images or animations frequently?
  • Is there a blog or news feed on the website to drive more traffic?

Browser Compatibility

  • Is the website compatible with all modern browsers?

Clutter

  • Is the copy compelling enough to persuade you to buy something?
  • Provide only the most pertinent of information and cut out the unnecessary details.

Outdated

  • Is the content fresh, and is Search Engine Optimization (SEO) used effectively?

User Friendly Interface

  • Can visitors get where they need to go quickly?
  • By removing roadblocks, the user will be able to find what they’re looking for fast.

Professionalism

  • Aside from content, the sites look and feel plays a large role in whether users trust it.
  • Strong branding that connects with the demographic is necessary in setting the website up for success.

Redesign or Realign?

After you answer these questions you can begin to determine whether a rehaul is in order, or will a realignment suffice. If you find a lot of the reasons for redesigning have to due with aesthetics, a Redesign is probably in order, but if those reasons instead have to do with purpose or strategy, a Realign is prescribed.

Research

It’s time to start thinking strategy and what you wish the new (or improved) pet website will deliver. At the core, every website for a pet business should provide current or potential customers with information and generate new leads. You should also consider the intangibles, such as how you want the visitor to feel when viewing the website. Visitor reactions are very important to the success of your web site so we plan carefully.

Goals

We consider the following in our research:

  • What is your call to action?
  • What do you want your visitors to do?

After writing your goals down, we organize them in primary, secondary, and support.

Visitor Reaction

The average attention span for a web user is 8 seconds. Due to the number of accessible content available, the website should work extra hard to garner the attention of your audience. If they have to jump through hoops to find information they may never return.

Scour the Web for Inspiration

Usability

In redesigning a website, it’s critical to keep the demographic of the users and their specific needs in mind.

  • The Usability Effect presents specific usability guidelines for nearly any need. This checklist runs the gamut from navigation concerns to website desirability.

Structure

After we establish the goals of the website with careful research, it’s time to start putting that knowledge into practice by creating a solid structure for it to live on. Since we’re redesigning an existing site, it’s worthwhile to go back and access the pages that have worked for you, and ditch the ones that won’t in moving forward.

In creating your new site, it’s best to start with these:

  • Sitemap: Critical in keeping things organized, a sitemap establishes what’s best for the visitor. Our aim is to create a natural flow that doesn’t make the user guess.
  • OmniGraffle is a great application for putting together your sitemap.
  • Wireframe: Wireframes help establish where content will be placed. This is where you determine which content is most important and how it meshes with other content. This is a critical element in the design process, as many redesigns are conducted because the previous design’s hierarchy now makes little sense.

Interaction

The interaction of the website shouldn’t be downplayed, afterall, interaction is what makes the web as dynamic and engaging as it is. Your website’s interaction capabilities can be as slight as a link to another page, pushing a button, submitting a form, or opening a modal window. The most common forms of interaction are navigation and forms.

Atticus Pet Design Studio

Navigation

  •  We streamline you navigation so it’s consistent and appears on every page.
  • Links should be short and descriptive. Users should understand very quickly where to find the content their looking for.
  • Place the most important content in your primary navigation and other content in your secondary navigation.
  • In the case of users having their graphics/javascript turned off or enabling the use of screen readers, a text alternative is available. The use of a text menu at the bottom of your site and alt tags will help these visitors navigate.
  • Navigation Menus: Trends and Examples: This article presents recent trends, examples and innovative solutions for design of modern navigation menus.

Contact Form for pet website

Forms

Web forms are often used to achieve goals such as collecting user information or accessing information you currently have. A successful form will be clear, concise and to-the-point. This will help your user send the information they need, without becoming confused or bored.

  • Beautiful Form Design
    Forms needs a solid visual structure, a profound hierarchy of form elements (Fields and Labels), powerful techniques and Functionality (AJAX) to make the form look and work creatively.

Pet Website

Design

Design is something we invest in wholly at Atticus Pet Design Studio. Think back to why you are redesigning the site: Was there lack of clear branding? It’s in this stage where all your hard work is laid in front of an audience, and where they begin to form impressions of the business or service at hand, so the design should reflect the main goals of your pet website.

Aesthetic Elements to Address:

Color

Color theory is used to convey many feelings and has many meanings.

  • Color Theory: A detailed and sometimes historical look at color theory with references for further reading.

Typography

  • 50 Useful Design Tools For Beautiful Web Typography
    This article covers typographic tools, useful typographic references, font browsers, typographic CSS- and JavaScript-techniques, hyphenation techniques, sIFR tools and resources, grids and related tools, free and commercial fonts, a guide to Web typography, examples of great Web typography.

Layout & Composition

  • Do you want a symmetrical or asymmetrical layout?

Viewport

  • Will the design be Fixed, Fluid, or Elastic?
  • Take into account the target audience and which devices they’re liking to be viewing on.

Imagery

  • Use imagery that supports the mission of your site.

Iconography

  • A well-designed and well-placed icon will work as a visual shorthand for visitors that can help understand content without reading it.

Conclusion

Style comes and goes, but nothing can take the place of a website that has been carefully planned and the goals of our clients have been clearly laid out. Careful analysis and research means the difference between a site lasting a long time as opposed to one that needs a facelift every other year. Through this article I’ve presented guides we follow as how to maximize the potential of any site, regardless of whether it’s being re-designed or not. With this knowledge we strive to deliver timeless websites for our pet clients – saving them time and money in the long run – a win-win situation for both of us.

This entry was posted in Business & Marketing, Web Design. Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>