<div class="post">
  <article class="wrapper">
    <h2>Images for {{year}}</h2>
    <p>In 2016, I challenged myself to try and complete a vector image for each month in the year.</p>
    <p>You can view the image full-size by selecting it.</p>
  </article>
</div>
<div class="lowered-area" id="gallery-thumbnails">
  <a class="card hoverable" *ngFor="let image of imageData" [routerLink]="['/calendar', year, image.monthId]">
    <span class="image-area"><img src="{{getSafeFileName(image)}}" alt="image for {{image.monthId}}/{{year}}"></span>
    <span class="text-area">{{getMonthName(image)}}</span>
  </a>
</div>

<div class="post">
  <article class="wrapper">
    <h2>Art gallery</h2>
    <p>The art gallery is being upgraded. In the meantime, you can browse the {{year}} art challenge gallery page.</p>
    <h3>What is this page?</h3>
    <p>In 2016, I challenged myself to try and complete a vector image for each month in the year.</p>
    <p>You can view the image full-size by selecting it.</p>
  </article>
</div>
<div class="lowered-area" id="gallery-thumbnails">
  <a class="card hoverable" *ngFor="let image of imageData" [routerLink]="['/calendar', year, image.monthId]">
    <span class="image-area"><img src="{{getSafeFileName(image)}}" alt="image for {{image.monthId}}/{{year}}"></span>
    <span class="text-area">{{getMonthName(image)}}</span>
  </a>
</div>

Update text to explain the gallery/calendar redirect
Update text to explain the gallery/calendar redirect

