Website Optimization Measures, Part III
Post from March 17, 2008 (↻ August 23, 2018), filed under Web Development.
This and many other posts are also available as a pretty, well-behaved e-book: On Web Development. And speaking of which, here’s a short treatise just about managing the quality of websites: The Little Book of Website Quality Control.
The last weeks meant a lot of work on this site despite being busy in Oldenburg and catching a neat cold. Apart from inspiration to publish a more “generic” optimization guide it suggested to write another part for this Website Optimization series, which had a nice start with parts I and II.
Featuring more articles on home and archive pages. Thanks to SEO considerations, no, inspiration by Jared Spool, I decided for more link density on my website. Although I am looking for load time and performance optimization almost everywhere, a handful more teasers didn’t mean a problem—instead, featuring 10 instead of 5 publications per homepage or archive document helped user orientation.
Checking and updating ping service lists. If I was a traffic-generating machine, I’d probably make a different article from that, but
I don’t. Browsing hypertext I found a few sites that advertised ping services I didn’t include in my WordPress config yet, so I thought it might be useful to check those services as well as the ones that I pinged before. I ended up with a new list eventually helpful for you, too (comment otherwise, please):
http://ping.bitacoras.com/ http://www.blogdigger.com/RPC2 http://rpc.blogrolling.com/pinger/ http://coreblog.org/ping/ http://www.feedburner.com/fb/a/pingSubmit?bloglink=http%3A%2F%2Fmeiert.com%2F http://www.feedburner.com/fb/a/pingSubmit?bloglink=http%3A%2F%2Fmeiert.com%2Fen%2F http://api.feedster.com/ping http://blogsearch.google.com/ping/RPC2 http://api.moreover.com/ping?u=http%3A%2F%2Fmeiert.com%2F http://api.moreover.com/ping?u=http%3A%2F%2Fmeiert.com%2Fen%2F http://ping.myblog.jp/ http://rpc.pingomatic.com/ http://www.popdex.com/addsite.php http://ping.syndic8.com/xmlrpc.php http://rpc.technorati.com/rpc/ping http://topicexchange.com/RPC2 http://www.wasalive.com/ping/ http://ping.weblogalot.com/rpc.php http://rpc.weblogs.com/RPC2 http://www.weblogues.com/RPC/ http://api.my.yahoo.com/RPC2
Fixing WordPress and WordPress plugins. My favorite. I noticed problems with
blockquoteelement nesting and finally managed to fix that by patching functions-formatting.php (WordPress connaisseurs will notice that this is a file from a former WP release). I also fixed the faulty
inselement handling in xhtml-strict-10.php of Jamie Talbot’s X-Valid plugin. (If you’re using an earlier WordPress 2.x release or Jamie’s plugin and want to get rid of these problems, don’t hesitate to drop me a line.)
Checking and improving WordPress blog security. This must be something every WordPress blog owner loves to do. Now that I still haven’t updated my WordPress installation, I instead watched out for additional information on WordPress security and felt inspired by Frank Bültge’s WordPress security tips (in German).
Trying to fix layout grid (when it’s broken). Mine was, and still is, so feel free to name this point pointless 😉 I failed fixing this site’s grid because I didn’t take enough time to plan it upfront. I stopped all efforts to repair it because it wasn’t “too broken,” you barely notice the problem. Lazy like I sometimes am I end this attempt at bugfixing documentation with a quick reference to a “layout grid” Google search.
Playing with types. I played with certain fonts and decided to switch to Cambria as the main type. Skipping the reasons that led me to Cambria I am instead referring to this order of fonts I now feed meiert.com visitors’ user-agents with:
cambria, palatino, georgia, 'bitstream vera serif', serif;. For what it’s worth.
Adding more prominent update information. Discovering a few sites that concluded that some of my articles must be outdated just because the URI contained an older date suggested me to show update information at the top of pages too. Thus, “last update” is not just mentioned at the end of the page but also in the “intro” element below the heading, when appropriate, for example “Jens Meiert, April 1, 2007 / March 17, 2008”. Adding “
[…], updated March 17, 2008” appeared to be even more clear, but a quick usability test revealed that people understand regardless. While additional tests should help, I’ll observe whether or not people notice that I take care of older articles. I do, and I do add notes when publications really got “deprecated”.
This has been quick again, especially since I changed many other things as well and found so much additional evidence that the best weapon to improve maintainability is to remove complexity—but, we already had that.
About the Author
Jens Oliver Meiert is a technical lead and author (sum.cumo, W3C, O’Reilly). He loves trying things, including in the realms of philosophy, art, and adventure. Here on meiert.com he shares and generalizes and exaggerates some of his thoughts and experiences.
If you have any thoughts or questions (or recommendations) about what he writes, leave a comment or a message.
Have you ever noticed any substantial benefit from pining such a plethora of services vs. just the established ones like ping-o-matic and a few else?
Do you want to light some issues of web page load optimization? There are a few services that can assist you in speeding up you website (also improving usability).
For example www.websiteoptimization.com and Firebug/Yslow
Good Morning, I have read over your changes and adjustments. You have a great site up and all i can suggest is to keep up with that security. I ran into 2.1.1 problem with one of my friends. A full overwrite for all of their older files and tons of exciting updates. That was a joy.
While you’re trying out differnt fonts, you might also consider to use small headlines instead of the italic fonts in beginning of the list. It might help a user much to get a faster overview through your posts, as they are usualy longer then the screen and to scroll. While giving a better overview for your auditory, you also might get an additional “+” at the search engines. They love or more then italic … and it would help google&Co to cluster your pages.
On April 1, 2008, 21:57 CEST, Gray said:
Website Optimization is seldom taken bit per bit…Your site explains it and shows examples of it in its links and content. Yes, link richness is a big plus to getting high page rank BUT I’ve learned never sacrifice web development for this requirement. Proper mix of elements in website optimization gets and makes your site valuable ( real and helpful content, link rich) and memorable (easy on the eyes, great page design). My apologies though, your site’s color isn’t just working- visually dependent people would like to learn but are either lazy or impatient. Will visit again soon!=)
On April 9, 2008, 22:35 CEST, Susan Shepherd said:
You’re right about having the “last updated” update to your page. I for one have been searching for sites like yours that will add to stock knowledge about optimization. Knowing that a page’s content has not changed or been corrected does put credibility to what is presented. I am learning on the job and getting the time to gather insights on how to make a company’s revenue earner (e-business) tops does help a whole lot. Thanks for not being selfish…
while you’re optimising your site, what about sprites?
I noticed that your smileys are single images - putting them in one image which you then reference through background-position further cuts down your page loading time.
Plus, if I surf to another page, my browser most probably has already cached the sprite.
Here’s an example of how we do it at Fairfax Digital:
Jens (in Australia)
One more comment on sprites: Although I see your point (having almost no images anyway), I do think that even on your site a sprite cuts down loading time.
If you check out “High Performance Web Sites” (O’Reilly) the first and most effective measure to optimise your page load time is to reduce the number of http requests. Nothing beats that.
Hence for this page (as of writing) you’d be able to remove two http requests if you used a sprite.
“Too much CSS code”? It’ll be three lines for your three images, going into an already existing style sheet. Plus, I admit, an HTML element, possibly a classed span, that’ll replace the current inline image element.
Codewise, let you have 1k more, but time wise you’ll save two http requests.
After reading the book I mentioned I’ve started applying sprites to my private site too (far from perfect yet, but on the way - click on my name to check it out).
Well I must admit that I checked the post date when I was reading part 1 a little while ago. I saw the second (up)date and really thought: ‘Nice, this article has been update lately’. It’s nice to know that a article isn’t totally under dust but someone’s still updating it. So I totally agree on the ’show update information’ point.
Is there some way you test which font visitors like more?
Have a look at the most popular posts, possibly including:
Perhaps my most relevant book: CSS Optimization Basics (2018). Writing CSS is a craft. As craftspeople we strive to write high quality CSS. In CSS Optimization Basics I lay out the, at least some of the most important aspects of such CSS.
Looking for a way to comment? Comments have been disabled, unfortunately.