Gravatars & Comment Links, Part 2

By Shamus
on Dec 11, 2007
Filed under:
Projects

As a follow-up to the slowdowns yesterday. If you remember, I added two things to the blog. One was just a plugin to remove the “nofollow” from comment links. The other was Gravatars.

Around mid-morning I noticed the site was really getting slow. Just before noon my host emailed me and let me know my site was beating the crap out of the server and I needed to do something about it. (They were very nice about it, considering.) By the time I checked on it the site was crashed.

For the next half-hour I experimented with settings, turning features on and off. I enabled Akismet. I upgraded Akisment to the latest version. I disabled Gravatars. I disabled comments. Nothing worked. Finally I disabled the “nofollow” plugin. I didn’t expect that to have any effect, since the plugin is very small and what it’s doing is supposedly simple, but I was out of ideas at that point.

I’m not sure what was wrong with that plugin, but it was devouring system resources at an outrageous pace and is simply not fit for use on any blog with more than the most modest traffic. Kind of shocking, really. I should have suspected it right away (because it was new) but I just couldn’t imagine something so simple going so wrong.

Ah well. Lesson learned. Nofollow is back in effect, so the site is once again treating everyone like a spammer. Grrr. I could fix this with a very, very minor change to the WordPress source, but I dislike branching off like that.

In contrast, Gravatars are looking good. I messed around with the theme to make them fit in a bit more. To get things working the way I wanted I was forced to leave the rigid safety of <tables> for formatting and use <div>s instead. I have a horrible time getting <div>s to behave in a predictable way on the various browser flavors. I’m too old school for this newfangled CSS crap.

At any rate, I’ve got the changes in place. Tested with Firefox, IE and Opera. Looks good as far as I can tell. Please let me know if you spot any problems.

Enjoyed this post? Please share!


2020202017There are now 97 comments. Almost a hundred!

From the Archives:

1 2

  1. 11 says:

    Hmmm… looks like the avatars are being cropped a bit on the top and left-hand side now.

  2. Kennet says:

    Looks good.
    (I considered mentioning that the design could use a bit of work yesterday but I didn’t feel like making my first post here a negative one. Glad to see that you felt the same way ;)

    Now I just need to go get myself one of those Gravatar thingies.

  3. Phlux says:

    I’ve always hated div tags as well. I taught myself HTML in about 1997, and that’s about the last time I updated my knowledge of it, aside from a little javascript in college and some PHP in grad school.

    CSS is probably great for the pros, but I think it makes HTML difficult to approach for novices. Maybe that’s just because I learned the old (now wrong) way.

  4. Shamus says:

    Note: If the icons are being cropped, it most likely means you’re using Internet Explorer and it’s being an idiot by not checking the CSS for changes. Do a ctrl-refresh on the page, and it should be good.

  5. Mari says:

    No, CSS is in fact difficult to teach, even to novices that haven’t learned the “wrong” way. I’m teaching web design to a bunch of 4-H kids and it’s all roses until we get to CSS.

  6. wererogue says:

    Divs and CSS really are the way forward. The two properties of CSS (related to divs) that I find people (myself included) have a while getting used to are float and clear – since I got the hang of those, I’ve only ever used tables for tabular data.

  7. Telas says:

    It looks good. I hope my page refresh times yesterday helped. I’m using Firefox, and it does look like the icons are a bit cropped; I’ll be able to tell on mine.

    I can barely read HTML, much less code in it. My greatest weakness as a geek is that I do not have the coder gene, whatever it may be.

  8. 11 says:

    Hmm. I am indeed using IEv6.0 at the moment (since, as you can see, I’m diligently doing my job at my workplace *cough cough* and thus can’t use my preferred FireFox) Ahem, anyway IE still doesn’t like the avatars upon refresh.

    (Or more accurately, it looks as if the gravatars are set to 66px in size. Instead of resizing the 80px versions from the gravatar site, its cropping off the top and left portions of the images. Certainly not the end of the world, it just looks off, as the tops of people’s heads are cut off x_x)

    *Sigh*

  9. Telas says:

    Nope, that’s my icon, a bit smaller than it appears on the Gravatar site. It’s a cleaner version than yesterday’s, even.

  10. Lebkin says:

    The page is running much better now. And I like the icons. It will make it easier to see who is who. A good choice.

  11. Taffer says:

    CSS, and are your friends, as is properly-formed HTML (or, preferably, XHTML). There’s an excellent book Designing with Web Standards by Jeffrey Zeldman that’ll tell you why and how. It also covers accessibility, which was something I hadn’t considered before.

    [Also posting to see if my Gravatar works. ;-) I’m using the MessageFaces add-on for Thunderbird, too, which adds Gravatar support to your email.]

    – chrish

  12. testing my gravatar.. didnt seem to show up on the other thread…

  13. Neil K. says:

    Oh, wow! I’m loving the visual refresh on the comments. Very web 2.0

    Love the blog. Long-time reader, first-time commenter.

  14. Clyde says:

    I like the Gravatars. It’s interesting to see some of the different choices people make.

  15. McNutcase says:

    Looks good, loads fast from here (Firefox, Ubuntu, UK). I may be able to let you know how Safari copes later this week…

  16. I think there’s still a little problem. If you look at comments by people that have lots of dice on their left, you’ll notice that the comment text gets pushed down. I noticed by looking at some people on http://www.shamusyoung.com/twentysidedtale/?p=1455 with four dice or more…

  17. TheMatt says:

    Yay for gravatars. Now if only mine would work…I’ve never been able to get it to. Perhaps your site will be the first.

  18. 11 says:

    Fledgling Otaku:
    You have apparently uploaded an avatar to the gravatar site… have you assigned it to your email address yet? You apparently can have a number of avatars ready for use, but you actually have to select one to have it show up at all.

  19. Ben says:

    Safari works A-OK. Just need to put up a gravatar now…

  20. Shawn says:

    The 20sider is a huge improvement over the generic Gravatar logo.

  21. BlueFaeMoon says:

    Looks good to me, Shamus. :) Gravatar is probably wondering about the sudden influx of registrants. I’ve seen their icon on other sites (love that you replaced it with the D20), but I never bothered to register. I’m just not much of a comments-leaver. Don’t you feel special, then? lol

    I’m glad you found the real problem. I like avatars for the same reason you mentioned (visual identification). And I MUCH prefer them like this! So much less distracting. Your site looks great! I am so very envious. Some day I’ll step out of my musty old HTML box and learn some new tricks. Geriatric canines and all that.

  22. M says:

    I think I’ll stay iconless…but those do look really cool.

  23. Joe says:

    Time to see how these Gavamadoodles look, along with your pretty new divs!

  24. Joe says:

    Hooray for trying again with double posts

  25. RudeMorgue says:

    Just trying out my gravatar. Let’s see…

  26. MSchmahl says:

    That’ll teach you to make multiple changes without testing them individually. I’m curious why a simple change like that would have such disastrous side-effects. You said, “I could fix this with a very, very minor change to the WordPress source, but I dislike branching off like that.” Have you considered submitting a patch?

    I like the gravatar layout changes a lot, and the new default image. Is it possible to round off the corners of the avatar box a bit, to match your post icons?

  27. Samrobb says:

    I was holding off on getting a gravatar until you figured out if you were going to keep the feature… since it looks like it’s here to stay, well, then gravatar gets another user.

  28. Shawn says:

    I think it would be funny if someone signed up for Gravatar, and set their icon to the blue d20. Unless they went to another blog that uses Gravatars, the world would never know.

  29. Shamus says:

    You could also be a smart-alec and set your icon to the blue Gravatar logo. :)

  30. Joe says:

    But the D20 for the gravatarless… It’s a 20, though at first glance you might think it’s an 8.

    So, is that like “you just rolled a natural 20 on your save vs. awesome. Congrats.”?

  31. Tango says:

    Oddly, my Gravatar failed to load yesterday…

  32. Davesnot says:

    My Gravitar is still in Limbo too… so I put a new one in to a new address.. we’ll see.. but I’m glad I don’t have to wait forever for the site today!

  33. Shawn says:

    You know, I’ve always read it as rolling an 8, but now I realize I’m horribly wrong.

  34. Katy says:

    Um, “me too!”

    Looks good Shamus. And yes, this is a shameless comment soley for the purpose of showing that I followed the herd and signed up for a Gravatar. I don’t even have to ID myself as “that other person named Katy” anymore.

  35. Hm, I believe ‘nofollow’ is a good thing for comments.

    The site looks fine, Seamus. (But then it really doesn’t matter much to me; I’m here for the contents.)

  36. McNutcase says:

    Camera angles can be tricky with a D20, but it’s definitely a natural 20. Is Seamus training his D20?

  37. SiliconScout says:

    Bonus brownie points to anyone who recognises my gravitarythingamajiger.

    and yeah the dice are bumping the comments down for me to (using Firefox).

  38. Henebry says:

    Glad to hear the gravatars weren’t the problem. Funny to hear that the problem came from the other big change you’d made.

    I remember, after making similar mistakes while coding, pledging to never again implement more than one change at a time. The fact that I’ve made this pledge repeatedly in the course of my life (probably once every six months) shows just how tempting it can be to “just add a little fix” when you’re in the midst of coding.

  39. Katy says:

    SiliconScout — that’s Groo, isn’t it?

  40. Gothmog says:

    Hooray! Looks good, Shamus. Glad to hear you figured out the problem. :)

  41. Hal says:

    Shawn
    I’d like to think I took a better approach.

  42. Hal says:

    Er, well, never mind. My gravatar didn’t load, apparently.

  43. 11 says:

    Hmm? I can see it, Hal. Don’t ever let me catch you using that in one of my games.

    For curiosity sake only, where does one get one of those dice? (j/k of course)

  44. Eric J says:

    Another Gravatar test. Last one didn’t work.

  45. Eric J says:

    Is it possible you don’t see your own? Anyone else see a Tardis there?

  46. Gahaz says:

    My Grav is still not working, i have tried 4 different images and so far they are all unusable I guess.

  47. Gahaz says:

    Woooo! I retract my statement!

  48. Luke Maciak says:

    Ugh… I’m guessing the plugin writer decided to remove nofollow links the hard way by parsing the comment text or something. :P

  49. Rustybadger says:

    Cool plugin! Now you have a record of my mug on here…

  50. bargamer says:

    Woot for Groo! *Joins in the fray! With a donut-eating Elf.*

  51. Hal says:

    I guess it takes a little while for changes to your gravatar to be reflected in sites using it.

  52. Gary says:

    I’m really liking these new changes, including the Gravatars thing, Shamus. Now you are making me want to update my website…..

  53. Jansolo says:

    The only comment is about Gravatar site.

    I attached and modified one image, but it seems to upload three, 2 of them without modifications.

    The modified one was rated G. The other appears X rated, so they don’t appear in the website, nor the default choiced by Shamus.

    I’m still working on it.

    Meanwhile I’ve selected the modified G rated image.

    By the way: congratulations to Shamus.

  54. Zaghadka says:

    Wow. That looks really sharp.

  55. lxs says:

    Well, I had to try it…

  56. krellen says:

    I really like the way the new layout jives, Shamus. Since I was one of the detractors back when you first redesigned, I thought you’d want to know that.

    I also dig the Gravatars, and the red box around your comments are a nice bonus.

    On topic: even veteran web designers have troubles getting CSS to render in every web browser. My boss (who is our webmaster, and has been doing webmastering professionally for years) is a huge fan of CSS and still has problems with it rendering right in every browser. But your layout looks good, so I wouldn’t sweat it.

  57. krellen says:

    I notice now that the comments pad to make room for the dice counters, though. That might be something to look in to.

  58. SiliconScout says:

    Cheese Dip for all!

    Groo it is indeed, my most favorite of comic characters. Where is HIS movie eh!?

  59. Will says:

    Hrm… IE7 at work and on my new machine looks fine, but IE6 is cropping the top and left-hand side of every image to fit in the comment box.

  60. Will says:

    And it would appear I’m also in image-limbo. Does it take a while to filter dwon from their system?

  61. Ben says:

    Testing the gravatar, if you don’t mind…

  62. Chris Arndt says:

    I only learned CSS so I could properly tweak my blog, as HTML wasn’t sufficient alone for a unified effect.

    Of course, since blogger stopped using CSS and is not primarily a WYSIWYG set-up, my blog template is either too obsolete for the new Blogger-created gadgets or I’m damned lost and I cannot tweak a new blogspot blog that I create.

    Coding is not instinctive. I hate this. I’m glad I can peel back a good number of my blogs and read the code but… whatever.

    I’m late.

  63. Scott says:

    Hrrrm… one thing I just noticed is that the comments have a big space between the name/date and the body of the comment. It seems to be the same size as the dice comment counter thingie. Is this just a Firefox thing or do other people see it as well?

  64. K says:

    Seeing the same thing as Scott, on current Opera (Mac). Also, the distance between two comments is rather large.

    And please use a CSS, that will make life easier for you. A lot.

1 2

Leave a Reply

Comments are moderated and may not be posted immediately. Required fields are marked *

*
*

Thanks for joining the discussion. Be nice, don't post angry, and enjoy yourself. This is supposed to be fun.

You can enclose spoilers in <strike> tags like so:
<strike>Darth Vader is Luke's father!</strike>

You can make things italics like this:
Can you imagine having Darth Vader as your <i>father</i>?

You can make things bold like this:
I'm <b>very</b> glad Darth Vader isn't my father.

You can make links like this:
I'm reading about <a href="http://en.wikipedia.org/wiki/Darth_Vader">Darth Vader</a> on Wikipedia!

You can quote someone like this:
Darth Vader said <blockquote>Luke, I am your father.</blockquote>