Nik's Technology Blog

Travels through programming, networks, and computers

Learning jQuery 1.3 - Book Review

My first exposure to jQuery was using other developer's plugins to create animation effects such as sliders, and accordion menus.
The highly refactored and compressed production code isn't the easiest to read and understand, especially if you want to alter the code to any great extent.
After reading a few tutorials, I thought I'd buy a book and get more involved with the jQuery library.

As an ASP.NET developer used to coding with intellisense, I was pleased that jQuery has been incorporated into Visual Studio to allow ease of developing.
I browsed through the jQuery books on Amazon and opted to buy "Learning JQuery 1.3" by Jonathon Chaffer and Karl Swedberg after reading the user reviews.

I've now read most of the book and can highly recommend it.  The book assumes the reader has good HTML, CSS knowledge as well as a familiarity with JavaScript and the DOM, but this enables the book to quickly move onto doing useful, everyday tasks with jQuery.

The first six chapters of the book explore the jQuery library in a series of tutorials and examples focusing on core jQuery components.  Chapters 7 to 9 look at real-world problems and show how jQuery can provide solutions to them, and the final two chapters cover using and developing jQuery plugins.

Web developers should be aware of web accessibility and SEO issues with using client-side scripting and it is good to see the book highlighting the concepts of progressive enhancement and graceful degradation where appropriate.

"the inherent danger in making certain functionality, visual appeal, or textual information available only to those with web browsers capable of (and enabled for) using JavaScript.  Important information should be accessible to all, not just people who happen to be using the right software." - Learning jQuery 1.3,  page 94

After a brief introduction into the world of jQuery, what it does and how it came about the book moves quickly on to selectors, which are a fundamental part of how jQuery selects element(s) from the DOM.  It also covers jQuery's chaining capability, which coming from other programming languages looks odd at the outset, but quickly proves to be a very powerful technique.

The authors then move on to talk about events.  What I particularly like about the way jQuery handles events is that the behavioural code can be cleanly separated away from the HTML mark-up without having to litter tags with onclick and onload attributes.

The examples show how to add functionality on top of your HTML by binding events to elements on the page, which when triggered cause jQuery to modify the HTML to bring the page to life.  Techniques are introduced by example, then slowly refactored and improved while introducing new jQuery methods along the way, which is a breeze to follow and learn.

The fourth chapter covers effects such as fading in and out and custom animations, and jumps straight in to cover a useful example of how text size can be increased on-the-fly for ease of reading.  The intro also mentions an important usability example of effects.

jQuery effects "can also provide important usability enhancements that help orient the user when there is some change on a page (especially common in AJAX applications)."- Learning jQuery 1.3,  page 67

Chapter 5 is all about DOM manipulation and covers jQuery's many insertion methods such as copying and cloning parts of the page, which it demonstrates with another useful example in the form of dynamically creating CSS styled pull quotes from a page of text used to attract a readers attention.

AJAX is the next topic, which interested me enough to create a little tool to load in an XML RSS feed and create a blog category list from the data.
The chapter covers the various options of loading partial data from the server including appending a snippet of HTML into the page, JSON, XML and how to choose which method is the most appropriate.

Table manipulation is next on the agenda and the book discusses how to sort table data preventing page refreshing using AJAX as well as client-side sorting, filtering and pagination.

Chapter 8 delves into forms, using progressive enhancement to improve their appearance and behaviour.  It also covers AJAX auto-completion as well as an in-depth look at shopping carts.

Shufflers and Rotators are next and the book starts out by building a headline news feed rotator which gets it's headlines from an RSS feed, typically used by blogs.  It also covers carousels, image shufflers and image enlargement.

Chapter 10 and 11 examine the plugin architecture of jQuery and demonstrate how to use plugins and build your own.  I successfully produced my first jQuery plugin from reading this book.  You can check out my tag cloud plugin and read about how I originally built it before turning it into a plugin that other developers can use.

Nike+ SportBand Review

Last year I decided to get healthy and take up running.  Being a gadget lover, I had been researching the iPod nano and Nike+ sport kit

I liked the idea of being able to record my progress, set myself challenges and map my routes etc, see http://nikeplus.nike.com/nikeplus/ for more details.

The thing was, I already had an iPod classic which was too bulky to run with, and not compatible with the Nike+ kit.  I didn't really want to fork out for another iPod just to take out for a run, so I was pleased when Nike released the SportBand, I ordered one and started my training. 

That was about a year ago, and I've been using the Nike+ SportBand for all my runs since, clocking up over 300km in that time.

Review

I thought I'd write a quick review of the product to share my experience with the SportBand and the Nike+ website, which forms an integral part of the product, since all your stats are uploaded to the site.

Hardware

The hardware included consists of a watch and shoe adapter.  The shoe adapter is designed to fit into special Nike+ running shoes, which I had already had.  If you don't want to purchase Nike+ running shoes search on eBay for "nike+ sensor" you can buy sensor pouches that fit on your shoe laces instead.

Before each run you have to hold down the big button on the face of the watch to sync the shoe adapter to the watch, then after a few seconds when you are ready to run, you just press the same button again briefly to start and stop the clock.

After using this for a while you wonder what Nike was thinking when they designed the watch.  First of all its not very sturdy, my LED broke after a few months use (see photo, left-hand side), the angle of the screen and reversed LED display are not at all easy to read when you are running.  Personally I would have been willing to pay a little more for a better watch.

Software and Website

When you get back from your run, you simply detach the watch from its strap and plug it into your computer's USB port to upload your run data.  The software driver that you install on your PC allows you to calibrate your device as well; however I found that its not very accurate and if you increase your pace you need to recalibrate the device.

The Nike+ website has been produced in Flash and looks visually impressive, but I find it to be a bit cumbersome to use and personally I would prefer an HTML website with embedded Flash graphs etc.

All your runs appear in a bar chart, with a calendar running across the bottom.  When you hover a run you get more details for that particular run.  If you click on a run you get a timeline for that run with km/mile marker points and your pace at those positions.

You can also map your runs before or after a training session to either gauge how far a route is or to assign certain runs to a particular route.  This is useful so you can see your progress over the same route.

The nike+ website also has a social element to it, allowing you to challenge other nike+ users and run routes others have mapped.  However the interface isn't as intuitive as it could be.  You can also create widgets to allow you to show your training overview on your blog or social profile, take a look at mine on the "About Me" page.  They also provide a FaceBook app, but I have never managed to get this to work.

Summary

Nike+ isn't perfect and I think that professional runners should probably look elsewhere, but for people like me who just run to keep fit and don't take it too seriously I find it helps me keep track of my progress and keeps me motivated.

Being a developer it would also be nice to get access to my run data through an API.  There are ways to do it, but it would be nice if Nike were to publish an SDK or API documentation to make this a little easier.  Services such as Twitter have thrived on 3rd party applications which leverage the Twitter API, what are you waiting for Nike?

Product Review: Train Signal's IIS Web Servers CBT Video Training

As an ASP.NET web developer, I think it's important to understand and know how to configure Microsoft's web server, Internet Information Services (IIS). Depending on the organisation you work for you may or may not get the opportunity to tinker with IIS, but this shouldn't stop you from learning the basics.

You could go out and buy a book on configuring IIS and then install IIS on your computer to practise what you've read, but thanks to the guys at Trainsignal.com who have kindly sent me some of their training videos, I've discovered a much easier way of learning.

Train Signal CD-ROM

Train Signal provides video training courses for Microsoft, Cisco and CompTIA certifications, including CCNA, A+, Network+.
I'll also be reviewing the Cisco CCNA training videos here soon.

Train Signal's IIS Web Server video training covers both IIS 5 and IIS6, and features topics including installing IIS, creating test websites, hosting more than one website using host headers, adding security, setting up an FTP server, and web server optimisation.

Train Signal CD-ROM menu

The course is taught by Scott Skinger, President and founder of Train Signal. Scott has many years of experience in the IT field, holds various IT certifications and is a competent instructor. The videos are easy to follow and Scott's narration is second to none.

Train Signal lab book sample

The series of videos are backed up with a written guide in the form of the lab book, which comes as a printable PDF on the CD ROM, this goes through the same steps featured in the videos and includes network diagrams like the one above to help you set-up your own lab.

Train Signal video player

If you want to get up to speed on a particular Microsoft product, obtain an IT certification or you don't like reading IT text books then I definitely recommend you give these training videos a try.

Course Contents in full:

Introduction
Lab Setup
Setting up the lab
Computer 1
Computer 2
Computer 3
Lab
Scenario
Installing IIS on Windows 2000 Server
Creating an HTML file
Hosting Ben & Brady's site
Configure DNS so Internet users can find your website
Testing the website from the client
Lab
Scenario
Creating a test website using an HTML file
Creating an additional website on the web server
Creating host headers
Configuring DNS for the second website
Test and view website from client
Assigning site operators
Adding security to a website
Test and view the website from a client
Lab
Scenario
Downloading and installing service packs and hot fixes
Setting NTFS permissions
Disabling Netbios over TCP/IP
Download and run The IIS lockdown tool from Microsoft
Enable and view logging

Product Review: uCertify PrepKit Exam Simulator

I was kindly sent a uCertify PrepKit for review back in December last year for the Microsoft C# .NET 2.0 Web-based Client Development exam (70-528). I'm looking to take the Microsoft MCTS .NET Framework 2.0 Web Applications certification this year, and needed an exam simulator and part of my study.

uCertify start-up logo

I've been so busy lately its been difficult to find the time to sit down and put the exam simulator through its paces. Anyhow I've spent a good few hours testing my .NET knowledge with this PrepKit to allow me to confidently evaluate it.

The PrepKit features a bunch of questions that closely follow the style of questions featured in the Microsoft exam, obviously the PrepKit does not contain real exam questions, but uCertify claim they are "realistic", and they are supposed to get you used to the kind of questions you should expect to see when you come to take the real exam.

uCertify PrepKit main menu

The tests in the PrepKit contain between 15 and 40 questions each and you’re given 120 minutes to complete each one, but I found that choosing a shorter time and reducing the amount of questions I needed to answer allowed me to spend more time using the PrepKit, because I don’t often have 2 hours of uninterrupted revision time.

There are two different modes to choose from before starting a test. Learn mode and Test mode, Learn mode allows you to get feedback on the current answer immediately whereas in Test mode you can only review the answers at the end of the practice test.

uCertify PrepKit test question page

When you complete a test you can review the questions and go back and look at any questions you may have answered incorrectly. You can also choose to re-take just the questions you got wrong. When you re-take the test the multiple choice answers change order to keep you on your toes!
During a test you can pause the timer to take a call, make a coffee etc, tag, print, review and bookmark questions.

uCertify PrepKit test history page

Every test you take with the PrepKit gets recorded in the Test History section, from here you can go back and review all the practice tests you've taken, review all the questions you got wrong, re-do the whole tests or re-do only the questions you got wrong.

Custom tests can also be created to turn your weaknesses, based on your test history or certain topics into your strengths.

Besides the practice tests the PrepKit contains study notes, quizzes and tips and flash cards to help assist you in understanding the topic.

Book Review: Prioritising Web Usability

I can't recommend this book enough. A lot of the topics covered in this book are common sense. As a Web developer or designer you may think you create very usable sites already, but even if this is true, and you are a true usability guru, a lot of the facts and statistics in this book are useful for backing up your views, and getting your point across to clients who insist on functionality that you know full well will break usability conventions, and potentially harm their finished Web site.

The book is for people who have business goals for their Web sites or the Web sites they work on. This includes sites that match the following criteria:

  • E-commerce sites
  • Corporate sites
  • News sites
  • Non-profit organisations
  • Government agencies

If you are trying to get users' to accomplish something when they visit your site then you should be concerned about usability.

This book contains the results of many studies into how people behave on the Internet and consequently what makes Web sites succeed or fail.

This book alone is not enough to ensure your site will be the most usable it can be, but it is crammed full of tips and real world examples of what to do, and what not to do when it comes to designing Web user interfaces, writing Web copy and planning your Information Architecture. Ideally you will need to perform usability testing as well, but the information in this book will significantly help in improving your Web site.

The book begins by explaining how people use the Web and how to optimise your site accordingly. It explains how users' use search engines to find answers to problems, and how to improve your site to cash-in on these users.

Nielsen and Loranger then go back to the usability problems they found back in 1994 and discover what significant usability issues are still relevant today, including bugbears such as:

  • Breaking the back button
  • Pop-ups
  • Flash
  • Uncertain clickability
  • Plug-ins
  • Splash pages

The forth chapter helps you prioritise your Web site usability issues and decide what to tackle first. They do this by categorising usability problems by severity, frequency, impact and persistence.

Site search engines and their user interfaces and results pages (SERPS) are covered next, including a brief introduction to Search Engine Optimisation.

Chapters 6 and 7 concern navigation, information architecture, readability and legibility. This is followed by a chapter on how important it is to specifically write for the Web, using summaries for key points, and by using simple language. The importance of knowing your audience and how people skim read articles on the Web is talked about, as is the use of marketing slogans and hype.

The following chapter is geared towards your e-commerce goals. How to provide good product information and win consumer confidence in your site and product to increase and promote sales.

The penultimate chapter looks at presentation and users' expectations, while the final chapter in the book is all about balancing technology with people's needs. This covers the use of multimedia content such as videos and the use of familiar interface conventions in Web design.

Prioritizing Web Usability
By Jakob Nielsen and Hoa Loranger
Published by New Riders
ISBN 0-321-35031-6

 

To Feedburn or not to Feedburn?

I've decided to try out Feedburner. We use RSS to syndicate content at work and have to use server log file analysis to track them, web-beacon based web analytics packages are good for websites, but you can't add Javascript to feeds, which are pure XML. We've tried using .NET to database the hits we were getting on the feeds, but after a short while of testing we were seeing our database growing quickly in front of our eyes, not to mention consuming our precious CPU cycles.

Feedburner not only takes away the hassle of analysing web feed statistics and subscribers, but adds a lot of other functionality too.

My main initial issues with Feedburner were the following:

* What if Feedburner went bankrupt? All the sites syndicating my feed would be using the feedburner URL (unless I pay for the Pro service). How would I be able to change this back to my own URL or another Feedburner type URL? (hopefully saying goodbye to Feedburner would also still hold true if they went bankrupt?) [UPDATED: On June 1st 2007 Google purchased Feedburner, therefore making bankruptcy much less likely :-) ]

* I can't redirect any current traffic from my old Blogger Atom feed on my shared Windows hosting as I don't have access to IIS through my control panel. The file is an .xml file, and I can't use .htaccess for obvious reasons. I would need to use an ISAPI rewrite tool I suppose, which I probably wouldn't be able to get installed in a hosted environment.

* If I want to later upgrade to the Pro service, I would surely have to keep my Feedburner URL even though I could have a URL hosted on my site with this package just so I keep all my subscribers using the same feed URL. (I guess I could use the "saying goodbye to Feedburner" process above?)

Despite these issues, I've decided that the pros of knowing my subscribers etc out way the cons and I'm now syndicating through Feedburner!

I am wondering however, how Feedburner manage to host so many blogs. I assume they have some serious kit to handle the many requests they get. I would be interested to know what the Feedburner IT infrastructure looks like.

Google Reader Mobile Interface - Good, But Room To Improve

I'm a big fan of Google Reader. I tried the first Google Reader interface not long after it was released and couldn't get on with it. It didn't have much going for it. It was hard to use and read articles from, and it was buggy although it was a beta release.
Since the interface was changed however it has progressed in leaps and bounds. It is now my feed reader of choice. I didn't particularly like the Bloglines interface either.

Mobile Feed Reading

I'm a busy person and I don't get much time during the day to catch-up on the news I want to hear about. So after purchasing a Windows Mobile MDA with unlimited 3G Internet access I was on the look out for a decent mobile feed reader.
Even though browsing normal websites with mobile devices is possible, it's not a rewarding experience because not many sites are optimised for the small interface.
Thankfully Google Reader has a fairly decent mobile interface, that includes a mobile proxy to reformat normal web pages to make them much more readable on small mobile devices.
Google have managed to shoe-horn most of the functionality into the mobile version, but it is a lot more buggy than the normal web version. Perhaps some of the bugs I come across are down to buggy web feeds, but Google should be able to find a way around most problems.

Google Reader Mobile User Interface Enhancements

Here are some of the bugs/bugbears I have with the mobile interface (in no particular order)

  • There should be a link straight through to the article on the site in question, not just the summary page in Reader. This will reduce the amount of clicks if you know you want to read the article even without reading a summary first.
  • Why do we need the more... Link when we now have the mark these items as read... Link?
  • When you star an item it reloads the whole page. Can it not return to the list on news items?
  • Some blogs cause http errors, produce no article when you click through, feature loads of links that you need to scroll through to get to the content, or show the summary as being the same as the blog title.
  • I would like the option of being about to read only a subset of my feeds from the mobile interface.

..and finally...

I use the new shared items widget on my blog to let my users know what I've been reading lately. From the web interface you can quickly share feed items with a simple click. This functionality is missing from the mobile interface however. So the work around for the time being is to star each item I want to share with my readers and click the share button on each item when I get on a desktop machine.

The interface is improving all the time, so hopefully Google will listen to its users, because I know I'm not the only one who has views on some of these topics.