Example SOP with Images

This is a demonstration of how to include images in your Standard Operating Procedures.

Process Overview

The following flowchart shows the general process flow for request handling:

Figure 1: Standard request processing workflow

Step-by-Step Instructions

Step 1: Initial Assessment

Review the incoming request and determine if it meets our standard criteria.

Step 2: Decision Point

Based on your assessment, decide whether to approve or reject the request as shown in the flowchart above.

Step 3: Documentation

Document your decision and any relevant notes in the system.

Visual Examples

Using Different Image Formats

You can include various types of images in your SOPs:

• Flowcharts and Diagrams: Use SVG format for scalable graphics
• Screenshots: Use PNG format for clear text and UI elements
• Photos: Use JPEG format for photographs
• Icons and Simple Graphics: Use PNG or SVG formats

Image Sizing Examples

Default Size Image

Custom Sized Image (HTML)

The same image shown at 75% size

Linked Image (Click to View Full Size)

Best Practices for Images in SOPs

1. Always include alt text for accessibility
2. Use descriptive file names that make sense
3. Organize images in logical folders
4. Optimize file sizes for faster loading
5. Test images in both desktop and mobile views

Troubleshooting

If images don’t appear:

1. Check that the file path is correct
2. Verify the file exists in the expected location
3. Ensure the file extension is supported (.jpg, .png, .svg, etc.)
4. Clear your browser cache and refresh the page

Additional Resources

For more detailed information about adding images to your documentation, see the Adding Images to Documentation guide.