✅ ANGULAR UI SEO DEVELOPMENT GUIDELINES

Purpose: This document defines mandatory SEO standards for Angular UI development. It must be followed by all UI developers working on public or SEO-indexed pages.


1️⃣ Project-Level Architecture (Foundation)

1.1 Rendering Strategy

SEO pages must return fully rendered HTML when viewed using “View Page Source”.

1.2 Page Classification

Page TypeSSR Required
HomeYes
About / CompanyYes
Product / ServiceYes
Blog / ContentYes
Login / DashboardNo
---

2️⃣ Routing & URL Structure

2.1 URL Rules

Good: /jewelry-erp/inventory-management
Bad:  /#/inventory?id=12

2.2 Angular Router Configuration

RouterModule.forRoot(routes, {
  useHash: false,
  scrollPositionRestoration: 'enabled'
});
---

3️⃣ HTML Structure & Semantics

3.1 Heading Rules

3.2 Semantic HTML (Mandatory)

<header>
<nav>
<main>
<section>
<article>
<footer>
Avoid using <div> for layout where semantic tags are applicable.
---

4️⃣ Meta Tags & SEO Head Management

4.1 Dynamic Title & Description

this.title.setTitle('Jewelry ERP Software | Inventory & POS');
this.meta.updateTag({
  name: 'description',
  content: 'Cloud-based jewelry ERP with inventory, POS, and accounting.'
});

4.2 Canonical URL

<link rel="canonical" href="https://www.example.com/page-url">
---

5️⃣ Content Visibility Rules

---

6️⃣ Image SEO Standards

6.1 Image Naming

6.2 Alt Text

<img src="inventory.webp"
     alt="Jewelry ERP inventory management dashboard">

6.3 Performance

---

7️⃣ Performance & Core Web Vitals

7.1 Build Rules

ng build --configuration=production
---

8️⃣ Structured Data (Schema)

<script type="application/ld+json">
{
 "@context": "https://schema.org",
 "@type": "SoftwareApplication",
 "name": "Jewelry ERP",
 "applicationCategory": "BusinessApplication"
}
</script>
---

9️⃣ Sitemap & Robots

9.1 Sitemap

9.2 Robots.txt

User-agent: *
Allow: /
Sitemap: https://example.com/sitemap.xml
---

🔟 Accessibility = SEO

---

11️⃣ Common SEO Mistakes

---

12️⃣ Final Release Checklist