Well, I succeeded in removing four images from the index page. But I replace those with a couple of hundred lines of javascript. Meh, what’re you gonna do. Went a little nuts with jQuery. I changed the forgot password link to do a little switchToggle animation. I also replaced the original qrisper leaderboard ad, which used to be a simple onclick/onmouseover event, with a snazzy sliding panel. I think it gets the message across, don’t you?
But I didn’t stop there with the javascriptin. I wasn’t happy with just having the recent answers in the left column. So I added a cool accordion function, this time using prototype/scriptaculous. I saw another version using jquery but I liked this one better. I think it’s pretty neat. Except I couldn’t figure out how to set the max height for the content (that’s why the recent answers heading isn’t sitting flush against the bottom). I decided to leave it as is since it doesn’t look that bad.
The problem with the accordion function, however, is that as soon as the user clicks on on of the recent answers links, the page will load and the recent answers column will reset back to the bottom. Not very user-friendly. So I figured I’d add a dash of ajax and make the recent answers links load on the screen without a page refresh. I found another handy tutorial on Nettuts that did just that. But the source code appears to have gone through a number of revisions, with the final version incompatible with the current versions of IE7 and Safari. Looks great on Firefox though!
All of these javascript functions were weight my site down. So I looked into ways to optimize the handling of my source codes. Initially, I was using Google’s Minify to minfiy my code. But then I discovered that Google also hosts most of the popular javascript libraries. So instead of attaching a copy of those files, you can link to Google hosted copies. Those are already minified and could potentially provide a speed boost if your users already have a cached copy of the library, which most people probably do. You can find all of the details at Google’s AJAX libraries API.
With the addition of all of the new fancy effects, I also decided that qrisper would no longer support IE6. So I created a redirect page for those poor souls still using that wretched browser. I’ve been using IETester to test qrisper on IE6. Worked pretty well.
Spent a good chunk of time this week putting together the admin pages for qrisper. There’s a lot going on back there! I’ve gained a new appreciation for the folks that developed all of the admin pages that I’ve utilized over the years. Actually, the one’s at JPM were crappy as hell. Admin pages never got any love over there.
Working on these pages and seeing the data flowing through gave me some more ideas for user incentives. More on that in a future posts.
Anyway, here are a few more enhancements:
- after logging in, clicking on the logo now takes you back to the splash page, without logging you out. Once I change the question and answer interface for both sides, not sure if this will still be necessary. But more than one person asked for it so there you go.
- after a lot of procrastinating, finally put together a decent FAQ page. The FAQ page got a decent amount of hits so I needed to get on that. The remaining pages should follow shortly.
- don’t think anyone noticed (since no one used the feedback form in qrisper.com to provide feedback) but that link was fixed.
- also fixed a problem where clicking on the “get password” submit button wasn’t pushing out the email with the user’s id and pw.
- been dipping my toes into modifying the .htaccess file and minifying js and css for site speed optimization. Not sure if I’m doing something wrong or my site just isn’t big enough, but I don’t see much of a difference.
Also hit a bit of a milestone this week. I wrote my first line of original php code to solve a problem. Woohoo! Up until now, I’ve been recycling Amos’ code. Baby steps.
Ajax is staring me in the face right now. Need to figure out a way to tackle that bastard.
Thanks again to everyone that provided feedback so far. It’s crazy how much tunnel-vision you get when you’re preoccupied with just making the darn thing work!
Anyway, just wanted to highlight all of the changes I made already based on people’s feedback:
Amos:
- added Q and A icons in the recent answers column. Tried adding image icons but decided that the simple text looked cleaner.
- inverted the colors for questions and answers in recent answers. Was trying to keep the answer colors consistent across the site…need to rethink this.
- got rid of most of the target=”_blank”. Still debating whether to keep the ones that link to a Google search or any site outside of qrisper.
- replaced the ad with a banner providing more info on qrisper – need to work on my animated ads.
- reorganized the What tab a bit. Still need to work on the content and new screenshots.
- combined View 1 and View 2. Made View 2 available as titles.
- added some text describing what users can do after signing up under all results pages – need to work on that.
- changed the links so that the category name takes you to a list of all questions for that category (before you had to click on the number to do that).
- changed the question page so that the first thing you see are the questions and their answers, with an add your own answer section on the bottom.
- changed the results page to include a suggest a question section.
I still need to make the content more readily accessible, both for registered and non-registered users. I’m gonna dive into some ajax to do that.
David:
- login button doesn’t work – the forgot id/pw div was on top of the login button – oops!
- form fields don’t fit – that was cuz I never checked for Mac Firefox/Safari. Only way I could fix it was to shorten it for PC Firefox/IE.
Jack:
- javascript errors – leftovers from previous code…didn’t even realize they were there!
Chris, thanks for your comment. That’s basically the idea.
