Let’s Build: A Consultancy Website—Part 23

Coding the Footer

Andy Leverenz
Aug 9, 2017 · 2 min read

Originally published at web-crunch.com on August 9, 2017.

In part 23 I round out the home page design and spend time coding the footer.

🤘🏻 It would be rad if you subscribe to my newsletter or YouTube channel! 🤘🏻

To make this a global component I needed to make sure it’s a snippet of its own inside the snippets directory of our Kirby install. Going one step further I’ll utilize the site.yml blueprint file to create new fields for social media links and copyright information.

SVG workflow

In this video, you’ll see me work with SVGs as background images and spend some time optimizing them to make the design look consistent for our social media icons. Due to there being a small amount of icons in the design, I chose to not create an SVG sprite as I felt it wasn’t 100% necessary.

SVGs have a very small file size so I don’t think the performance of the site took a bit hit. If your own site’s icon archive starts to grow you may consider opting in for sprites. You can read an article I wrote about creating sprites on Web Designer Depot called How to Create and Manage SVG sprites

Obviously, I could have gone about adding these SVGs in different ways; perhaps by embedding the SVG code directly in our theme but since I’m reusing the footer on all pages already I didn’t see the need to add more control.

Download the Source Code for this Project

Source Code

The Series So Far


Originally published at web-crunch.com on August 9, 2017.

The Web-Crunch Column

A publication for design, development, and business related articles published via medium and web-crunch.com

Andy Leverenz

Written by

Web-Crunch is a blog that delivers the crunchiest articles on design and development. Follow us or check out the website http://web-crunch.com

The Web-Crunch Column

A publication for design, development, and business related articles published via medium and web-crunch.com

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade