Prechádzať zdrojové kódy

Accessibility and SEO improvements (#296)

Co-authored-by: JCabak <kubaczento@gmail.com>
Jakub Cabak 4 rokov pred
rodič
commit
19c2edb08d

+ 1 - 1
layouts/_default/single.html

@@ -59,7 +59,7 @@
         <!--- Improve this page button --->
         {{ if site.Params.GitRepo }}
           <div class="btn-improve-page">
-              <a href="{{ site.Params.GitRepo }}/edit/{{ site.Params.GitBranch }}/content/{{ .File.Path }}" target="_blank">
+              <a href="{{ site.Params.GitRepo }}/edit/{{ site.Params.GitBranch }}/content/{{ .File.Path }}" title="{{ i18n "improve_this_page" }}" target="_blank" rel="noopener">
                 <i class="fas fa-code-branch"></i>
                 {{ i18n "improve_this_page" }}
               </a>

+ 1 - 1
layouts/index.html

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="{{ .Site.Language.Lang }}">
   <head>
     <title>{{- .Site.Title -}}</title>
     {{ $siteDescription := .Site.Params.description }}

+ 2 - 2
layouts/partials/cards/accomplishments.html

@@ -3,7 +3,7 @@
     <div class="card-header">
       <h5 class="card-title mb-0">{{ .name }}</h5>
       <div class="sub-title">
-        <span><a href="{{ .organization.url }}" target="_blank">{{ .organization.name }}</a></span>
+        <span><a href="{{ .organization.url }}" title="{{ .organization.name }}" target="_blank" rel="noopener">{{ .organization.name }}</a></span>
         <span class="ml-2">{{ .timeline }}</span>
       </div>
     </div>
@@ -12,7 +12,7 @@
     </div>
     <div class="card-footer">
       {{ if .certificateURL }}
-        <a class="btn btn-outline-info ml-1 pl-2 mb-2" href="{{ .certificateURL }}" target="_blank" role="button">{{ i18n "view_certificate"}}</a>
+        <a class="btn btn-outline-info ml-1 pl-2 mb-2" href="{{ .certificateURL }}" target="_blank" rel="noopener" role="button">{{ i18n "view_certificate"}}</a>
       {{ end }}
     </div>
   </div>

+ 1 - 1
layouts/partials/cards/project.html

@@ -4,7 +4,7 @@
 >
   <div class="card mt-1">
     <div class="card">
-      <a class="card-header" href="{{ if .repo }}{{ .repo }}{{ else if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}" {{ if or .repo .url }}target="_blank"{{ end }}>
+      <a class="card-header" href="{{ if .repo }}{{ .repo }}{{ else if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}" {{ if or .repo .url }}target="_blank" rel="noopener"{{ end }}>
         <div>
           <div class="d-flex">
             {{ if .logo }}

+ 2 - 2
layouts/partials/cards/recent-post.html

@@ -1,5 +1,5 @@
 <div class="col-lg-4 col-md-6 pt-2 post-card">
-  <a href="{{ .RelPermalink }}" class="post-card-link">
+  <a href="{{ .RelPermalink }}" title="{{ .Title }}" class="post-card-link">
     <div class="card">
       <div class="card-head">
         <img class="card-img-top" src='{{ partial "helpers/get-hero.html" . }}'
@@ -12,7 +12,7 @@
       </div>
       <div class="card-footer">
         <span class="float-left">{{ .Date.Format "January 2, 2006" }}</span>
-        <a href="{{ .RelPermalink }}" class="float-right btn btn-outline-info btn-sm">{{ i18n "read" }}</a>
+        <a href="{{ .RelPermalink }}" title="{{ i18n "read" }}" class="float-right btn btn-outline-info btn-sm">{{ i18n "read" }}</a>
       </div>
     </div>
   </a>

+ 1 - 1
layouts/partials/cards/skill.html

@@ -1,5 +1,5 @@
 <div class="col-xs-12 col-sm-6 col-lg-4 pt-2">
-  <a class="skill-card-link" href="{{ if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}" {{ if .url }}target="_blank"{{ end }}>
+  <a class="skill-card-link" {{ if .url }}href="{{ .url }}" title="{{ .name }}" target="_blank" rel="noopener"{{ end }}>
     <div class="card">
       <div class="card-head d-flex">
         {{ if .logo }}

+ 2 - 2
layouts/partials/footer.html

@@ -92,14 +92,14 @@
   <div class="container">
     <div class="row text-left">
       <div class="col-md-4">
-        <a id="theme" href="https://github.com/hossainemruz/toha" target="_blank">
+        <a id="theme" href="https://github.com/hossainemruz/toha" target="_blank" rel="noopener">
           <img src="{{ $themeLogo }}" alt="Toha Theme Logo">
           Toha
         </a>
       </div>
       <div class="col-md-4 text-center">{{ $copyrightNotice | markdownify }}</div>
       <div class="col-md-4 text-right">
-        <a id="hugo" href="https://gohugo.io/" target="_blank">{{ i18n "hugoAttributionText" }}
+        <a id="hugo" href="https://gohugo.io/" target="_blank" rel="noopener">{{ i18n "hugoAttributionText" }}
         <img
           src="{{ $hugoLogo }}"
           alt="Hugo Logo"

+ 1 - 0
layouts/partials/navigators/navbar.html

@@ -45,6 +45,7 @@
       type="button"
       data-toggle="collapse"
       data-target="#top-nav-items"
+      aria-label="menu"
     >
       <span class="navbar-toggler-icon"></span>
     </button>

+ 2 - 2
layouts/partials/navigators/next-prev-navigator.html

@@ -5,7 +5,7 @@
     {{ if .Next }}
       {{ if (in site.Params.mainSections .Next.Type) }}
       <div class="col-md-6 previous-article">
-        <a href="{{.Next.RelPermalink}}" class="btn btn-outline-info">
+        <a href="{{.Next.RelPermalink}}" title="{{ .Next.Title }}" class="btn btn-outline-info">
           <div><i class="fas fa-chevron-circle-left"></i> {{ i18n "prev" }}</div>
           <div class="next-prev-text">{{ .Next.Title }}</div>
         </a>
@@ -21,7 +21,7 @@
           {{ end }}
         {{ end}}
         <div class="{{ $columnWidth }} next-article">
-          <a href="{{ .Prev.RelPermalink }}" class="btn btn-outline-info">
+          <a href="{{ .Prev.RelPermalink }}" title="{{ .Prev.Title }}" class="btn btn-outline-info">
             <div>{{ i18n "next" }} <i class="fas fa-chevron-circle-right"></i></div>
             <div class="next-prev-text">{{ .Prev.Title }}</div>
           </a>

+ 1 - 1
layouts/partials/navigators/sidebar.html

@@ -17,6 +17,6 @@
     </li>
   {{ else }}
     <!-- No sub-tree. So, only add current entry -->
-    <li><a class="{{$class}}" href="{{ .URL }}">{{.Name}}</a></li>
+    <li><a class="{{$class}}" href="{{ .URL }}" title="{{ .Name }}">{{.Name}}</a></li>
   {{ end }}
 {{ end }}

+ 1 - 1
layouts/partials/note-aggregator.html

@@ -5,7 +5,7 @@
     {{ else }}
         {{$id := .Params.Menu.Notes.Identifier }}
         <h4 class="note-collection-title" id="{{ $id }}">
-            <a href="#{{ $id }}"># {{ .Title }}</a>
+            <a href="#{{ $id }}" title="{{ .Title }}"># {{ .Title }}</a>
             {{$badges:= split .File.Dir "/"}}
             {{ range after 1 $badges }}
             <span class="badge btn-info note-badge">{{ . }}</span>

+ 5 - 5
layouts/partials/sections/about.html

@@ -17,7 +17,7 @@
       <h5 class="p-1">
         {{ .designation }}
         {{ if .company }}
-        {{ i18n "at"}} <a href="{{ .company.url }}" target="_blank">{{ .company.name }}</a>
+        {{ i18n "at"}} <a href="{{ .company.url }}" title="{{ .company.name }}" target="_blank" rel="noopener">{{ .company.name }}</a>
         {{ end }}
       </h5>
       {{ end }}
@@ -29,18 +29,18 @@
           {{ range .socialLinks }}
           <li>
             {{ if eq .name "Email" }}
-              <a href="mailto:{{ .url }}" target="_blank"><i class="{{ .icon }}"></i></a>
+              <a href="mailto:{{ .url }}" title="{{ .name }}" target="_blank" rel="noopener"><i class="{{ .icon }}"></i></a>
             {{ else if eq .name "Phone" }}
-              <a href="tel:{{ .url }}" target="_blank"><i class="{{ .icon }}"></i></a>
+              <a href="tel:{{ .url }}" title="{{ .name }}" target="_blank" rel="noopener"><i class="{{ .icon }}"></i></a>
             {{ else }}
-              <a href="{{ .url }}" target="_blank"><i class="{{ .icon }}"></i></a>
+              <a href="{{ .url }}" title="{{ .name }}" target="_blank" rel="noopener"><i class="{{ .icon }}"></i></a>
             {{ end }}
           </li>
           {{ end }}
         </ul>
       </div>
       {{ if .resume }}
-      <a href="{{ .resume | relURL }}" target="#"
+      <a href="{{ .resume | relURL }}" title="{{ i18n "resume"}}" target="#"
         ><button class="btn btn-dark">{{ i18n "resume"}}</button></a
       >
       {{ end }}

+ 4 - 4
layouts/partials/sections/education-alt.html

@@ -27,7 +27,7 @@
                             <div class="row">
                                 <div class="col-lg-10 col-md-8">
                                     {{ if .institution.url }}
-                                        <h5><a href="{{ .institution.url }}" target="_blank">{{ .institution.name }}</a></h5>
+                                        <h5><a href="{{ .institution.url }}" title="{{ .institution.name }}" target="_blank" rel="noopener">{{ .institution.name }}</a></h5>
                                     {{ else }}
                                         <h5>{{ .institution.name }}</h5>
                                     {{ end }}
@@ -44,7 +44,7 @@
                                     <ul>
                                         {{ range .publications }}
                                             {{ if .url }}
-                                                <li><a href="{{ .url }}" target="_blank">{{ .title }}</a></li>
+                                                <li><a href="{{ .url }}" title="{{ .title }}" target="_blank" rel="noopener">{{ .title }}</a></li>
                                             {{ else }}
                                                 <li>{{ .title }}</li>
                                             {{ end }}
@@ -82,9 +82,9 @@
                                 {{ end }}
                                 {{ if gt (len .takenCourses.courses) 2 }}
                                     <button type="button" class="btn btn-link show-more-btn pt-0 {{ if .takenCourses.showGrades }}ml-1{{ else }}ml-2{{ end }}"
-                                    onclick="toggleCourseVisibility(this);" id="show-more-btn">{{ i18n "show_more"}}</button>
+                                    onclick="toggleCourseVisibility(this);" id="show-more-btn" aria-label="{{ i18n "show_more"}}">{{ i18n "show_more"}}</button>
                                     <button type="button" class="btn btn-link show-more-btn hidden pt-0 {{ if .takenCourses.showGrades }}ml-1{{ else }}ml-2{{ end }}"
-                                    onclick="toggleCourseVisibility(this);" id="show-less-btn">{{ i18n "show_less"}}</button>
+                                    onclick="toggleCourseVisibility(this);" id="show-less-btn" aria-label="{{ i18n "show_less"}}">{{ i18n "show_less"}}</button>
                                 {{ end }}
                             </div>
                             {{ end }}

+ 2 - 2
layouts/partials/sections/education.html

@@ -27,7 +27,7 @@
                             <div class="row">
                                 <div class="col-lg-10 col-md-8">
                                     {{ if .institution.url }}
-                                        <h5><a href="{{ .institution.url }}" target="_blank">{{ .institution.name }}</a></h5>
+                                        <h5><a href="{{ .institution.url }}" title="{{ .institution.name }}" target="_blank" rel="noopener">{{ .institution.name }}</a></h5>
                                     {{ else }}
                                         <h5>{{ .institution.name }}</h5>
                                     {{ end }}
@@ -44,7 +44,7 @@
                                     <ul>
                                         {{ range .publications }}
                                             {{ if .url }}
-                                                <li><a href="{{ .url }}" target="_blank">{{ .title }}</a></li>
+                                                <li><a href="{{ .url }}" title="{{ .title }}" target="_blank" rel="noopener">{{ .title }}</a></li>
                                             {{ else }}
                                                 <li>{{ .title }}</li>
                                             {{ end }}

+ 1 - 1
layouts/partials/sections/experiences/multiple-positions.html

@@ -1,7 +1,7 @@
 <div class="col-10 col-lg-8">
     <div class="experience-entry-heading">
         <!-- For multiple positions, give emphasis on the company name-->
-        <h5>{{ if .company.url }}<a href={{.company.url}} target="_blank">{{ .company.name }}</a>{{ else }}{{ .company.name }}{{ end }}</h5>
+        <h5>{{ if .company.url }}<a href={{.company.url}} title="{{ .company.name }}" target="_blank" rel="noopener">{{ .company.name }}</a>{{ else }}{{ .company.name }}{{ end }}</h5>
 
         <!-- Total experience duration on a company is time between the starting date of the oldest position and ending date of most recent position -->
         {{ $oldestPosition := index (last 1 .positions) 0}}

+ 1 - 1
layouts/partials/sections/experiences/single-position.html

@@ -3,7 +3,7 @@
         {{ $position:= index .positions 0 }}
         <!-- For single position, give emphasis on the designation-->
         <h5>{{ $position.designation }}</h5>
-        <h6>{{ if .company.url }}<a href={{.company.url}} target="_blank">{{ .company.name }}</a>{{ else }}{{ .company.name }}{{ end }}</h6>
+        <h6>{{ if .company.url }}<a href={{.company.url}} title="{{ .company.name }}" target="_blank" rel="noopener">{{ .company.name }}</a>{{ else }}{{ .company.name }}{{ end }}</h6>
         <!-- Add experience duration info -->
         <p class="text-muted">{{ $position.start }} - {{ if $position.end }}{{ $position.end }}{{ else }}{{ i18n "present" }}{{ end }},
             {{ .company.location }}

+ 1 - 1
layouts/partials/sections/home.html

@@ -127,7 +127,7 @@
         {{ if .section.id }}
           {{ $sectionID = .section.id }}
         {{ end }}
-        <a href="#{{ $sectionID }}"><i class="arrow bounce fa fa-chevron-down"></i></a>
+        <a href="#{{ $sectionID }}" aria-label="{{ i18n "read" }} {{ i18n "more" }} - {{ $name }}"><i class="arrow bounce fa fa-chevron-down"></i></a>
       {{ end }}
     {{ end }}
   </div>