anatomy of a website: part ii

Lisa, circa 1973 or 1974.
Lisa phone hacking, circa 1973 or 1974.

Dear Internet,
Yesterday I started out putting together an entry on the process and design of the site, only it turned into nearly 3100 wordy behemoth. I’ve split the entries into half, the first half concentrating on the backend, landing page and design thought, with the second half below getting more into the nitty gritty, process, and promotions.
Individual Entry Pages
For the individual entry pages, all of the previous design for the landing page is true plus with the added following:

  • Breadcrumbs – Located above the title and are crucial! I will not design a site without them and it is also good SEO and information architecture practices. I use Breadcrumb NavXT.
  • “Estimated reading time” in the byline metadata. General consensus of the internets said they liked this feature because it gives them time to pause to continue reading now or come back later. Plus I can be wooordy and days like today, you need to know how much time to invest. The plugin I use is Post Reading Time, which is customizable.
  • Share the love – I use unobtrusive small icons, no text, of print, email, and top social sharing sites via the Jetpack plugin. I also turned on the “follow me via Google+” option available in the same plugin. I also only selected social sites I personally use, hence why there is no LinkedIn.
  • Below the footer metadata are named links to previous post and after post
  • Next is the comments section, which I use Disqus plugin to handle that feature. Additionally, in the landing page version, comments are located at the top by the byline entry so readers can comment on the landing page instead of clicking to the full entry itself to do so.
    • I currently do not turn off comments on any of the content, so if you wanted to comment on an entry from 10 years ago, you could.

Individual Page pages
Since these are rarely updated and are static, the styling is a bit less structured:

  • I’ve turned off commenting and direct people to my contact page
  • Each page is either a top level page as a landing page for a project or a child page
  • SEO is also applied to all pages as I now create them
  • Breadcrumbs are also used on pages
  • The sidebar remains the same

Process and Promotion

  • Currently I write the day before it’s due and I almost never know ahead of time what I’m going to write. It literally is, some days, begins with a sentence and I’ll end up with 900 words an hour later.
  • I can write a 750 word entry, complete with formatting and editing, in about an hour.
  • I schedule the entries to post mid-morning ET the following day. I will also set up a tweet mid-afternoon with the same information
    • The initial posting format is: [blog] TITLE OF ENTRY short link EXPLANATION
    • Further promotion on Twitter will contain a slightly reworded version of the original to prevent going to Twitter jail
  • Promotion of the entry is done in the following
    • Automatic cross posting to TwitterFacebook, and Tumblr
      • The Facebook page is the blog’s page. I also cross-post from the page to my personal Facebook
    • Posting to LiveJournal via LiveJournal Crossposter
    • Posting to Google+ manually
    • Repost to Twitter later in the afternoon
  • On the rare occasion, I’ll post a link to the entry more than twice in the same day
  • It is utterly important to me that I am available, findable, and read in a variety of mediums, hence the cross-promotion to major sites as well as some not so major ones in addition to the RSS and email feeds.
  • SEO is applied to all entries with descriptions and proper keywords to enhance findability

Plugins
What’s currently powering my site:

  • Akismet – Spam blocker. Between this and Disqus, there has been almost no comment spam on this site.
  • All in One SEO – One of the definitive SEO plugins, easy to use and pretty customizable.
  • Breadcrumb NavXT – One of the better breadcrumb plugins, also easy to use and customize.
  • Broken Link Checker – The best client I found to scan the entire site, check links and report back errors. Especially useful as I add in the old content.
  • Disqus – I’ve been a long user of this commenting system for a number of reasons: It allows people to comment by logging in via any number of existing OAuth systems such as Facebook and Twitter without having to create an account at EPbaB. I also liked that you can consolidate all of your sites into one admin account.
  • Google Analytics for WordPress One of the three analytics software I use, highly robust and full of rich features
  • Google XML Sitemaps If you are not practicing SEO, you should have a site map of your site for search engines to index. I really like this one.
  • iframe Plugin to allow the use of iframe HTML because sometimes old tags don’t go away, they just continue to be used.
  • Jetpack This plugin is produced by the makers of WordPress and contains some of the top features they implement on the wordpress.com site and made them available for self-hosted users. Frankly, this is by far the best plugin I use and while I know some despise it for a variety of reasons, as someone who just wants shit to work, it’s brilliant. Here are the features I use (and be mindful this is not ALL the features available):
    • Notifications – notifies of activity from wordpress.com users and sites on your site
    • Stats – One of the three analytics plugins I use
    • Publicize – The social arm of the plugin, it auto publishes to selected sites when you publish your entry as well as is the configuration for the Share the Love social sharing
    • Subscriptions – Subscribe by email
    • Sharing – See Publicize
    • Spelling and Grammar – Yes to the first, meh to the second. The grammar function is often wrong
    • Omnisearch – Search Every. Single. Page on your site, deeply, from within the dashboard
    • Contact form – So you say you have a message from your people to my people? This is where you go
    • Widget visibility – Control what pages / posts your widgets are on
    • Wp.me short links – Yep
    • Google+ Profile – See Publicize
    • Tiled galleries – If I ever feel the need, it is here
    • Shortcode embeds – Always important
    • Custom CSS – Sometimes designers do NOT know best. Also a lot of theme designers sell their “premium” themes based on the fact you can customize the CSS. Why bother to pay for something you can do for free?
    • Mobile theme – I know a lot of people don’t like this version, but I don’t see a problem with how it renders or allows navigation on my site. Works great!
    • Extra sidebar widgets – Always a necessity
    • WordPress.com Connect – Allows you to login to your sites using your WordPress.com login – which is more secure than just a username/password!
    • Enhanced distribution – There is no clear description to what this does exactly, but what the hell. It’s turned on.
    • Jason API – Also needed
  • List category posts – Another favorite! Allows you to post links to entries on any page/widget from specific categories or tags – automatically! Example of it being used, multiple times, on the To:Be Project page. Each section is its own tag getting updated automatically when I post with that tag appended.
  • LiveJournal Crossposter – Some sites do not die, they just become LiveJournal.
  • Organize Series – A neat plugin that allows you to easily set up posts of the same subject to be easily read together without searching through the archives.
  • Post Reading Time – Displays the amount of time to read the entry, at 200 words a minute average.
  • Redirection – I currently have two or three domains, in addition to exitpursuedbyabear.net, that point to the this domain. In order to clean up old links from journals gone by, Redirection will take a link from biblyotheke.net/nameofentry and point it to the correct entry here without the use knowing!
  • Simple Social Plugins – Sidebar widget using pure CSS to display stylized social media links
  • Smart Archives Reloaded – Plugin behind my archives page, was the easiest way to generate the page in a simple to read format without getting overly complicated.
  • TablePress – Plugin to generate complicated tables, but I’m finding it easier to create them via pure HTML and CSS so I might ditch this at some point.
  • Word Stats – Secretly I’m a stats nerd and things like this get me wet. I disagree with some of its assessment on reading levels but I do like some of the other features like breaking down words per entry, or per month, or entire lifetime.

Other design tweaks, such as color schemes and CSS options tend to be in the muted areas, with a shocking color for contrast. I like my fonts to be readable, and I can spend hours on the right font combination, and easy to print. I haven’t yet found the perfect font yet, but I’m always looking.
This holiday season, since I have nearly a month off, I’m going to be setting up a home server version of the site and start building, I hope, a new and improved site layout and design to correct the little things I cannot get sorted in using child themes. Ideally, I’d like to build off an existing theme, but I’m thinking at this rate I’ll probably end up starting from the ground up and building my own.
If you have any plugin or theme suggestions, let me know! I’m always up for getting my website dirty!
x0x0,
Lisa

This day in Lisa-Universe: 2009

One thought on “anatomy of a website: part ii”

Comments are closed.