This is a basic guide for deciding what content you should include on your website, understanding what format it should be in, and how to organize it.
Pages
Here are some commonly used pages, which you can use as a starting point for ideas.
- Home
- The home page is typically the most important page, as it’s the first impression most people get when visiting your site for the first time.
- Start Here
- If you have a lot of content, such as a blog or podcast centered site, you may want a “Start Here” page to introduce yourself, show a list of your categories, and/or highlight your most popular pages/posts/episodes.
- Products
- Services
- Pricing / Plans
- Shop / Store
- FAQ
- A long FAQ can be organized as an “accordion”, with a list of clickable questions. When a question is clicked, it expands to show the full answer.
- Testimonials / Case Studies
- Adding photos looks better than plain text, and adds credibility.
- Blog / Articles / Resources
- Sign Up / Join
- About
- Contact
- Privacy Policy
- Terms of Service
If you have a small logo and few navigation items, you may want to have them on the same line, with the logo on the left and the navigation on the right. Otherwise, you can have the navigation menu on its own line. While there’s no limit to the number of items you can have in your navigation menu, and no limit to the number of lines of navigation, it’s best not to overwhelm your visitors and make it easy for them to find what they want.
Remember that you can have navigation items as sub-menus, and multiple levels of sub-menus. You don’t necessarily have to include all pages in your navigation menu. You may have some pages that are less important, which you can simply link from the content of other pages on the site.
If getting people on the phone is an important objective, adding your phone number to the header (usually in the upper right) is an effective best practice.
All sites should have a footer, typically a line with the following:
- Copyright notice (i.e. “Copyright (C) [YEAR] [BUSINESS NAME]. All rights reserved.”)
- Privacy Policy
- Terms of Service
Depending on your site, you may want to include some more items above this bottom line. You typically want 2-4 columns, which may include items such as:
- Additional navigation menu (either identical to the main navigation or different)
- List of recent blog posts
- Social media account icons
- Company address
- Email opt-in box
- Company or website tagline
- Call to action button
Sidebars are commonly found on blog posts, and rarely on pages. Typically, the sidebar is located on the right. Some common sidebar widgets (elements):
- Search box
- Email opt-in box
- List of recent blog posts
- List of blog categories
- Social media account icons
- Ads and affiliate links
- Call to action button
Page Content / Materials
Text. Large walls of text are often skimmed over by visitors. To make it easier for people to read your content, here are some tips. Use headings, bulleted or numbered lists, occasional images, links, blockquotes, and formatting such as bold and italic. Make sure your paragraphs aren’t too long.
Background images. If you have content over a background image, make sure there is enough contrast to read the text. You typically want a darker image as the background (or at least the part of the image where the text covers), and the text to be white or a bright color. For a light background image, use a strong color (not black). You can use an overlay to darken or lighten the image, or give it a color tint. Also, keep in mind how the content and image should look on various screen sizes, especially if you are using an image that includes people. You don’t want text covering people’s faces. If you keep the text very short, you can keep the text in the same position on mobile devices and it won’t be too small to read. Or you can hide or move the text above or below the image when the website is below a certain screen size.
Image upload sizes. Generally, you want to resize images to the largest dimensions that they are being displayed on your site. If you use an image that’s smaller than the dimensions it’s being displayed at, and stretch it to be larger, it will be distorted. If you use an image that’s larger than the dimensions it’s being displayed at, it will look the same. However, this affects your page loading time and can have an impact on your search engine rankings (load time is a Google ranking factor). So you should avoid using images that are larger than necessary. Large, full-screen background images will have different dimensions depending on your visitor’s screen size. As a general rule of thumb, for full-screen images, I use a width of 1920 pixels. While there are some people with wider screens than that, it’s not worth losing search engine rankings to provide a slightly sharper image to a small percentage of people with very large screens.
Image source files. For logos or any other images modified in a design program, you’ll want to include the source files (i.e. PSD or EPS files) for reference. If the images need to be modified or resized, you typically want to start with the source files to avoid distorting them.
Video. In virtually all cases, you don’t want to upload videos to your website directly. You’ll want to upload them to a 3rd party service such as YouTube, Vimeo, or Wistia, and embed the video player on your site. If you’re offering them as downloadable files, you should use Amazon S3. Streaming or downloading videos uses a lot of bandwidth, and if you’re doing it from your own site, your bandwidth allocation from your host can get used up quickly, and your site could be shut down or your traffic throttled.
Once you’ve uploaded your videos to a 3rd party service, you’ll just need the URLs to embed them on your site.
Audio. This is typically the same case as video. However, if it’s just small files, and not something a lot of people will listen to (i.e. a podcast), then you can probably get away with uploading them to your site. For audio hosting (especially podcasts), you may want to look into Libsyn, Blubrry, or SoundCloud.
Downloadable files. Typically, if you have documents you want people to download, you should offer them in PDF format, which is universally readable. If you need to offer them in a proprietary format, such as .doc or .docx, make sure you save it as a .pdf as well.
