Using HTML to create a Web page from scratch involves four straightforward steps:
So break out your text editor and Web browser and roll up your sleeves.
Step 1: Planning a simple design
We’ve discovered that a few minutes spent planning your general approach to a page at the outset of work makes the page-creation process much easier. You don’t have to create a complicated diagram or elaborate graphical display in this step. Just jot down some ideas for what you want on the page and how you want it arranged.
You don’t even have to be at your desk to plan your simple design. Take a notepad and pencil outside and design in the sun, or scribble on a napkin while you’re having lunch. Remember, this is supposed to be fun.
The example in this chapter is our take on the traditional “Hello World” exercise used in just about every existing programming language. That is, the first thing you learn when tackling a new programming language is how to display the phrase Hello World on-screen. In our example, we create a short letter to the world instead, so the page is a bit more substantial and gives you more text to work with. Figure shows our basic design for this page.
Figure : Taking a few minutes to sketch your page design makes writing HTML easier.
The basic design for the page includes four basic components:
Jot down some notes about the color scheme you want to use on the page. For effect, we decided that our example page should have a black background and white text, and the title should be “Greetings From Your Future Znufengerb Minister.”
When you know what kind of information you want on the page, you can move on to Step 2 — writing the markup.
Step 2: Writing some HTML
You have a couple of different options when you’re ready to create your HTML. In the end, you’ll probably use some combination of these:
Our example in this chapter starts with some text in Word document format. We saved the content as a text file, opened the text file in our text editor, and added markup around the text.
To save a Word file as a text document, choose File➪Save As. In the dialog box that appears, choose Text Only (*.txt) from the Save As Type drop-down list.
Figure shows how our draft letter appears in Microsoft Word before we convert it to text for our page.
Listing : The Complete HTML Page for the Zog Letter<p>It has come to our attention that Earth has fallen well short of producing its yearly quota of Znufengerbs. To help you improve your production and establish a plentiful Znufengerb colony, I, Zog, the Minister of Agriculture of Grustland, will be arriving on your planet within the week along with my herd experts to take command of your Znufengerb enterprise.</p> <p>Do not fear, I have the highest expectations for a smooth transition from your current production of the creatures you call cows to our beloved Znufengerbs. The future of the galaxy hinges on Earth’s ability to meet
The complete HTML page looks like Listing.
The HTML markup includes a collection of markup elements and attributes that describe the letter’s contents:
Figure : The letter that is the text for our page in wordprocessing form
Don’t worry about the ins and outs of how all these elements work.
After you create a complete HTML page (or the first chunk of it that you want to review), you must save it before you can see your work in a browser.
Step 3: Saving your page
You use a text editor to create your HTML documents and a Web browser to view them, but before you can let your browser loose on your HTML page, you have to save that page. When you’re just building a page, you should save a copy of it to your local hard drive and view it locally with your browser.
Choosing a location and name for your file
When you save your file to your hard drive, keep the following in mind:
Don’t use spaces in the name. Some operating systems — most notably Unix and Linux (the most popular Web-hosting operating systems around) — don’t tolerate spaces in filenames.
In our example, we saved our file in a folder called Web Pages and named it (drum roll, please) zog_letter.html, as shown in Figure.
Figure : Use a handy location and a logical filename for HTML pages.
.htm or .html
You can actually choose from one of two suffixes for your pages: .html or .htm. (Our example filename, zog_letter.html, uses the .html suffix.)
The shorter .htm is a relic from the 8.3 DOS days when filenames could only have eight characters followed by a three-character suffix that described the file’s type. Today, operating systems can support long filenames and suffixes that are more than three letters long, so we suggest you stick with .html.
Web servers and Web browsers handle both .htm and .html equally well.
Stick with one filename option. .html and .htm files are treated the same by browsers and servers, but they’re different suffixes, so they create different filenames. (The name zog_letter.html is different from zog_letter.htm.) This matters when you create hyperlinks.
Step 4: Viewing your page
After you save a copy of your page, you’re ready to view it in a Web browser.
Follow these steps to view your Web page in Internet Explorer. (Steps may be
different if you’re using a different browser.)
Figure shows a highlighted HTML file, ready to be opened.
Figure : Use Internet Explorer to navigate to your Web pages
The page appears in your Web browser in all its glory, as shown in Figure.
Figure : Viewing a local file in your Web browser.
You aren’t actually viewing this file on the Web yet; you’re just viewing a copy of it saved on your local hard drive. You can’t give anyone the URL for this file yet, but you can edit and view the changes you make.
HTML 4 Related Interview Questions
|XML Interview Questions||HTML 4 Interview Questions|
|HTML Interview Questions||HTML 5 Interview Questions|
|HTML DOM Interview Questions||Java Interview Questions|
|CSS Interview Questions||Java Abstraction Interview Questions|
|Dynamic HTML Interview Questions||XHTML Interview Questions|
Html 4 Tutorial
The Least You Need To Know About Html And The Web
Creating And Viewing A Web Page
Proper Planning Prevents Poor Page Performance
Creating (x)html Document Structure
Text And Lists
Linking To Online Resources
Finding And Using Images
Introducing Cascading Style Sheets
Using Cascading Style Sheets
Getting Creative With Colors And Fonts
Using Tables For Stunning Pages
Scripting Web Pages
Working With Forms
Fun With Client-side Scripts
The About Me Page
The Ebay Auction Page
A Company Site
A Product Catalog
Ten Cool Html Tools
Ten Html Do’s And Don’ts
Ten Ways To Exterminate Web Bugs
All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd
Wisdomjobs.com is one of the best job search sites in India.