When you are developing web pages there are certin things that you may be struggling with. Here are some basic tools to make things a little easier


Selector Gadget - http://www.selectorgadget.com/
SelectorGadget is an open source bookmarklet that makes CSS selector generation and discovery on complicated sites a breeze. Just drag the bookmarklet to your bookmark bar, then go to any page and press it. A box will open in the bottom right of the website. Click on a page element that you would like your selector to match (it will turn green). SelectorGadget will then generate a minimal CSS selector for that element, and will highlight (yellow) everything that is matched by the selector. Now click on a highlighted element to remove it from the selector (red), or click on an unhighlighted element to add it to the selector. Through this process of selection and rejection, SelectorGadget helps you come up with the perfect CSS selector for your needs.

FireBug - https://addons.mozilla.org/en-US/firefox/addon/1843/
Firebug integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.

Web Developer Toolbar - https://addons.mozilla.org/en-US/firefox/addon/60/
The Web Developer extension adds a menu and a toolbar with various web developer tools. This plugin is my personal favorite, very easy to use and very very useful.

Coda Editor -http://www.panic.com/coda/
Nothing much to say about this, it great. Lol. See below windows users

E-Text Editor -http://www.e-texteditor.com/
E is a new text editor for Windows, with powerful editing features and quite a few unique abilities. It makes manipulating text fast and easy, and lets you focus on your writing by automating all the manual work. You can extend it in any language, and by supporting TextMate bundles, it allows you to tap into a huge and active community

Apanta Studio 2 - http://aptana.com/
Aptana Studio is the industry leading web development environment that combines powerful authoring tools for HTML, CSS, and JavaScript, along with thousands of additional plugins created by the community.

FireFTP - http://fireftp.mozdev.org/
FireFTP is a free, secure, cross-platform FTP client for Mozilla Firefox which provides easy and intuitive access to FTP servers.

Firefox 3/4 Beta - http://www.mozilla.com/
Meet the World’s Best Browser. With security, stability, speed and much more, Firefox is made for the way you use the Web. Free and easy to install!

Hosting - PM me for a good host
Hosting is proberly the most essential tool you can have. It is all very well using a free host such as forumotion, but they have very limited features. Where as a descent host had a bunch of features such as the ability for PHP, SQL etc... My hosting what I use for my website(s) is great. Its fully unlimited and very cheap considering, very rarely goes offline and the cusomer service is unbeatable.

Adobe Photoshop/Fireworks - http://www.adobe.com/products/photoshop/compare/
Adobe Photoshop is a graphics editing program developed and published by Adobe Systems Incorporated. If you want to build effective and pretty websites use it. Nothing really compares to it, just get it if you plan on saying in web design for the long run. It will pay off (PS. I am on version CS5 Master Collection and it cost me around £600 for the Mac version with the student discount) (PSS. I do not agree at all with people that use "torrents", keep away from them)

CSS Mastery: Adavanced Web Standars 2nd Edition - http://www.cssmastery.com/
Andy Budd not only clearly understands and is able to teach the underlying technologies and contemporary methods used in CSS design, but his knowledge of cross-browser support issues is unparalleled.
It's a great book, if every you are stuck you can just flick through the pages and find your solousion. Both for beginners and seasoned web designers.

Web Designer Magazine - http://www.webdesignermag.co.uk/
I personaly love this magazine, I have my subscription paid at the beggining of every year Got some fantastic tutorials and some brilliant showcase. And you get a disc in the back that at times are worth upto £1,000. Nothing more to say BTW: It's alot more expensive if you don't have a subscription (£5.99)

Got API/HTML - http://www.gotapi.com/html (Courtesy of Green CoW)
I can't really comment on this as I have not had chance to check it out yet, when I do I'll be sure to give my full say on it.

Script SRC - http://scriptsrc.net/
Its a great little website that lets you copy all the script src's you could want. Not so good for people running on servers but great for Forumotion users I suppose...

XAMPP - http://www.apachefriends.org/en/xampp.html
The philosophy behind XAMPP is to build an easy to install distribution for developers to get into the world of Apache. To make it convenient for developers XAMPP is configured with all features turned on.

The default configuration is not good from a securtiy point of view and it's not secure enough for a production environment - please don't use XAMPP in such environment.

CSS Reset - http://www.cssreset.com/
This site is a life saver. As you may know it is a good idea to include a CSS reset, this is usually done by adding it to your current CSS or in my cas I always link it to a new file called "reset.css". All the most common CSS Reset scripts in one place, with complete documentation, guides and tutorials.

Intype - http://intype.info/
This is my personal choice of editor for Windows. It's a great little studio and I have developed a ton of snippets for it including HTML5 and CSS3. If you wanna get your hands on them just give me a PM and I'll send them over to you.


I hope you find some of these tools useful

I'm already using Firebug. Its a great tool

I just tried SG bookmarklet on webartz index Though its not difficult to find exact selector, this tool is very helpful

Yes it is

No it is not, but for newbies it is OK

Not updated it in a while

Apanta Studio 2 - http://aptana.com/
Aptana Studio is the industry leading web development environment that combines powerful authoring tools for HTML, CSS, and JavaScript, along with thousands of additional plugins created by the community.

FireFTP - http://fireftp.mozdev.org/
FireFTP is a free, secure, cross-platform FTP client for Mozilla Firefox which provides easy and intuitive access to FTP servers.

Missed the most important one of all

Firefox 3/4 Beta - http://www.mozilla.com/
Meet the World’s Best Browser. With security, stability, speed and much more, Firefox is made for the way you use the Web. Free and easy to install!

I didn't like Aptna studio but FireFTP is cool

Why did you not like Aptana?

RockerMan wrote:Why did you not like Aptana?

Its good but not as cool and simple as Notepad++

FireBug & FireFTP are great! Been using them forever.

Updated

ankillien wrote:I'm already using Firebug. Its a great tool

I just tried SG bookmarklet on webartz index Though its not difficult to find exact selector, this tool is very helpful

I prefer dragonfly :3 Awesome list, it'll certainly come in handy!

Never heard of it, mind sending over a link?

It's default when you download Opera (:

This link is also pretty good to have
http://www.gotapi.com/html

Thanks GC, I'll add it

Firebug is a great tool and if you own a mac espresso is really nice

Updated

XAMPP is cool. I use XAMPP Lite for development.

08/02/2011 - Updated

Any chance of getting this to a stick post? I think it may save alot of the simple problems that some of the members are having

They Cool!

Not as much of a "tool" as the others, but I thought it was a really good color picker: http://argentina.org/

fire bug is best I have just use only this.

pink zebra designs

We can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page for that shared information is very useful. 

i love to use the inspector tool in Firefox first got a great design and easy to understand than you can editor anything, i think that is even better than firebug.