I said somewhere in the introduction of HTML that the browser requests an HTML code from server. A web server is not within everyone’s reach. Fortunately, for simple sites in HTML (without any PHP scripts), you do not need it. We will speak probably in two weeks from now about the PHP scripts, so don’t worry, you’ll learn everything there is to learn about PHP also. You can use your computer without problems with Windows (or Linux or Mac). I’ll present the steps for Windows.
First, we need an editor. It can be any text editor. The most banal Notepad editor is the best and you can be sure that you have installed this editor on your computer, because it comes with Windows. Be careful not to touch the graphics editors such as Word or WordPad. In principle, if they have the option to format the text, to bold it or underline it, it is not good.
Image may be NSFW.
Clik here to view.
I have seen that many developers use Notepad + + editor. During installation, it is best to tick the “Context Menu Entry” (left), so each file will have the option to open it with Notepad + + (right). There are clearly many other editors very useful, but to me, and not only me, I really like Notepad + +. And is there for free. When you write a new file, Notepad + + has no way of knowing that you write an HTML file. If they knew, would consume more resources and would not be so attractive.
You can get over this and tell it to treat the code as the HTML code in the menu or set to automatically start on HTML. Notepad + + text editor is the one I recommend. It’s good to have in addition a WYSIWYG visual editor. Here it is hard to find a free editor which is widely appreciated. Some would recommend Adobe Dreamweaver ($ 400) or Microsoft Expression Web ($ 200). I personally do not really like them for their cost and I’d rather look at other free solutions. You can find a comparison on Wikipedia between these editors.
Image may be NSFW.
Clik here to view.
But do not hurry to use these visual editors. Try first to understand what code they produce. However, they are just tools which should make things easier, but if you do not know how to work using any tools at all, this is all in vain.
How to create an HTML page
I’ll actually handle the HTML code in the next chapter. Now I will teach you how to create and access an HTML page. It’s good to make a folder (directory) separately for the HTML files that you create, folder which must be placed on your desktop or Documents (My Documents in XP), to remember where you put it when you want to access it.
In Notepad + + or another editor of your choice, choose the File option and then Save as. If you’ve been used other editors before (Word, Paint, etc.), it will be pretty easy. You must make sure that the file is saved with an. Html extension or .htm. In Notepad + + and Notepad of Windows 7 this means that after the file name (which is totally your choice) write an .Html, but in the Notepad from Windows XP, you must choose from the menu “Save as Type” option “All Files” and save it with an .htm extension. This depends very much on your computer type and software that it uses.
To make sure that everything went well, you can browse to the location where you have saved the file and try to open. If it opens with Notepad, it’s probably not good. If you open a browser and see what you have written there, it’s good. If what you wrote is seen and transmitted by the browser back to you, it’s perfect.
For starters, you can use your standard browser, but on the way you will feel you need a browser that helps. Internet Explorer is the worst choice in this regard. Just recently, Microsoft has decided to allow independent developers to write addons for this browser, so the future addons will be useful for us.
Firefox is the choice of most Web developers that can be enriched with Firefox addons especially created for them. Of these, two stand out: Web Developer Toolbar and Firebug. A bar (toolbar) where there are a lot of useful features, very useful when you do not know what’s wrong (by the way, the activity in which you seek an error is called debugging) and in many other situations. Firebug is a tool actually fallen from the sky when you code in HTML, CSS and JavaScript. You can make changes to the Code and see these changes in real time without reloading the page. Unfortunately, these changes are not saved in the file where you look, so that as soon as you can see what you missed, you should go back to your editor Notepad + + (or though I’ve heard) to fix the mistake.
Google’s browser comes hard from behind and seriously threatens Firefox. The two extensions which have already been presented earlier have a variant on Chrome: Firebug Lite for Google Chrome and Web Developer. But they still are not as powerful and useful as they are on Firefox. However, they worth being watched at work.
In the programming world, it’s best to learn by cheating. Or at least, this is what I have discovered when I tried to learn HTML. That’s why I never appreciated the school competitions where any materials were prohibited. When you write a code, even the most advanced programmers also get a peek at a book or a file explaining where they forgot something. As you read more often, with both those concepts and formats, they will remain in your memory and you will soon do not need to look for a solution in any other part, except your brain.
If you get a test for a job and the employer does not let you look on the Internet to solve or at least get a few clues, go on, that company will go bankrupt soon. This is what I have discovered when learning my first HTML courses. And you know what? This is actually true. In fact, you are not preparing to be a tester, but a real programmer. So, we better move on.
To not make this any longer, the most important material related to HTML, in my opinion is htmlhelp.com site. That is a file format in .chm (Windows Help) from where you can find information on all the HTML4 tags. Besides HTML, you must learn CSS also. On the same site are a few notes about CSS.
Another important site which is good to have in the list of bookmarks is w3schools.com site. There, in addition to lessons in English for HTML and CSS, you will find the complete list of HTML tags and CSS attributes. A very useful site, but a nightmare for those who do not deal in English. If you are not an English native speaker, it’s harder to learn programming, but not impossible. Read the next article, where I will write an effective introduction to HTML.11