HTML Dashboard¶
The dashboard generator creates a self-contained HTML report with colour-coded grades, progress bars, and a filterable findings table.
Usage¶
python scripts/generate_html_dashboard.py \
--scores scores.json \
--url example.com \
--output-dir ./reports
Options¶
| Flag | Default | Description |
|---|---|---|
--scores |
Required | Path to scores JSON |
--url |
Required | Site URL for the report header |
--output-dir |
./reports |
Directory for the HTML file |
--client-facing |
false |
Transform jargon to plain English |
--title |
Auto | Custom report title |
Features¶
The generated dashboard includes:
- Overall grade with colour coding (A=green, B=blue, C=yellow, D=orange, F=red)
- Category scores with progress bars
- Findings table sortable by priority, module, and effort
- Priority distribution chart
- Module coverage indicator showing which modules ran
- Responsive layout that works on desktop and mobile
Self-Contained¶
The HTML file is fully self-contained -- all CSS and JavaScript are inlined. No external dependencies or CDN links. You can email the file, host it on a web server, or open it directly in a browser.
Client-Facing Mode¶
With --client-facing, the dashboard:
- Replaces technical terms with plain English (e.g. "HSTS" becomes "browser security header")
- Converts priority labels (P0 becomes "Urgent", P3 becomes "Nice to have")
- Strips code blocks from fix suggestions
- Uses simpler language throughout
This is ideal for sending to non-technical stakeholders or clients.
Example¶
# Generate a client-facing dashboard
python scripts/generate_html_dashboard.py \
--scores scores.json \
--url mysite.com \
--output-dir ./client-reports \
--client-facing \
--title "Monthly Website Health Report"
The output file is named {url}_dashboard.html (e.g. mysite.com_dashboard.html).