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...
- Google Chrome at http://www.google.com/chrome
- Mozilla Firefox at http://www.mozilla.org/
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/
Editors
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/
Learning HTML, CSS, and JavaScript
Many web designers/developers, at one point or another, will start learning HTML, CSS, JavaScript, and other programming languages due to the limitations of many WYSIWYG editors. Many go back to school, but many of us prefer to teach ourselves. There are many wonderful, free websites for people to learn and use their products and standards.- 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.
- Notepad++ at http://notepad-plus-plus.org/
- ASpell spell checker at http://aspell.net/win32/
But eventually, even Notepad++ has its limitations.
Eclipse and Aptana
Eclipse is a free IDE (Integrated Development Environment) that helps assist designers/developers with writing codes. Aptana is a free plugin for Eclipse that assists specifically for writing HTML, CSS, and JavaScript. Although Aptana comes in a stand-alone package (without having to install Eclipse), unfortunately, doesn't offer some features that Eclipse comes with, such as a spell checker. Also, Eclipse allows you to expand your horizons by offering support for Java and other programming languages. For this reason, I recommend downloading Eclipse, and installing the Aptana plugin versus the stand-alone package.
- Eclipse at http://www.eclipse.org/downloads/
- Aptana at http://www.aptana.com/
Not sure which flavor of Eclipse to download? That depends upon which programming language you want to use. However, for most beginners, I recommend either the Classic version or Eclipse IDE for JavaScript Web Developers, if you're thinking about learning JavaScript. You can also add a simple text file as a custom dictionary for Eclipse under Window -> Preferences -> General -> Editors -> Text Editors -> Spelling.
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 Editors
At 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
- Pixlr at http://pixlr.com/
- Gimp at http://www.gimp.org/
- GimpShop at http://gimpshop.com/
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 Services
Eventually, 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 Website
Whatever 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.- FireFTP Client at http://fireftp.mozdev.org/
- FileZilla Client at http://filezilla-project.org/
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.
No comments:
Post a Comment