ANGULAR SEO AUDIT · CSR DETECTION · SSR MIGRATION · AI VISIBILITY
Free Angular SEO Audit
Default Angular renders entirely in the browser — Googlebot gets an empty shell. DeepSEOAnalysis detects Angular CSR apps, confirms whether Angular Universal or @angular/ssr is active, and surfaces the exact steps to fix metadata coverage, URL structure, sitemap generation, and AI visibility.
WHAT WE CHECK
6 Angular-specific SEO checks
Angular CSR is one of the most SEO-damaging framework configurations — the audit identifies it immediately and provides Angular-specific SSR migration steps, Meta service patterns, and build-time sitemap approaches.
Client-side rendering gap (the critical Angular SEO issue)
Default Angular compiles to a JavaScript bundle that runs entirely in the browser. The raw HTML response Googlebot receives on first request is a near-empty shell: `<app-root></app-root>` with no page content, no H1, no metadata, and no structured data — just the JavaScript bundle references. Content only appears after the Angular runtime downloads, parses, bootstraps, and renders the component tree. This two-wave rendering process puts Angular CSR pages in Google's secondary rendering queue, which can delay indexing by days or weeks. The audit fetches every page with JavaScript disabled to check for this: pages that return `<app-root></app-root>` or similar empty content shells are flagged as client-side rendered with Angular-specific SSR migration steps via `ng add @angular/ssr` (Angular 17+) or `@nguniversal/express-engine` (Angular 16 and earlier).
Angular Meta service metadata coverage
Angular provides `Title` and `Meta` services (from `@angular/platform-browser`) for setting page-level metadata programmatically. These must be called in each component's `ngOnInit()` or `constructor()` to set per-route metadata: `this.titleService.setTitle("My Page | Brand")` and `this.metaService.updateTag({ name: "description", content: "..." })`. With Angular SSR, this runs server-side and the metadata appears in the initial HTML response. Without SSR, it only runs in the browser — meaning crawlers never see per-page titles or descriptions, only whatever is hard-coded in `index.html`. Common gaps: `index.html` has a generic `<title>Angular App</title>` that isn't overridden by the Meta service; `<meta name="description">` is absent from components; OG tags are static in `index.html` and don't update per route. The audit checks every crawled URL for a unique, populated title tag and meta description in the initial response.
Angular Router URL structure
Angular Router routes are defined in `app.routes.ts` (Angular 17+) or `app-routing.module.ts`: `{ path: "posts/:id", component: PostComponent }` produces numeric-ID URLs (`/posts/42`); `{ path: "posts/:slug", component: PostComponent }` produces clean slug URLs (`/posts/my-post-title`). The slug must be stored in your API model and resolved via the route param: `this.route.paramMap.subscribe(params => params.get("slug"))`. Angular Router also handles URL encoding — ensure slugs use hyphens (URL-safe) not underscores (less SEO-friendly) or special characters. Common gaps: `:id` used for content-heavy routes, no slug field on the API response model, and lazy-loaded modules with routes not covered in the static sitemap. The audit flags numeric-ID or non-keyword parameter patterns in crawled URLs.
Sitemap generation at build time
Angular has no built-in sitemap generator. For SSR apps: generate the sitemap at build time using a Node.js script that queries your API for all published content and outputs `src/sitemap.xml` as a static asset served from the Angular assets directory. Alternatively, generate it at the Express server level in `server.ts`. For static prerendering (`prerender: true` in `@angular/ssr` config): Angular can prerender known routes — add your sitemap URLs to `prerenderOptions.routes` in `angular.json` to ensure all pages get static HTML snapshots. Common gaps: the sitemap only includes hardcoded static routes and misses dynamically-generated content routes (blog posts, product pages); `lastmod` is the build timestamp rather than individual content updated dates; the sitemap URL isn't referenced as a `Sitemap:` directive in `src/assets/robots.txt`.
robots.txt and AI crawler access
Angular serves static assets — including `robots.txt` — from the `src/assets/` directory, which maps to the app root URL at `/robots.txt`. Place `robots.txt` in `src/assets/robots.txt` and Angular CLI builds it to `dist/[app-name]/browser/robots.txt`. The reverse proxy (nginx, Caddy) serving the Angular app must serve this correctly at the URL root. Common gaps: `robots.txt` is missing entirely (no file in `src/assets/`); Angular route paths are accidentally disallowed by broad wildcard rules; the Node.js Express server for Angular SSR (`server.ts`) needs an explicit route for `/robots.txt` if static file serving isn't configured; AI crawlers (GPTBot, ClaudeBot, PerplexityBot) are blocked. The audit checks the file at `/robots.txt` and all major AI crawler user-agents.
AI visibility for Angular apps
For Angular SSR apps: `llms.txt` goes in `src/assets/llms.txt` and is served at `/llms.txt` via Angular's assets pipeline. FAQPage JSON-LD is rendered server-side in the component template — add the structured data as a `<script type="application/ld+json">` DOM element in the component's template using Angular's `DomSanitizer` to bypass XSS escaping: `this.sanitizer.bypassSecurityTrustHtml(...)`. Article JSON-LD belongs in the blog post component. With Angular SSR, all JSON-LD rendered in component templates appears in the server-rendered HTML and is read by crawlers. For Angular CSR apps, JSON-LD rendered in components is completely invisible to crawlers — only JSON-LD placed directly in `index.html` (not useful for per-page schema) would be visible. The audit checks all five AI visibility signals with Angular SSR vs CSR context for each fix.
HOW IT WORKS
Audit your Angular app in 60 seconds
- Enter your Angular app URL. Works with any Angular deployment: Vercel, Netlify, Firebase Hosting, nginx on a VPS, Angular Universal on Node.js, or a CDN-served static build. No source code, TypeScript files, or CLI access needed — the audit crawls the live site.
- We crawl and analyse. The engine fetches each page with and without JavaScript to detect the CSR/SSR status, checks the Angular Meta service output in the raw HTML, validates JSON-LD structured data, tests robots.txt and AI crawler access, measures CrUX Core Web Vitals, and evaluates all five AI visibility signals.
- You get a prioritised report. Angular-specific issues first — CSR rendering gap, Meta service gaps in `ngOnInit`, missing SSR config, sitemap coverage gaps — then general SEO, each with the specific `@angular/ssr` command, `app.config.ts` pattern, or `angular.json` option to fix it.
FAQ
Questions about the Angular SEO audit
Does DeepSEOAnalysis detect Angular-specific SEO issues?
Yes. The engine detects Angular signatures — the characteristic `<app-root></app-root>` shell in raw HTML, Angular Universal SSR output patterns, and Angular Router URL structures — and surfaces framework-specific guidance alongside the 80+ general checks. Angular CSR apps that have not implemented Angular Universal are flagged with the specific SSR migration steps.
Is Angular bad for SEO?
Default Angular (CSR — client-side rendering) is bad for SEO: Googlebot receives an empty `<app-root></app-root>` shell and must wait for JavaScript to execute before content is visible — putting pages in the slower second-wave rendering queue. Angular with Angular Universal or the newer `@angular/ssr` package (Angular 17+) renders pages server-side and solves the core rendering problem. The audit distinguishes between Angular CSR (critical issue) and Angular SSR (passes rendering check).
How do I add SSR to an Angular app?
In Angular 17+: `ng add @angular/ssr` — this scaffolds server-side rendering via Express under the hood and updates `app.config.ts` with `provideClientHydration()`. In Angular 16 and earlier: `ng add @nguniversal/express-engine` which adds Angular Universal. Both approaches require running the app via a Node.js server (not as static files). After adding SSR, verify that crawled pages contain real content in the raw HTML response — the audit checks this directly.
Is the Angular SEO audit free?
Yes. The complete audit is free with no signup and no email gate. Paid plans add saved history, scheduled monitoring, larger crawls (up to 1,000 pages), and agency workflows.