Post image for Web Design Tools

Web Design Tools

by Melvin Ram on January 16, 2010

What web design tools do we use to build your website? The answer really depends on what your website will need to do.

For designing your website, we start inside Adobe Photoshop. We work with you to interactively tweak the design and make it into just what you need. Photoshop gives us the freedom to fully create a special website for you. Once we’ve got the design part of the website completed, we use Photoshop again to turn the large design into little images, also known as slices.

Once we got all the images we need for building a website, we turn our trusted text editor Textmate to code your website using XHTML and CSS. This process takes long than using a look like Dreamweaver but it produces better results. As we do the coding, we’ll browser test the page inside FireFox, Safari, Internet Explorer & Google Chrome.

With the coding completed, we’ll convert the website into a WordPress theme. This is done again using Textmate.

So let’s recap: We designed the website inside Photoshop and used it to create the small images that will be needed to build up the full website. Next we used Textmate to code the XHTML & CSS and then turn that code into a WordPress theme.

A clean XHTML + CSS based WordPress theme is nice but it’s even nicer once we add some effects & interactivity using Javascript. Our script framework of choice is jQuery. We’ll often add an image slideshow and more to the home page. Javascript is difficult to test but FireBug (an extension for FireFox) makes it much easier. From there, we’ll do a second browser test inside FireFox, Safari, Internet Explorer & Chrome.

At this point, we’ve got a working WordPress website. Once we load it to our web host, we’ll need to setup a database for our WordPress website. As standard, we utilize MySQL. Once we’ve got the website working, it’s time for performance testing.

Performance testing on your website is done using a number of different tools. We start with Pingdom to see how the website will load for end users and how much time it will take. Next we use the Page Speed FireFox extension by Google.  We’ll take the suggestions it gives and make the appropriate changes to the site.

That’s it. Once we’ve done some performance testing, we’re ready to do some user testing and start promoting the website.

I hope this has given you some insight into how we do things.

{ 0 comments… add one now }

Leave a Comment

Previous post:

Next post: