Skip to content
This repository has been archived by the owner on Apr 25, 2024. It is now read-only.

added main benchmark to all pages, labeled all footer buttons, labele… #1005

Merged
merged 5 commits into from
Jul 8, 2020
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
16 changes: 8 additions & 8 deletions src/components/FooterSection.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<div class="container">
<div class="columns">
<div class="column">
<a href="https://creativecommons.org" class="main-logo margin-bottom-bigger has-text-white">
<a aria-label="Creative Commons Home Page" href="https://creativecommons.org" class="main-logo margin-bottom-bigger has-text-white">
<svg xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 304 73">
Expand All @@ -20,22 +20,22 @@
<a href="tel://+1-415-429-6753" class="phone">+1-415-429-6753</a>

<div class="margin-vertical-large">
<a href="https://www.instagram.com/creativecommons" class="social has-text-white" target="_blank" rel="noopener">
<a aria-label="Instagram" href="https://www.instagram.com/creativecommons" class="social has-text-white" target="_blank" rel="noopener">
<i class="icon instagram margin-right-small is-size-4" />
</a>
<a href="https://www.twitter.com/creativecommons" class="social has-text-white" target="_blank" rel="noopener">
<a aria-label="Twitter" href="https://www.twitter.com/creativecommons" class="social has-text-white" target="_blank" rel="noopener">
<i class="icon twitter margin-right-small is-size-4" />
</a>
<a href="https://www.facebook.com/creativecommons" class="social has-text-white" target="_blank" rel="noopener">
<a aria-label="Facebook" href="https://www.facebook.com/creativecommons" class="social has-text-white" target="_blank" rel="noopener">
<i class="icon facebook margin-right-small is-size-4" />
</a>
<a href="https://www.linkedin.com/company/creative-commons/" class="social has-text-white" target="_blank" rel="noopener">
<a aria-label="Linkedin" href="https://www.linkedin.com/company/creative-commons/" class="social has-text-white" target="_blank" rel="noopener">
<i class="icon linkedin margin-right-small is-size-4" />
</a>
</div>
</div>
<div class="column is-half">
<nav class="footer-navigation">
<nav aria-label="footerlinks" class="footer-navigation">
<ul class="menu">
<li>
<a class="menu-item" href="https://creativecommons.org/about/contact/">Contact</a>
Expand Down Expand Up @@ -71,14 +71,14 @@
</div>
</div>
<div class="column">
<aside class="donate-section">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I guess it would be better to leave the markup of this tag to be aside itself since it follows the rules of good HTML semantics and also helps in improving accessibility.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I changed that because OP's csv file reported this issue:https://dequeuniversity.com/rules/axe/3.3/landmark-complementary-is-top-level

I've seen aside used in main all the time, but this aside seems to be contained in a column

. Since there's already a container grid structure, I think the aside tag is out of place. It's not a big issue, I will change it back.

I am not that familiar with aria-labels, usually framework handles it, glad you point out my inconsistency, I will change them lower cases and maybe tighten up the naming as well.

<div class="donate-section">
<h5>Our work relies on you!</h5>
<p>Help us keep the internet free and open.</p>
<a class="button small donate" href="http://creativecommons.org/donate">
<i class="icon cc-letterheart margin-right-small is-size-5 padding-top-smaller" />
Donate now
</a>
</aside>
</div>
</div>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/components/NavSection.vue
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<template>
<nav class="navbar small">
<nav aria-label="Primary" class="navbar small">
<div class="navbar-brand">
<a class="logo" href="/">
<img alt="Logo" src="/static/logos/products/search.svg">
Expand Down
4 changes: 2 additions & 2 deletions src/pages/AboutPage.vue
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div class="about-page">
<header-section showNavSearch="true"></header-section>
<div class="margin-normal">
<main class="margin-normal">
<h2>About CC Search</h2>
<p>
CC Search is a tool that allows openly licensed and public domain works to be discovered
Expand Down Expand Up @@ -60,7 +60,7 @@
</tr>
</tbody>
</table>
</div>
</main>
<footer-section></footer-section>
</div>
</template>
Expand Down
4 changes: 2 additions & 2 deletions src/pages/CollectionsPage.vue
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div>
<header-section></header-section>
<div class="collections-page padding-larger">
<main class="collections-page padding-larger">
<h1>Browse collections</h1>
<h2 class="margin-bottom-normal">Museum Collections</h2>
<div class="providers-list columns is-multiline">
Expand All @@ -16,7 +16,7 @@
:key="index"
:provider="provider" />
</div>
</div>
</main>
<footer-section></footer-section>
</div>
</template>
Expand Down
4 changes: 2 additions & 2 deletions src/pages/FeedbackPage.vue
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div class="feedback-page">
<header-section showNavSearch="true"></header-section>
<div class="margin-larger">
<main class="margin-larger">
<h1 id="feedback">Feedback</h1>
<p>
Thank you for using CC Search! We welcome your ideas for improving the tool below.
Expand Down Expand Up @@ -49,7 +49,7 @@
</div>
</section>
</div>
</div>
</main>
<footer-section></footer-section>
</div>
</template>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/HomePage.vue
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div class="home-page grid-container full">
<header-section></header-section>
<hero-section></hero-section>
<hero-section role="main"></hero-section>
<footer-section></footer-section>
</div>
</template>
Expand Down
4 changes: 2 additions & 2 deletions src/pages/NotFoundPage.vue
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
<template>
<div class="grid-container full">
<header-section></header-section>
<div class="not-found">
<main class="not-found">
Page Not Found
</div>
</main>
<footer-section></footer-section>
</div>
</template>
Expand Down
4 changes: 2 additions & 2 deletions src/pages/SearchHelpPage.vue
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div class="page">
<header-section showNavSearch="true"></header-section>
<div class="margin-larger">
<main class="margin-larger">
<h2 class="margin-vertical-normal">CC Search Syntax Guide</h2>
<p>
When you search, you can enter special symbols or words to your search term
Expand Down Expand Up @@ -117,7 +117,7 @@
This will search for images that match strings close to the term "theatre" with a difference
of one character. Results might include terms with different spellings like "theater".
</p>
</div>
</main>
<footer-section></footer-section>
</div>
</template>
Expand Down