Site Structure and Pages
The website contains all nine required pages, each accessible through a consistent navigation menu displayed at the top of every page. The pages are:
| Page | Purpose |
|---|---|
| Introduction | Introduces the topic of AI, includes the student name (Adrian Asogu), student ID (G00390947), and a full overview of what the site covers. |
| History | Covers the development of AI from the 1950s Dartmouth Conference through AI Winters to the current era of deep learning and generative AI. |
| Converging Technologies | Explains the six key technologies that power AI: Machine Learning, Deep Learning, NLP, Cloud Computing, Big Data, and IoT. |
| Leaders | Profiles and compares major AI companies including OpenAI, Google, Microsoft, NVIDIA, Meta, and Anthropic using tables and written analysis. |
| Market | Examines the financial growth, investment landscape, and sector-by-sector impact of the AI industry with data, tables, and market statistics. |
| Pros and Cons | Presents a balanced discussion of AI’s benefits and risks, including perspectives from researchers, workers, governments, and everyday users. |
| Conclusion | A personal reflection on the research findings, written in the student’s own voice as required by the brief. |
| Compliance | This page — documents how the website meets the project requirements. |
| References | Lists all sources used across the website in a consistent citation format. |
Design and Visual Styling
The website uses a custom dark theme with a consistent colour scheme and design language across all pages. This was achieved through custom CSS added via the WordPress Customiser.
Custom CSS Theme
A dark background (#081225) with white text and indigo (#818cf8) accent colours is used across the entire site. All cards, tables, highlights, and sections follow a unified design system using custom CSS classes.
Hero Banners
Every page features a full-width hero section with a background image, dark gradient overlay, page title, and subtitle. These create a professional, visually consistent entry point on each page.
Card-Based Layout
Content is presented using styled cards with rounded corners, borders, and hover effects (scale and glow on hover). These are used on the Introduction, Converging Technologies, and Market pages to organise information clearly.
Responsive Design
The site uses CSS Grid with auto-fit columns and clamp() font sizing to ensure content displays correctly on desktop, tablet, and mobile devices without requiring separate layouts.
Plugin Summary
| Plugin | Category | What It Does |
|---|---|---|
| Yoast SEO | Search Engine Optimisation | Analyses content for SEO, generates sitemaps, and manages meta tags for better search visibility. |
| LiteSpeed Cache | Performance | Caches pages, minifies code, and optimises images to make the site load faster. |
| Jetpack | Security & Analytics | Protects against attacks, tracks visitor statistics, and enables lazy loading of images. |
| Mx Chat | User Engagement | Adds an AI-powered chatbot widget, demonstrating a real-world AI application on the site. |
| Easy Table of Contents | Navigation & Usability | Auto-generates a clickable table of contents from page headings for easier navigation. |
| CookieYes | Privacy & Compliance | Displays a GDPR-compliant cookie consent banner, linking to the site’s discussion of AI privacy. |
Content Quality and Depth
Each page contains detailed, original content written specifically for this project. The site goes beyond surface-level coverage to include:
Comparison Tables
The Leaders page includes two detailed comparison tables covering AI products, market focus, open-source status, and company strengths. The Market and Pros and Cons pages also use tables to present structured data clearly.
Multiple Perspectives
The Pros and Cons page presents viewpoints from researchers, workers, governments, and everyday users — ensuring a balanced and critical discussion rather than a one-sided argument.
Company Profiles
The Leaders page includes individual written profiles for OpenAI, Google DeepMind, Microsoft, NVIDIA, Meta, and Anthropic — going beyond a simple table to explain each company’s role in the AI landscape.
Use of Media
Images and media are used throughout the site to support content and improve engagement:
| Media Type | Where Used | Purpose |
|---|---|---|
| Hero Background Images | All pages | Each page has a unique AI-themed hero image with a gradient overlay to create a consistent visual identity. |
| AI History Image | History page | A figure showing the evolution of AI from symbolic systems to modern deep learning, with a descriptive caption. |
| AI Market Image | Market page | A visual supporting the market data and financial growth section of the page. |
| Site Logo / Favicon | Header and browser tab | A custom AI-themed logo is displayed in the site header and as the browser favicon for branding. |
| TradingView Widget | Market page | A live stock market widget showing real-time prices for major AI companies (NVIDIA, Apple, Microsoft, Tesla, Google, Meta). |
Standout Additions
Beyond the core requirements, the following features were added to make the site more professional and engaging:
🎨
Custom Dark Theme
A fully custom CSS design system with hover animations, gradient overlays, and consistent colour tokens — not a default WordPress template.
📊
Live Market Data
A TradingView widget showing real-time stock prices for AI companies, making the Market page interactive and data-driven.
📋
Structured Data Tables
Multiple styled comparison tables across the Leaders, Market, and Pros and Cons pages to present complex information clearly.