Archive for the ‘XHTML’ Category

« Older Entries

WeBuilder 2008 vs Dreamweaver CS4

Friday, January 23rd, 2009

Adobe Dreamweaver CS4 and WeBuilder 2008

I have two website editors of choice:

For years I heard that Dreamweaver was the Web editor of choice for the serious Web developer. At the time I wasn’t a serious Web developer, I was a lowly curate and couldn’t afford a copy (I made do with trial versions) so I had to find another solution.

From 1st Page 2000 to WeBuilder

For about five years I used Evrsoft 1st Page 2000. For a free text editor it did everything that I wanted and more — it was certainly a good step up from Notepad — but as the Web developed I grew increasingly frustrated by its lack of support for the latest standards (XHTML anyone? CSS 2.0, etc.). The application was really feeling dated.

But I hung on in the hope that a new, promised version would be the solution I was needing. Month turned to year, nothing appeared and I faithfully struggled on. “Better the Web editor you know …” and all that.

The day that I installed the first public beta on their new version, First Page 2006, was the day that I finally gave up on Evrsoft and moved to WeBuilder. I haven’t looked back.

WeBuilder

That’s when I discovered Blumentals WeBuilder 2005 (version 6.3). Not only was it similar in layout to 1st Page 2000 it far surpassed it in terms of both Web standards and application features.

I’ve now used WeBuilder (which I presume is pronounced “web builder”, although in the office we called it “we builder”) ever since, upgrading through versions 7 (2006), 8 (2007) and now 9 (2008). And it just gets better and better with each new release. There is a very active community forum and its developers really do listen to requests for new features. I’ve had one of my requests included (to do with how the file explorer displays files), and I put my voice to calls for Subversion integration, which appeared a version or two ago.

Matching and missing HTML tag highlighting

One of my favourite features in WeBuilder is the code highlighting:

Code highlighting in WeBuilder 2008

As you can see from the screenshot above, if you click within a tag it highlights the tag in green and shows the corresponding end tag. It also highlights broken tags – you can see immediately that there’s a problem with the anchor tag (<a>).

It’s a really impressive feature that makes navigating code very easy, particularly when you have quite a few nested DIV tags.

Meanwhile in Dreamweaver

Looking at the same code in Dreamweaver CS4, when I click on the list-item tag (<li>) nothing happens within the code window; there is no code highlighting.

Dreamweaver screenshot of code

Instead, the corresponding list-item tag in the code navigator bar at the bottom of the window subtly highlights. Clicking on that tiny navigation item then highlights the code in the code window but it’s nowhere near as intuitive, doesn’t give as much immediate feedback to the coder and involves having to move the mouse to the bottom of the code window which is fiddly.

File associations

Another area where I think WeBuilder outshines the mighty Dreamweaver is in the area of file associations.

When I first installed both applications they each asked me which file types I’d like to associate with that program, e.g. .css, .js, .php, .xml, etc. I made my selection and the application negotiated a deal with Windows, so that I could simply double-click a CSS file, for example, and as if by magic the Web-developer-application-of-choice appeared.

But what if you change your mind? What if you now want to associate PHP files with WeBuilder instead of Dreamweaver, so that when you double-click a CSS file it opens in WeBuilder rather than Adobe’s offering?

In WeBuilder …

In WeBuilder it’s quite simple. Go to Options > Preferences, click on Files then select Associations:

File associations dialog in WeBuilder 2008

In Dreamweaver CS4 …

In Dreamweaver … I’ve still to find out how to do it. I’ve read through two Dreamweaver CS4 books, searched Google down to about results page 10 and I don’t think you can. I think you have to do it manually via Windows Explorer: Tools > Folder Options > click on the File Types tab.

I can’t understand why. Unless, of course, Adobe reason: why would anyone want to use anything other than Dreamweaver?!

Question: does anyone know how to do this from within Dreamweaver, or how to get DW to run the initial file association dialog again?

Project management

Where I think Dreamweaver CS4 completely outshines WeBuilder is in the area of project management. In WeBuilder you can define projects, which is a really useful feature, but it doesn’t manage them to the same extent that Dreamweaver does.

Dreamweaver scans your site code and builds a cache. It knows what’s linked to what, so if you rename a file, for example, it will offer to update links to that file throughout your site. And if you site has 600+ pages, as one of mine does, you’ll realise what a time-saver that is. For that feature alone it’s worth the money!

I remember back in the days of 1st Page 2000 spending two weeks going through a site simply correctly links to files that I’d moved because I’d not planned the site in full before coding.

Extensions

The other advantage that Dreamweaver has over WeBuilder is its support for community-created extensions, which add extra functionality to the application.

Want to add microformats, Google maps, PayPal or Skype buttons, YouTube videos — just download and install the extension.

WebAssist

WebAssist create a number of amazingly good extensions. Some are free, the best ones cost, but are very reasonable considering what they do and the time and potential frustration that they avert.

I thoroughly recommend Eric Meyer’s CSS Sculptor extension and the related CSS Menu Writer extension, and I like the look of the new Jeffrey Zeldman’s Web Standards Advisor extension.

Conclusion

So, is Dreamweaver better than WeBuilder? In some ways, yes … but there are some features in WeBuilder that I struggle without now (particularly, especially the code highlighting). I can see me using a combination of them both for a few years to come.

That all said … I do fancy checking out WestCiv Style Master assuming that it supports CSS 2.1. I suppose it’s too much to expect it to handle elements of CSS 3, given that the latest version was released in 2006.

Posted in CSS, Computer, General, Reviews, Software, Web, Windows, XHTML | 2 Comments »

A very creative year so far …

Tuesday, September 9th, 2008

Right Twin - week 19
Right twin at 19 weeks

In many ways 2008 has been a very odd year for me, for many reasons. Of course it opened with the IVF procedures that led to Jane discovering that she was pregnant, that led to us discovering that she was pregnant with twins.

During the last six months we’ve been filled with delight, trepidation, excitement, nervousness, wonder, a whole spectrum of emotions. And here we are now at week 27.

For those who don’t know, a full-term pregnancy is generally regarded to be 40 weeks. Twins, we’re told, generally make an appearance early, round about weeks 35-37. So we could have another 10 weeks; we could have more, we could have less. We’ll continue to trust God, and wait in quiet expectation.

I was born to reflect and not shine

It’s been a funny year where I’ve blogged a whole lot less, but gone out and done a whole lot more — but then didn’t come back here and share it with you all … sorry about that, but I guess I’ve needed that time to reflect. I’ve felt myself go deeper within myself — go into my ‘cave’, Jane might say — and reflect on where I am, who I am, and what it means to be expecting children: two, at once!

I’m not entirely sure where I am, or what to expect, it’s all a very new experience for me. But one thing I can say with certainty is that I’m really looking forward to meeting the boys now, and I’ll certainly give it my best shot.

I learned a lot of good things from my own dad, hopefully I can pass some of that love and laughter on to my own boys, and make up some weird nonsense of my own to hand on to them!

I just really wish that Dad was still here to meet them too when they arrive. (Again, for those who don’t know: my Dad had a triple brain haemorrhage in 1983, was really quite ill for about 15 years and died shortly after New Year in 1998. Ten years ago: another contribution to the oddness of 2008.)

New design

But 2008 also opened with another creative process: the redesign of the University of St Andrews website, which was launched to the public (having been in what I guess we could call ‘closed beta’ if we wanted to go all Web 2.0 with y’all) last night.

Here’s a screenshot of the external homepage:

Screenshot of University of St Andrews website
Screenshot of the new design for the University of St Andrews website.

“But… didn’t you just launch a new design last year?! Why do you need another new design?” Quite a few folk have asked us that over the course of the last few months, and it’s a good question to ask.

When we did the first relaunch of the University site it was more than just a new visual design, it was a completely new website: new design, new architecture, new way to update and manage the content, new … everything.

We designed and built the site according to the excellent wireframes that had been developed in collaboration with us by Dynamic Diagrams, an information architecture company from the States. They were great, we learned a lot from them, and for me that was one of the most exciting parts of the project.

Listening

But like any design, the then-new design was a “best bet”, it was the closest that we got to what we perceived we would need from the site. So we built it, launched it and let it settle in for six months while all the time listening for where the design wasn’t working properly, where we needed more flexibility, and crucially: what the users were asking for.

We got a little more explicit by inviting both staff and students to feedback sessions over lunch, where we bribed them with food to tell us what they really thought of the site, what they liked about the site, what they felt could be done better, and what was missing.

I went into those sessions expecting to feel very defensive, but came out of all three sessions feeling quite buoyed and encouraged. It felt good to listen to our ‘customers’, and from the feedback from those sessions mixed in with our own collation of ideas from helpdesk calls, as well as our own thoughts and observations we set about redesigning the site. And this time we didn’t touch the structure (much), we looked instead solely at the visual design and its functionality.

New design

We wanted something that was:

  • Clean, fresh and contemporary
  • Not too far from what we already had
  • Easy to maintain, and extend
  • Compatible with the most number of browsers (old and new)

The site itself is built on the Blueprint CSS framework, with a number of tweaks, which helped us address most of these requirements.

What was particularly impressive about Blueprint was how it allowed us to ’sketch’ designs in code faster than we were able to do it with a graphic design package. And nothing looks more like a web page than a web page!

So for the last seven months or so I’ve been diligently working on the code, often times taking it home to work on in the evenings and at the weekend. I’ve working on it some nights past 01:00, and some mornings before 05:00.

It really has been a labour of love, but then … I believe in the University of St Andrews, and I love my job. St Andrews is where I did my undergraduate degree, I feel an incredible loyalty to the place and sincerely want to do the best for the University.

Launch

So at five pm last night we scheduled the new site to launch … and ran away!

At home we waited with baited breath while the new design for the University of St Andrews website was published to the public web server, and then breathed a sigh of relief that we’d got most of the planning right.

There were a couple of sections (sport, music, UTREC) that we’d overlooked and had published out with the wrong design, but on the whole it went without a hitch.

… until there was a serious power outage in St Andrews during the afternoon today and all our systems (including the web server) went down! You can’t have everything … like a new design and the ability to look at it!

And relax!

Posted in CSS, Content Management System, Design, Family, General, God Project, Job, Places, St Andrews, University, Web, Web 2.0, XHTML | 1 Comment »

The last three months

Monday, March 31st, 2008

Sun behind clouds

How can it be the end of March already?!

It’s not just me, is it? Easter felt infeasibly early this year. I happened before the clocks went forward (from GMT to BST). In fact, it happened before it had even stopped snowing!

And now that Easter is passed, Jesus has risen again (Alleluia!) and in a strange way I feel as though I’m emerging back into the sunshine. Have I been hibernating for the last few months?

I’ve certainly been fighting more bugs than is healthy in the first three months of any year. I don’t remember any other year when I’ve been inundated with so many illness bugs, and viruses and the like. Just as soon as I’m getting over one the next wave of attack hits me. It’s not funny … I want it to stop. Please!

In many ways the last couple of months have been a whirlwind of activity and emotion, which has largely been responsible for the dearth of blog posts here this year.

I’ve pretty much been doing the following:

  1. Waiting
  2. Coding
  3. Reading

Waiting

When the calendar clicked over to 2008, a couple of months ago, and we got (another) green light from the hospital to say that our IVF treatment would begin (again) this year a strange thing happened: I felt a though I began to retreat into myself.

I’m not entirely sure why, except that I guess I wanted to protect myself and from the relative safety of my ‘inner cave’ examine how I felt about this enormous step we were about to embark on (again!). It’s not an all-together bad thing to do, all things considered. In some ways, quite responsible. (Perhaps this means that I must be a grown-up now.)

One of the hardest things about the whole IVF programme (so far) is the waiting.

There’s a lot of waiting.

And unlike many of the procedures involved in the In Vitro Fertilisation process it’s something that the man can do equally well as the woman. In fact, it’s something that they can do together … since they can’t do any of the other things that are normally involved in trying to start a family!

So we’ve been waiting. And waiting some more. And in between the waiting … well, actually it’s mostly been waiting if I’m honest.

At times it’s been quite unbearable. We just want to know. One way or the other.

Coding

For the last few weeks I’ve hardly known what to do with myself. I’ve felt like a kid waiting for Christmas.

Jane started on the IVF drugs in July 2007 and it dragged on and on and on. One more month, another month after that … and then in December it was cancelled. Brought to an abrupt halt.

We could have had a child in that time!!

So in order to distract myself I’ve been bringing work home with me. I’m currently working on a recoding of the University’s website. And with the recoding a bit of a design tweak here and there.

Bringing it home has given me something to focus on. Something consistent. Something that has a beginning and an end. Something that I have been able to create.

I’ve been really enjoying it too, which has been the important thing.

Reading

And when I’ve not been sitting in front of my monitors I’ve been reading. Sometimes curled up in bed, other times on the sofa keeping Jane company.

Here are a few of the books I’ve been waiting through.

So I’m still alive and well, just keeping my head low just now.

Posted in Books, CSS, Family, Fertility, General, Health, IVF, Reviews, Web, XHTML | 3 Comments »

Transcending CSS

Sunday, January 6th, 2008

Transcending CSS

Transcending CSS: the fine art of web design by Andy Clarke is one of the best books about cascading style sheets (CSS) that I’ve read in a long time.

As a designer Andy Clarke has produced a book that’s far from the hundreds of other dull books on CSS which are packed full of dry code examples and pages and pages of text. This is a beautiful and colourful book, filled with hundreds of images, that takes a real-life approach to designing sites and writing accessible HTML and CSS code.

While this book isn’t aimed at beginners, it assumes that you have at least a good, working knowledge of XHTML and CSS, it is very easily read and if you’re looking to get into modern CSS layout methods then this book could be an inspirational introduction to the subject. Because of the design of the book it’s also more accessible than Jeffrey Zeldman’s excellent Designing with Web Standards, now in its second edition.

The book is organized into four main sections:

  1. Discovery
  2. Process
  3. Inspiration
  4. Transcendence

Discovery

In the first part of his book Andy Clarke introduces us to what he calls Transcendent CSS, that is code that looks to the future, building on current web standards to create accessible, cross-browser-compatible websites, rather than relying on outdated layout methods such as non-semantic tables.

He argues for web standards, acknowledges that not all browsers display the same design, advocates that web designers use all available CSS selectors and semantic code, use CSS3 where possible to look to the future, avoid using hacks and filters, and to use JavaScript and the DOM to plug any gaps in CSS.

One particularly useful exercise is where he takes real-life examples and shows how he would present these in XHTML, in a section entitled “translating meaning into markup”. His examples include a horse race, marathon runners, a taxi rank, books on a shelf, and a museum display of mediaeval helmets.

Process

Having set the scene over the first 100 pages (lots of pretty pictures on the way, so don’t worry!) Clarke explores a usable process for designing with web standards. It’s quite a good introduction to certain elements of information architecture, such as wireframing/grey-boxing and usability.

Taking the example of a design for Cookr! (his made-up recipe website) he adds mark-up to the design to show you how to best mark-up and organize the XHTML and CSS code. It’s a very visual and practical approach which is strengthened by excellent explanations of what he’s doing and why.

Inspiration

In the third part of the book Clarke moves away from code and gives us an insight into where he finds inspiration for website designs. And it’s not just from other websites but newspapers, magazines, buildings, streets … anywhere really.

This section offers a good introduction to grid and layout theory, and his advice about keeping a scrapbook of inspiration examples is really helpful, either a real scrapbook or something online like Flickr. He finishes off the section exploring why design is more than just creating attractive visuals.

Transcendence

In the final section Clarke brings it all together in some practical examples of how to take particular designs and mark them up using semantic XHTML and CSS. Of particular note is his extensive and creative use of lists for marking up particular content.

This section has the best explanation of relative and absolute positioning that I’ve read in any book on CSS. It’s really worth buying it just for that.

He finishes off the section with a look ahead to what CSS3 has to offer. I’m looking forward especially to the :nth-child pseudo-class which will make creating zebra-stripes on tables easy (currently available via hand-coding and jQuery), multiple background images for elements, and multicolumn layouts (currently available in Firefox via the -moz identifier).

Conclusion

I found this a really inspiring book which got the balance between code theory and practical design application right. I’d certainly recommend it to anyone who’s looking to improve their CSS coding or simply wanting inspiration about how to take their CSS to the next level.

Available on Amazon UK.

Posted in Accessibility, Books, CSS, General, Reviews, Usability, Web, XHTML | No Comments »

Latest version of Firefox broke our 404 page

Saturday, October 20th, 2007

Broken web page

The latest version of Mozilla Firefox 2.0.0.8, I’m sorry to report, broke a couple of our web pages yesterday.

UPDATE: This problem has now been fixed in Firefox 2.0.0.9: see Firefox 2.0.0.8 update to be updated

I noticed it just as I was about to go out for lunch. I was checking out a page on the University website and followed a broken link … to a broken 404 page.

Investigations

At first I simply suspected that it was due to some CSS tinkering that either my colleague or I had done. But neither of us had done any.

And then I discovered that it was working fine in Firefox 1.5, IE6, IE7, Opera 9 and Safari 3. It was working fine in my colleague’s installation of Firefox 2.0.0.7 … and then when he restarted the browser to allow its automatic update to version 2.0.0.8 it promptly broke.

So the culprit was indeed the latest incarnation of my favourite browser. How disappointing.

The problem

The way that the page is constructed is that there is a div that wraps the page’s main content. If I was recoding it today, I’d call it #contentWrapper; when I coded it 10 months ago, I called it #main.

Within #main there are three other divs, in order:

  1. #content
  2. #sidebar
  3. #related_content

#main then has a background image of part of the University crest. How much of the crest is displayed depends entirely on the height of its three internal divs.

Only, this appears to be the problem that Firefox 2.0.0.8 has highlighted/discovered/introduced* (*delete as applicable): it now does not recognize the height of the internal divs: #content, #sidebar and #related_content and so collapses, as you can see from the screenshot above.

The (temporary) fix

Introducing a min-height CSS attribute to the code has temporarily fixed the problem, but fixed the height of #main at 550px — enough for the 404, 401 and the front page, which all use that code.

Recoding

I’m now working on a more robust fix … in fact, I’m now working on recoding the entire site to make it more usable by the few ancient browsers that Google Analytics informs us are still being used to visit the site, such as Firefox 1.0, Firefox 1.5, and various older versions of Netscape and IE.

I had used a variation of Matthew Levine’s In Search of the Holy Grail method on A List Apart, mixed with a Dan Cederholm’s Faux Columns approach, for a number of reasons:

  1. I wanted the site to be as accessible as possible, and decided that placing the main page content as high in the source code as possible would be helpful.
  2. Do you know how difficult it is to achieve something as seemingly simple as creating a page layout with three equal-height columns?
  3. The ‘holy grail’ approach worked for almost everything we needed until it came to wanting to jump down to page anchors. We had a couple of A-Z lists and wanted to be able to click on ‘D’ to take us down to the ‘D’ entries. Instead, it pulled ‘D’ up to the top of the page and made A-C disappear completely!!
  4. We decided to fully support only modern browsers: IE6 and IE7, Firefox, Safari/Konqueror and Opera 8 and above. (While I don’t class IE6 as a modern browser it’s the one used on about 75% of all the university PCs so we had no choice but to support it.)

I guess I now need to be finishing writing these fixes sooner rather than later. I’m just a little disappointed that the latest version of my favourite browser has broken the code, while Safari, Opera 9 and even IE7 saw fit to render it as expected.

However, what I’m not entirely certain about is whether Firefox is now simply rendering the code as it should be (in other words, I’d missed a trick with my code) or whether this genuinely is a fault with Firefox’s rendering. Time will tell.

Posted in CSS, Computer, General, Mozilla Firefox, Trouble-shooting, Updated, Usability, Web, XHTML | 4 Comments »

Borders Scrap Store website launched

Tuesday, September 25th, 2007

Borders Scrap Store

Late last week the Borders Scrap Store website was finally launched. I had fun designing and building it. Here are a few features that I’m proud about:

Dynamic site on a static host

The site is built using XHTML 1.0 Transitional, CSS 2 and hosted on a static hosting account. In order to allow the staff to update the news section more easily I set up a WordPress account: http://bordersscrapstore.wordpress.com/ and then used the Google AJAX Feed API to pull-in the latest news items into the static HTML page.

There can be a delay of about an hour (or more) before news is updated, because it relies on Google Feedfetcher, which is also used for Google Reader and the Google personalized homepage.

I discovered that a good way to ensure that Feedfetcher was picking up the new feed from the Borders Scrap Store WordPress account was to simply add the feed to my Google Reader account. That way it was in the system and guaranteed that Google will be watching this feed.

Microformats and Google Maps

Other neat features of the site include the use of hCard microformats on the contacts page, and personalized Google Maps.

Microformats are simply ways to mark-up existing XHTML code so that the data can be read equally by humans and machines. This means that on the contacts page if you have a browser add-on, such as Operator for Firefox, then you can automatically import the contact details into your contacts application (such as Microsoft Outlook) without having to manually type in the information.

I used Google Maps to create custom markers for the Selkirk store and Musselburgh store which should make it easier for folks to locate the stores using familiar mapping tools.

Next

I’m already working on my next project: a new website for the Christian Fellowship of Healing.

Posted in General, God Project, Google, RSS, Web, XHTML | No Comments »

Essential web development tools for Firefox

Wednesday, September 12th, 2007

Firefox eats IEI was chatting with a friend online this evening (hello Steve!) about web coding, and I offered him my three favourite add-ons for Mozilla Firefox which I find absolutely essential for coding and debugging HTML, CSS and JavaScript.

Work in Firefox, debug in IE

When developing code I tend to always work with Firefox first. When I’m happy that my code is working properly, I’ll then test it in Opera and Safari and only then will I check it out in Internet Explorer 6 and 7.

And then typically I’ll spend the next fortnight debugging my nice clean code in IE, trying to find workarounds that will make my pages work properly in the world’s favourite (and most terrible) browsers.

It’s only the most popular because people are too lazy to install something better. Or don’t realise that there is something better. “But it looks okay to me…!”

Seriously, if there was a car that killed as many people as IE kills good quality web code, it would be banned in a flash.

1. Web Developer

Web Developer toolbar

Web Developer by Chris Pederick adds a toolbar and a new submenu to Tools to Firefox, which are absolutely packed with web developer tools.

There are 12 main sections on the toolbar, which give you access to all the tools and features:

  1. Disable
    Allows you to disable anything from Java to JavaScript, Cache, Meta redirects to colours.

  2. Cookies
    Disable, delete, clear or view cookie information.

  3. CSS
    Not only can you view CSS, you can also edit live CSS in the cache and see what effect your changes have.

  4. Forms
    Display form details, show passwords, change GETs to POSTs, etc.

  5. Images
    Disable or hide images, display alt attributes, image dimensions, etc.

  6. Information
    View all sorts of details about the page from ID and class information to blocks, anchors, links, tables, document size, headers and lots more.

  7. Miscellaneous
    Show comments, show hidden elements,show a ruler on the page, etc.

  8. Outline
    This is one of my favourites — here you can single out a particular page element and find out the markup, class and ID information. Essential for debugging or writing CSS.

  9. Resize
    Define preset page sizes for testing, eg 800 x 600, 1024 x 768, etc.

  10. Tools
    Validation, DOM inspector, Error and Java consoles.

  11. View Source
    View Source, Framed Source and Generated Source.

  12. Options
    Options, Help and About.

I use this add-on all the time, particularly for debugging code or learning about someone else’s code.

It is designed for Firefox, Flock, Mozilla and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS X and Linux.

2. Firebug

Firebug

Firebug offers a few similar features to Web Developer but it really comes into its own with its own separate window. Here you can explore the HTML, CSS, JavaScript, all viewable by DOM, Styles or Layout.

Two of my favourite features are the ability to point at a line of code in the Firebug source view and the corresponding section of the actual page is highlighted (check out the blue highlight in the screenshot above), showing you exactly what that code relates to on the finished page. It even shows margins and padding in different colours (yellow and purple).

It will also show you the CSS cascade: which CSS rules are being used for that section of the page, and which are being overruled.

Firebug will also allow you to edit HTML, CSS, and run live JavaScript on the cached page, making it one truly remarkable and powerful add-on to your web developing toolkit.

3. HTML Validator

0 errors / 0 warnings

HTML Validator is an add-on that shows HTML validation information within your Firefox browser window, rather than having to go to a separate site, such as http://validator.w3.org.

The number of errors of a HTML page is seen on the form of an icon in the status bar when browsing. The details of the errors are seen when looking the HTML source of the page.

It really is that simple. You can specify the type of validations to check, including accessibility.

Conclusion

Those are my top 3 web developer add-ons. Of course, Microsoft also has its own Internet Explorer Developer Toolbar, but to be honest compared with the polished and precise offerings for Mozilla, the IE version has the elegance of performing open-heart surgery with a wooden spoon and a spanner.

Other developer-related add-ons that I’ve used, include:

  • JavaScript Debugger – This is Mozilla’s official JavaScript debugger, code named Venkman, which aims to provide a powerful JavaScript debugging environment for all Mozilla based browsers.
  • View Source Chart (creates a colourful chart of a web page’s rendered source code, which can be very useful.
  • UrlParams – Shows you the GET and POST parameters of the current website in the sidebar, and allows you to edit and submit your own values. Useful for testing forms.
  • Operator and Tails – two add-ons for showing Microformats information .. but that’s for another blog post

I tend to keep most of these installed (apart from the Microformats add-ons) but disabled, and only enable them when I need them. That way they are close at hand, but don’t take up valuable system resources for the 99% of time that I’m not using them.

Posted in Accessibility, CSS, Computer, Friends, General, Job, Mozilla Firefox, Reviews, Software, Trouble-shooting, Web, XHTML | 5 Comments »

« Older Entries