A successful website is a combination of design, execution, and achieving the objective. To review these concepts in detail with a visual example as a case study, I will review the most successful website in my portfolio in terms of traffic, design, referrals, awards, and overall achievement of its firm’s goal.
From the beginning of this project I worked directly with the principal attorney at the firm to define the goal of the site. We discussed that the main function was to convey compassion and advocacy. While she definitely wanted the site to rank well and provide the functionality that potential clients were looking for, it was very important that the visual elements of the site were in line with her message and did not convey the negative aspects of her practice area (police tape, handcuffs, etc), but rather represented solutions and understanding.
Website projects often get stale and can drag on for ages because of other work, difficulty in content development, or too many ideas. However, this is generally just a waste of time and rarely makes the site better. This website was completed in about eight weeks, during which time the client was busy with a number of cases. The client was great at maintaining good communication and constantly working on small parts of the website when she had time in order to maintain some amount of progress. In my experience, sites that take too long often get off course, distracted by an idea they found, and steer away from the original goal. This has never been a worthwhile exercise and just creates unnecessary chaos and frustration.
Strong, compelling, and emotional images
We accomplished her goal by finding great stock images. All of the photos were purchased at a cheap stock image site and unified by making them all grayscale. A slideshow in the home page header includes images that are stunning, coupled with verbiage that corresponds with the solutions provided by the firm. There is nothing generic about the image—no columns, gavels, or law books. Which goes to prove that stock photos can be fantastic if used well.
Hierarchy of information
After determining the main goal of the site and how to achieve it, it is important to design your page layout (especially the home page) with a hierarchy in mind. In this case, the hierarchy can be followed with the F-shaped reading pattern; the viewer first notices the firm’s logo in the top left which provides for a great branding element, then moves onto the slideshow which is the most important element on the home page. As the reader moves lower on the page they notice the practice areas and information about the firm, however it is presented with less emphasis and plenty of whitespace to make it easy to scan through and find the relevant information for their purpose. The information on your website should be considered and laid out on the page so that it is both logical and functional.
Limited use of color for emphasis
The client’s logo includes a strong color (dark orange) that could have easily been overused on the site. By only using the dark orange color in a few places we were able to use the contrast of that color to draw attention to those areas as well as convey a greater sense of overall calm. Additionally, because the practice areas of this firm are dark, we were careful with the use of gray and black to convey a sense of hope. For example, the overall background of the page is currently a silvery gray whereas originally it was a much darker charcoal color that was just too ominous.
Promotion and Recognition
Finally, once the site was completed and launched, both the client and I worked to promote the website through blog posts, emails., and paid search marketing. We were also thrilled to be awarded one of the 25 best law firm websites by design blog visualswirl. Combined with all of the elements above, each of these promotion methods has had a noticeable effect on traffic and business.