feat(home): compact value-prop line on the mobile hero (P1.7)
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 13s
Build and Push Docker Images / Build Frontend (Next.js) (push) Successful in 48s
Build and Push Docker Images / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Build and Push Docker Images / Trigger Portainer Update (push) Successful in 1s
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 13s
Build and Push Docker Images / Build Frontend (Next.js) (push) Successful in 48s
Build and Push Docker Images / Build Pipeline (Meltano + dbt + Airflow) (push) Successful in 13s
Build and Push Docker Images / Trigger Portainer Update (push) Successful in 1s
Phones showed only the poetic h1 and a bare search box — no coverage,
scope, or freshness statement above the fold for the 63%-of-entries,
56%-mobile audience. One compact line ('24,000+ English schools — SATs,
GCSEs, Ofsted & admissions, side by side. Updated for 2026/27') now
replaces the hidden eyebrow + full paragraph at ≤640px, costing ~2 short
lines. Desktop copy unchanged.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -62,6 +62,11 @@
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Copy variants: full paragraph ≥641px, compact merged line on phones. */
|
||||
.heroDescriptionCompact {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.heroSection {
|
||||
padding-top: 1.5rem;
|
||||
@@ -74,18 +79,29 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* Above the fold on phones, every line costs. Drop the eyebrow tag and the
|
||||
long descriptive paragraph — the h1 already names the product, and the
|
||||
search input is the primary action users came to perform. */
|
||||
/* Above the fold on phones, every line costs. Drop the eyebrow tag and swap
|
||||
the long descriptive paragraph for one compact line that carries coverage
|
||||
("24,000+ schools") and freshness ("updated for 2026/27") — a first-time
|
||||
visitor otherwise sees only a poetic h1 and a bare box, with no reason to
|
||||
trust the data (audit P1.7, feeds the 46% home exit rate). */
|
||||
@media (max-width: 640px) {
|
||||
.heroSection {
|
||||
padding-top: 0.75rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.heroEyebrow,
|
||||
.heroDescription {
|
||||
.heroDescriptionFull {
|
||||
display: none;
|
||||
}
|
||||
.heroDescriptionCompact {
|
||||
display: block;
|
||||
}
|
||||
.heroDescription {
|
||||
font-size: 0.85rem;
|
||||
line-height: 1.4;
|
||||
max-width: 320px;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
.heroTitle {
|
||||
font-size: 1.65rem;
|
||||
}
|
||||
|
||||
@@ -267,7 +267,15 @@ export function HomeView({ initialSchools, filters, totalSchools, howItWorks, ed
|
||||
Every school in England, <em className={styles.heroEmph}>compared.</em>
|
||||
</h1>
|
||||
<p className={styles.heroDescription}>
|
||||
<strong>24,000+ primary and secondary schools</strong> with Key Stage 2 SATs, GCSE results, Ofsted grades, progress scores and admissions data — side by side, in one place.
|
||||
{/* Full copy for larger screens; a compact merged line (coverage +
|
||||
freshness, standing in for the hidden eyebrow too) on phones,
|
||||
where every line above the fold costs. */}
|
||||
<span className={styles.heroDescriptionFull}>
|
||||
<strong>24,000+ primary and secondary schools</strong> with Key Stage 2 SATs, GCSE results, Ofsted grades, progress scores and admissions data — side by side, in one place.
|
||||
</span>
|
||||
<span className={styles.heroDescriptionCompact}>
|
||||
<strong>24,000+ English schools</strong> — SATs, GCSEs, Ofsted & admissions, side by side. Updated for 2026/27.
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user