Free website validation tools

Just found what look to be a couple of really great free resources...

Free Site Validator claims to be able to scan an entire website for validation errors and broken links, manage multiple sites, watch report status in real time, receive report email notifications. This is great if you don't want the hassle of having to trawl through your site page by page validating each one individually.

Browsershots lets you request screenshots of URLs in a whole host of browsers, again completely free (although there is a limit to how many requests you can make in a given period of time). I've only ever seen this sort of thing as a paid service before (Campaign Monitor offer it with HTML emails for example) so this is great.

'GCal Popup' Firefox extension

Although I haven't really got into the habit of using Google Calendar yet (to be honest I've managed to organise my life reasonably well so far without the need for a calendar), for those who do use it, GCal Popup looks like a nice little extension for Firefox.

Quite simply, it adds an icon to the status bar which, when clicked, opens Google Calendar in an overlay over the current web page, lightbox-style. Clicking the icon toggles the calendar.

I've not tested it but I guess the acid test is how quickly it opens. If it's no faster than having a conventional bookmark and opening in a new tab then I guess there's no real advantage, unless its psychological.

Anyway, the extension is currently labelled "experimental" so it might still be a bit buggy. But if anyone tries it out or already uses it, lets hear your comments.

Premailer — preflight for HTML e-mail

I just stumbled across Premailer. It's a free-to-use web-based service that takes any URL and converts it to a single static HTML file with all external styles converted to inline styles, as well as giving a list of warnings for anything that might not work in HTML emails (based on the Email Standards Project's guidelines. It'll even generate a plain text version for you as well!

Absolutely invaluable when it comes to creating HTML emails. I know Campaign Monitor already does this for you, but for those occasions when you're not using it this is prefect.

Firefox security extensions

Recommendation time. Here are a few useful Firefox security extensions...

Noscript - Blocks harmful scripts and objects including javascript, Flash, Java, Silverlight, even iframes and frames if you want! You can set the level of protection you want and then allow or deny scripts on a per domain basis, either temporarily or permanently.

CookieSafe - Similar to Noscript except for cookies rather than scripts.

KeyScrambler Personal - Encrypts keystrokes when entering text in web forms etc. to protect against keyloggers. You can also install a plugin for Internet Explorer at the same time although this requires a system restart. The default setting for Firefox is for an overlay bar showing your encrypted keystrokes as you type but you can turn this off and just have the icon in the task bar or nothing at all.

Adblock Plus - Whitelist based banner ad blocking.

I know there's a temptation to think, "Is all this security really necessary?" Well, I'd rather be too careful and have to jump through a few more hoops while browsing the web than not be careful enough and end up regretting it!

Changing the Noscript keyboard shortcut

I recently started using the Noscript extension for Firefox in an effort to improve browsing security. One issue I noticed is that the 'Show/hide styles' keyboard shortcut (Ctrl+Shift+S) used by the Web Developer toolbar no longer works as the same shortcut is used to display the Noscript menu.

I already use an extension called Keyconfig which lets you edit most of your Firefox keyboard shortcuts (including those used by extensions) but for some reason the Noscript shortcuts don't appear in the Keyconfig list.

There is an easy fix though. Simply open extensions\{73a6fe31-595d-460b-a920-fcc0f8843232}\defaults\preferences\noscript.js (in your Firefox profile folder) and edit the line pref("noscript.keys.ui", "ctrl shift S"); to whatever key combination you want to use instead. I've changed mine to Ctrl+Shift+N (N for Noscript obviously, and it's not currently used by anything else).

Digital photography tips

Ask MetaFilter have some handy digital photography tips that are worth a look.

Another font manager

Cfont Pro is another free font manager for Windows. I haven't tried it out yet but it's worth filing away in the 'to look at sometime when I've got nothing else to do' tray.

Retain aspect ratio of selected area when resizing images

Seam Carving GUI is a freeware utility which allows you to resize an image while retaining the aspect ration of a specified area.

A similar functionality is built into Photoshop CS4 but for those who can't afford the upgrade (me included!), this could come in quite handy on the odd occasion when I need to fit an image into a space that's the wrong size.

Obviously it won't work for all images, but an example where it would work quite nicely is where you've got an area of background (sky, water, or something where a bit of stretching won't be obvious) that can be resized, while maintaining the proportions of the main subject.

It is possible to approximate this sort of effect by selecting an area of an image in Photoshop and resizing that part, but this tool is a bit more intelligent, allowing you to select irregularly shaped or multiple areas.

Ajax Contact Form

Tutorial Blog have a nice tutorial on how to create a simple Ajax contact form using PHP and jQuery.

jQuery definitely makes Ajax a lot simpler to use than 'raw' javascript.

typeface.js

One worth watching - typeface.js is a work in progress but aims to allow you to embed fonts directly into your website, removing the need for image/Flash text replacement.

Google Docs Desktop Shortcuts

Digital Inspiration have a handy walk-through guide to creating desktop shortcuts for Google Docs. A nice idea, obvious really but one of those things you don't think of until someone else mentions it!

There are quite a few browser extensions and desktop tools available to integrate Google Docs more fully into your workflow, although I haven't really investigated them all fully yet. The one thing I haven't found yet though is an application for Windows that will automatically open Microsoft Office docs (saved on my computer) in Google Docs.

Upcoming new WYSIWYG editor from 37signals

37signals have announced that they are working on a new open source javascript WYSIWYG editor. I'm going to be keeping a close eye on this as I'm not a big fan of existing WYSIWYG editors (TinyMCE et al), and Textile is just not user-friendly enough for the majority of people, simple though it is.

My biggest bugbears with existing WYSIWYG solutions is they're a pain to install and configure and they generate messy markup. If 37signals can overcome these issues I think they'll be onto a winner.

ScreenToaster

If you need to make a quick and simple screencast that doesn't require any fancy editing, ScreenToaster looks to be a really handy tool. It's completely web-based so no download required.

Template inheritance in Django

I've just discovered a killer feature of Django... template inheritance, using the {% block %} and {% extends %} tags.

It's probably there in other templating systems and frameworks so I'm probably coming late to the party but for someone who is more than a bit obsessive about nice clean structures in website development, avoidance of repetition in code, etc. it really appeals to me, more than all the other nifty things I've seen that Django can do.

To quote from the Django documentation:

One common way of using inheritance is the following three-level approach:

• Create a base.html template that holds the main look-and-feel of your site.
• Create a base_SECTIONNAME.html template for each "section" of your site. For example, base_news.html, base_sports.html. These templates all extend base.html and include section-specific styles/design.
• Create individual templates for each type of page, such as a news article or blog entry. These templates extend the appropriate section template.

Network hard drive

While Dropbox is a nice simple solution for syncing files over the internet, I'm not sure it's really what I need. The biggest requirement I have is for files to be accessible from both our home computers. The need to access files over the internet is fairly minimal really.

So on this basis I'm now thinking that a network hard drive is the answer. In the price bracket I'm looking at (as cheap as possible really!), Freecom do a nice one which seems to be rated pretty highly. Apart from the operating systems and software, everything else - photos, music, documents, etc. could be stored on here and then simply accessed from either computer. And you can also configure it for internet access which would make Dropbox redundant anyway.

Note to self: Must learn AJAX!

I know its embarrassing to admit, being a web developer and all, but while I've skim-read through a number of AJAX tutorials in the past, I've never really got round to properly learning it - by which I mean actually writing some code 'in anger'. I've always been able to get away without it or relied on colleagues to look after those particular bits of a project.

So Smashing Magazine's list of 50 AJAX tutorials looks like a good place to dive in when I next have a spare moment.

Duplicate Tab Firefox Addon

Duplicate Tab lets you clone or the current tab (as a new tab or a new window), detach the current tab into a new window, merge all tabs in all windows, etc. Useful.

I think Mozilla have a drag-tab-to-desktop-to-create-new-window function (like Google Chrome) in the pipeline for an upcoming release version but in the meantime at least, this is a useful addon.

Deserted US shopping mall

On the news last night there was a piece on how the credit crunch is affecting main street America. I wasn't really paying too much attention (any mention of the 'credit crunch' or 'global financial crisis' is enough to make anyone want to switch off just to save your sanity these days!).

Until they showed an out-of-town shopping mall. Somewhere in Ohio I think.

Out of 160 shops, only 5 were still open for business. The rest were simply empty, shutters down. How the remaining shops were managing to stay open I don't know because the place was literally deserted - not a single person in sight. Even the vast car park was completely empty except for a single car. It was eerie, like a ghost town.

A bit of a contrast with Leicester's (currently bustling) new Highcross shopping centre which has just opened, and hopefully not a sign of things to come here in the UK.

Kind of cool, kind of over-the-top

There's a video clip on the BBC website showing a quick tour round Google's office in Zurich. I've seen other clips before and I always find myself thinking I'm not sure whether it's cool or just a bit over-the-top.

Probably a bit of both.

Things like the slide, fireman's pole, etc. are just a bit over-the-top, and the big dark room with fish tanks and massage chairs - while I don't doubt it's relaxing - seems a bit excessive really! But having areas to relax and chill out, access to free food, the ability to choose different working environments depending on your mood, space to meet with colleagues and have a chat over a coffee - these are all great things (although I do wonder how they 'police' the amount of time people spend playing pool or computer games!).

KeePass

I've never been very organised with passwords, but with no end in sight to the number of new logins required, it seems like its well overdue that I do something about it. OpenID sounds like a good idea but the number of sites supporting it is still fairly small. Maybe I'll switch to using it for those sites that do support it. But for the rest, in the meantime, KeePass looks like a very nice bit of software for securely tracking passwords.

Lifehacker have a nice article on how to set it up and use it, as well as an article on using Dropbox to sync the KeePass database online so you can access it from multiple computers.

Dropbox

Oh yes! Why has Dropbox never showed up on my radar before? OK, I'm not one of these people that walk around with a laptop, connecting to the internet in every cafe, coffee shop and petrol station I see, but still, there are occasions when being able to access files remotely would be great. In fact, even at home where we have a desktop (which is upstairs, doesn't get used all that much and remains switched off most of the time) and a laptop (which is usually downstairs, gets used a lot, and is on standby most of the time), it would be very useful - and a much cheaper (free!) alternative to a network hard drive.

Rail overcrowding 'to get worse'

BBC NEWS | UK | Rail overcrowding 'to get worse'

...of course, if the government hadn't closed 2/3 of the rail network in the 1960s we probably wouldn't be facing this problem today!

List comprehensions in Python

Just came across this concept in the Django documentation, but without any background in Python or maths it wasn't immediately obvious what it was.

The basic syntax is:

L = [expression for variable in sequence]

L is the name of a the resulting variable containing the list of items generated by the loop
expression is the python expression that will be evaluated on each iteration of the for loop, using the given variable
variable refers to each item in the list to pass to the expression as we loop through it
sequence is the set of items we're looping through

An example:

toppings = ('ham', 'pineapple', 'beef', 'chicken')
x = ', '.join([toppings.loop_count() for t in toppings])

Totally pointless operation I know, as it simply copies the list in the 'toppings' variable to a new variable called 'x', but it illustrates the point! In reality it would make more sense if the initial list was a queryset object from a database that we want to loop through and list the values.

The for...in loop syntax already made sense to me, but I'd not come across this shorter way of writing it before. Apparently it's also the most efficient in terms of system resources.

Font sizes in CSS

Just now I wanted to adjust the font sizes in Django's built-in admin interface so I had a look at the CSS. In the global stylesheet, as expected, there's a font-size defined on the body tag. First thing to note - it's a fixed pixel size rather than a relative size which isn't ideal (for accessibility it's better to make this relative to the user's system/browser default). Anyway, when I changed it, none of the fonts actually changed size, because there are seperate (fixed-pixel) font sizes defined for each type of element.

This is a common error and one that winds me up. I just want to change the font size in one place, not search through a load of files looking for all the font-size properties. And when they've all been defined as fixed-pixel sizes it's worse because then I've got to try to work out by how many pixels each size should be adjusted to keep everything in proportion.

If all the font-sizes were set relative to the body font-size (using % or em values), then I could simply adjust the body font-size and everything else would resize accordingly - a 10 second job instead of 10 minutes!

Lists, tuples, dictionaries etc. in Python

I'm currently learning Django and found a useful reference explaining the different types of 'collection' structures in Python.

In brief:

List - contained in square brackets - like a PHP array - contents are editable.

Tuple - contained in round brackets - like a PHP array but contents are fixed (can't be edited). If only one item is specified, it must be followed by a comma.

Dictionary - contained in curly brackets - like an associative array in PHP

String - contained in quotes - can refer to individual characters by their position in the string like in a list/tuple

Iterator - a list temporarily created from an object to allow looping through each value using 'for ... in ...' syntax

With all of these, when referring to a specific item within the collection, you use square brackets.

Effort

Ian just sent me a link to this article on Seth Godin's blog. Well worth taking 2 minutes to read.

Carrying on regardless

Well, it seems that despite being 'blocked' I can still post here so post I shall do, in the hope at least that I will be unblocked again soon!

Partly for the benefit of any Google staff who may be checking whether this blog is actually violating any of their terms of service, and partly for the benefit of any regular readers (although I doubt there are many of those yet since I only just set it up!)... the point of this blog, as it says at the top of the page, is really just a place for me to pull together thoughts, commentary, useful links, and whatever else I feel like writing about. In other words, a place to voice some of my thoughts.

I already use Google Reader, Twitter, Facebook and Flickr, but I'm still searching for the best place to collate all those random bits of information that I want to share with a wider audience. A blog seemed like a good option to explore, so here it is.

Actually, I already have a blog (line2nowhere.blogspot.com) but that's specifically related to my interest in finescale railway modelling - something that is fairly 'niche' in it's appeal! Although I might occasionally comment on such things here, I'll aim to keep most of that stuff over there.

I imagine most of what I post on here will relate to web design, technology, news, and general life stuff. We'll see how it develops...

Blocked!

For some reason, on the first day of setting up this blog, Google has seen fit to block it as 'a possible Spam site'!! I know it's all automated but still...

I've sent a request for a review but still waiting to hear anything back!

picasa2flickr

picasa2flickr - flickr upload plugin for picasa is a useful little plugin that adds a button to Picasa allowing you to send selected photos straight to Flickr Uploadr.

Reassuring?

BBC NEWS | Business | What would financial Armageddon look like?

It's reassuring if you consider that things aren't currently anything like as bad as they were in the 1930s. But it's not so reassuring when you turn it around and think that things could get a whole lot worse before they get better!