Fine Tuning Pelican: Setting Up The Landing Page

Preface¶

This is one of the articles in a series about how I fine tuned my Pelican+Elegant web site to make it “more mine”. For other articles in the series, click on the title of the article under the heading “Fine Tuning Pelican” on the right side of the webpage.

Unlike my series on Choosing and Setting Up Pelican, these articles are intended to be byte sized, addressing specific fine tunings I made to my own website. As such, the Disclaimer section below is referred to by link in the other articles in this series instead of replicating it in each article.

Disclaimer¶

I have taken efforts to be clear about whether a given fine tuning was made to the Pelican configuration or the Elegant configuration for my website. Any Pelican configuration that I am documenting should be broadly applicable to any Pelican based site, and any Elegant configuration to a Elegant themed site. If you are using a theme other than Elegant, please consult the documentation for that theme to determine if that theme supports something similar.

In addition, I want to be clear that I am a contributor to the Elegant theme that I use for my website, helping with the documentation of the theme. While I decided that it is the best choice for a theme for my website, I leave it to any reader to make their own determination as to which theme is best for their own website. I merely reference Elegant in these notes on Fine Tuning as part of the configuration that I had to learn and set up for my own website. Your mileage may vary.

Introduction¶

It is important to engage readers of the website and to give them multiple reasons to come back to the website time and time again. The creation of a good landing page for the website is a large part in making that engagement with the readers happen. This article walks through a number of things that help a landing page increase it’s engagement with the readers.

One of the most important parts of that is to give the website a good name that will stick in their head and display it prominently on the website. Following that, a well thought out introduction to the website will then give the reader a solid idea of what to expect, allowing them to determine for themselves if it is worth their time and effort to return to the website. Finally, adding a list of projects that are related to the website can be a useful tool in demonstrating to the reader why the website is useful by documenting how the website and it’s authors benefit other websites and projects.

Giving the Website a good name¶

When a reader first comes to the landing page, it is pivotal to have a name for the website that is front and center on the landing page, easy to identify, and one that will stick in their mind. The Elegant theme partially helps with this by putting the site name at the top left corner of the webpage, with no other text or images right next to it. This Pelican configuration is set with the following configuration in the website’s pelicanconf.py file:

SITENAME = "Jack's Digital Workbench"

While the title placement helps, it is up to the website owners to determine the name to be used with the website. I put a lot of thought into the name of my website, as detailed in my article The Inspiration For Jack’s Digital Workbench. However, prior to me getting the finishing touches on the website for a soft-launch, the name was Jack's Web Site for a couple of months. I wanted to give it a name that reflected what I wanted to communicate, and I believe that waiting to give it the proper name allowed me to really figure out the right title, and not just a placeholder title.

Introducing myself to Readers¶

Now that the website’s name was configured, it was time to introduce myself to the people who would hopefully become readers of my blog. The first part of this was to follow Elegant’s Home Page - Write Welcome Message article and set the title of the landing page to reflect the new name of the site:

LANDING_PAGE_TITLE = "Welcome to " + SITENAME

With the title of the introduction taken care of, it was time to further follow Elegant’s advice, this time from the article titled Home Page — Write About Me. Creating a new document in my content directory called /pages/landing-page-about-hidden.md, I copied their sample document and initially trimmed it down to the following:

---
Title: What is Jack's Digital Workbench?
slug: landing-page-about-hidden
status: hidden
---

This blog is a place for me to...

After building the website and serving it up locally, to make sure that page was being included properly, I started working on the content. Due to the importance of this page, I started working on it in mid-August and didn’t finish it until mid-November. While this may seem a bit of a long time and somewhat silly, I wanted to make sure that this introduction was done right. In the end, after 5-6 drafts, I made notes on what I liked and disliked about each draft, then starting from scratch to write the final version in a couple of hours.

During all of those drafts, what I was looking for in an introduction was something that was descriptive, yet not too wordy. In most of my drafts, I nailed one section, but the other two failed this test, so the final version took the best parts of a number of the drafts and wrapped them up as one. I believe it took a long time because I was trying to find the right balance for what I wanted to say, without writing what seemed to be an entire article. In the end, I ended up taking one of the more verbose sections of the introduction and made it into it’s own article, replacing it with just two sentences. For me, this struck a good balance between communicating what I wanted in that section and keeping the introduction descriptive, but brief.

Adding in related Projects¶

I believe that in any website, it is important to show how that website and it’s authors contribute or are related to other projects.

Elegant supports this configuration out of the box with the PROJECTS configuration value, documented with the Elegant article on Home Page — Projects List. For my website, this was set up as the following:

PROJECTS = [
    {
        'name': 'Creating and Maintaining This Website',
        'url': 'https://jackdewinter.github.io/categories#website-ref',
        'description': 'Notes and articles about the creation and maintenance of this website.'
    },
    {
        'name': 'Elegant Documentation',
        'url': 'https://elegant.oncrashreboot.com/',
        'description': 'Documentation repository for Pelican-Elegant theme.'
    }
]

From my research on different authors and their blogs, the ones that ended up grabbing my attention were the ones that not only solved a problem I had, but showed interest in related projects. Those related projects didn’t always have to be related to what I was looking for, but they added “color” to the website. Without any extra references to other related websites, I found that I viewed that website as a reference resource rather than a website that I bookmarked and frequented.

One thing I thought about for a while was whether or not to include the Creating and Maintaining This Website in the projects list. For the longest time, I was stuck between calling it a category (it is a distinct group of articles) and calling it a project (it is stored as one in GitHub). In the end, the balance I achieved with this was to create a category for it that appears after pressing the Categories button on the title bar and not mentioning it in my introduction where I talk about the other categories. I am not sure if this makes sense to any readers, but I felt that the equilibrium achieved by those two choices allow it to be a category but elevate it a bit to something that is a bit bigger than just another category. As the website is somewhat fluid, I’ll see how that goes for now, and perhaps change it later.

What Was Accomplished¶

The landing page of any website is almost certainly the most important page or article on that entire website. I documented the process I used to capture a reader’s attention by selecting a good title for the website, followed by a good introduction to what the website and it’s authors are about. As part of this process, I also talked about how I approached these decisions, and how I figured out that I had accomplished my goal for both of these items. Finally, I talked about how I configured a Projects section to detail some of the other projects I am working on, and why having a section like that is important to a website.

The landing page of any website can capture the attention of a reader or lose that attention just as easily. It is important to take your time when developing these parts of your website to ensure that these pieces of your website are an accurate reflection of yourself and what you intend to communicate with the website.

Like this post? Share on: Twitter ❄ Facebook ❄ Email