Content Creation Fundamentals

Unique Titles and Headings

1. Use Descriptive Titles
   • Ensure each web page and document has a unique and descriptive title. For example, instead of "Page 1," use "Introduction to Accessible Design."
2. Hierarchical Headings
   • Apply headings in a logical order (H1, H2, H3, etc.). For instance, use H1 for the main title, H2 for section titles, and H3 for subsections. Avoid skipping heading levels to maintain a clear structure.
3. SEO Benefits
   • Proper use of headings not only aids screen reader users but also improves Search Engine Optimization (SEO) by making content easier to index.

Organized Content

1. Short Paragraphs
   • Break content into short, manageable paragraphs to reduce cognitive load. For example, instead of a long block of text, use multiple paragraphs with clear breaks.
2. Lists and Tables
   • Use bullet points or numbered lists to present information clearly. For instance, list steps in a process or key points in a summary. Use tables for data, not for layout, to ensure screen readers can interpret the information correctly.

Plain Language

1. Avoid Jargon
   • Use simple, clear language that is easy to understand. For example, instead of "utilize," use "use."
2. Define Acronyms
   • Spell out acronyms the first time they appear, followed by the acronym in parentheses. For example, "Web Content Accessibility Guidelines (WCAG)."
3. Short Sentences
   • Keep sentences concise to enhance readability. For instance, "Ensure all images have alt text" is clearer than "It is important to ensure that all images included in the content have alternative text descriptions."

Support Scanning

1. Use Headings and Subheadings
   • Break up content with headings and subheadings to help users scan and find information quickly.
2. Highlight Key Information
   • Use bold or italics to emphasize important points, but avoid overusing these styles as they can reduce readability.

Clear and Unique Link Text

1. Descriptive Links
   • Write link text that clearly indicates the destination or action. For example, instead of "Click here," use "Read our accessibility guidelines."
2. Contextual Clarity
   • Ensure link text makes sense out of context. Screen reader users often navigate by links alone, so "Read our accessibility guidelines" is more helpful than "Click here."

Distinctive Links

1. Visual Distinction
   • Make links visually distinct from other text using color and underlining. For instance, use a different color for links and underline them to ensure they stand out.
2. Consistent Styling
   • Apply consistent styling to all links to help users recognize them easily.

Meaningful Alt Text

1. Descriptive Alt Text
   • Provide alt text that describes the content and function of the image. For example, for an image of a chart showing sales growth, use "Chart showing a 20% increase in sales from 2023 to 2024."
2. Contextual Relevance
   • Ensure the alt text provides context on how the image relates to the surrounding content. For instance, "Photo of NJIT campus during spring" for an image on a page about campus life.

Keep It Simple

1. Concise Descriptions
   • Keep alt text simple, helpful, and descriptive. Avoid overly complex descriptions that can overwhelm users.
2. Functional Images
   • For functional images like buttons or icons, describe their action. For example, "Search button" for a magnifying glass icon.

High Contrast Ratios

1. Contrast Standards
   • Ensure a minimum contrast ratio of 4.5:1 between text and background for normal text, and 3:1 for large text (18pt and larger, or 14pt and bold) as per WCAG guidelines.
2. Practical Example
   • Use dark text on a light background or light text on a dark background. For instance, black text on a white background provides excellent contrast.

Avoiding Color-Only Indicators

1. Multiple Indicators
   • Do not rely solely on color to convey information. Use additional indicators such as text labels, patterns, or shapes.
2. Practical Example
   • Instead of using red text alone to indicate an error, use red text with an error icon or the word "Error" to ensure the message is clear to all users.

Structure and Readability

This table provides a structured overview of the essential elements and advantages of accessible design, along with actionable steps to achieve it.

Introduction to Accessible Design (H2) Why Accessibility Matters (H3) Accessibility ensures that all users, including those with disabilities, can access and benefit from digital content. Benefits of Accessibility (H4) Improves user experience Enhances SEO Complies with legal requirements How to Implement Accessibility (H3) Follow these steps to make your content accessible: Use descriptive titles and headings. Write in plain language. Provide alternative text for images.

Descriptive Links

For more information on accessibility, visit our accessibility guidelines.

Alt Text

Chart showing a 20% increase in sales from 2023 to 2024

High Contrast Text

Black text on a white background.

Multiple Indicators

Error: Please enter a valid email address. ⚠️