Читать книгу WordPress 24-Hour Trainer - Plumley George - Страница 10

The final list you should make in planning your website is the visual elements of the site. When choosing a theme for WordPress, this list can help focus the process.

Site Design

The first part of this list should be a series of URLs for websites you like the look of. Along with the web address of the site, be sure to write a short note about which elements you liked in particular, such as “open, airy feeling with lots of white space” or “dark, textured background in the footer.” Not all the elements may fit together well, but with modifications or eliminations, the result should be a good picture of what you're looking for.

The best place to begin your search is with competing websites. It can help you to spot trends within your field, either to incorporate them or to deliberately break away from them. After that you can expand your search to sites of any kind. If you make this a habit during your normal web surfing, you can build up a good collection of sites with not much additional effort.

Hopefully, there will be a few sites whose overall look would be good candidates for yours. This can make the process much easier than trying to piece together a site design only from elements on numerous sites.

Two elements are particularly important to pay attention to when looking through all these sites: color schemes and typography. They have become increasingly important as web design has become more minimalistic. If you have a logo or company colors, watch for color schemes that match or complement them. Don't worry about finding color codes at this point. Lesson 27, “Overview of WordPress Themes,” discusses tools for grabbing those. If you don't have a company color to work with, focus on the effect of the color scheme on the mood of your site: professional versus light-hearted versus folksy, and so on.

When looking for great typography on sites, don't simply pay attention to the font. It's only one element of typography. Watch for easy-to-read font sizing, comfortable spacing between letters, lines, and paragraphs, and the overall look of the type on the screen. Font color and the color of links is another part of readability on the web. Again, just make notes along with the URL of the site – the tools for finding technical details, such as the name of a font or the font sizing, spacing, and so on will be discussed later.

What's been said so far concerns the common design governing all the pages on your site, but there's one page that needs its own examples and notes: the homepage. This is your business's introduction to the world and it needs to stand out. That doesn't mean a lot of fancy graphics (though if that would benefit your business, by all means), but it does mean more color, more images, wider variations in typography, and more elements that require design.

One word of warning as you make your way through all these sites: Don't get caught up in the magpie effect: being dazzled by bright, shiny objects. From time to time you'll see, for example, a cool animation and think, I need that. Sometimes, though, these effects that impress us on first glance become annoyances when you see it on every page of the site or every time you return to the homepage. Be dazzled, by all means, but don't rush it to the top of your design list.

Site Layout

In the broadest sense, there isn't much to think about for site layout: header, content, footer, and probably a sidebar. Perhaps the sidebar is on the right instead of on the left, but what more is there to say about site layout? Of course, there's a lot more to say when you start filling in the details of these broad areas of the site. And if it sounds like you already went through this with the page map earlier in this lesson, that was simply about what common content is planned for all web pages. Now you're concerned with positioning that content.

A drawing is going to be the most effective way to visualize the layout and again, while a hand-drawn outline is fine, Figure 2.4 has been done with presentation software:

Figure 2.4

Armed with an outline like this you'll have another set of criteria when eventually looking for a WordPress theme. Either the theme will have a layout close to this or the capability for you to easily customize areas of the site to match your vision. Not that you can't change your mind as you go along, but you'll have something to change.

Now there's one other important element of site layout you'll want to plan for: the homepage. Because it's meant to be an introduction to your business, it needs a different layout. In some cases the layout may not be all that different, but typically it takes on a different form, as illustrated in Figure 2.5.

Figure 2.5

The goal here is to quickly convey the key benefits of what you're offering and guide the visitor to the areas of the site with more details. The flow of the layout and where it draws your eye becomes important. You don't want to overwhelm the visitor.