StepFun Step 5 Preview – Education
via StepFun · Generated
- AIMAC Debt 4.85
- Cost $0.05
- Total Violations 20
- HTML Size 60 KB
- Em Dashes 4
Screenshot
View Live Page
Accessibility Issues Found
20 Serious
-
color-contrast serious 20 instances
Elements must meet minimum color contrast ratio thresholds
Example HTML
<div>© <span id="current-year">2026</span> Aurora Institute. All rights reserved.</div>
Artifacts
View Generated HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aurora Institute | Illuminate Your Future Through Inquiry and Innovation</title>
<meta name="description" content="Aurora Institute is a leading institution for higher education, offering interdisciplinary research opportunities, hybrid learning programs, and a global alumni network.">
<style>
:root {
--primary: #0f172a;
--primary-light: #1e293b;
--accent: #f59e0b;
--accent-hover: #d97706;
--text-main: #334155;
--text-muted: #64748b;
--bg-light: #f8fafc;
--bg-white: #ffffff;
--border: #e2e8f0;
--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--font-serif: 'Georgia', 'Times New Roman', serif;
--font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
font-family: var(--font-sans);
line-height: 1.7;
color: var(--text-main);
background-color: var(--bg-white);
-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 {
font-family: var(--font-serif);
color: var(--primary);
line-height: 1.25;
font-weight: 700;
}
a {
text-decoration: none;
color: inherit;
transition: color 0.3s ease;
}
ul {
list-style: none;
}
img {
max-width: 100%;
display: block;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 2rem;
}
/* Header & Navigation */
.site-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1000;
background: rgba(255, 255, 255, 0.95);
backdrop-filter: blur(12px);
border-bottom: 1px solid var(--border);
transition: box-shadow 0.3s ease;
}
.site-header.scrolled {
box-shadow: var(--shadow-md);
}
.header-inner {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 2rem;
max-width: 1200px;
margin: 0 auto;
}
.brand {
display: flex;
align-items: center;
gap: 1rem;
}
.brand img {
width: 52px;
height: 52px;
border-radius: 10px;
object-fit: cover;
}
.brand-text h1 {
font-size: 1.5rem;
letter-spacing: -0.5px;
}
.brand-text .tagline {
font-size: 0.8rem;
color: var(--text-muted);
font-weight: 500;
letter-spacing: 0.5px;
text-transform: uppercase;
}
.main-nav {
display: flex;
align-items: center;
gap: 2.5rem;
}
.main-nav ul {
display: flex;
gap: 2rem;
}
.main-nav a {
font-weight: 600;
font-size: 0.95rem;
position: relative;
}
.main-nav a::after {
content: '';
position: absolute;
bottom: -4px;
left: 0;
width: 0;
height: 2px;
background: var(--accent);
transition: width 0.3s ease;
}
.main-nav a:hover {
color: var(--accent);
}
.main-nav a:hover::after {
width: 100%;
}
.nav-cta {
background: var(--primary);
color: white;
padding: 0.6rem 1.4rem;
border-radius: 6px;
font-weight: 600;
font-size: 0.95rem;
transition: transform 0.2s ease, background 0.3s ease;
}
.nav-cta:hover {
background: var(--primary-light);
transform: translateY(-2px);
}
.mobile-menu-btn {
display: none;
background: none;
border: none;
font-size: 1.5rem;
cursor: pointer;
color: var(--primary);
}
/* Hero Section */
.hero {
padding: 9rem 2rem 5rem;
background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
}
.hero-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 4rem;
align-items: center;
max-width: 1200px;
margin: 0 auto;
}
.hero-content h2 {
font-size: 3.5rem;
margin-bottom: 1.5rem;
letter-spacing: -1px;
}
.hero-content h2 span {
color: var(--accent);
}
.hero-content p {
font-size: 1.25rem;
color: var(--text-muted);
margin-bottom: 2.5rem;
max-width: 540px;
}
.hero-buttons {
display: flex;
gap: 1rem;
flex-wrap: wrap;
}
.btn {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 1rem 2rem;
border-radius: 8px;
font-weight: 700;
font-size: 1rem;
transition: all 0.3s ease;
cursor: pointer;
border: none;
}
.btn-primary {
background: var(--primary);
color: white;
}
.btn-primary:hover {
background: var(--primary-light);
transform: translateY(-3px);
box-shadow: var(--shadow-lg);
}
.btn-outline {
background: transparent;
color: var(--primary);
border: 2px solid var(--primary);
}
.btn-outline:hover {
background: var(--primary);
color: white;
transform: translateY(-3px);
}
.hero-image {
position: relative;
}
.hero-image img {
border-radius: 16px;
box-shadow: var(--shadow-lg);
width: 100%;
height: auto;
}
.hero-badge {
position: absolute;
bottom: -20px;
left: -20px;
background: white;
padding: 1.5rem;
border-radius: 12px;
box-shadow: var(--shadow-lg);
max-width: 220px;
border-left: 4px solid var(--accent);
}
.hero-badge strong {
display: block;
font-size: 1.5rem;
color: var(--primary);
font-family: var(--font-serif);
}
.hero-badge span {
font-size: 0.85rem;
color: var(--text-muted);
}
/* Stats Bar */
.stats-bar {
background: var(--primary);
color: white;
padding: 3rem 0;
}
.stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 2rem;
text-align: center;
}
.stat h3 {
font-size: 2.5rem;
color: var(--accent);
margin-bottom: 0.5rem;
}
.stat p {
color: #94a3b8;
font-size: 0.95rem;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 600;
}
/* Program Finder */
.program-finder {
padding: 6rem 0;
background: var(--bg-light);
}
.section-header {
text-align: center;
max-width: 720px;
margin: 0 auto 3.5rem;
}
.section-header h2 {
font-size: 2.5rem;
margin-bottom: 1rem;
}
.section-header p {
font-size: 1.15rem;
color: var(--text-muted);
}
.finder-card {
background: white;
border-radius: 16px;
padding: 2.5rem;
box-shadow: var(--shadow-md);
max-width: 1000px;
margin: 0 auto;
}
.finder-controls {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 1.5rem;
margin-bottom: 2.5rem;
padding-bottom: 2.5rem;
border-bottom: 1px solid var(--border);
}
.form-group label {
display: block;
font-weight: 700;
font-size: 0.9rem;
margin-bottom: 0.5rem;
color: var(--primary);
}
.form-control {
width: 100%;
padding: 0.85rem 1rem;
border: 1px solid var(--border);
border-radius: 8px;
font-size: 1rem;
font-family: var(--font-sans);
background: white;
transition: border-color 0.3s;
}
.form-control:focus {
outline: none;
border-color: var(--accent);
}
.results-count {
font-size: 0.95rem;
color: var(--text-muted);
margin-bottom: 1.5rem;
font-weight: 600;
}
.results-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 1.5rem;
}
.program-card {
border: 1px solid var(--border);
border-radius: 12px;
padding: 1.75rem;
transition: all 0.3s ease;
background: white;
position: relative;
overflow: hidden;
}
.program-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 4px;
height: 100%;
background: var(--accent);
opacity: 0;
transition: opacity 0.3s;
}
.program-card:hover {
box-shadow: var(--shadow-md);
border-color: #cbd5e1;
transform: translateY(-4px);
}
.program-card:hover::before {
opacity: 1;
}
.program-card h3 {
font-size: 1.35rem;
margin-bottom: 0.5rem;
}
.program-tags {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
margin-bottom: 1rem;
}
.tag {
font-size: 0.75rem;
padding: 0.35rem 0.75rem;
border-radius: 999px;
background: #eff6ff;
color: #1d4ed8;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.tag.level {
background: #ecfdf5;
color: #047857;
}
.program-card p {
font-size: 0.95rem;
color: var(--text-muted);
margin-bottom: 1.25rem;
}
.program-link {
font-weight: 700;
color: var(--accent);
font-size: 0.95rem;
display: inline-flex;
align-items: center;
gap: 0.35rem;
}
.program-link:hover {
gap: 0.6rem;
}
/* Features Grid */
.features {
padding: 6rem 0;
}
.features-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 2rem;
}
.feature-card {
text-align: center;
padding: 2.5rem 2rem;
border-radius: 16px;
background: white;
border: 1px solid var(--border);
transition: all 0.3s ease;
}
.feature-card:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-5px);
border-color: transparent;
}
.feature-icon {
width: 72px;
height: 72px;
border-radius: 20px;
margin: 0 auto 1.5rem;
object-fit: cover;
}
.feature-card h3 {
font-size: 1.3rem;
margin-bottom: 1rem;
}
.feature-card p {
color: var(--text-muted);
font-size: 0.95rem;
}
/* Research Section */
.research-section {
padding: 6rem 0;
background: var(--bg-light);
}
.research-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 4rem;
align-items: center;
}
.research-content h2 {
font-size: 2.5rem;
margin-bottom: 1.5rem;
}
.research-content p {
margin-bottom: 1.5rem;
color: var(--text-main);
font-size: 1.05rem;
}
.research-list {
margin: 2rem 0;
display: grid;
gap: 1rem;
}
.research-list li {
display: flex;
gap: 1rem;
align-items: flex-start;
}
.check-icon {
width: 24px;
height: 24px;
flex-shrink: 0;
margin-top: 3px;
}
.research-image img {
border-radius: 16px;
box-shadow: var(--shadow-lg);
width: 100%;
}
/* Course Catalog & Sidebar */
.catalog-section {
padding: 6rem 0;
}
.catalog-layout {
display: grid;
grid-template-columns: 340px 1fr;
gap: 3rem;
align-items: start;
}
.sidebar {
position: sticky;
top: 110px;
background: white;
border: 1px solid var(--border);
border-radius: 16px;
padding: 2rem;
box-shadow: var(--shadow-sm);
}
.sidebar h3 {
font-size: 1.4rem;
margin-bottom: 1.5rem;
padding-bottom: 1rem;
border-bottom: 2px solid var(--accent);
display: inline-block;
}
.event-list {
display: grid;
gap: 1.5rem;
margin-bottom: 2.5rem;
}
.event-item {
padding-left: 1rem;
border-left: 3px solid var(--border);
transition: border-color 0.3s;
}
.event-item:hover {
border-color: var(--accent);
}
.event-date {
font-size: 0.85rem;
font-weight: 800;
color: var(--accent);
text-transform: uppercase;
letter-spacing: 0.5px;
margin-bottom: 0.25rem;
}
.event-title {
font-weight: 700;
color: var(--primary);
margin-bottom: 0.25rem;
font-size: 1rem;
}
.event-desc {
font-size: 0.9rem;
color: var(--text-muted);
line-height: 1.5;
}
.sidebar-cta {
background: var(--primary);
color: white;
padding: 1.5rem;
border-radius: 12px;
text-align: center;
}
.sidebar-cta h4 {
color: white;
margin-bottom: 0.5rem;
font-size: 1.1rem;
}
.sidebar-cta p {
font-size: 0.9rem;
color: #94a3b8;
margin-bottom: 1rem;
}
.sidebar-cta .btn {
width: 100%;
justify-content: center;
padding: 0.75rem 1rem;
font-size: 0.95rem;
}
.catalog-header {
margin-bottom: 2.5rem;
}
.catalog-header h2 {
font-size: 2.5rem;
margin-bottom: 1rem;
}
.catalog-header p {
color: var(--text-muted);
font-size: 1.1rem;
max-width: 720px;
}
.course-list {
display: grid;
gap: 2rem;
}
.course-item {
display: grid;
grid-template-columns: 180px 1fr;
gap: 2rem;
padding: 2rem;
border: 1px solid var(--border);
border-radius: 16px;
transition: all 0.3s;
background: white;
}
.course-item:hover {
box-shadow: var(--shadow-md);
border-color: transparent;
}
.course-item img {
width: 100%;
height: 140px;
object-fit: cover;
border-radius: 10px;
}
.course-info h3 {
font-size: 1.5rem;
margin-bottom: 0.5rem;
}
.course-meta {
display: flex;
gap: 1.5rem;
margin-bottom: 1rem;
font-size: 0.9rem;
color: var(--text-muted);
font-weight: 600;
}
.course-info p {
color: var(--text-main);
margin-bottom: 1.25rem;
font-size: 1rem;
}
.course-actions {
display: flex;
gap: 1rem;
flex-wrap: wrap;
}
.btn-sm {
padding: 0.6rem 1.2rem;
font-size: 0.9rem;
border-radius: 6px;
font-weight: 700;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 0.4rem;
transition: all 0.2s;
}
.btn-dark {
background: var(--primary);
color: white;
}
.btn-dark:hover {
background: var(--primary-light);
}
.btn-ghost {
background: transparent;
color: var(--primary);
border: 1px solid var(--border);
}
.btn-ghost:hover {
border-color: var(--primary);
}
/* Alumni Testimonials */
.alumni-section {
padding: 6rem 0;
background: var(--bg-light);
}
.testimonials-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 2rem;
}
.testimonial-card {
background: white;
padding: 2.5rem;
border-radius: 16px;
box-shadow: var(--shadow-sm);
border: 1px solid var(--border);
position: relative;
}
.testimonial-card::before {
content: '"';
font-family: var(--font-serif);
font-size: 5rem;
color: var(--accent);
opacity: 0.2;
position: absolute;
top: 10px;
left: 20px;
line-height: 1;
}
.testimonial-text {
font-style: italic;
color: var(--text-main);
margin-bottom: 2rem;
position: relative;
z-index: 1;
font-size: 1.05rem;
}
.testimonial-author {
display: flex;
align-items: center;
gap: 1rem;
}
.testimonial-author img {
width: 56px;
height: 56px;
border-radius: 50%;
object-fit: cover;
}
.author-info strong {
display: block;
color: var(--primary);
font-size: 1.05rem;
}
.author-info span {
font-size: 0.9rem;
color: var(--text-muted);
}
/* FAQ Accordion */
.faq-section {
padding: 6rem 0;
}
.faq-container {
max-width: 800px;
margin: 0 auto;
}
.faq-item {
border: 1px solid var(--border);
border-radius: 12px;
margin-bottom: 1rem;
overflow: hidden;
transition: all 0.3s;
background: white;
}
.faq-item.active {
border-color: var(--accent);
box-shadow: var(--shadow-sm);
}
.faq-question {
width: 100%;
text-align: left;
padding: 1.5rem 2rem;
background: white;
border: none;
font-size: 1.15rem;
font-weight: 700;
color: var(--primary);
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
font-family: var(--font-sans);
}
.faq-icon {
font-size: 1.5rem;
color: var(--accent);
transition: transform 0.3s;
}
.faq-item.active .faq-icon {
transform: rotate(45deg);
}
.faq-answer {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease;
}
.faq-answer-inner {
padding: 0 2rem 1.75rem;
color: var(--text-muted);
font-size: 1rem;
line-height: 1.8;
}
/* Footer */
.site-footer {
background: var(--primary);
color: #cbd5e1;
padding: 5rem 0 2rem;
}
.footer-grid {
display: grid;
grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
gap: 3rem;
margin-bottom: 4rem;
}
.footer-brand img {
width: 52px;
height: 52px;
border-radius: 10px;
margin-bottom: 1.5rem;
}
.footer-brand h3 {
color: white;
font-size: 1.5rem;
margin-bottom: 1rem;
}
.footer-brand p {
color: #94a3b8;
font-size: 0.95rem;
margin-bottom: 1.5rem;
max-width: 320px;
}
.social-links {
display: flex;
gap: 1rem;
}
.social-links a {
width: 40px;
height: 40px;
border-radius: 50%;
background: var(--primary-light);
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s;
}
.social-links a:hover {
background: var(--accent);
transform: translateY(-3px);
}
.social-links img {
width: 18px;
height: 18px;
filter: brightness(0) invert(1);
}
.footer-col h4 {
color: white;
font-size: 1.15rem;
margin-bottom: 1.5rem;
font-family: var(--font-sans);
font-weight: 700;
}
.footer-col ul {
display: grid;
gap: 0.85rem;
}
.footer-col a {
color: #94a3b8;
font-size: 0.95rem;
transition: color 0.3s;
}
.footer-col a:hover {
color: var(--accent);
}
.contact-info {
display: grid;
gap: 1rem;
font-size: 0.95rem;
color: #94a3b8;
}
.contact-info li {
display: flex;
gap: 0.75rem;
align-items: flex-start;
}
.footer-bottom {
border-top: 1px solid #334155;
padding-top: 2rem;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 1rem;
font-size: 0.9rem;
color: #64748b;
}
.footer-bottom-links {
display: flex;
gap: 2rem;
}
/* Utility & Animations */
.fade-in {
opacity: 0;
transform: translateY(30px);
transition: opacity 0.8s ease, transform 0.8s ease;
}
.fade-in.visible {
opacity: 1;
transform: translateY(0);
}
/* Responsive */
@media (max-width: 1024px) {
.hero-content h2 { font-size: 2.75rem; }
.catalog-layout { grid-template-columns: 1fr; }
.sidebar { position: static; }
.footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
.main-nav { display: none; }
.mobile-menu-btn { display: block; }
.hero-grid, .research-grid { grid-template-columns: 1fr; }
.stats-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
.course-item { grid-template-columns: 1fr; }
.course-item img { height: 200px; }
.hero-content h2 { font-size: 2.25rem; }
.hero { padding-top: 7rem; }
.footer-grid { grid-template-columns: 1fr; }
.footer-bottom { flex-direction: column; text-align: center; }
}
</style>
</head>
<body>
<!-- Header -->
<header class="site-header" id="header">
<div class="header-inner">
<div class="brand">
<img src="https://placehold.co/64x64/0f172a/f59e0b?text=AI" alt="Aurora Institute Logo">
<div class="brand-text">
<h1>Aurora Institute</h1>
<div class="tagline">Illuminate Your Future</div>
</div>
</div>
<nav class="main-nav">
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#academics">Academics</a></li>
<li><a href="#research">Research</a></li>
<li><a href="#library">Library</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<a href="#apply" class="nav-cta">Apply Now</a>
</nav>
<button class="mobile-menu-btn">☰</button>
</div>
</header>
<!-- Hero -->
<section class="hero" id="home">
<div class="hero-grid">
<div class="hero-content fade-in">
<h2>Where Inquiry Meets <span>Innovation</span></h2>
<p>Aurora Institute cultivates the next generation of scholars, researchers, and leaders through rigorous academics, groundbreaking discovery, and a commitment to societal impact. Join a community where curiosity is celebrated and every question opens a door.</p>
<div class="hero-buttons">
<a href="#program-finder" class="btn btn-primary">View Courses</a>
<a href="#research" class="btn btn-outline">Meet Faculty</a>
</div>
</div>
<div class="hero-image fade-in">
<img src="https://placehold.co/800x600/0f172a/ffffff?text=Modern+Campus+Life" alt="Students collaborating on campus">
<div class="hero-badge">
<strong>94%</strong>
<span>Placement rate within 6 months of graduation</span>
</div>
</div>
</div>
</section>
<!-- Stats -->
<div class="stats-bar">
<div class="container">
<div class="stats-grid fade-in">
<div class="stat">
<h3>12:1</h3>
<p>Student-Faculty Ratio</p>
</div>
<div class="stat">
<h3>8,400+</h3>
<p>Active Students</p>
</div>
<div class="stat">
<h3>180+</h3>
<p>Degree Programs</p>
</div>
<div class="stat">
<h3>75k</h3>
<p>Global Alumni</p>
</div>
</div>
</div>
</div>
<!-- Program Finder -->
<section class="program-finder" id="academics">
<div class="container">
<div class="section-header fade-in">
<h2>Find Your Program</h2>
<p>Filter through 180+ accredited degree programs, certificates, and continuing education pathways. Whether you are beginning your undergraduate journey or defending your doctoral thesis, Aurora has a path designed for your ambitions.</p>
</div>
<div class="finder-card fade-in" id="program-finder">
<div class="finder-controls">
<div class="form-group">
<label for="filter-level">Academic Level</label>
<select id="filter-level" class="form-control">
<option value="all">All Levels</option>
<option value="certificate">Certificate</option>
<option value="undergraduate">Undergraduate</option>
<option value="masters">Master's</option>
<option value="phd">PhD / Doctoral</option>
</select>
</div>
<div class="form-group">
<label for="filter-format">Delivery Format</label>
<select id="filter-format" class="form-control">
<option value="all">All Formats</option>
<option value="on-campus">On-Campus</option>
<option value="online">Fully Online</option>
<option value="hybrid">Hybrid</option>
<option value="low-residency">Low-Residency</option>
</select>
</div>
<div class="form-group">
<label for="filter-school">School / Discipline</label>
<select id="filter-school" class="form-control">
<option value="all">All Schools</option>
<option value="science">School of Science</option>
<option value="engineering">School of Engineering</option>
<option value="business">School of Business</option>
<option value="arts">School of Arts & Humanities</option>
<option value="social">School of Social Sciences</option>
</select>
</div>
<div class="form-group">
<label for="search-input">Keyword Search</label>
<input type="text" id="search-input" class="form-control" placeholder="e.g. Data, Biology, Design...">
</div>
</div>
<div class="results-count" id="results-count">Showing all available programs</div>
<div class="results-grid" id="results-grid">
<!-- Cards populated by JS -->
</div>
</div>
</div>
</section>
<!-- Features -->
<section class="features">
<div class="container">
<div class="section-header fade-in">
<h2>The Aurora Advantage</h2>
<p>Our institutional framework is built on four pillars that support every student from enrollment through graduation and beyond.</p>
</div>
<div class="features-grid fade-in">
<div class="feature-card">
<img src="https://placehold.co/80x80/0f172a/f59e0b?text=🔬" alt="Research" class="feature-icon">
<h3>Research Excellence</h3>
<p>Undergraduates publish by sophomore year. Our labs are equipped with next-generation instrumentation, and every thesis is mentored by faculty who lead their fields.</p>
</div>
<div class="feature-card">
<img src="https://placehold.co/80x80/0f172a/f59e0b?text=🌐" alt="Hybrid Learning" class="feature-icon">
<h3>Hybrid Learning</h3>
<p>Our proprietary AuroraNet platform integrates asynchronous coursework with live seminars, giving working professionals and international students full academic parity.</p>
</div>
<div class="feature-card">
<img src="https://placehold.co/80x80/0f172a/f59e0b?text=🤝" alt="Alumni Network" class="feature-icon">
<h3>Global Alumni Network</h3>
<p>With 75,000 graduates across 92 countries, our mentorship circles and career pipelines connect students to opportunities long after they leave campus.</p>
</div>
<div class="feature-card">
<img src="https://placehold.co/80x80/0f172a/f59e0b?text=🚀" alt="Career" class="feature-icon">
<h3>Career Launch</h3>
<p>Dedicated career architects help students navigate internships, co-ops, and placements at Fortune 500 companies, startups, and leading research institutions.</p>
</div>
</div>
</div>
</section>
<!-- Research Section -->
<section class="research-section" id="research">
<div class="container">
<div class="research-grid">
<div class="research-content fade-in">
<h2>Research Excellence & Discovery</h2>
<p>At Aurora Institute, research is not confined to graduate laboratories. Our academic model embeds inquiry into every curriculum, ensuring that students learn to question assumptions, design methodologies, and defend their conclusions with rigor. From the first-year seminar to the doctoral dissertation, scholarly investigation forms the backbone of the Aurora experience.</p>
<p>Our faculty secure over $140 million in annual research funding, supporting interdisciplinary centers in quantum computing, public health, climate resilience, and digital humanities. Students who join these teams gain hands-on experience with grant writing, peer review, and conference presentation—skills that are essential for advanced study and competitive careers.</p>
<p>The Office of Undergraduate Research offers competitive fellowships that fund independent projects during the academic year and summer terms. Each year, more than 600 students present their findings at the Aurora Research Symposium, and a select number are invited to co-author publications in top-tier journals.</p>
<ul class="research-list">
<li>
<img src="https://placehold.co/24x24/22c55e/ffffff?text=✓" alt="Check" class="check-icon">
<span>Interdisciplinary thesis tracks with dual faculty mentorship</span>
</li>
<li>
<img src="https://placehold.co/24x24/22c55e/ffffff?text=✓" alt="Check" class="check-icon">
<span>Access to 12 specialized research centers and maker spaces</span>
</li>
<li>
<img src="https://placehold.co/24x24/22c55e/ffffff?text=✓" alt="Check" class="check-icon">
<span>Annual conference travel grants for presenting students</span>
</li>
</ul>
<a href="#contact" class="btn btn-primary">Download Catalog</a>
</div>
<div class="research-image fade-in">
<img src="https://placehold.co/700x500/0f172a/ffffff?text=Advanced+Research+Lab" alt="Researchers in advanced laboratory">
</div>
</div>
</div>
</section>
<!-- Course Catalog with Sidebar -->
<section class="catalog-section" id="library">
<div class="container">
<div class="catalog-layout">
<!-- Sidebar -->
<aside class="sidebar fade-in">
<h3>Upcoming Events</h3>
<div class="event-list">
<div class="event-item">
<div class="event-date">Oct 15, 2024</div>
<div class="event-title">Fall Open House</div>
<div class="event-desc">Prospective students tour facilities and meet department chairs.</div>
</div>
<div class="event-item">
<div class="event-date">Oct 28, 2024</div>
<div class="event-title">Thesis Defense Series</div>
<div class="event-desc">Public defenses by doctoral candidates in Engineering & Science.</div>
</div>
<div class="event-item">
<div class="event-date">Nov 05, 2024</div>
<div class="event-title">Scholarship Info Session</div>
<div class="event-desc">Financial aid office walks through merit and need-based awards.</div>
</div>
<div class="event-item">
<div class="event-date">Nov 22, 2024</div>
<div class="event-title">Alumni Mixer</div>
<div class="event-desc">Networking evening with graduates in tech and academia.</div>
</div>
</div>
<div class="sidebar-cta">
<h4>Need Guidance?</h4>
<p>Speak with an admissions advisor about enrollment deadlines and academic calendars.</p>
<a href="#contact" class="btn btn-primary">Schedule a Call</a>
</div>
</aside>
<!-- Main Catalog -->
<div class="catalog-content">
<div class="catalog-header fade-in">
<h2>Featured Course Catalog</h2>
<p>Our curriculum is reviewed annually by industry advisory boards to ensure alignment with emerging professional standards. Below are flagship programs across our five schools, each with detailed credit requirements, practicum components, and thesis or capstone options.</p>
</div>
<div class="course-list fade-in">
<div class="course-item">
<img src="https://placehold.co/400x300?text=Data+Science" alt="Data Science">
<div class="course-info">
<h3>M.S. in Data Science & Analytics</h3>
<div class="course-meta">
<span>📅 20 Months</span>
<span>🎓 45 Credits</span>
<span>💻 Hybrid</span>
</div>
<p>This program combines statistical theory, machine learning engineering, and data ethics. Students complete a two-semster capstone with a corporate partner, building production-grade analytical tools. Prerequisites include linear algebra and introductory programming. Enrollment opens each fall and spring term.</p>
<div class="course-actions">
<a href="#apply" class="btn-sm btn-dark">View Courses</a>
<a href="#contact" class="btn-sm btn-ghost">Meet Faculty</a>
</div>
</div>
</div>
<div class="course-item">
<img src="https://placehold.co/400x300?text=Biomedical+Engineering" alt="Biomedical Engineering">
<div class="course-info">
<h3>Ph.D. in Biomedical Engineering</h3>
<div class="course-meta">
<span>📅 5 Years</span>
<span>🎓 72 Credits</span>
<span>🏫 On-Campus</span>
</div>
<p>Doctoral candidates conduct original research in tissue engineering, medical imaging, or neural interfaces. The program requires a qualifying examination in year two, a dissertation proposal defense in year three, and a final public thesis defense. Funding is guaranteed for five years through research and teaching assistantships.</p>
<div class="course-actions">
<a href="#apply" class="btn-sm btn-dark">View Courses</a>
<a href="#contact" class="btn-sm btn-ghost">Meet Faculty</a>
</div>
</div>
</div>
<div class="course-item">
<img src="https://placehold.co/400x300?text=Sustainable+Architecture" alt="Sustainable Architecture">
<div class="course-info">
<h3>Master of Architecture (Sustainable Design)</h3>
<div class="course-meta">
<span>📅 3 Years</span>
<span>🎓 108 Credits</span>
<span>🏫 On-Campus</span>
</div>
<p>Accredited by the NAAB, this professional degree emphasizes regenerative building systems, urban ecology, and digital fabrication. Studios are supplemented by professional practice courses covering building codes, project management, and client relations. A comprehensive design thesis is required in the final year.</p>
<div class="course-actions">
<a href="#apply" class="btn-sm btn-dark">View Courses</a>
<a href="#contact" class="btn-sm btn-ghost">Meet Faculty</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Alumni Testimonials -->
<section class="alumni-section">
<div class="container">
<div class="section-header fade-in">
<h2>Alumni Network</h2>
<p>Aurora graduates lead research labs, found companies, and shape public policy. Here is what a few of them say about their time at the Institute.</p>
</div>
<div class="testimonials-grid fade-in">
<div class="testimonial-card">
<p class="testimonial-text">The undergraduate research fellowship changed the trajectory of my career. By the time I defended my thesis on renewable energy grids, I had already published two papers and presented at an international conference. Aurora gave me the confidence to pursue a PhD immediately after graduation.</p>
<div class="testimonial-author">
<img src="https://i.pravatar.cc/150?u=alex" alt="Alex Chen">
<div class="author-info">
<strong>Alex Chen</strong>
<span>PhD Candidate, MIT — Class of 2021</span>
</div>
</div>
</div>
<div class="testimonial-card">
<p class="testimonial-text">As a working professional, the hybrid format was essential. I completed my MBA without pausing my career in product management. The alumni network helped me transition into a senior role six weeks before graduation. The faculty genuinely care about your success.</p>
<div class="testimonial-author">
<img src="https://i.pravatar.cc/150?u=sarah" alt="Sarah Johnson">
<div class="author-info">
<strong>Sarah Johnson</strong>
<span>Senior Product Manager, TechFlow — MBA '22</span>
</div>
</div>
</div>
<div class="testimonial-card">
<p class="testimonial-text">I came to Aurora for the labs and stayed for the community. My advisor pushed me to apply for grants I thought were beyond my reach. Winning the departmental fellowship validated my research direction and set the foundation for my current role in biomedical innovation.</p>
<div class="testimonial-author">
<img src="https://i.pravatar.cc/150?u=marcus" alt="Marcus Williams">
<div class="author-info">
<strong>Marcus Williams</strong>
<span>Research Scientist, BioGen Labs — PhD '20</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- FAQ -->
<section class="faq-section" id="apply">
<div class="container">
<div class="section-header fade-in">
<h2>Admissions & Enrollment FAQ</h2>
<p>Everything you need to know about applying, funding your education, and joining the Aurora community.</p>
</div>
<div class="faq-container fade-in">
<div class="faq-item">
<button class="faq-question">
What are the key application deadlines?
<span class="faq-icon">+</span>
</button>
<div class="faq-answer">
<div class="faq-answer-inner">
Aurora Institute operates on a semester-based academic calendar. For fall enrollment, priority applications are due January 15, and final applications close May 1. Spring enrollment closes November 1. Graduate program deadlines vary by department; most doctoral programs require applications by December 15 for the following fall term. We strongly recommend submitting materials at least two weeks before the posted deadline to allow time for transcript verification and recommendation processing.
</div>
</div>
</div>
<div class="faq-item">
<button class="faq-question">
How does the thesis requirement work for master's students?
<span class="faq-icon">+</span>
</button>
<div class="faq-answer">
<div class="faq-answer-inner">
Most master's programs offer both a thesis track and a non-thesis capstone track. The thesis track requires 6–9 credit hours of original research under a faculty advisor, culminating in a written thesis and public defense. The capstone track substitutes these credits with a applied project or comprehensive examination. Students typically decide their track during their second semester, in consultation with their academic advisor.
</div>
</div>
</div>
<div class="faq-item">
<button class="faq-question">
Are online degrees equivalent to on-campus degrees?
<span class="faq-icon">+</span>
</button>
<div class="faq-answer">
<div class="faq-answer-inner">
Yes. Aurora Institute does not designate transcripts with an online or hybrid notation. Online students complete the same curriculum, sit for the same examinations, and earn identical degrees. Our synchronous seminars are recorded for students in different time zones, and proctored assessments ensure academic integrity across all delivery formats.
</div>
</div>
</div>
<div class="faq-item">
<button class="faq-question">
What financial aid and scholarships are available?
<span class="faq-icon">+</span>
</button>
<div class="faq-answer">
<div class="faq-answer-inner">
Aurora offers merit-based scholarships ranging from $5,000 to full tuition, awarded automatically upon admission review. Need-based grants are determined through the FAFSA or CSS Profile. The Office of Student Employment places over 2,000 students in on-campus roles annually, and departmental research assistantships provide tuition remission for graduate students. Our financial literacy workshops help students navigate budgeting, loan repayment, and tax planning.
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="site-footer" id="contact">
<div class="container">
<div class="footer-grid">
<div class="footer-brand">
<img src="https://placehold.co/64x64/1e293b/f59e0b?text=AI" alt="Aurora Institute">
<h3>Aurora Institute</h3>
<p>A leading institution for higher education, interdisciplinary research, and lifelong learning. Committed to access, excellence, and societal impact.</p>
<div class="social-links">
<a href="#" aria-label="LinkedIn"><img src="https://placehold.co/24x24/ffffff/000000?text=in" alt="LinkedIn"></a>
<a href="#" aria-label="Twitter"><img src="https://placehold.co/24x24/ffffff/000000?text=X" alt="Twitter"></a>
<a href="#" aria-label="Instagram"><img src="https://placehold.co/24x24/ffffff/000000?text=ig" alt="Instagram"></a>
<a href="#" aria-label="YouTube"><img src="https://placehold.co/24x24/ffffff/000000?text=YT" alt="YouTube"></a>
</div>
</div>
<div class="footer-col">
<h4>Quick Links</h4>
<ul>
<li><a href="#academics">Academic Programs</a></li>
<li><a href="#library">Library & Archives</a></li>
<li><a href="#research">Research Centers</a></li>
<li><a href="#apply">Admissions</a></li>
<li><a href="#">Student Life</a></li>
<li><a href="#">Employment</a></li>
</ul>
</div>
<div class="footer-col">
<h4>Resources</h4>
<ul>
<li><a href="#">AuroraNet Portal</a></li>
<li><a href="#">Academic Calendar</a></li>
<li><a href="#">Library Catalog</a></li>
<li><a href="#">Thesis Repository</a></li>
<li><a href="#">IT Services</a></li>
<li><a href="#">Campus Safety</a></li>
</ul>
</div>
<div class="footer-col">
<h4>Contact Us</h4>
<ul class="contact-info">
<li>📍 450 Knowledge Way, Cambridge, MA 02139</li>
<li>📞 (617) 555-0199</li>
<li>✉️ admissions@aurorainstitute.edu</li>
<li>🕐 Mon–Fri: 8:30 AM – 5:00 PM EST</li>
</ul>
</div>
</div>
<div class="footer-bottom">
<div>© <span id="current-year"></span> Aurora Institute. All rights reserved.</div>
<div class="footer-bottom-links">
<a href="#">Privacy Policy</a>
<a href="#">Terms of Service</a>
<a href="#">Accessibility</a>
<a href="#">Sitemap</a>
</div>
</div>
</div>
</footer>
<script>
// Set current year
document.getElementById('current-year').textContent = new Date().getFullYear();
// Header shadow on scroll
const header = document.getElementById('header');
window.addEventListener('scroll', () => {
if (window.scrollY > 50) {
header.classList.add('scrolled');
} else {
header.classList.remove('scrolled');
}
});
// Intersection Observer for fade-in animations
const observerOptions = {
threshold: 0.1,
rootMargin: '0px 0px -50px 0px'
};
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
}
});
}, observerOptions);
document.querySelectorAll('.fade-in').forEach(el => observer.observe(el));
// Program Data
const programs = [
{
title: "M.S. in Data Science & Analytics",
level: "masters",
format: "hybrid",
school: "business",
desc: "Advanced statistical modeling, machine learning engineering, and ethical data governance with an applied corporate capstone.",
credits: "45 Credits"
},
{
title: "Ph.D. in Neuroscience",
level: "phd",
format: "on-campus",
school: "science",
desc: "Original research in neural circuitry, cognition, and computational neurobiology. Full funding guaranteed for five years.",
credits: "72 Credits"
},
{
title: "B.S. in Sustainable Architecture",
level: "undergraduate",
format: "on-campus",
school: "engineering",
desc: "NAAB-accredited foundation in regenerative design, building systems, and digital fabrication with a studio-intensive curriculum.",
credits: "128 Credits"
},
{
title: "Certificate in Digital Marketing",
level: "certificate",
format: "online",
school: "business",
desc: "Fifteen-week intensive covering SEO, content strategy, analytics, and campaign management for career changers.",
credits: "15 Credits"
},
{
title: "Ph.D. in Biomedical Engineering",
level: "phd",
format: "on-campus",
school: "engineering",
desc: "Tissue engineering, medical imaging, and neural interfaces. Requires qualifying exam, proposal defense, and thesis.",
credits: "72 Credits"
},
{
title: "M.Ed. in Educational Psychology",
level: "masters",
format: "hybrid",
school: "social",
desc: "Learning sciences, assessment design, and counseling fundamentals for K-12 and higher education professionals.",
credits: "36 Credits"
},
{
title: "MFA in Creative Writing",
level: "masters",
format: "low-residency",
school: "arts",
desc: "Genre-focused workshops, literature seminars, and a final manuscript thesis. Ideal for practicing writers.",
credits: "48 Credits"
},
{
title: "B.A. in Economics",
level: "undergraduate",
format: "on-campus",
school: "social",
desc: "Micro and macroeconomic theory, econometrics, and policy analysis with a mandatory research practicum.",
credits: "120 Credits"
},
{
title: "M.S. in Environmental Science",
level: "masters",
format: "hybrid",
school: "science",
desc: "Climate systems, field ecology, and environmental policy. Includes a summer field residency at the Aurora Marine Station.",
credits: "42 Credits"
}
];
// Render Programs
function renderPrograms(filtered) {
const grid = document.getElementById('results-grid');
const count = document.getElementById('results-count');
grid.innerHTML = '';
if (filtered.length === 0) {
grid.innerHTML = '<p style="grid-column: 1/-1; text-align: center; color: var(--text-muted); padding: 2rem;">No programs match your criteria. Try adjusting your filters.</p>';
count.textContent = 'Showing 0 programs';
return;
}
filtered.forEach(p => {
const card = document.createElement('div');
card.className = 'program-card';
card.innerHTML = `
<div class="program-tags">
<span class="tag level">${p.level}</span>
<span class="tag">${p.format}</span>
</div>
<h3>${p.title}</h3>
<p>${p.desc}</p>
<div style="display:flex; justify-content:space-between; align-items:center;">
<span style="font-size:0.85rem; font-weight:700; color:var(--primary);">${p.credits}</span>
<a href="#apply" class="program-link">Program Details →</a>
</div>
`;
grid.appendChild(card);
});
count.textContent = `Showing ${filtered.length} program${filtered.length !== 1 ? 's' : ''}`;
}
function filterPrograms() {
const level = document.getElementById('filter-level').value;
const format = document.getElementById('filter-format').value;
const school = document.getElementById('filter-school').value;
const search = document.getElementById('search-input').value.toLowerCase();
const filtered = programs.filter(p => {
const matchLevel = level === 'all' || p.level === level;
const matchFormat = format === 'all' || p.format === format;
const matchSchool = school === 'all' || p.school === school;
const matchSearch = p.title.toLowerCase().includes(search) || p.desc.toLowerCase().includes(search);
return matchLevel && matchFormat && matchSchool && matchSearch;
});
renderPrograms(filtered);
}
document.getElementById('filter-level').addEventListener('change', filterPrograms);
document.getElementById('filter-format').addEventListener('change', filterPrograms);
document.getElementById('filter-school').addEventListener('change', filterPrograms);
document.getElementById('search-input').addEventListener('input', filterPrograms);
// Initial render
renderPrograms(programs);
// FAQ Accordion
document.querySelectorAll('.faq-question').forEach(btn => {
btn.addEventListener('click', () => {
const item = btn.parentElement;
const answer = item.querySelector('.faq-answer');
const isActive = item.classList.contains('active');
// Close all
document.querySelectorAll('.faq-item').forEach(i => {
i.classList.remove('active');
i.querySelector('.faq-answer').style.maxHeight = null;
});
if (!isActive) {
item.classList.add('active');
answer.style.maxHeight = answer.scrollHeight + 'px';
}
});
});
</script>
</body>
</html>
View Axe Report (JSON)
{
"testEngine": {
"name": "axe-core",
"version": "4.10.2"
},
"testRunner": {
"name": "axe"
},
"testEnvironment": {
"userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/156.0.8078.4 Safari/537.36",
"windowWidth": 1280,
"windowHeight": 720,
"orientationAngle": 0,
"orientationType": "landscape-primary"
},
"timestamp": "2026-11-12T10:14:20.947Z",
"url": "https://benchmark.aimac.invalid/10fe2197615f3e822ee6373296355cbc2ae196bf1db72bb4e9ea2abf4c8993fb.html",
"toolOptions": {
"runOnly": {
"type": "tag",
"values": [
"wcag2a",
"wcag2aa",
"wcag21a",
"wcag21aa",
"wcag22a",
"wcag22aa"
]
},
"resultTypes": [
"violations"
],
"reporter": "v1"
},
"inapplicable": [
{
"id": "area-alt",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag244",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.2.4.4",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure <area> elements of image maps have alternative text",
"help": "Active <area> elements must have alternative text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/area-alt?application=axeAPI",
"nodes": []
},
{
"id": "aria-braille-equivalent",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure aria-braillelabel and aria-brailleroledescription have a non-braille equivalent",
"help": "aria-braille attributes must have a non-braille equivalent",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-braille-equivalent?application=axeAPI",
"nodes": []
},
{
"id": "aria-command-name",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure every ARIA button, link and menuitem has an accessible name",
"help": "ARIA commands must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-command-name?application=axeAPI",
"nodes": []
},
{
"id": "aria-deprecated-role",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure elements do not use deprecated roles",
"help": "Deprecated ARIA roles must not be used",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-deprecated-role?application=axeAPI",
"nodes": []
},
{
"id": "aria-hidden-focus",
"impact": null,
"tags": [
"cat.name-role-value",
"wcag2a",
"wcag412",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure aria-hidden elements are not focusable nor contain focusable elements",
"help": "ARIA hidden element must not be focusable or contain focusable elements",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-hidden-focus?application=axeAPI",
"nodes": []
},
{
"id": "aria-input-field-name",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"TTv5",
"TT5.c",
"EN-301-549",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure every ARIA input field has an accessible name",
"help": "ARIA input fields must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-input-field-name?application=axeAPI",
"nodes": []
},
{
"id": "aria-meter-name",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag111",
"EN-301-549",
"EN-9.1.1.1"
],
"description": "Ensure every ARIA meter node has an accessible name",
"help": "ARIA meter nodes must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-meter-name?application=axeAPI",
"nodes": []
},
{
"id": "aria-progressbar-name",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag111",
"EN-301-549",
"EN-9.1.1.1"
],
"description": "Ensure every ARIA progressbar node has an accessible name",
"help": "ARIA progressbar nodes must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-progressbar-name?application=axeAPI",
"nodes": []
},
{
"id": "aria-required-attr",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure elements with ARIA roles have all required ARIA attributes",
"help": "Required ARIA attributes must be provided",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-attr?application=axeAPI",
"nodes": []
},
{
"id": "aria-required-children",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag131",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure elements with an ARIA role that require child roles contain them",
"help": "Certain ARIA roles must contain particular children",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-children?application=axeAPI",
"nodes": []
},
{
"id": "aria-required-parent",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag131",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure elements with an ARIA role that require parent roles are contained by them",
"help": "Certain ARIA roles must be contained by particular parents",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-parent?application=axeAPI",
"nodes": []
},
{
"id": "aria-roles",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure all elements with a role attribute use a valid value",
"help": "ARIA roles used must conform to valid values",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-roles?application=axeAPI",
"nodes": []
},
{
"id": "aria-toggle-field-name",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"TTv5",
"TT5.c",
"EN-301-549",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure every ARIA toggle field has an accessible name",
"help": "ARIA toggle fields must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-toggle-field-name?application=axeAPI",
"nodes": []
},
{
"id": "aria-tooltip-name",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure every ARIA tooltip node has an accessible name",
"help": "ARIA tooltip nodes must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-tooltip-name?application=axeAPI",
"nodes": []
},
{
"id": "autocomplete-valid",
"impact": null,
"tags": [
"cat.forms",
"wcag21aa",
"wcag135",
"EN-301-549",
"EN-9.1.3.5",
"ACT"
],
"description": "Ensure the autocomplete attribute is correct and suitable for the form field",
"help": "autocomplete attribute must be used correctly",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/autocomplete-valid?application=axeAPI",
"nodes": []
},
{
"id": "avoid-inline-spacing",
"impact": null,
"tags": [
"cat.structure",
"wcag21aa",
"wcag1412",
"EN-301-549",
"EN-9.1.4.12",
"ACT"
],
"description": "Ensure that text spacing set through style attributes can be adjusted with custom stylesheets",
"help": "Inline text spacing must be adjustable with custom stylesheets",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/avoid-inline-spacing?application=axeAPI",
"nodes": []
},
{
"id": "blink",
"impact": null,
"tags": [
"cat.time-and-media",
"wcag2a",
"wcag222",
"section508",
"section508.22.j",
"TTv5",
"TT2.b",
"EN-301-549",
"EN-9.2.2.2"
],
"description": "Ensure <blink> elements are not used",
"help": "<blink> elements are deprecated and must not be used",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/blink?application=axeAPI",
"nodes": []
},
{
"id": "definition-list",
"impact": null,
"tags": [
"cat.structure",
"wcag2a",
"wcag131",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure <dl> elements are structured correctly",
"help": "<dl> elements must only directly contain properly-ordered <dt> and <dd> groups, <script>, <template> or <div> elements",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/definition-list?application=axeAPI",
"nodes": []
},
{
"id": "dlitem",
"impact": null,
"tags": [
"cat.structure",
"wcag2a",
"wcag131",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure <dt> and <dd> elements are contained by a <dl>",
"help": "<dt> and <dd> elements must be contained by a <dl>",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/dlitem?application=axeAPI",
"nodes": []
},
{
"id": "frame-focusable-content",
"impact": null,
"tags": [
"cat.keyboard",
"wcag2a",
"wcag211",
"TTv5",
"TT4.a",
"EN-301-549",
"EN-9.2.1.1"
],
"description": "Ensure <frame> and <iframe> elements with focusable content do not have tabindex=-1",
"help": "Frames with focusable content must not have tabindex=-1",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-focusable-content?application=axeAPI",
"nodes": []
},
{
"id": "frame-title-unique",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag412",
"TTv5",
"TT12.d",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure <iframe> and <frame> elements contain a unique title attribute",
"help": "Frames must have a unique title attribute",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-title-unique?application=axeAPI",
"nodes": []
},
{
"id": "frame-title",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag412",
"section508",
"section508.22.i",
"TTv5",
"TT12.d",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure <iframe> and <frame> elements have an accessible name",
"help": "Frames must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-title?application=axeAPI",
"nodes": []
},
{
"id": "html-xml-lang-mismatch",
"impact": null,
"tags": [
"cat.language",
"wcag2a",
"wcag311",
"EN-301-549",
"EN-9.3.1.1",
"ACT"
],
"description": "Ensure that HTML elements with both valid lang and xml:lang attributes agree on the base language of the page",
"help": "HTML elements with lang and xml:lang must have the same base language",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-xml-lang-mismatch?application=axeAPI",
"nodes": []
},
{
"id": "input-button-name",
"impact": null,
"tags": [
"cat.name-role-value",
"wcag2a",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT5.c",
"EN-301-549",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure input buttons have discernible text",
"help": "Input buttons must have discernible text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/input-button-name?application=axeAPI",
"nodes": []
},
{
"id": "input-image-alt",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag111",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT7.a",
"EN-301-549",
"EN-9.1.1.1",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure <input type=\"image\"> elements have alternative text",
"help": "Image buttons must have alternative text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/input-image-alt?application=axeAPI",
"nodes": []
},
{
"id": "link-in-text-block",
"impact": null,
"tags": [
"cat.color",
"wcag2a",
"wcag141",
"TTv5",
"TT13.a",
"EN-301-549",
"EN-9.1.4.1"
],
"description": "Ensure links are distinguished from surrounding text in a way that does not rely on color",
"help": "Links must be distinguishable without relying on color",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/link-in-text-block?application=axeAPI",
"nodes": []
},
{
"id": "marquee",
"impact": null,
"tags": [
"cat.parsing",
"wcag2a",
"wcag222",
"TTv5",
"TT2.b",
"EN-301-549",
"EN-9.2.2.2"
],
"description": "Ensure <marquee> elements are not used",
"help": "<marquee> elements are deprecated and must not be used",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/marquee?application=axeAPI",
"nodes": []
},
{
"id": "meta-refresh",
"impact": null,
"tags": [
"cat.time-and-media",
"wcag2a",
"wcag221",
"TTv5",
"TT8.a",
"EN-301-549",
"EN-9.2.2.1"
],
"description": "Ensure <meta http-equiv=\"refresh\"> is not used for delayed refresh",
"help": "Delayed refresh under 20 hours must not be used",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/meta-refresh?application=axeAPI",
"nodes": []
},
{
"id": "object-alt",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag111",
"section508",
"section508.22.a",
"EN-301-549",
"EN-9.1.1.1"
],
"description": "Ensure <object> elements have alternative text",
"help": "<object> elements must have alternative text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/object-alt?application=axeAPI",
"nodes": []
},
{
"id": "role-img-alt",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag111",
"section508",
"section508.22.a",
"TTv5",
"TT7.a",
"EN-301-549",
"EN-9.1.1.1",
"ACT"
],
"description": "Ensure [role=\"img\"] elements have alternative text",
"help": "[role=\"img\"] elements must have an alternative text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/role-img-alt?application=axeAPI",
"nodes": []
},
{
"id": "scrollable-region-focusable",
"impact": null,
"tags": [
"cat.keyboard",
"wcag2a",
"wcag211",
"wcag213",
"TTv5",
"TT4.a",
"EN-301-549",
"EN-9.2.1.1",
"EN-9.2.1.3"
],
"description": "Ensure elements that have scrollable content are accessible by keyboard",
"help": "Scrollable region must have keyboard access",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/scrollable-region-focusable?application=axeAPI",
"nodes": []
},
{
"id": "server-side-image-map",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag211",
"section508",
"section508.22.f",
"TTv5",
"TT4.a",
"EN-301-549",
"EN-9.2.1.1"
],
"description": "Ensure that server-side image maps are not used",
"help": "Server-side image maps must not be used",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/server-side-image-map?application=axeAPI",
"nodes": []
},
{
"id": "summary-name",
"impact": null,
"tags": [
"cat.name-role-value",
"wcag2a",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure summary elements have discernible text",
"help": "Summary elements must have discernible text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/summary-name?application=axeAPI",
"nodes": []
},
{
"id": "svg-img-alt",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag111",
"section508",
"section508.22.a",
"TTv5",
"TT7.a",
"EN-301-549",
"EN-9.1.1.1",
"ACT"
],
"description": "Ensure <svg> elements with an img, graphics-document or graphics-symbol role have an accessible text",
"help": "<svg> elements with an img role must have an alternative text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/svg-img-alt?application=axeAPI",
"nodes": []
},
{
"id": "td-headers-attr",
"impact": null,
"tags": [
"cat.tables",
"wcag2a",
"wcag131",
"section508",
"section508.22.g",
"TTv5",
"TT14.b",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure that each cell in a table that uses the headers attribute refers only to other cells in that table",
"help": "Table cells that use the headers attribute must only refer to cells in the same table",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/td-headers-attr?application=axeAPI",
"nodes": []
},
{
"id": "th-has-data-cells",
"impact": null,
"tags": [
"cat.tables",
"wcag2a",
"wcag131",
"section508",
"section508.22.g",
"TTv5",
"TT14.b",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure that <th> elements and elements with role=columnheader/rowheader have data cells they describe",
"help": "Table headers in a data table must refer to data cells",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/th-has-data-cells?application=axeAPI",
"nodes": []
},
{
"id": "valid-lang",
"impact": null,
"tags": [
"cat.language",
"wcag2aa",
"wcag312",
"TTv5",
"TT11.b",
"EN-301-549",
"EN-9.3.1.2",
"ACT"
],
"description": "Ensure lang attributes have valid values",
"help": "lang attribute must have a valid value",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/valid-lang?application=axeAPI",
"nodes": []
},
{
"id": "video-caption",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag122",
"section508",
"section508.22.a",
"TTv5",
"TT17.a",
"EN-301-549",
"EN-9.1.2.2"
],
"description": "Ensure <video> elements have captions",
"help": "<video> elements must have captions",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/video-caption?application=axeAPI",
"nodes": []
},
{
"id": "no-autoplay-audio",
"impact": null,
"tags": [
"cat.time-and-media",
"wcag2a",
"wcag142",
"TTv5",
"TT2.a",
"EN-301-549",
"EN-9.1.4.2",
"ACT"
],
"description": "Ensure <video> or <audio> elements do not autoplay audio for more than 3 seconds without a control mechanism to stop or mute the audio",
"help": "<video> or <audio> elements must not play automatically",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/no-autoplay-audio?application=axeAPI",
"nodes": []
}
],
"passes": [
{
"id": "aria-allowed-attr",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure an element's role supports its ARIA attributes",
"help": "Elements must only use supported ARIA attributes",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-allowed-attr?application=axeAPI",
"nodes": [
{
"any": [],
"all": [
{
"id": "aria-allowed-attr",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "ARIA attributes are used correctly for the defined role"
}
],
"none": [
{
"id": "aria-unsupported-attr",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "ARIA attribute is supported"
}
],
"impact": null,
"html": "<a href=\"#\" aria-label=\"LinkedIn\"><img src=\"https://placehold.co/24x24/ffffff/000000?text=in\" alt=\"LinkedIn\"></a>",
"target": [
"a[aria-label=\"LinkedIn\"]"
]
}
]
},
{
"id": "aria-conditional-attr",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure ARIA attributes are used as described in the specification of the element's role",
"help": "ARIA attributes must be used as specified for the element's role",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-conditional-attr?application=axeAPI",
"nodes": [
{
"any": [],
"all": [
{
"id": "aria-conditional-attr",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "ARIA attribute is allowed"
}
],
"none": [],
"impact": null,
"html": "<a href=\"#\" aria-label=\"LinkedIn\"><img src=\"https://placehold.co/24x24/ffffff/000000?text=in\" alt=\"LinkedIn\"></a>",
"target": [
"a[aria-label=\"LinkedIn\"]"
]
}
]
},
{
"id": "aria-hidden-body",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag131",
"wcag412",
"EN-301-549",
"EN-9.1.3.1",
"EN-9.4.1.2"
],
"description": "Ensure aria-hidden=\"true\" is not present on the document body.",
"help": "aria-hidden=\"true\" must not be present on the document body",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-hidden-body?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "aria-hidden-body",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "No aria-hidden attribute is present on document body"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<body>",
"target": [
"body"
]
}
]
},
{
"id": "aria-prohibited-attr",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure ARIA attributes are not prohibited for an element's role",
"help": "Elements must only use permitted ARIA attributes",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-prohibited-attr?application=axeAPI",
"nodes": [
{
"any": [],
"all": [],
"none": [
{
"id": "aria-prohibited-attr",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "ARIA attribute is allowed"
}
],
"impact": null,
"html": "<a href=\"#\" aria-label=\"LinkedIn\"><img src=\"https://placehold.co/24x24/ffffff/000000?text=in\" alt=\"LinkedIn\"></a>",
"target": [
"a[aria-label=\"LinkedIn\"]"
]
}
]
},
{
"id": "aria-valid-attr-value",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure all ARIA attributes have valid values",
"help": "ARIA attributes must conform to valid values",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-valid-attr-value?application=axeAPI",
"nodes": [
{
"any": [],
"all": [
{
"id": "aria-valid-attr-value",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "ARIA attribute values are valid"
},
{
"id": "aria-errormessage",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "aria-errormessage exists and references elements visible to screen readers that use a supported aria-errormessage technique"
},
{
"id": "aria-level",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "aria-level values are valid"
}
],
"none": [],
"impact": null,
"html": "<a href=\"#\" aria-label=\"LinkedIn\"><img src=\"https://placehold.co/24x24/ffffff/000000?text=in\" alt=\"LinkedIn\"></a>",
"target": [
"a[aria-label=\"LinkedIn\"]"
]
}
]
},
{
"id": "aria-valid-attr",
"impact": null,
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure attributes that begin with aria- are valid ARIA attributes",
"help": "ARIA attributes must conform to valid names",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-valid-attr?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "aria-valid-attr",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "ARIA attribute name is valid"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<a href=\"#\" aria-label=\"LinkedIn\"><img src=\"https://placehold.co/24x24/ffffff/000000?text=in\" alt=\"LinkedIn\"></a>",
"target": [
"a[aria-label=\"LinkedIn\"]"
]
}
]
},
{
"id": "button-name",
"impact": null,
"tags": [
"cat.name-role-value",
"wcag2a",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure buttons have discernible text",
"help": "Buttons must have discernible text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/button-name?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "button-has-visible-text",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "Element has inner text that is visible to screen readers"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<button class=\"faq-question\">\n What are the key application deadlines?\n <span class=\"faq-icon\">+</span>\n </button>",
"target": [
".faq-item:nth-child(1) > .faq-question"
]
}
]
},
{
"id": "bypass",
"impact": null,
"tags": [
"cat.keyboard",
"wcag2a",
"wcag241",
"section508",
"section508.22.o",
"TTv5",
"TT9.a",
"EN-301-549",
"EN-9.2.4.1"
],
"description": "Ensure each page has at least one mechanism for a user to bypass navigation and jump straight to the content",
"help": "Page must have means to bypass repeated blocks",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/bypass?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "internal-link-present",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "Valid skip link found"
},
{
"id": "header-present",
"data": null,
"relatedNodes": [
{
"html": "<h1>Aurora Institute</h1>",
"target": [
"h1"
]
},
{
"html": "<h2>Where Inquiry Meets <span>Innovation</span></h2>",
"target": [
".hero-content > h2"
]
},
{
"html": "<h3>12:1</h3>",
"target": [
".stat:nth-child(1) > h3"
]
},
{
"html": "<h3>8,400+</h3>",
"target": [
".stat:nth-child(2) > h3"
]
},
{
"html": "<h3>180+</h3>",
"target": [
".stat:nth-child(3) > h3"
]
},
{
"html": "<h3>75k</h3>",
"target": [
".stat:nth-child(4) > h3"
]
},
{
"html": "<h2>Find Your Program</h2>",
"target": [
"#academics > .container > .section-header.fade-in > h2"
]
},
{
"html": "<h3>M.S. in Data Science & Analytics</h3>",
"target": [
".program-card:nth-child(1) > h3"
]
},
{
"html": "<h3>Ph.D. in Neuroscience</h3>",
"target": [
".program-card:nth-child(2) > h3"
]
},
{
"html": "<h3>B.S. in Sustainable Architecture</h3>",
"target": [
".program-card:nth-child(3) > h3"
]
},
{
"html": "<h3>Certificate in Digital Marketing</h3>",
"target": [
".program-card:nth-child(4) > h3"
]
},
{
"html": "<h3>Ph.D. in Biomedical Engineering</h3>",
"target": [
".program-card:nth-child(5) > h3"
]
},
{
"html": "<h3>M.Ed. in Educational Psychology</h3>",
"target": [
".program-card:nth-child(6) > h3"
]
},
{
"html": "<h3>MFA in Creative Writing</h3>",
"target": [
".program-card:nth-child(7) > h3"
]
},
{
"html": "<h3>B.A. in Economics</h3>",
"target": [
".program-card:nth-child(8) > h3"
]
},
{
"html": "<h3>M.S. in Environmental Science</h3>",
"target": [
".program-card:nth-child(9) > h3"
]
},
{
"html": "<h2>The Aurora Advantage</h2>",
"target": [
".features > .container > .section-header.fade-in > h2"
]
},
{
"html": "<h3>Research Excellence</h3>",
"target": [
".feature-card:nth-child(1) > h3"
]
},
{
"html": "<h3>Hybrid Learning</h3>",
"target": [
".feature-card:nth-child(2) > h3"
]
},
{
"html": "<h3>Global Alumni Network</h3>",
"target": [
".feature-card:nth-child(3) > h3"
]
},
{
"html": "<h3>Career Launch</h3>",
"target": [
".feature-card:nth-child(4) > h3"
]
},
{
"html": "<h2>Research Excellence & Discovery</h2>",
"target": [
".research-content > h2"
]
},
{
"html": "<h3>Upcoming Events</h3>",
"target": [
"aside > h3"
]
},
{
"html": "<h4>Need Guidance?</h4>",
"target": [
".sidebar-cta > h4"
]
},
{
"html": "<h2>Featured Course Catalog</h2>",
"target": [
".catalog-header > h2"
]
},
{
"html": "<h3>M.S. in Data Science & Analytics</h3>",
"target": [
".course-item:nth-child(1) > .course-info > h3"
]
},
{
"html": "<h3>Ph.D. in Biomedical Engineering</h3>",
"target": [
".course-item:nth-child(2) > .course-info > h3"
]
},
{
"html": "<h3>Master of Architecture (Sustainable Design)</h3>",
"target": [
".course-item:nth-child(3) > .course-info > h3"
]
},
{
"html": "<h2>Alumni Network</h2>",
"target": [
".alumni-section > .container > .section-header.fade-in > h2"
]
},
{
"html": "<h2>Admissions & Enrollment FAQ</h2>",
"target": [
"#apply > .container > .section-header.fade-in > h2"
]
},
{
"html": "<h3>Aurora Institute</h3>",
"target": [
".footer-brand > h3"
]
},
{
"html": "<h4>Quick Links</h4>",
"target": [
".footer-col:nth-child(2) > h4"
]
},
{
"html": "<h4>Resources</h4>",
"target": [
".footer-col:nth-child(3) > h4"
]
},
{
"html": "<h4>Contact Us</h4>",
"target": [
".footer-col:nth-child(4) > h4"
]
}
],
"impact": "serious",
"message": "Page has a heading"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<html lang=\"en\">",
"target": [
"html"
]
}
]
},
{
"id": "color-contrast",
"impact": "serious",
"tags": [
"cat.color",
"wcag2aa",
"wcag143",
"TTv5",
"TT13.c",
"EN-301-549",
"EN-9.1.4.3",
"ACT"
],
"description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
"help": "Elements must meet minimum color contrast ratio thresholds",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#ffffff",
"bgColor": "#0f172a",
"contrastRatio": 17.85,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [],
"impact": "serious",
"message": "Element has sufficient color contrast of 17.85"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<a href=\"#apply\" class=\"nav-cta\">Apply Now</a>",
"target": [
".nav-cta"
]
}
]
},
{
"id": "document-title",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag242",
"TTv5",
"TT12.a",
"EN-301-549",
"EN-9.2.4.2",
"ACT"
],
"description": "Ensure each HTML document contains a non-empty <title> element",
"help": "Documents must have <title> element to aid in navigation",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/document-title?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "doc-has-title",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "Document has a non-empty <title> element"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<html lang=\"en\">",
"target": [
"html"
]
}
]
},
{
"id": "duplicate-id-aria",
"impact": null,
"tags": [
"cat.parsing",
"wcag2a",
"wcag412",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure every id attribute value used in ARIA and in labels is unique",
"help": "IDs used in ARIA and labels must be unique",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/duplicate-id-aria?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "duplicate-id-aria",
"data": "filter-level",
"relatedNodes": [],
"impact": "critical",
"message": "Document has no elements referenced with ARIA or labels that share the same id attribute"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<select id=\"filter-level\" class=\"form-control\">",
"target": [
"#filter-level"
]
}
]
},
{
"id": "form-field-multiple-labels",
"impact": null,
"tags": [
"cat.forms",
"wcag2a",
"wcag332",
"TTv5",
"TT5.c",
"EN-301-549",
"EN-9.3.3.2"
],
"description": "Ensure form field does not have multiple label elements",
"help": "Form field must not have multiple label elements",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/form-field-multiple-labels?application=axeAPI",
"nodes": [
{
"any": [],
"all": [],
"none": [
{
"id": "multiple-label",
"data": null,
"relatedNodes": [
{
"html": "<label for=\"filter-level\">Academic Level</label>",
"target": [
"label[for=\"filter-level\"]"
]
}
],
"impact": "moderate",
"message": "Form field does not have multiple label elements"
}
],
"impact": null,
"html": "<select id=\"filter-level\" class=\"form-control\">",
"target": [
"#filter-level"
]
}
]
},
{
"id": "html-has-lang",
"impact": null,
"tags": [
"cat.language",
"wcag2a",
"wcag311",
"TTv5",
"TT11.a",
"EN-301-549",
"EN-9.3.1.1",
"ACT"
],
"description": "Ensure every HTML document has a lang attribute",
"help": "<html> element must have a lang attribute",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-has-lang?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "has-lang",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "The <html> element has a lang attribute"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<html lang=\"en\">",
"target": [
"html"
]
}
]
},
{
"id": "html-lang-valid",
"impact": null,
"tags": [
"cat.language",
"wcag2a",
"wcag311",
"TTv5",
"TT11.a",
"EN-301-549",
"EN-9.3.1.1",
"ACT"
],
"description": "Ensure the lang attribute of the <html> element has a valid value",
"help": "<html> element must have a valid value for the lang attribute",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-lang-valid?application=axeAPI",
"nodes": [
{
"any": [],
"all": [],
"none": [
{
"id": "valid-lang",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "Value of lang attribute is included in the list of valid languages"
}
],
"impact": null,
"html": "<html lang=\"en\">",
"target": [
"html"
]
}
]
},
{
"id": "image-alt",
"impact": null,
"tags": [
"cat.text-alternatives",
"wcag2a",
"wcag111",
"section508",
"section508.22.a",
"TTv5",
"TT7.a",
"TT7.b",
"EN-301-549",
"EN-9.1.1.1",
"ACT"
],
"description": "Ensure <img> elements have alternative text or a role of none or presentation",
"help": "Images must have alternative text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/image-alt?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "has-alt",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "Element has an alt attribute"
}
],
"all": [],
"none": [
{
"id": "alt-space-value",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "Element has a valid alt attribute value"
}
],
"impact": null,
"html": "<img src=\"https://placehold.co/64x64/0f172a/f59e0b?text=AI\" alt=\"Aurora Institute Logo\">",
"target": [
"img[alt=\"Aurora Institute Logo\"]"
]
}
]
},
{
"id": "label",
"impact": null,
"tags": [
"cat.forms",
"wcag2a",
"wcag412",
"section508",
"section508.22.n",
"TTv5",
"TT5.c",
"EN-301-549",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure every form element has a label",
"help": "Form elements must have labels",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/label?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "explicit-label",
"data": null,
"relatedNodes": [
{
"html": "<label for=\"search-input\">Keyword Search</label>",
"target": [
"label[for=\"search-input\"]"
]
}
],
"impact": "critical",
"message": "Element has an explicit <label>"
},
{
"id": "non-empty-placeholder",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "Element has a placeholder attribute"
}
],
"all": [],
"none": [
{
"id": "hidden-explicit-label",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "Form element has a visible explicit <label>"
}
],
"impact": null,
"html": "<input type=\"text\" id=\"search-input\" class=\"form-control\" placeholder=\"e.g. Data, Biology, Design...\">",
"target": [
"#search-input"
]
}
]
},
{
"id": "link-name",
"impact": null,
"tags": [
"cat.name-role-value",
"wcag2a",
"wcag244",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.2.4.4",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure links have discernible text",
"help": "Links must have discernible text",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/link-name?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "has-visible-text",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "Element has text that is visible to screen readers"
}
],
"all": [],
"none": [
{
"id": "focusable-no-name",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "Element is not in tab order or has accessible text"
}
],
"impact": null,
"html": "<a href=\"#home\">Home</a>",
"target": [
"a[href$=\"#home\"]"
]
}
]
},
{
"id": "list",
"impact": null,
"tags": [
"cat.structure",
"wcag2a",
"wcag131",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure that lists are structured correctly",
"help": "<ul> and <ol> must only directly contain <li>, <script> or <template> elements",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/list?application=axeAPI",
"nodes": [
{
"any": [],
"all": [],
"none": [
{
"id": "only-listitems",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "List element only has direct children that are allowed inside <li> elements"
}
],
"impact": null,
"html": "<ul>",
"target": [
"nav > ul"
]
}
]
},
{
"id": "listitem",
"impact": null,
"tags": [
"cat.structure",
"wcag2a",
"wcag131",
"EN-301-549",
"EN-9.1.3.1"
],
"description": "Ensure <li> elements are used semantically",
"help": "<li> elements must be contained in a <ul> or <ol>",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/listitem?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "listitem",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "List item has a <ul>, <ol> or role=\"list\" parent element"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<li><a href=\"#home\">Home</a></li>",
"target": [
"nav > ul > li:nth-child(1)"
]
}
]
},
{
"id": "meta-viewport",
"impact": null,
"tags": [
"cat.sensory-and-visual-cues",
"wcag2aa",
"wcag144",
"EN-301-549",
"EN-9.1.4.4",
"ACT"
],
"description": "Ensure <meta name=\"viewport\"> does not disable text scaling and zooming",
"help": "Zooming and scaling must not be disabled",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/meta-viewport?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "meta-viewport",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "<meta> tag does not disable zooming on mobile devices"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
"target": [
"meta[name=\"viewport\"]"
]
}
]
},
{
"id": "nested-interactive",
"impact": null,
"tags": [
"cat.keyboard",
"wcag2a",
"wcag412",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.4.1.2"
],
"description": "Ensure interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies",
"help": "Interactive controls must not be nested",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/nested-interactive?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "no-focusable-content",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "Element does not have focusable descendants"
}
],
"all": [],
"none": [],
"impact": null,
"html": "<img src=\"https://placehold.co/64x64/0f172a/f59e0b?text=AI\" alt=\"Aurora Institute Logo\">",
"target": [
"img[alt=\"Aurora Institute Logo\"]"
]
}
]
},
{
"id": "select-name",
"impact": null,
"tags": [
"cat.forms",
"wcag2a",
"wcag412",
"section508",
"section508.22.n",
"TTv5",
"TT5.c",
"EN-301-549",
"EN-9.4.1.2",
"ACT"
],
"description": "Ensure select element has an accessible name",
"help": "Select element must have an accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/select-name?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "explicit-label",
"data": null,
"relatedNodes": [
{
"html": "<label for=\"filter-level\">Academic Level</label>",
"target": [
"label[for=\"filter-level\"]"
]
}
],
"impact": "critical",
"message": "Element has an explicit <label>"
}
],
"all": [],
"none": [
{
"id": "hidden-explicit-label",
"data": null,
"relatedNodes": [],
"impact": "critical",
"message": "Form element has a visible explicit <label>"
}
],
"impact": null,
"html": "<select id=\"filter-level\" class=\"form-control\">",
"target": [
"#filter-level"
]
}
]
},
{
"id": "target-size",
"impact": null,
"tags": [
"cat.sensory-and-visual-cues",
"wcag22aa",
"wcag258"
],
"description": "Ensure touch targets have sufficient size and space",
"help": "All touch targets must be 24px large, or leave sufficient space",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/target-size?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "target-offset",
"data": {
"closestOffset": 24,
"minOffset": 24
},
"relatedNodes": [],
"impact": "serious",
"message": "Target has sufficient space from its closest neighbors. Safe clickable space has a diameter of 24px which is at least 24px."
}
],
"all": [],
"none": [],
"impact": null,
"html": "<a href=\"#home\">Home</a>",
"target": [
"a[href$=\"#home\"]"
]
}
]
}
],
"incomplete": [
{
"id": "color-contrast",
"impact": "serious",
"tags": [
"cat.color",
"wcag2aa",
"wcag143",
"TTv5",
"TT13.c",
"EN-301-549",
"EN-9.1.4.3",
"ACT"
],
"description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
"help": "Elements must meet minimum color contrast ratio thresholds",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": null,
"bgColor": null,
"contrastRatio": 0,
"fontSize": "18.0pt (24px)",
"fontWeight": "bold",
"messageKey": "bgGradient",
"expectedContrastRatio": "3:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<header class=\"site-header\" id=\"header\">",
"target": [
"#header"
]
},
{
"html": "<section class=\"hero\" id=\"home\">",
"target": [
"#home"
]
}
],
"impact": "serious",
"message": "Element's background color could not be determined due to a background gradient"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<h1>Aurora Institute</h1>",
"target": [
"h1"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined due to a background gradient"
}
]
}
],
"violations": [
{
"id": "color-contrast",
"impact": "serious",
"tags": [
"cat.color",
"wcag2aa",
"wcag143",
"TTv5",
"TT13.c",
"EN-301-549",
"EN-9.1.4.3",
"ACT"
],
"description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
"help": "Elements must meet minimum color contrast ratio thresholds",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#64748b",
"bgColor": "#0f172a",
"contrastRatio": 3.75,
"fontSize": "10.8pt (14.4px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<footer class=\"site-footer\" id=\"contact\">",
"target": [
"#contact"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<div>\u00a9 <span id=\"current-year\">2026</span> Aurora Institute. All rights reserved.</div>",
"target": [
".footer-bottom > div:nth-child(1)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#64748b",
"bgColor": "#0f172a",
"contrastRatio": 3.75,
"fontSize": "10.8pt (14.4px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<footer class=\"site-footer\" id=\"contact\">",
"target": [
"#contact"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<span id=\"current-year\">2026</span>",
"target": [
"#current-year"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#64748b",
"bgColor": "#0f172a",
"contrastRatio": 3.75,
"fontSize": "10.8pt (14.4px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<footer class=\"site-footer\" id=\"contact\">",
"target": [
"#contact"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#\">Privacy Policy</a>",
"target": [
".footer-bottom-links > a[href=\"#\"]:nth-child(1)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#64748b",
"bgColor": "#0f172a",
"contrastRatio": 3.75,
"fontSize": "10.8pt (14.4px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<footer class=\"site-footer\" id=\"contact\">",
"target": [
"#contact"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#\">Terms of Service</a>",
"target": [
".footer-bottom-links > a[href=\"#\"]:nth-child(2)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#64748b",
"bgColor": "#0f172a",
"contrastRatio": 3.75,
"fontSize": "10.8pt (14.4px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<footer class=\"site-footer\" id=\"contact\">",
"target": [
"#contact"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#\">Accessibility</a>",
"target": [
".footer-bottom-links > a[href=\"#\"]:nth-child(3)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#64748b",
"bgColor": "#0f172a",
"contrastRatio": 3.75,
"fontSize": "10.8pt (14.4px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<footer class=\"site-footer\" id=\"contact\">",
"target": [
"#contact"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#\">Sitemap</a>",
"target": [
".footer-bottom-links > a[href=\"#\"]:nth-child(4)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 3.75 (foreground color: #64748b, background color: #0f172a, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(1)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(1) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(2)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(2) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(3)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(3) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(4)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(4) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(5)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(5) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(6)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(6) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(7)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(7) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(8)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(8) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "11.4pt (15.2px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<div class=\"program-card\">",
"target": [
".program-card:nth-child(9)"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#apply\" class=\"program-link\">Program Details \u2192</a>",
"target": [
".program-card:nth-child(9) > div:nth-child(4) > .program-link[href$=\"#apply\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 11.4pt (15.2px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "10.2pt (13.6px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<aside class=\"sidebar fade-in visible\">",
"target": [
"aside"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<div class=\"event-date\">Oct 15, 2024</div>",
"target": [
".event-item:nth-child(1) > .event-date"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "10.2pt (13.6px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<aside class=\"sidebar fade-in visible\">",
"target": [
"aside"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<div class=\"event-date\">Oct 28, 2024</div>",
"target": [
".event-item:nth-child(2) > .event-date"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "10.2pt (13.6px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<aside class=\"sidebar fade-in visible\">",
"target": [
"aside"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<div class=\"event-date\">Nov 05, 2024</div>",
"target": [
".event-item:nth-child(3) > .event-date"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#f59e0b",
"bgColor": "#ffffff",
"contrastRatio": 2.14,
"fontSize": "10.2pt (13.6px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<aside class=\"sidebar fade-in visible\">",
"target": [
"aside"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<div class=\"event-date\">Nov 22, 2024</div>",
"target": [
".event-item:nth-child(4) > .event-date"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 2.14 (foreground color: #f59e0b, background color: #ffffff, font size: 10.2pt (13.6px), font weight: bold). Expected contrast ratio of 4.5:1"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"fgColor": "#64748b",
"bgColor": "#f3f3f4",
"contrastRatio": 4.29,
"fontSize": "9.6pt (12.8px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "4.5:1",
"shadowColor": null
},
"relatedNodes": [
{
"html": "<header class=\"site-header scrolled\" id=\"header\">",
"target": [
"#header"
]
},
{
"html": "<a href=\"#contact\" class=\"btn btn-primary\">Schedule a Call</a>",
"target": [
".sidebar-cta > .btn-primary.btn[href$=\"#contact\"]"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 4.29 (foreground color: #64748b, background color: #f3f3f4, font size: 9.6pt (12.8px), font weight: normal). Expected contrast ratio of 4.5:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<div class=\"tagline\">Illuminate Your Future</div>",
"target": [
".tagline"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 4.29 (foreground color: #64748b, background color: #f3f3f4, font size: 9.6pt (12.8px), font weight: normal). Expected contrast ratio of 4.5:1"
}
]
}
],
"coverage": {
"contract": "main-document-vertical-scroll",
"complete": true,
"positions": [
{
"y": 0,
"height": 8662
},
{
"y": 576,
"height": 8662
},
{
"y": 1152,
"height": 8662
},
{
"y": 1728,
"height": 8662
},
{
"y": 2304,
"height": 8662
},
{
"y": 2880,
"height": 8662
},
{
"y": 3456,
"height": 8662
},
{
"y": 4032,
"height": 8662
},
{
"y": 4608,
"height": 8662
},
{
"y": 5184,
"height": 8662
},
{
"y": 5760,
"height": 8662
},
{
"y": 6336,
"height": 8662
},
{
"y": 6912,
"height": 8662
},
{
"y": 7488,
"height": 8662
},
{
"y": 7942,
"height": 8662
}
],
"scans": 16,
"max_states": 512,
"settle_ms": 5000,
"page_timeout_seconds": 150,
"layout_stability": "consecutive 100ms size samples within one CSS pixel",
"animation_settling": "finite animations present when scroll resources are ready finish or are cancelled",
"interactive_states": "not exercised",
"horizontal_scroll": "not exercised"
}
}
System Prompt
You are a lead web developer at a top digital agency, tasked with creating a one-page website for a new client based on the given specifications, delivered as an HTML file. First non-whitespace char '<', last non-whitespace char '>'. Use the following services to generate placeholder images where needed:
- placehold.co (text): https://placehold.co/[{w}x{h}|{size}][/{bg-color}/{text-color}]?text={text}&font=[lato|lora|montserrat|noto sans|open sans|oswald|playfair display|poppins|pt sans|raleway|roboto|source sans|source sans pro]
- picsum.photos (photos): https://picsum.photos/[{w}/{h}|{size}]?[grayscale][&blur={1-10}]
- pravatar.cc (avatars): https://i.pravatar.cc/{size}?u={identifier}
Choose sizes appropriate to layout.
User Prompt
Create a **complete, polished, production-quality** primary web page for a new client in the "Education" sector.
Your goal is to generate the full HTML code for a page that is not just functional but also visually compelling, content-rich, and feels like a finished product ready for launch.
**Client & Category:**
- Industry: "Education"
- Description: Educational resources, school and university information, and online learning platforms.
**Your Creative Task:**
1. **Invent:** Create a unique, professional-sounding site name and a strong tagline fitting the "Education" category.
2. **Define Page:** Determine the most effective primary page type (e.g., homepage, service landing page, category portal) to showcase this fictional entity.
3. **Design:** Develop an opinionated, modern, and professional layout. Make distinct choices about structure and flow.
**Content & Structure Requirements (Deliver a COMPLETE page):**
- **Overall:** The final page must feel substantial and complete, with realistic amounts of text (multiple paragraphs per section where appropriate, avoid single sentences), well-integrated placeholder images, and logical flow. It should look like a real website a business would proudly use.
- **HEADER:** Include the invented site name, tagline, a logo placeholder image, and a primary navigation bar. Ensure the navigation has **at least 5-7 clearly defined, relevant links** including: "Contact", "Apply", "Library".
- **MAIN CONTENT:** Structure this area with **at least 3-4 distinct, well-developed sections**.
- Address key topics relevant to the "Education" category. Consider themes similar to: "Research Excellence", "Alumni Network", "Course Catalog".
- **Content Depth:** Populate each section with **substantial, realistic text** (multiple sentences/paragraphs). Use authentic industry language and terminology like: "thesis", "academic calendar", "enrollment".
- **Visuals:** Integrate relevant placeholder images logically within the content sections.
- **Calls to Action:** Include clear and contextually relevant CTAs. Use strong verbs similar to: "View Courses", "Meet Faculty", "Download Catalog".
- **ENGAGEMENT (Recommended):** Strongly consider incorporating **one meaningful interactive element** that would genuinely benefit a user in the "Education" sector. Ideas similar but not limited to: "program finder".
- **SIDEBAR (Optional):** If your design includes a sidebar, populate it with **useful, relevant content**. Ideas: "events calendar", "faculty highlights", "scholarship opportunities".
- **FOOTER:** Include a professional footer with invented contact details, copyright (current year), social media links, and standard links (Privacy, Terms).
- **MODERN WEB PATTERNS:** Include modern web patterns like testimonial cards, feature grids, or FAQ accordions where appropriate.