Every pro has his/her tools: yours are website development tools. Before you create that first unforgettable page of your new website, or make sweeping changes to your outdated message on the current one, take a good look at your tools. As a seasoned pro you must already have a couple on your laptop. If you're a novice -- go get them now! There are many other tools but the ones we list below are the really indispensable tools. Take a look:
Web Inspectors
This list starts with the Web Inspector – a tool I find indispensable in finishing the look and feel of a web page. It allows you to dig into the HTML of your displaying page as well as show you what Cascading Style Sheets (CSS) apply to the element you need to analyze, change, or replace. I couldn't finish any Joomla or Wordpress projects, which typically use sophisticated custom templates, without this tool.
The Web Inspector is part of pretty much all of the web browsers like Chrome, FireFox, or Internet Explorer (reborn as Edge in Windows 10). You get to it by right-clicking on the element in question – be it a button, an image, a section of text. The "inspector console" appears and overlays the bottom of your window. The chosen element and its code are highlighted and the applicable CSS is shown on the right.
The beauty of the inspector is that it allows you to change the CSS and the code on the page, and witness the results immediately. These tentative changes do not change your code – you do that once you are satisfied with your trials.
Dreamweaver or Visual Studio
There is no better way to develop web pages than by using tools that show you the code and the resulting page, side by side. There are other tools but these two are certainly on the top of my list because of the richness of options, modules, and shortcuts they offer. Jump on one of the free trials and see how much time they will save you on your next project.
Photoshop or Fireworks
A website will not live by code alone – you need images, graphics, photos, maps, diagrams, etc... These two tools will allow you to create or modify your graphics and images to fit your website design as well as create more attractive pages, pleasing to the eye, more engaging and more memorable to the visitors.
Cascading Style Sheets (CSS)
The final tool that you need as a website developer. Is it a tool? Of course it is because you can't develop web pages without CSS. I see styles embedded in code all the time: it's sloppy, it's lazy; it cost time and money later when you have to update your website. CSS is a style sheet language used for describing the presentation of a document written in a markup language like HTML. CSS allows complete and total control over the style of a hypertext document without using browser tags.
If you are not a CSS devotee – learn it and love it. You too will achieve CSS Zen.
Content Management Systems (CMS)
So you want to build a website?! A Content Management System or CMS (like Joomla or WordPress) makes it much easier for you to create, edit and publish you content online. A good CMS allows non-technical authors and editors to easily and quickly create and publish their web pages.
Not all users have the same comfort level with technology, but the basic CMS functions of writing and publishing contents, and the more advanced ones of adding media are usually easy for everyone to grasp. In fact, anyone who can use word-processing software can use a CMS for the basic functions.
CMS features like templates, built-in security and access management, and SEO are definitely the way to go. For more, check out our blog on
So you have it: if you use a web ispector, Dreamweaver, Photoshop, CSS, and CMS you are truly well equiped to rapidly create informative, engaging and even entertaining websites for your client or your company. May the Force be with you!
