Website Best Practices

accessibility basics

Headings

When we look for content on websites or in documents, we don't read every word. We skim until we find the information we are looking for. Headings makes this process easier. Just as visual users use headings to navigate, so can adaptive technologies such as screen readers.

• Headings should use concise and meaninful language, letting a user know exactly what they will find on any given page/section.
• Headings provide structure, readability, and scanibility to your content, so they should create an outline of your content.
• REQUIRED: One (and only one) heading 1 per page.
  • Think of a heading 1 as a chapter title, reflective of an overall view of the content found on the page.
  • Headings must be hierarchical and follow content structure.
    • Heading 2 is used for main sections of your page
    • Heading 3 is subsections of main sections
    • Headings 4-6 are subsections of the previous subsections.
• You can use as many headings as needed - but if your page has too many headings, consider breaking the content into separate pages, or a use a different layout to minimize scrolling.

accessibility basics

Tables

Info about tables here with do and don't examples.

accessibility basics

Video/Audio

Info about accessible media here.

search engine optimization (seo)

What is Search Engine Optimization

Search engine optimization is the process of improving your website content to increase visibility on search engine results pages (SERPs).

A common question we get asked is “how do I get my content to show up in Google?” The answer is search engine optimization (SEO).

How do we help?

First and foremost, your website lives on the Fullerton domain (fullerton.edu). The Fullerton domain is a known and trusted entity, so search engines will crawl your site. We also build in site maps and use a robots.txt file to let search engines know what to look for.

What can you do?

You are the architect of your content. Writing good content, using concise and meaninful language filled with keywords and phrases that are relevant to your site is your number one priority for boosting your search engine score. Below are some tips and tools to get you started.

search engine optimization (seo)

Quality Heading Text

Headings are used to introduce the content that appears below them. Headings should be used hierarchically, and appropriately.

• Use only one heading 1 to introduce your content
• Heading 2 is for main sections
• Use headings 3-6 as needed to denote subsections, but always keep them in order
• A scan of headings should provide an outline of what the content contains.

Not only do headings make your content easily digestible for your users, search engines like them. Search engines place a higher score on text in headings. Headings should use concise and meaningful language with keywords or phrases that are reflected in your content. However, avoid cramming a bunch of keywords into headings without paragraphical content to back it up on the page. This is known as keyword stuffing. That includes making a large sentence or an entire paragraph into a header. It is confusing and also unattractive. Poorly used headings not only put your users at a disadvantage, but it can also lower the quality of your search engine score.

RECAP:

• Headings provide structure, readability, and scanibility to your content. Also, search engines like them!
• DO use headings appropriately, using concise and meaningful text with keywords that accurately reflect your content.
• DO use keywords in your headings that accurately reflect your content.
• DO NOT just shove a bunch of words into headings that are not repeated in your text.
• DO NOT make an entire sentence a heading. Search engines may penalize you for doing so.

search engine optimization (seo)

Quality Link Text

Link (or anchor) text is the text that links to another page, either within your own site, or to an external site.

When linking to another resource outside of your own site, you are providing information to search engines about the content on the site you are linking to. When other's link to you, they are providing information about your website. While you cannot control how others link to you, you can optimize your link text for internal links (links to other pages within your own website).

Optimized link text should contain concise and meaningful, keyword rich language that is relevant to the target page. Try to be consistent across your site when linking to the same resource from multiple pages. Link text is best when it includes keywords or phrases that are found on the target page. When using an image as a link, the image description (or alt tag) is what will be read as the anchor text by search engines, screen readers, and will be visible if your image fails load. Dot not use text such as click here or read more. That is generic text that lacks meaningful context as to what the target of the link is, and will not help your search engine score.

RECAP:

• DO use descriptive and meaningful link text that reflects the content of the target page.
• DO use clear language that benefits both users and search engine results.
• DO NOT use generic language or words that do not appear on the linked page.

search engine optimization (seo)

Quality Page Titles

HTML documents contain a title attribute. In the page properties of each of your pages contains parameter to add a title. Our templates use the text that you provide in that title box. We add your site name, along with CSUF, and that becomes the HTML document title. This is the text that will show up linked when it comes up in search engine results. Poorly written or absent titles can hurt your search engine score, or if your page does come up in a search, a user may overlook your site when the linked title doesn't quickly reflect your content.

It is recommended that you use the concise and meaningful text from your heading 1 on each page (or something close to it) as your title. This repeats the main purpose of the page and adds to your overall search score. It helps search engines know what your content is about, and assures searchers that they have found what they are looking for. Titles that contain language that uses keywords that are found in your headings and in your text will serve you best.

Avoid titles that are too short or not descriptive. Conversely, avoid titles that are too long, as they will be truncated in search engine results. Avoid repeating words (i.e. "We have the best program, Number 1 program, Join the best program!") as well as generic titles such as "Home."

Finally, avoid duplicate titles on your website. If you have two pages providing resources, be specific in the title and header as to what the resources are for.

YES: Using Current Student Resources and Prospective Student Resources as titles for each specific page

NO: Using only Resources for both

RECAP:

• DO make sure you add a title on your pages.
• DO use concise and meaningful language, repeating (or closely mirroring) the text found in your heading 1.
• DO NOT use titles that are too short, too long, or are generic or non-relevant to your content.
• DO NOT keyword stuff your titles.

search engine optimization (seo)

Quality Page Text (Content)

The words on your page should use meaningful and relevant words and phrases that your users are searching for. Sometimes we get asked why a site is not coming up on a search for "some keywords." We will take a look at the copy (body text) and often find that they are not even using those words in their text, or if they are, they are only used once and are not repeated in a heading, page title, or link text.

Aligning your content with your page title, headings, and link text is what is known as on-page SEO. It is the practice of pulling all of the elements together in a meaningful way. When your content uses keyword rich text, containing words and phrases that reflect accurately the message of your website, search engines take notice. Your score is built upon your content pulling all of the other elements together. This is the heart of good search engine optimization.

However, do not just stuff a bunch of keywords into your copy without reason. Less is more! You will lose a user's focus if they feel overwhelmed by large amounts of unnecessary text, as well as possibly lowering your search engine score (see more in the Keyword Density section). Create pages such as "history" or "about this program" to add additional keyword rich text. This could help bring users to your site without cluttering your more salient content.

RECAP:

• DO write content that is rich with keywords and phrases that are relevant to what users are searching for.
• DO use your headings, page title, and link text in a way that repeats the primary focus of each page.
• DO NOT keep repeating keywords unnecessarily as this can actually lower your score.

search engine optimization (seo)

Keyword Density

Keyword density is the percentage that words and phrases show up on a particular page. You can get flagged for keyword stuffing, meaning a word or phrase that is repeated too often on any page. There are keyword density tools out there that allow you to input your URL, or even paste text that you are working on, and then evaluate it. It will show you 1 word, 2 word, and 3 word results (usually just the 5-10 highest) and let you know if it looks over optimized.

You don't want any one keyword or phrase to exceed more than 5% density. The sweet spot is a density score of 2% to 4%.

NOTES:

• DO NOT be alarmed if common words and phrases that may not be your keywords also show up on a keyword density scan. These types of programs aren't always smart enough to understand irrelevant word combinations. However, this can help you see if you are overusing a turn of phrase, and allow you to fine tune your content.
• DO pay attention to the words and phrases you want your content to be known for!

search engine optimization (seo)

Meta Descriptions

A meta description is a snippet of text that appears below the title of your web page in web search results. It is what lets users know what your page is about and why they should visit it. If you do not have a meta description, Google and other search engines will highlight content on your page that contain the keywords users searched for.

Here are some tips for writing a good meta description:

• Keep it short and sweet. Your meta description should be 155 characters or less.
• Use keywords. Include your keywords that are found on your page in your meta description.
• Be descriptive. Tell searchers what your page is about in a few sentences.
• Be accurate. Make sure your meta description accurately reflects the content of your page.
• Be unique. Each page on your website should have a unique meta description.

Here's an example of a good meta description:
"Learn how to write a good meta description in this comprehensive guide. Includes tips for keeping it short, sweet, and accurate."

RECAP:

• DO write descriptions that accurately summarize your page content.
• DO repeat your main key words in your description.
• DO NOT create one generic site description and use it on every page.

what is a website

What is a Website?

Websites are just folders and files that live on a computer. How you name your files and organize your pages is what creates website structure (and your URLs).

A website is a collection of web pages that is identified by a common domain name.

Websites can be created using a variety of tools and technologies. Here at Cal State Fullerton, we use Omni CMS (content management system). We provide templates and the CMS makes it easy to create and manage content without having to know any coding.

Once a website is created, it needs to be hosted on a web server. A web server is a computer that stores the website's folders and files and makes them available to visitors. Websites can be accessed by anyone with an internet connection. To access a website, you need to enter its URL address into a web browser. The URL address is the unique identifier for a website. For example, the URL address for Cal State Fullerton's website is www.fullerton.edu.

Once you have entered a website's URL address into a web browser, the browser will request the website's files from the web server. The web server will then send the files to the browser, which will display them on your screen.

How do we help?

We provide you with tools such as one on one content consultations as well as guides such as the one you are reading now.

What can you do?

Utilize the resources we provide and take the extra minute to make sure the files you create or upload are named and organized correctly. We understand the desire to be quick about things sometimes, but correcting a file name or file location later is more work down the line.

what is a website

Website Organization & Structure

Good website structure is one that is easy for users to navigate and understand. It should be logical and well-organized, with a clear hierarchy of pages. The structure should also be consistent throughout the website, so that users can easily find what they are looking for. Websites are organized by creating folders and files with meaningful names.

There are a few different types of website structures that can be used, depending on the needs of the website.

The most common type of structure is a hierarchical structure, which is organized in a tree-like format. This type of structure is well-suited for websites with a lot of content, as it allows users to easily drill down to the specific information they are looking for.

Another type of structure is a sequential structure, which is organized in a linear format. This type of structure is often used for websites that need users to follow a specific sequence, such as an online course, or for smaller sites.

Tips

• Start with a clear understanding of your audience. Who are you trying to reach with your website? What are their needs and interests? Once you understand your audience, you can start to organize your content in a way that is relevant and useful to them.
• Group related content together. This will make it easier for users to find the information they are looking for. For example, if you have a website about cooking, you could group recipes together by cuisine or course.
• Use a logical hierarchy. The pages on your website should be organized in a logical way, with each page linked to the pages that are most relevant to it. This will help users to find their way around your website and to understand the relationships between different pages.
• Use clear and consistent navigation. The navigation menu should be easy to use and should be consistent throughout the website. This will help users to find the pages they are looking for quickly and easily.

what is a website

Tab Navigation & Tab Naming

Tab navigation is a type of navigation that allows users to switch between areas within a website. In our templates, tabs are located at the top of the website in the header section and they are the main navigation for your site.

Tabs are best used when representing a high level of organization and linked to a directory (or folder). The folder may contain a single file, or several files that contain relevant information.

Tabs should be named clearly and be representitive of the content inside each folder. Be concise and meaningful when maing tabs. Tabs that are too wordy, or too many tabs, makes navigation confusing and cumbersome, and makes a website looked cluttered.

what is a website

Files & File Naming

File naming for websites is an important part of website development. The way you name your files can affect how users find your content, how search engines index your website, and how easy it is for you to manage your files.

DO

• Use lowercase letters, numbers, and dashes only. It's helpful to use a consistent file naming convention throughout your website. This will make it easier for you to manage your files and to find the files you need.
• Use descriptive names. The names of your files should be descriptive of the content they contain. This will help users to find your content more easily, and it will also help search engines to index your website more effectively.
• Keep file names short. File names with too many characters can be difficult to remember and manage.

Here are some examples of good file names for websites:

• about-us.html
• contact-us.html
• staff-at-retreat.jpg

By following these tips, you can create file names that are descriptive, easy to use, and search engine friendly. This will help to improve the user experience of your website and will ultimately lead to increased traffic and conversions.

what is a website

What is an index page?

An index file in HTML, most commonly named index.html, refers to the default webpage of a website/directory. It's the first file a web server displays when someone visits the website without specifying a specific page.

The index page is automatic loading. Web servers are configured to look for a file named "index.html" inside a directory of a website. If they find it, they automatically show it to the visitor without needing them to type the file name in the URL.

Your first page must have the file name of index, as well as the first page in every directory (folder) of your website. This helps to create neat and memorable web addresses (URLs).

When linking to an index file, select the directory for linking and not the index file itself.

what is a website

Left Navigation Files

Left navigation files are a type of navigation that is used per directory/folder on a website. It is used to allow users to navigate to the pages within that folder. Our tab navigation file allows for extended navigation, meaning that selecting a tab will extend a list of all pages that are available in that folder. Some may prefer to use left navigation for directory navigation instead of extended navivation, or they may prefer extended navigation only, or they may use both. It is up to the individual site owner/creator which method would be best for their audience.