diff options
author | danielkvist <d94.zaragoza@gmail.com> | 2018-12-27 14:45:05 +0300 |
---|---|---|
committer | danielkvist <d94.zaragoza@gmail.com> | 2018-12-27 15:10:51 +0300 |
commit | 60f2bba9f6390087cbcb893670f2623efb7fee4c (patch) | |
tree | 8fbedbae277e1418ae9b018d82a06b9c6483c978 /layouts | |
parent | dd6ff2bc44a4457a39d4bc16e31a179820216554 (diff) |
improve accessibility
Diffstat (limited to 'layouts')
-rw-r--r-- | layouts/contact/list.html | 11 | ||||
-rw-r--r-- | layouts/partials/cta-btn.html | 2 | ||||
-rw-r--r-- | layouts/partials/footer.html | 5 | ||||
-rw-r--r-- | layouts/partials/hamburger-menu.html | 2 |
4 files changed, 13 insertions, 7 deletions
diff --git a/layouts/contact/list.html b/layouts/contact/list.html index fe7d774..84edd78 100644 --- a/layouts/contact/list.html +++ b/layouts/contact/list.html @@ -15,26 +15,29 @@ <div class="contact-field contact-field--name"> <label for="{{ $.Site.Params.form.inputNameName }}">{{ $.Site.Params.form.inputNameLabel }}</label> <input type="text" name="{{ $.Site.Params.form.inputNameName }}" placeholder="{{ $.Site.Params.form.inputNamePlaceholder }}" - class="contact-form__input contac-form__name" required> + class="contact-form__input contac-form__name" id="{{ $.Site.Params.form.inputNameName }}" + aria-labelledby="{{ $.Site.Params.form.inputNameName }}" required> </div> <!-- Email --> <div class="contact-field contac-fiel--email"> <label for="{{ $.Site.Params.form.inputEmailName }}">{{ $.Site.Params.form.inputEmailLabel }}</label> <input type="email" name="{{ $.Site.Params.form.inputEmailName }}" placeholder="{{ $.Site.Params.form.inputEmailPlaceholder }}" - class="contact-form__input contac-form__email" required> + class="contact-form__input contac-form__email" id="{{ $.Site.Params.form.inputEmailName }}" + aria-labelledby="{{ $.Site.Params.form.InputEmailName }}" required> </div> <!-- Message --> <div class="contact-field contact-field--msg"> <label for="{{ $.Site.Params.form.inputMsgName }}">{{ $.Site.Params.form.inputMsgLabel }}</label> <textarea name="{{ $.Site.Params.form.inputMsgName }}" id="{{ $.Site.Params.form.inputMsgName }}" form="contact-form" - maxlength="{{ $.Site.Params.form.inputMsgLength }}" required></textarea> + maxlength="{{ $.Site.Params.form.inputMsgLength }}" id="{{ $.Site.Params.form.inputMsgName }}" + arial-labelledby="{{ $.Site.Params.form.InputMsgName }}" required></textarea> </div> <!-- Submit --> <div class="contact-field contact-field--submit"> - <button type="submit" class="ripple-btn submit" onclick="cleanForm"> + <button type="submit" class="ripple-btn submit" onclick="cleanForm" aria-label="{{ $.Site.Params.form.inputSubmitValue }}"> {{ $.Site.Params.form.inputSubmitValue }} </button> </div> diff --git a/layouts/partials/cta-btn.html b/layouts/partials/cta-btn.html index 1d0e538..1513bb5 100644 --- a/layouts/partials/cta-btn.html +++ b/layouts/partials/cta-btn.html @@ -3,6 +3,6 @@ {{ $pre = "mailto:" }} {{ end }} -<a href="{{ $pre }}{{ .Site.Params.cta.link }}" class="ripple-btn cta__btn" alt="{{ .Site.Params.cta.cta }}"> +<a href="{{ $pre }}{{ .Site.Params.cta.link }}" class="ripple-btn cta__btn" alt="{{ .Site.Params.cta.cta }}" aria-label="{{ .Site.Params.cta.cta }}}"> {{ .Site.Params.cta.cta }} </a>
\ No newline at end of file diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 2b595f3..a8530e7 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -2,7 +2,10 @@ <div class="footer__social"> {{ range $k, $v := .Site.Params.social }} {{ if $v}} - <a href="{{ $v }}" class="footer__social__link" alt="{{ $k }}" target="_blank"><span><i class="fab fa-{{ $k }}"></i></span> + <a href="{{ $v }}" class="footer__social__link" alt="{{ $k }}" target="_blank" aria-label="{{ $v }}"> + <span> + <i class="fab fa-{{ $k }}"></i> + </span> </a> {{ end }} {{ end }} diff --git a/layouts/partials/hamburger-menu.html b/layouts/partials/hamburger-menu.html index e15d2a8..63e0c6f 100644 --- a/layouts/partials/hamburger-menu.html +++ b/layouts/partials/hamburger-menu.html @@ -1,6 +1,6 @@ <nav class="hamburger-menu"> <div class="toggle"> - <input type="checkbox" class="hamburger__toggle" id="hamburger__toggle"> + <input type="checkbox" class="hamburger__toggle" id="hamburger__toggle" name="hamburger toggle" aria-label="Hamburguer menu"> <label class="hamburger__toggle__icon" for="hamburger__toggle"> <i class="fas fa-bars"></i> </label> |