Report loading
calgarywatch.ca
Preparing the full page inventory and screenshots.
Report loading
Preparing the full page inventory and screenshots.
Poor
Health Score
Score by category
The headline health score combines page-level quality and site-wide repeat patterns, then stays anchored to the weakest visible category so it never looks worse than every category beneath it.
Section 01
The Calgary Watch web application suffers from critical server-side latency and security vulnerabilities that undermine its mission as a real-time safety utility.
The site establishes a professional, high-trust brand identity through a modern dark theme with high-contrast accents and effective visual hierarchy. On both desktop and mobile, the implementation of WebApplication JSON-LD schema is technically sound, and the use of semantic HTML landmarks ensures strong foundational accessibility for screen readers. The primary call-to-action placement is highly optimized for conversion, providing users with an immediate, intuitive path to the live map.
However, severe performance bottlenecks and security gaps threaten user retention and data integrity. On desktop, a high Time to First Byte (TTFB) of 1.42s and significant render-blocking resources drive the Largest Contentful Paint (LCP) well beyond Google's recommended thresholds. This sluggishness is even more pronounced on mobile, where LCP reaches 3.39s. Furthermore, the site lacks essential security headers, including a Content-Security-Policy and Strict-Transport-Security, and fails to redirect HTTP traffic to HTTPS, leaving users vulnerable to man-in-the-middle and injection attacks.
The greatest opportunity lies in optimizing the delivery pipeline to achieve "Good" Core Web Vital ratings. By addressing the 2.6 MB page weight and resolving render-blocking resources, the application can significantly reduce LCP and improve perceived reliability. Implementing explicit width and height attributes for images will also eliminate layout shifts that currently degrade the user experience during page load.
First 30 Days
<head>.5 highest-impact findings, ranked.
No HSTS header. Users are vulnerable to protocol downgrade attacks.
How to fix: Add: Strict-Transport-Security: max-age=31536000; includeSubDomains; preload
On /
The Largest Contentful Paint (LCP) is 3392ms, which exceeds the Google-recommended threshold of 2.5s. This delay in rendering the primary hero content can lead to higher bounce rates as users perceive the site as slow.
How to fix: Optimize the hero image (`/images/calgary2.jpg`) by using modern formats like WebP or AVIF and ensuring it is properly sized for mobile viewports. Additionally, check if any render-blocking CSS or JS in the `<head>` can be deferred to improve FCP.
On /
The LCP is 2984ms, which exceeds the Google-recommended threshold of 2.5s. This delay is driven by a high Time to First Byte (TTFB) of 1415ms and significant render-blocking resources in the head.
How to fix: Optimize server response time to reduce TTFB below 800ms. Additionally, consider using modern image formats like AVIF for the hero background and ensure critical CSS is inlined to improve FCP (2068ms).
On /
No CSP header found. The site is vulnerable to XSS and injection attacks.
How to fix: Add a Content-Security-Policy header. Start restrictive: default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'
On /
Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds. Fix any of the following: Element has insufficient color contrast of 3.34 (foreground color: #ffffff, background color: #4a90d9, font size: 10.5pt (14px), font weight: bold). Expected contrast ratio of 4.5:1
How to fix: Element matching `.md\:flex.shadow-blue-500\/20.hover\:bg-blue-500` has contrast ratio 3.34; WCAG AA requires 4.5:1. Increase the contrast between foreground and background colours (the Tailwind hint below proposes the next darker step in the same family if the offending class is a recognised palette utility). Reference: https://dequeuniversity.com/rules/axe/4.11/color-contrast?application=playwright Tailwind hint: `bg-blue-500` (#3b82f6) is on a dark background (#4a90d9); no lighter step in the `blue` family passes 4.5:1 — switch to a higher-contrast colour family (e.g. `white`, `zinc-50`, `zinc-100`) or increase font weight to qualify as "large text" (3:1 threshold).
On /