Leon Paternoster version 5

Welcome to version 5 of leonpaternoster.com

From version 4

Welcome to Leon Paternoster v.5. Version 4 was created during a Christmas work flurry: 3 blog posts, 2 additional projects, 1 WordPress theme, 2 Christmas dinners and lots of booze.

I spent a long time tinkering with version 4, left the work for a couple of days, returned and really didn’t like it. It was the first theme I’d created using a framework, which initially seemed an ideal way to work as all the theme templates were ready to go, and it created HTML full of hooks to style.

But that was part of the problem. It generated too much markup, and I ended up fiddling with the PHP until it was unrecognisable from the original theme. The whole point of using a framework is that you dispense with the HTML/PHP coding: you concentrate on the CSS and save yourself hours of toil.

The truth is that any original design has to incorporate style and content. Not all blogs should have a sidebar of links (or a sidebar at all). Other people’s code is difficult to deal with (however neat it is), while frameworks tend to err on the side of content overkill. It’s a ‘no’ to other people’s frameworks (and Sandbox is really very clever and well executed), and ‘yes’ to a library of PHP, HTML and CSS snippets. (If your experience is different, please leave a comment).

So I ended up with a 5 column, 2 sidebar, somewhat standard blog theme. Ho hum.

To version 5

I returned to a theme I’d been working on a couple of months ago, influenced by some of the work showcased on minimalsites, and, unconsciously at first, Daniel Mall’s site. I’ve also been reading a great post by Andy Rutledge on simplicity, complexity and order (post to follow), which made me think about adding some typographic variation to the design.

In many ways it’s a traditional design: navigat‌ion through a vertical sidebar, separate archive page etc. I’ve really tried to strip the blog components down and reassemble them in separate pages; so no sidebar archives and the such. I’ve also attempted to break the monotonous, minimalist visual language and rhythm by introducing the odd textual flourish, double and negative margins, flash of colour etc. If you have any opinions on this, I’d love to hear them.

So another blog redesign. I may well try and stick with this one. For a few months, at least.

Comments

  1. Michael Tuck says:

    Nice look, Leon. Much better than v4. I haven’t looked under the hood, but the front end is very appealing — the orange links, the restrained use of borders, all works very well.

    Gigantic Theme?

    • Leon says:

      Gigantic Theme?

      All my themes follow a certain naming convention.

      Thanks for the comments: glad it looks better than v.4.

  2. I understand your pain with using Sandbox, but that framework just keeps drawing me back in with its brilliant documentation and numerous CSS hooks.

    As for your new design, it’s attractive, clear, and easy to understand, but I think maybe you’ve tipped yourself too far into the direction of minimalism in content.

    With all the space on your site, why not include a search box at the very least?

    • Leon says:

      …I think maybe you’ve tipped yourself too far into the direction of minimalism in content.

      With all the space on your site, why not include a search box at the very least?

      This is what Andy Rutledge’s article alludes to: he claims that simply getting rid of things is “lazy”. Having said that, I found that the search box was getting virtually zero usage, so there wasn’t much point in keeping it.

      My main concern is getting readers to read more content. At the moment, the paths to more articles are through the ‘Archives’ link, the category link in the post meta and the pagination links at the bottom of the article. I’m not sure this is enough.

      Are there any other elements missing from the design?

  3. John Baker says:

    It looks good and is very fast. Visually striking and it drew me in, so I found myself exploring.
    But I’d also find a need for a search box, although the ‘archives’ page is quite comprehensive.
    Lastly, if I like a site, one of the first things I look for is a quick way of subscribing to the feed, so I don’t have to worry about finding it again or remembering the name or URL.

    • Leon says:

      Hi John,

      Thanks for the comments. The search box seems popular: I may well add one to the site.

      a quick way of subscribing to the feed, so I don’t have to worry about finding it again or remembering the name or URL

      I personally prefer good old email subscriptions. I could add a ‘Subscribe’ page that links to RSS and email updates, although that may be one step too far. I’ll think it over.

  4. I don’t have any data to back this up, but I’ve always found that a “Greatest Hits” list of top posts at blogs very useful.

    That way, people that stumble on to a specific post via a search engine get an immediate picture of the content you’re best known for providing.

    From personal experience, I have to disagree with John Baker. The ability to subscribe to a feed for blog is built right into the browser for most people these days. Google Reader and others can now parse a feed location from just a root domain. I don’t think I’ve ever used an RSS button on a website, so I’ve always thought plastering little icons everywhere was redundant.

    • Leon says:

      I don’t have any data to back this up, but I’ve always found that a “Greatest Hits” list of top posts at blogs very useful.

      Yes, that’s the approach I’ve always taken (tag posts ‘favourite’ or ‘lead’ and generate a list of these). I like the idea of the blog author leading the reader through the content.

      I originally included a ‘Top 5′ list in the footer of every page, but I think I’ll limit this to the home page. I might well add a link and an excerpt to a related post in the footer of single pages.

      I’ve always thought plastering little icons everywhere was redundant

      There was quite a fad for these buttons. They do offer the advantage of maybe prodding readers into subscribing.

  5. Michael Tuck says:

    I think the “need” for an RSS link is more of a convention for people who, well, need it (i.e. those who don’t know that their browser can handle an RSS feed). I’d guess that your audience wouldn’t need such a link. A search box will definitely become a requirement as your archives become more expansive, although right now your content is limited enough to where it isn’t hard to deal with strictly through the content listings.

    Just my two cents. It’s a lovely design.

    I was curious about the “Gigantic” theme and what it contains. The link just takes you to your main page, which has nothing about the theme.

    • Leon says:

      I was curious about the “Gigantic” theme and what it contains. The link just takes you to your main page, which has nothing about the theme.

      I was thinking of releasing the theme, but as it doesn’t have a home (as of yet) it just links to my home page.

  6. Michael Tuck says:

    I was thinking of releasing the theme, but as it doesn’t have a home (as of yet) it just links to my home page.

    Your themes make me interested in working with real WordPress sites again (as opposed to kiddie-pool WordPress.com sites). Meanwhile, for laughs, you can take a look at the theme I used for the first blog I ever opened and perhaps tell me why I picked that particular theme. I certainly don’t know what I was thinking. (That blog is now inactive, so save your hoots and giggles for this thread. :) )

  7. André Elias says:

    I really appreciated your current theme, it’s something I’d use for a personal blog. I’ve been looking for something like this for personal use, I hope you release the theme someday. :-)

  8. First of all, congratulations with the launch of the new version of your blog, Leon. I do really like the design, and the fact that you’re making the blog look more like a web site with clearing all typical blog features and keeping the typical web site features, like vertical navigation for pages only.

    However, I have to agree with the comments above, I think the following are still considered to be a necessity: search box and RSS subscription, as well as email subscription (I couldn’t find your email subscription, btw). I find that search boxes are re-assuring that I’ll be able to find some specific content on the site if I need to and RSS/subscription links are encouraging.

    Since you do feature the most popular posts on the Archives page, I’m ok with not having them listed on individual pages, but I think the Archives page will need to be re-structured in the near future (the more article you publish, the sooner that time will come).

    Style-wise I’ve got three comments so far: why don’t you get the advantage of Helvetica as your primary type choice and display the name of your blog in a large size, rather than keeping it at the browser’s default 16px. Also, I would remove the blue underlines when hovering the blog name. Finally, how about differentiating the comments from the articles with some subtle differences (say in a darker/lighter grey, different font, or letter-spacing, …)? Since you’re sticking only to one font for all elements in your design, how about adding a bit more texture (different sizes, colours, spacing…)?

    I do appreciate though the smaller font size in the blog’s content ;)

    Sorry for the critique, but you’ve asked for it ;)

    As for working with frameworks: somehow with WordPress I prefer to work on each theme almost from scratch. I usually prepare HTML templates and then modify them with ready to go PHP snippets (Though I do keep the common CSS classes/ids, say for comments, plus I try to stick to the same structure and naming convention for my DIVs, IDs and Classes).
    When theming for Drupal though, I always work with a framework.

    • Leon says:

      Hi Vivien,

      Firstly happy new year to you and the family.

      Secondly, thanks for the critque. As ever, much appreciated (and a bit quicker than the last one ;) )

      Thirdly, the background image on your site is looking a really good idea: it’s a smart way of changing the mood.

      Anyway…

      I think I’ll add email and RSS links to the sidebar (with a margin between them and the nav links).

      why don’t you get the advantage of Helvetica as your primary type choice and display the name of your blog in a large size

      The title’s small as the theme started out as a monotone, monosize affair, and got modified from there. I quite like the space around the title, but I like big Helvetica too…I’ll experiment (the containing block’s not that big, though!) btw You’re not a big Helvetica fan, I’m guessing.

      how about differentiating the comments from the articles with some subtle differences (say in a darker/lighter grey, different font, or letter-spacing, …)? Since you’re sticking only to one font for all elements in your design, how about adding a bit more texture (different sizes, colours, spacing…)?

      Hmmm…I’m not sure about this: I don’t think there’s a huge issue with not differentiating the comments from the post. Perhaps I could play around with a few of your ideas: changing letter-spacing would be an original approach (I may even try changing the line-height and margins).

      The “texture” thing is what I find difficult. But the Andy Rutledge article really got me thinking about it. Have you read it? It’s really good.

  9. Leon says:

    OK everyone, I’ve taken your ideas on board—your feedback is really valuable; many thanks.

    I’ve set up a live demo with a few changes.

    Please note:

    - this is the version I’ll make available for download, so it doesn’t have any features you’d get through using plugins
    - no subscribe by email option as that comes via a plugin
    - no ‘most commented’ list in the archive as that also needs a plugin (note to self: maybe integrate plugins?)
    - I don’t have my work laptop yet, so I haven’t tested in IE, Opera or Safari
    - I’ll have a think about adding links to my favourite posts on my own site: I won’t add this option to the publically available theme as I don’t think people can be arsed with the admin side of it
    - the author’s comments aren’t highlighted as they are on this page: that’s because the posts were imported from this blog, so it doesn’t recognise ‘me’ as the author (if that makes any sense whatsoever)

    Cheers,

    Leon

  10. The revised theme looks much better now. Glad you took some of my comments into consideration and increased the font size of the blog’s name, display comments in lighter grey (I often like to go back and forth between comments and the article, and having that visual differentiation really helps).
    Adding RSS link and search above helps too.

    One critique: why don’t you separate trackbacks from the comments? I actually think that this should come as default in WordPress, but until then theme designers would need to add that piece of code manually.

    As to your question about Helvetica: I do like it, and it deserves all the praise and attention this typeface gets. Let’s just say I’m more of a serif person. But I do like how other people implement Helvetica in their designs, if it’s done right.

    Also, I just realized that even though it says ‘You are subscribed to this entry’, I didn’t get any email notifications of your replies after leaving the comment here. Perhaps you need to check your Subscribe to Comments plugin?

    And thanks, I too like how the background image option on iBit turned out. I’m even considering updating it with every post.

    P.S. well, looks like this critique came even quicker ;)

    • Leon says:

      Thanks again Vivien,

      why don’t you separate trackbacks from the comments?

      Partly because I haven’t reactivated the plugin I was using to do this after I upgraded to wp 2.8, and partly because I quite like to see when I get a trackback in relation to other posts: I thought making them really light sort of pushed them under the cushion.

      Perhaps you need to check your Subscribe to Comments plugin?

      I’m glad you’ve pointed this out: it’s a problem with my host, which I thought had been resolved. The contract’s up in Feb, so I think I’ll switch, even if moving everything over fills me with horror.

      I’m even considering updating it with every post

      That’ll work really well (sort of like the Jason Santa Maria approach of changing the look of every post).

  11. Michael Tuck says:

    Nice job, Leon. I like this the best of your three themes (I like the evolutionary pattern you’ve created in the three, each one growing and developing from ideas stated in the previous theme). Simple and elegant without being simplistic and lacking in function. You took Vivien’s suggestions and crafted them into a very workable product that’s easy to look at. I’d love to play with it on a non-Wordpress site. A couple of things:

    * Your doctype is incomplete.
    * Your h2 and h3 font-family bits are incorrectly structured:

    font-family: font-family: helvetica, arial, bitstream vera sans, verdana, sans-serif;

    should be

    font-family: helvetica, arial, “bitstream vera sans,” verdana, sans-serif;

    You also need to quote the “bitstream vera sans” in the body tag.

    And in the footer, you’ve created yourself a big ol’ spam magnet by directly giving your e-mail address (even without using the mailto link). There are a lot of ways to handle the display of your e-mail address without giving the spambots a snack, with varying degrees of success and ease of use.

    Other than that, very nicely done. Makes me want to play with it all evening! :)

    • Leon says:

      Appreciate that, Michael.

      Your doctype is incomplete

      The doctype is actually valid, but it’s inappropriate for a WordPress site, which generates XHTML. I’d prefer to use HTML 4, but WordPress XHTMLifies everything, even when you enter your own code (e.g img tags are closed with a forward slash and an angled bracket, rather than an angled bracket on its own).

      So I’ll change it to an XHTML doctype.

      Your h2 and h3 font-family bits are incorrectly structured

      I appear to have got into the habit of omiting the quote marks. I’ll add them, but I don’t actually think it makes a difference: v4 used Lucida Grande as its first choice, and that was picked up without quotes. I’m willing to be corrected on this!

      you’ve created yourself a big ol’ spam magnet

      I’ve always given out my email address quite freely and trusted in gmail’s spam filters. I get about 20 spam a day, but it’s not caused a problem.

      Thanks for taking the time to look through the HTML and CSS: when you’re working in isolation you can miss some pretty simple things.

  12. Michael Tuck says:

    Darn it, I didn’t close the blockquote tag in the last post.

  13. I was wondering about the email address. I thought that perhaps it’s not vulnerable without mailto, but I see now Michael raised a concern about it as well.
    I didn’t look too much under the hood, so glad to see that others are doing so ;)

    When are you planning on releasing the theme, Leon? I think you should make sure your server will be able to handle the traffic. I bet SM or one of the big gallery sites will feature it and send you lots of traffic.

    • Leon says:

      When are you planning on releasing the theme, Leon? I think you should make sure your server will be able to handle the traffic. I bet SM or one of the big gallery sites will feature it and send you lots of traffic.

      Probably after I move host. I use the wp-cache plugin, which coped with my last big spike in traffic. It’ll also give me a month or so to get it running perfectly.

      BTW could you (or anybody) point me to any info on changing host and moving over several URLs and wp installations. The thought’s filling me with dread!

      Thanks,

      Leon

  14. I think what you need to do is:
    1) Back up your blog(s): filed + database
    2) Install local copies of all your blogs and make sure you didn’t lose anything and locally they run as smoothly as online
    3) rather than waiting to drop your existing host before moving your sites, I’d recommend you to sign up with a new host and set up your sites there while you’re still with the old host.
    You can test your sites using the IP address, make sure everything works fine, and then you can change the DNS settings on all your domains to point to the new host. Test them there. If something goes wrong, you can always go back by pointing the domains back to the old host. Once you’re sure you’ve got your sites working properly on the new server, cancel your existing host.

    I’ll try finding some online tutorials for you.
    Good luck!

  15. btw, personally I prefer to see the dates on comments as well for the same reasons that readers prefer seeing the posts timestamped.
    Any specific reasons why you’re not showing them in your theme?

    • Leon says:

      Again, not really – I didn’t feel they were particularly important. I guess some may be time sensitive, so I’ll think about adding them in again.

    • Leon says:

      Thanks Vivien – I really appreciate the overview and the links.

      I actually have quite a simple blog (one user, light on plugins, zero widgets): I may try using the XML import/export first.

    • Leon says:

      Well, I found a host that will manage the move for you. I have to say that WP WebHost have been absolutely brilliant; they’ve moved 2 wp installations and even arranged for 301 redirects after I moved the blog to the top level of my domain, so I don’t lose my RSS subscribers or SE rating.

  16. Michael Tuck says:

    Rock it, Vivien. :) I’ve bookmarked those tutorials for my use as well.

  1. [...] It’s designed to be a very simple, stylish theme that displays your content with a minimum of fuss. Influences include minimalsites and, somewhere in the background, Dan Mall. Several very nice people contributed their ideas. [...]

Add a comment