ANL - Video Stream TV App

1. Navigation – About Us Dropdown Behavior¶

User Story

As a visitor,
I want the About Us menu in the navigation bar to show dropdown options on hover,
So that I can directly navigate to Management or ANL Culture & Core Values pages.

Acceptance Criteria

• “About Us” must appear in the main navigation bar.
• On hover (desktop view), dropdown must display:
  • Management
  • ANL Culture & Core Values
• On click of:
  • About Us → Navigate to About Us page
  • Management → Navigate to Management page
  • ANL Culture & Core Values → Navigate to respective page
• Dropdown must not flicker.
• On mobile view:
  • Dropdown must expand on click (not hover).
  • Submenus must be clearly visible and clickable.
• No broken links.
• URLs must be SEO-friendly.

2. About Us Page (Static Content)¶

User Story

As a visitor,
I want to read detailed information about the company,
So that I can understand its background and operations.

Acceptance Criteria

• Content must be static.
• Content must match exactly with the old website (no text changes).
• Proper formatting must be preserved (paragraphs, headings, spacing).
• Page must contain breadcrumb navigation:
  • Home > About Us
• Header and footer must be consistent with Home page.
• Proper heading hierarchy (single H1).
• Images (if any) must include alt text.
• Fully responsive layout.
• No layout breaking on smaller screens.

3. Management Page (Static Content)¶

User Story

As a visitor,
I want to view details about the company’s management,
So that I can understand leadership information.

Acceptance Criteria

• Content must be static.
• Content must be exactly the same as the old website.
• Proper profile structure (Name, designation, description).
• Images must not distort.
• Alt text required for profile images.
• Breadcrumb:
  • Home > About Us > Management
• Header and footer must be available.
• Responsive card or structured layout.
• No overlapping content in mobile view.

4. ANL Culture & Core Values Page (Static – YouTube Videos)¶

User Story

As a visitor,
I want to view ANL Culture & Core Values videos,
So that I understand the company’s cultural principles.

Acceptance Criteria

• Page content must be static.
• YouTube videos must be embedded properly.
• Videos must load correctly.
• Clicking play must open video within page (embedded).
• Videos must be responsive (resize properly in mobile).
• Breadcrumb:
  • Home > About Us > ANL Culture & Core Values
• No broken YouTube links.
• Proper video titles displayed.
• No autoplay unless required.
• Page load should not be heavily delayed due to video embedding.

5. Breadcrumb Navigation (Common Requirement)¶

User Story

As a visitor,
I want breadcrumb navigation on inner pages,
So that I understand my location within the website.

Acceptance Criteria

• Breadcrumb must appear below header on all inner pages.
• Format examples:
  • Home > About Us
  • Home > About Us > Management
• Each breadcrumb item must be clickable (except current page).
• Breadcrumb must be SEO-friendly.
• Proper spacing and alignment.
• Responsive layout.

6. Common Header & Footer (Across All Pages)¶

User Story

As a visitor,
I want consistent header and footer across all pages,
So that navigation experience remains uniform.

Acceptance Criteria

• Same header as Home page.
• Same footer as Home page.
• Footer links must be functional.
• No duplication of content.
• No layout inconsistencies between pages.

Global Non-Functional Requirements¶

SEO Requirements¶

• Unique meta title for:
  • About Us
  • Management
  • ANL Culture & Core Values
• Unique meta description per page.
• Single H1 per page.
• Structured H2/H3 hierarchy.
• Image alt attributes mandatory.
• Sitemap.xml must include all pages.
• Robots.txt configured.
• No duplicate content errors.

Performance¶

• Page load time under 3 seconds.
• Embedded YouTube videos must not block initial page rendering.
• No console errors.
• No broken links.

Responsiveness¶

• Fully responsive for:
  • Mobile
  • Tablet
  • Desktop
• Dropdown must work properly in mobile.
• No horizontal scrolling.
• No UI misalignment.