How to Make a Website - Useful Tools

When developing a website there is a lot to consider even if you are experienced and already understand a lot of the requirements and concepts involved. It makes it easier if you know what tools are available to help you out. Based on this I have compiled a list of the tools I find most useful when developing a site and thought I would share it with you.

Browser Extensions

Firebug and the Firefox developer toolbar

These are two different extensions for Firefox which allow you to both inspect the data and scripts that make a website page up. Firebug is actually my favourite but you may wish to check out the Developer toolbar as well. Do a search on google for 'firebug' or 'firefox developer toolbar'.

Developer toolbar for Internet Explorer

There is also now a developer toolbar for Internet Explorer 7 and IE 8 actually comes with the toolbar pre-installed.

These tools allow you to do things such as: inspect CSS styles sheets and Javascripts used in the page, see the individual CSS or Javascript events attached to individual HTML elements in the page, view header data, post and response data. Believe me, whether you are a web designer or web developer, learning how these tools work will give you a big advantage when developing and bug-fixing your websites. I absolutely cannot do without them on a day-to-day basis.

SEO for Firefox

There is a great little tool if you want to understand SEO. Search Google for 'SEO for Firefox' and you will find seobook.com which offers 2 tools for SEO - a toolbar and also an inpage set of SEO results.

SEOMOZ keyword extractor

This tool scans a web page and reports back the keywords and terms which are most prominent on that page. Basically, you tell it where your website is, then it tells you which terms your site seems to be trying to rank highly in search engines for. If the results aren't the keywords you've been targeting, you'll probably want to make some changes.

Browsershots

Browsershots is a great service for web designers that lets you see how your website looks in different types and versions of web browser. It can take a while to produce the results, but it has a comprehensive list of browsers and you can't argue with the price - its free.

Wave

It's good practice to adhere to to accessibility guidelines, and means people with disabilities will find your website easier to use. Wave is a tool to evaluate how accessible your site is - it will show you what you're doing right, and where you can improve.

W3C link checker

It's easy to get links right when you first add them to your website. But as your site grows, pages change. The same happens to external sites too, so links which once worked often end up at a 'page not found' error. This link checker scans every link on your web pages, telling you which ones work, which ones don't - and exactly what's wrong with them.

Site Monitoring with

Site24×7 - this free online service pings your site hourly and graphs response times and warns you if the site goes off line. For a few dollars a month, you can get checks every 5m and SMS alerts.

Wordpress

Wordpress is probably 1 of the greatest tools to be introduced to the web in the last few years. It was originally intended as a blogging tool but now - with the great range of Theme templates, widgets and plugins you can create a fully fledged website without having to write any code yourself. You dont have to create blog posts but can just create a site which has pages. Plugins such as SEO for Wordpress even help optimize your content for SEO without you having to understand this too heavily.

Google Tools

Google Webmaster Tools

Your best insight into how Google's search engine sees your site, statistics of the googlebot's activity on your site. You can even adjust the crawl rate of the googlebot on your site ie. this is useful if the googlebot is taking up alot of bandwidth and throttling your site.

Google Analytics

Completely awesome, interactive, online site statistics.

Google AdSense

Sign up for AdSense and you can make money by putting Google provided ads on your site. Google generate the code for you so you don't even have to write any yourself.

Technorati

If you haven't done it yet, registering your site with Technorati will help you track your interactions with the blogosphere. Who links to you and how much authority your site has. Warning: addictive!

Alexa

Yes, I know it's the subject of much debate but if you get reasonable amounts of traffic, Alexa is one useful way of benchmarking your traffic against other popular sites. It's also a useful way of seeing who is linking to your site.

Feedburner

Feedburner provides site statistics, simplifies RSS feeds, does some social network bookmarking (Digg etc.) and some other stuff. There's a WordPress plug in that automatically switches existing RSS subscribers over to a Feedburner feed.

If you are completely new to the topic of how to make a website then you might find it useful to check out our article 'Starting Web Development' first.