Switched most h1's for h2's. Also top two I had as h1 to paragraphs, neither is really a title/heading, both have importance. (Given "Powered by Technology" is in bold, one might argue its could be an h1)

Suggestion to consider h1 & accessibility from Matt@Frontend Mentor
This commit is contained in:
Robert McGovern 2020-09-28 13:06:27 +01:00
parent 06985ea3c0
commit 8243501927
2 changed files with 11 additions and 11 deletions

View File

@ -54,7 +54,7 @@ body {
text-align: center;
}
.topSection h1 {
.topSection > .title {
font-size: calc(24px + (35 - 24) * ((100vw - 375px) / (1440 - 375)));
}

View File

@ -20,8 +20,8 @@
<main>
<div class="flexContainer">
<div class="topSection">
<h1 class="title1">Reliable, efficient delivery</h1>
<h1 class="title2">Powered by Technology</h1>
<p class="title title1">Reliable, efficient delivery</p>
<p class="title title2">Powered by Technology</h2>
<p class="blurb">Our Artificial Intelligence powered tools use millions of project data points
to ensure that your project is successful</p>
</div>
@ -29,9 +29,9 @@
<div class="middleSection">
<div class="column">
<div class="supervisor card">
<h1 class="card-title">
<h2 class="card-title">
Supervisor
</h1>
</h2>
<p class="card-blurb">
Monitors activity to identify project roadblocks
</p>
@ -41,18 +41,18 @@
<div class="column">
<div class="teamBuilder card">
<h1 class="card-title">
<h2 class="card-title">
Team Builder
</h1>
</h2>
<p class="card-blurb">
Scans our talent network to create the optimal team for your project
</p>
<img class="card-image" src="images/icon-team-builder.svg" alt="Team building icon">
</div>
<div class="karma card">
<h1 class="card-title">
<h2 class="card-title">
Karma
</h1>
</h2>
<p class="card-blurb">
Regularly evaluates our talent to ensure quality
</p>
@ -61,9 +61,9 @@
</div>
<div class="column">
<div class="calculator card">
<h1 class="card-title">
<h2 class="card-title">
Calculator
</h1>
</h2>
<p class="card-blurb">
Uses data from past projects to provide better delivery estimates
</p>