From 33ba3aaee71a157e2459b5a803ab002a2d42844c Mon Sep 17 00:00:00 2001
From: austinseraphin <omeron@clearwhitelight.org>
Date: Fri, 4 Aug 2017 12:06:20 -0400
Subject: [PATCH] Header alt tags (#1138)

* Added support for an alt tag for the header image

This allows using page.header.image_description as the alt tag. It
will still default to site.title if unset.

* Added documentation
---
 _includes/page__hero.html | 4 ++++
 docs/_docs/10-layouts.md  | 8 ++++++++
 2 files changed, 12 insertions(+)

diff --git a/_includes/page__hero.html b/_includes/page__hero.html
index 24488932ae5f..97090d0721ac 100644
--- a/_includes/page__hero.html
+++ b/_includes/page__hero.html
@@ -45,7 +45,11 @@ <h1 class="page__title" itemprop="headline">
       {% endif %}
     </div>
   {% else %}
+    {% if page.header.image_description %}
+    <img src="{{ img_path }}" alt="{{ page.header.image_description }}" class="page__hero-image">
+    {% else %}
     <img src="{{ img_path }}" alt="{{ page.title }}" class="page__hero-image">
+    {% endif %}
   {% endif %}
   {% if page.header.caption %}
     <span class="page__hero-caption">{{ page.header.caption | markdownify | remove: "<p>" | remove: "</p>" }}</span>
diff --git a/docs/_docs/10-layouts.md b/docs/_docs/10-layouts.md
index 5285fcf06cb9..39f8b288f282 100644
--- a/docs/_docs/10-layouts.md
+++ b/docs/_docs/10-layouts.md
@@ -273,6 +273,14 @@ header:
   image: http://some-site.com/assets/images/image.jpg
 ```
 
+To provide a custom alt tag for screen readers:
+
+```yaml
+header:
+  image: /assets/images/unsplash-image-1.jpg
+  image_description: "A description of the image"
+```
+
 To include a caption or attribution for the image:
 
 ```yaml