Free Tools For Beginning Web Designers And Developers
For anyone who's interested in creating basic websites, here's a few free software programs you'll need to get you started.
Internet Web Browsers
One of the most important tools any beginning web designer/developer will need are a couple or more web browsers. Unfortunately, web pages won't display the exact same in all web browsers, MSIE (Microsoft Internet Explorer) being the worst. You can install as many web browsers as you'd like, but there's a few popular ones many different people use, besides MSIE...
Since Google Chrome uses the same rendering engine as Apple Safari, there's really no need to install both Apple Safari and Google Chrome, since all web pages should look identical in either web browser.
Adobe and Java
Many websites use Adobe and Java products, and the latest versions should always be installed. However, if you're thinking about using Java on your website, then I'd highly recommend installing the JDK (Java Development Kit) versus the JRE (Java Runtime Environment). The JRE is just for displaying Java, whereas JDK is for Java developers.
- Adobe at http://www.adobe.com/downloads/
- Java JDK at http://www.oracle.com/technetwork/java/javase/downloads/
There are many editors you can use, some very expensive, some free, some WYSIWYG (What You See Is What You Get), and some text-based. Personally, I prefer the free, text-based editors. Although WYSIWYG editors are nice, they often add a ton of unneeded codes, blowing-up your web pages, thus taking longer for web browsers to render them. And the WYSIWYG editors that don't add a ton of useless codes aren't very powerful. However, if you've never made a web page in your life, don't know any HTML or CSS, then a decent WYSIWYG editor is Amaya. It's jointly made from the same people who write many of the web standards we all must conform to (W3C at http://www.w3.org/).
- Amaya at http://www.w3.org/Amaya/
- W3School at http://www.w3schools.com/
- HTML.net at http://www.html.net/
- Mozilla Developer Network at http://developer.mozilla.org/en-US/learn/
- CSS Basics at http://www.cssbasics.com/
- CodeAcademy at http://www.codecademy.com/
Once you start learning HTML and CSS, then it's time to start writing your own codes. Many of us started out using a very basic text editor like Notepad, but quickly found out how soon we needed something more powerful. The better solution to Notepad is called Notepad++. Not only does it give you line numbers (which is important when you're trying to figure out code issues), but it also colorizes different types of code so it's easier to separate code from content. You can even add a spell checker for those of us who write a lot of our own content.
But eventually, even Notepad++ has its limitations.
Eclipse and Aptana
Firefox and Chrome Web Developer Toolbar
I'm not a fan of toolbars. In fact, I hate them. But unlike most toolbars that provide yet, another worthless search bar, this one is specifically designed for web designers/developers without a search bar! Just only what you need to view different aspects of a web page, for both Mozilla Firefox and Google Chrome web browsers.
- Web Developer Toolbar at http://chrispederick.com/work/web-developer/
Digital Image EditorsAt one point or another, may web designers/developers will want to add an image or two or ten on their website. Like other types of editors, there are some very expensive digital image editors, and there are very good free ones! Since there are a lot of free digital image editors geared toward different audiences, I'll narrow the choices down to two types and two choices:
- Easy to use, but less functionality
- Complex with tons of features
Web Page Validation
One important aspect of writing codes is to make sure that everything is correct, and that you are using the proper codes. One way of doing so is to verify your web pages with W3C, and also clean them up a little using HTML Tidy. Both are free, online tools, and don't require to download and install any software programs.
- The W3C Markup Validation Service at http://validator.w3.org/
- HTML Tidy at http://infohound.net/tidy/
Web Hosting ServicesEventually, at some point, you'll want to upload your web pages to a web hosting server for all of the world to see. What's the point of writing web pages if no one can view them? Most broadband ISPs (Internet Service Providers) offer a small amount of online storage with limited functionality, but with unlimited bandwidth. However, there are many free web hosting services that give you tons of features, but they display ads on your website, and have limited bandwidth. Once that bandwidth is used up, your web pages will be cut off from the rest of the world until the next month. Personally, I prefer to make do with the limited functionality but adless and limitless bandwidth my ISP gives me. However, here's a couple of articles that you may want to read...
- How to build and host a website for free at http://www.techsupportalert.com/how-to-build-a-website-1.htm
- Best free online applications and services at http://www.techsupportalert.com/content/best-free-online-applications-and-services.htm
If your website is for an organization (whether it's commercial or non-profit), most likely, you'll want to use a recognized, paid-for web hosting service. Paid-for web hosting services can vary from a couple bucks a month to about $30/month!
Uploading Your WebsiteWhatever online web hosting service you choose, you'll need a way to upload your web pages, images, and other files to their web hosting server. Most web hosting servers support FTP (File Transfer Protocol), and you will need to know your web host's FTP address, your login, your password, and any other settings they may require. Personally, I prefer to use FireFTP, a free addon extension for Mozilla Firefox, but some people prefer a separate software program, such as FileZilla.
Eclipse IDE/Aptana Studio has a built-in "sync" option that automatically uploads your saved web page, which is very nice, but it's not very "user friendly" to setup. However, once you figure out how to set it up, it's definitely the best option, since it automatically uploads after you save any changes made to the web page you're editing.