Creating A Landing Page In WordPress II — Architecture And Design

This is the second post in the series Creating a landing page in WordPress Let’s see where we are.

  1. Creating a landing page in WordPress I — Introduction
  2. Creating a landing page in WordPress II — Architecture and Design
  3. Creating a landing page in WordPress III — Coding and Implementation

We have covered the introduction part in the last post Creating a landing page in WordPress I — Introduction. In case you are wondering what we are into you may want to go back and read it. We’ll wait.

The architecture and design of a web page is an interesting problem solving exercise. There are problems and there are choices you have to make.

  • Too much content and limited space

    Our first problem to solve. Essentially pulling visitors into the depth of your content requires you present them with a lot of choice and variety. Given that you have substantial content to showcase there is only as much you can present at a time. The average resolution of visitors (general estimate as of present) is close to 2048X1024px. So here are a few options. You just have to come up with ideas to come up with a more effective solution.

    • Use fixed size container allowing scroll – This will occupy a fixed size on the screen. If visitors want more they can scroll within the container. Your sidebar ads still will show and so will the rest of the content outside this container.
    • Use a tabbed interface – This is what I picked. After all there must be good reason all major browsers flaunt a tabbed interface. You have a lot of options here and wouldn’t need to reinvent the wheel. Take a look at DomTab, Tabifier and idTabs, Yahoo! UI Library and Google for more.
  • What to showcase

    An advertisement that your landing page is going to be, it should feature the best. So here’s a few things you can consider including

    • Showcase your best posts – Let me mention a killer tool here. Go to aideRSS and punch in your blog’s url. Surprise surprise. You have all you wanted. You can analyze posts which worked the best and which were most bookmarked. You can view the summary of the post and the various actions the visitors took. There are some of the posts you want to showcase.
    • Showcase a post you want to make popular – There are times when you create content which you know was worth it but didn’t attract that many visitors. Make it sticky. At other times you may find there’s this one post that drew a lot of comments one day but slipped under the newer post the next day. There was one post that I wanted to feature and draw visitors to. So make sure we are going to have a feature to make sticky one or several posts under a featured post category.
    • Your favorites – A list of your favorite picks. Not that the users want them but because you want to show them.
    • A list of popular posts by popular categories – The best of a category is a great way to promote your expertise on multiple subjects.
    • A list of popular categories – if not one of the popular posts they can browse the posts by their interests and choices.
    • Recent comments – let the new visitors know there are real people visiting and participating in the blog. This draws them in, see what others are discussing and opens new opportunities for them to participate.
  • What to avoid

    You must avoid and clear any distractions out of the way of the new visitors. This increases visitor loyalty by allowing them to explore and satisfy themselves before bookmarking or subscribing your blog.

    • The sidebar – If you have sold advertisement in your sidebar on all the pages then the sidebar needs to be there. But if not you can get rid of the sidebar. If you do you may have to make some theme changes to maintain the balance and extend the content area to the full width. Or you can have a dynamic custom sidebar for the landing page which makes it easier for visitors to explore more content or participate in polls etc.
    • Recent posts – you can include the recent posts in a tab or keep them to a maximum of five on the landing page.
    • The advertisements – it is best to avoid ads on the landing page because you don’t want to lose your first time visitors to the ads or worse turn them off.
    • The dates on the posts – avoid them. Just in case you take a week off and are not able to post you don’t want to give a hint of stagnation to the new visitors.

Create a sketch of the design you have decided all through. If you have a sketch it makes it easier to remember through the process of design what exactly you are doing and trace your way to the end goal. Once you have done this, you will want to review it and see what other modifications you can make before you position it next to your monitor.

In this post we have seen what all elements we need and can avoid and how we would like to place them for maximum impact. We will now need to place the scripts and engage in some coding to pull the content that we decided in this post. We shall be covering this part in the next post in the series.

Divi WordPress Theme