Design Tools

Web Design Tools are always handy to a web designer and coder, with tons of features, fantastic UI, these tools provide best results if used wisely. Every tool has its pros and cons, you have to choose which suits your needs, investment planning and the OS you are using.

Some of these are not cross platform and some are free, yes totally free design tools. But this list is not completed and can never be completed, without your input. With emerging trends of online apps some of the software are not needed to be installed on your computer.

I hope you will like the collection for a start and I will be adding more and more web design tools which designer and developers use in day to day life. So stay connected and bookmark this post for future reference.

Designing

Photoshop : Adobe Photoshop is a very popular commercial graphics editor available for the Mac and Windows operating system. Created for professional photographers and designers, it is the ideal application for manipulating images and creating web graphics. Photoshop has all the necessary tools and options you need such as: Filters – which automatically adds effects to your image or a selected section of your image, extensibility and automation with Brushes, Actions and Scripting, and workflow enhancement features like Layer Comps and the Revert  option.

Fireworks : Adobe® Fireworks® CS5 software enables you to create expressive, highly optimized graphics for the web or virtually any device — from smartphones to kiosks to embedded displays. Produce websites, user interfaces, and rich prototypes that are editable in both vector and bitmap modes.

Gimp : GIMP is the GNU Image Manipulation Program. It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.

Wix : Free website builder to design stunning Flash websites designs with drag and drop website builder.

Flash : Adobe® Flash® Professional CS5 software is the industry standard for interactive authoring and delivery of immersive experiences that present consistently across personal computers, mobile devices, and screens of virtually any size and resolution.

Favicon : Use this online tool to easily create a favicon (favorites icon) for your site. A favicon is a small, 16×16 image that is shown inside the browser’s location bar and bookmark menu when your site is called up. It is a good way to brand your site and increase it’s prominence in your visitor’s bookmark menu.

Gomockingbird : An online tool that makes it easy for you to create, link together, preview, and share mockups of your website or application.

Kuler : Online Application for generating color themes that can inspire any project. No matter what you’re creating, with Kuler you can experiment quickly with color variations and browse thousands of themes from the Kuler community.

Pixlr : Most popular advanced online image editor.

Vecteezy : Vecteezy is the place to share your free Vector Art and other vector-related resources. Here you can explore and discuss the creations of other artists from around the world, or just find that perfect little freebie for your next project. Vecteezy makes it easy to explore thousands of graphics created by vector artists from all over the globe. All the graphics are free to download and, depending on the license, free to use in your projects.

Gliffy : Gliffy is a online diagram software, you can easily create professional-quality flowcharts, diagrams, floor plans, technical drawings, and more.

Coding

Kompozer : KompoZer is a complete web authoring system that combines web file management and easy-to-use WYSIWYG  web page editing.

TextMate : TextMate brings Apple’s approach to operating systems into the world of text editors. By bridging UNIX underpinnings and GUI, TextMate cherry-picks the best of both worlds to the benefit of expert scripters and novice users alike.

Dreamweaver : Adobe® Dreamweaver® CS5 software empowers designers and developers to build standards-based websites with confidence. Design visually or directly in code, develop pages with content management systems, and accurately test browser compatibility thanks to integration with Adobe BrowserLab, a new Adobe CS Live online service.

Netbeans : Runs on Windows, Linux, Mac OS X and Solaris. NetBeans IDE is open-source and free. An open-source IDE  and an application platform  that enable developers to rapidly create web, enterprise, desktop, and mobile applications using the Java platform, as well as JavaFX, PHP, JavaScript and Ajax, Ruby and Ruby on Rails, Groovy and Grails, and C/C++.

Coda : Coda is a commercial (with a 14 days free trial) web development application for Mac OS X, developed by Panic. It was released on April 23, 2007. It won the 2007 Apple Design Award for Best User Experience.

Cssedit : CSSEdit’s intuitive approach to style sheets and powerful previewing features will make you deliver awesome standards-based sites in no time!

Notepad++ : Notepad++ is a free source code editor and Notepad replacement that supports several languages. Running in the MS Windows environment, its use is governed by GPL License.

Zend : Zend Studio is our professional-grade PHP IDE (Integrated Development Environment). It has been designed to maximize developer productivity by enabling you to develop and maintain code faster, solve application problems quickly and improve team collaboration.

Jqueryui : jQuery UI provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications.

Blueprintcss : Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.

Quanta : Quanta Plus is a highly stable and feature rich web development environment. Pretty much everything in Quanta is designed so you can extend it. Even the way it handles XML DTDs is based on XML files you can edit. You can even import DTDs, write scripts to manage editor contents, visually create dialogs for your scripts and assign script actions to nearly any file operation in a project. You can even look at and communicate with a wide range of what happens inside Quanta using DCOP.

Ultra Edit : Versatile and easy to use, UltraEdit is the ideal text, hex, XML, HTML, PHP, Java, Javascript, Perl, and programmer’s editor.

Bluefish : Bluefish is a powerful editor targeted towards programmers and webdesigners, with many options to write websites, scripts and programming code. Bluefish supports many programming and markup languages, and it focuses on editing dynamic and interactive websites.

Editra : Editra is a multi-platform text editor with an implementation that focuses on creating an easy to use interface and features that aid in code development. Currently it supports syntax highlighting and variety of other useful features for over 60 programming languages.

Visual Studio : Visual Studio 2010 is packed with new and enhanced features that simplify the entire development process from design to deployment. Customize your workspace with multiple monitor support. Create rich applications for SharePoint and the Web. Target multiple versions of the .NET Framework with the same tool. Eliminate the dreaded “no repro” problem with IntelliTrace.

Aptana : A Web development environment that combines powerful authoring tools for HTML, CSS, and JavaScript, along with thousands of additional plugins created by the community.

Extensions

Web-developer Toolbar : The Web Developer extension adds a menu and a toolbar to the browser with various web developer tools. It is designed for Firefox, Flock  and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS  X and Linux.

Firebug : The most popular and powerful web development tool. Most advanced JavaScript debugger available for any browser, Accurately analyze network usage and performance.

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

Typography

Typetester : Website for instantly comparing fonts and typefaces side by side. You can apply different fonts to the text sample and compare them in plain view, bold, italic and more. Change the sample text, text size, alignment, color, decoration etc., in each of 3 text columns and see the difference.

Typeface : Instead of creating images or using flash just to show your site’s graphic text in the font you want, you can use typeface.js and write in plain HTML and CSS, just as if your visitors had the font installed locally.

Analytics

Google Analytics : Google Analytics is the enterprise-class web analytics solution that gives you rich insights into your website traffic and marketing effectiveness. Powerful, flexible and easy-to-use features now let you see and analyze your traffic data in an entirely new way. With Google Analytics, you’re more prepared to write better-targeted ads, strengthen your marketing initiatives and create higher converting websites.

W3counter : W3Counter is free, hosted website analytics solution for answering the key questions about your website: who’s your audience, how they find your site, and what interests them.

Chartbeat : Chartbeat is a real-time analytics service that enables people to understand emergent behaviour in real-time and exploit or mitigate it.

Project Management

Basecamphq : Basecamp tackles project management from an entirely different angle: A focus on communication and collaboration.

Redmine : Redmine is a flexible project management web application. Written using Ruby on Rails framework, it is cross-platform and cross-database.

Projectpier : ProjectPier is a Free, Open-Source, self-hosted PHP application for managing tasks, projects and teams through an intuitive web interface. ProjectPier will help your organization communicate, collaborate and get things done Its function is similar to commercial groupware/project management products, but allows the freedom and scalability of self-hosting.

Yuuguu : Instant web-conferencing, online meetings and collaboration.

Jira : JIRA provides issue tracking and project tracking for software development teams to improve code quality and the speed of development.  Combining a clean, fast interface for capturing and organising issue with customisable workflows, OpenSocial dashboards and a pluggable integration framework, JIRA is the perfect fit at the centre of your development team.

Github : GitHub is the best way to participate in that collaboration: fork projects, send pull requests, create issues, and monitor development with all of your public and private  code.

And there are plenty more and we will be adding them for you, so bookmark this post and you will find the correct tool for your web design work in future. Your comments can be helpful for us to build an ultimate list of web design tools, so let us know which one is your favorite from this list and you have any other that you to add.