Visual hierarchy designs are always changing, and developers are constantly looking for ways to innovate websites in order to create more compelling, better converting experiences.
But, even as specifics change, the basic fundamentals stay the same.
1. Color.
Using color strategically is one of the most basic components of visual hierarchy design. From pops of color around text to subtle changes in gradient or background colors, you can take your visitor’s eye from one section to the next in a way that is both predictable and pleasant.
While sometimes effective, obnoxious color changes or ones that aren’t visually appealing can make your attorney or law firm’s website appear cheap or unprofessional.
2. Eye Patterns.
When an individual lands on your website’s pages, their eyes immediately start going to work. And, while you might not think of it, there are actually predictable patterns.
By recognizing what the eye does the moment it hits your first page, you can better place information, content, visuals, etc. so that what you want to be seen gets seen. In general, there are two types of eye patterns for individuals who live in countries that read and write left to write. These patterns are the “F-Pattern” and the “Z-Pattern.”
Depending on which pattern you choose, the layout of your website will change. Designers and developers will argue about which pattern is more effective, but the margins of difference appear to be so slim that either choice is a good one.
You’ll want to dive into both of these patterns more if you’re designing your website’s layout yourself, but a basic rule of thumb is that if your website is text heavy, then go with the F-Pattern.
If your website relies more on images and features, then the Z-Pattern is a better option.
3. Layout.
Once you’ve selected which eye pattern you’re going to use, the layout should be more straightforward.
While you can think of your website’s pages as blank canvases, not using a proven layout is a bit like attempting to freehand an intricate design instead of using a stencil – the result with the latter will almost always turn out better unless you’re a certified pro.
In general, the most effective website layouts, especially for attorneys and lawyers, include a focus element at the very top (like your logo or name) and rows and columns of structured content below.
Where you’ll want the help of a professional designer is when it comes time to add your Calls To Action and buttons; the goal is to keep your website looking clean and organized, while simultaneously engaging.
4. Sizing.
While it’s typical for people to want to draw attention to specific elements on their website by making them bigger, it’s not always as effective as you may think. Sometimes you can call attention to something more effectively by simply making it stand out.
Subtle highlighting, which can happen in a variety of ways (from changing colors and fonts to isolating an element from the rest of the design) can be a better way to prevent your attorney website from looking overly “sales-y” while still calling attention to pertinent information.
5. Spacing.
Not only can you adjust how far apart each of your elements are, you can also play with the spacing of each of your paragraphs, your headers – even your letters.
While it may seem too minute of an element to worry about, the amount of space left on your website actually plays a big role in how it looks, feels, and works. No, you don’t want loads of empty space, but the right amount of white space can prevent your website from feeling too busy, too crowded, and too overwhelming.
So much more goes into a great website design for lawyers and attorneys than you probably realized. And, while it’s possible to improve your current website on your own, the best results come from working with a team of industry professionals.
If you want help developing a great visual hierarchy for your website, contact our team at FreshySites today!
