Web design – tools to use

This article is based on which programs and software you should or could use when developing with web design. Some of these are so familiar but some you might not know. I admit this should had been written days ago.

Tools to use

When you are facing a new project, you really don’t want to start doing something before thinking. I mean, before doing anything we should have a plan, what we want to do, who is this site for and how much stuff can we add there. These are just basics of every day work but how can we so often forget these?

Well there are way too much programs to use now a days and I thing, some are almost copies of one another. Basically this is the list what we need at beginning

  • Fully functional computer (means we have computer, mouse, keyboard and screen)
  • We have Internet connection to download programs and editors we want to use
  • We need browsers, well to check our results
  • We need text-editor,now we can add our code
  • We need photo manipulator -program, then we can make custom pictures and make them smaller to Web
  • All the other software you might want to use, if you want to make video-clips or  music-clips

Browsers

^^So at the begin there were a code but no one couldn’t read it. Then came browser who supported the code and showed what we get.^^ Well enough jokes, you might want to install at least these browsers to check results

  • Opera
  • Mozilla Firefox
  • Google Chrome
  • Internet Explorer, well not everyone uses other browsers so you should at least check what are the results in there too.

Remember, if you use HTML5 and CSS3.0, IE will have some problems to understand the code, but it’s natural. To fix this you need to use this

<!-- [if lt IE 9]>
<script>
document.createElement("header");
document.createElement("nav");
document.createElement("article");
document.createElement("footer");
</script>
<![endif] -->

<!-- [if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5-els.js">
</script>
<![endif] -->

So what this means, it means that if browser is IE 8 or older, then create header, nav, article and footer elements to support HTML5.0. And that others is a javascript function that enables you to use HTML5.0 new elements for each IE browser.

Text editor

So with the text editor we are able to write our code. There are many and many editors but I recommend using these

  • Notepadd++
  • Notepadd
  • Gedit
  • Eclipse
  • Adobe Dreamweaver

Photo manipulator programs

There are two simple ways to use. We make our own custom pictures and make them so small that websites can be surfed without any big problems. With big pictures, it takes sometimes time to browser first to get it and then show it to screen. The second way of using these is almost the same if we want to make thumbnails for slide show. I recommend these

  • Paint, okay use it only to make your pictures smaller
  • Adobe Photoshop series CS and Elementals, Adobes gift to the world
  • GIMB, specialty in Linux OS

Other software

So what this means, other software? With this I meant all the other software you have to use to get your media files or something else converted on your website. With quick look, you are able to find tons of these software and I recommend to check Youtube.com for videos about them.

Conclusion

With web-projects you are able to use various programs and you get much more experience. I recommend using different software to get different results and check them in other browsers as well.

– Tuomas Törmä

Sources

  • Introduction to Web Site Development lectures At Haaga-Helia spring 2013 teacher Mirja Jaakkola.

Leave a comment