Want to do the website maintenance yourself? Here are some basic tools you need
There are a lot of good HTML tutorials online from beginning to intermediate and advanced levels. You can find almost everything about HTML and other web design coding languages at www.w3schools.com. This article and the followings, however, only aim to help you gain some fundamental knowledge of essential tools and HTML basics – not enough to build a whole website but perhaps enough and quickly enough to know what to use to look at an HTML page and know what’s what and to maintain the web pages by yourself.
Note: If your website is built with a Content Management System, you probably don’t need to know HTML to update your site; however, it’s always a good thing to know some HTML for trouble-shooting later on or creating cleaner HTML code.
Tools you need
1. WEB EDITOR or TEXT EDITOR:
As mentioned in some other posts, for web coding all you need is a good text editor. Notepad is a text editor but not good enough. A good text editor must at least be free, must have code / syntax highlighting capability, must allow you open multiple files….
Notepad ++ is a really good and free text editor running in Windows environment. It highlights your codes and text content in different colors, and by default your text content is in black, and your HTML code is blue, red and purple. Thus, if you only want to make some change to your text content, just look at the black text as seen on the screenshot on the left. If you already have a web editor like Adobe Dreamweaver, Adobe GoLive, MS FrontPage… then you’re ok. Most web editors are good text editors plus allow you to switch between different views like designer view, source view, or split view.
2. DIFFERENT WEB BROWSERS:
If you’re doing web maintenance, you must have at least 2 web browsers installed on your computer – Internet Explorer [IE] and FireFox [FF]. Those may not be your favorite, but they are for sure the most commonly used. Since you can’t force your target audience to use a specific web browser of your choice, you must assume they’re using more than one browsers, and in fact they are. Here’s the list of web browsers with the usage frequency for your reference. In May 2009, 40% of Internet users browsed the web with IE [versions 6, 7, and 8 combined], and more than 47% users used FF.
Source:W3schools.com
Because different browsers and different versions of the same browsers may display your website differently, you should know if the pages you’re maintaining display correctly at least with the two mentioned browsers. Most of the times, the difference is only a few pixels off in terms of text and/or image positioning, but sometimes it’s way off to the point of breaking the whole page layout. IE especially older versions are known in the web design and development community for having bugs and unexpected displaying issues compared to FF.
To know which browsers you should install to check your web pages, you’ll need to collect some web traffic data to see what browsers and versions are the most commonly used by your clients and prospects. You need to make sure that you’ll use what your clients/prospects or at least the majority of them are using and see what they are seeing. This is very important because eventually broken links, broken images or broken page layouts are exhibiting lacking technical capability, negligence, and untrustworthiness, which will hurt your business and company image tremendously. My motto is if we can’t please everybody [using all sorts of web browsers], we need to make sure to be able to please the majority [using IE and FF].
3. IMAGE EDITOR:
This software will be essential if you need to create web graphics whether it is as simple as resizing or cropping a photo, or as complicated as creating a web banner with text and montaged images. The softwares I used almost everyday is the Adobe Creative Suite 
with Photoshop, Illustrator, and Acrobat Professional. The Adobe suite is powerful but expensive; there are, however, some free image editing softwares and even free online photo editing applications introduced in other posts.
Now that you know the tools to edit and to check a web page, let’s get started by looking at the HTML codes behind a web page through viewing source.
Viewing source with your web browser
A web page is basically an HTML [HyperText Markup Language] file, and a web browser is like an HTML reader that reads and displays the web page content. To see what the codes inside a web page look like you can use the main menu of your browser, go to View > Page Source or right click and select View [Page] Source. The codes can be simple or complicated depending on the complexity of the web page, and you will notice that whatever text and images you see on the web page will be there inside the codes.
In many cases, viewing source is a great way to learn HTML since you can look into how a page is built and learn from it. It’s like you’re doing reverse engineering. Viewing source with Firefox will be much more convenient compared to viewing source with IE because FireFox colors HTML codes and text content differently. The screenshot on the left is how a small portion of this web page looks through View [Page] Source.
Viewing source, however, only lets you see the output or final codes of the page and not the original codes. When a web page is built with server-side coding languages like ASP, PHP and the like, the original codes are usually not the same as the output codes because ASP/PHP/… codes are to be executed and interpreted [doing calculation, querying from database…] by the web server which in turn will spit the output to the web browser for you to see.
I use UltraEdit text editor; it works pretty well, but comes at a price about 50 bucks or so