| Creating Your First Web Page | | Print | |
a bit about you and your interests. It might look a little basic, but don’t let that put you off. As each chapter
progresses, your pages will continue to get more impressive as you learn new features of the languages.
If you have a program you want to use for writingWeb pages, then get it up and running now; otherwise
simply fire up a text editor.
In this example you are going to create aWeb page about yourself. You will write this page in Transitional
XHTML 1.0.
1. Start the program you are going to use to write yourWeb pages, whether this is a plain text
editor or a dedicatedWeb page authoring tool. (If you are using an authoring tool, make sure
that you are in the code view and delete any code it might have already entered for you.)
2. Enter the XML declaration and the DOCTYPE declaration for Transitional XHTML 1.0. Remember
that the XML declaration should be the very first thing in your document; there should not even
be a space before it:
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3. Add in the opening <html> tag right after the DOCTYPE declaration and the closing </html>
tag at the end. You will note that the opening <html> tag in this example carries an xmlns
attribute. You look at this attribute in Chapter 2, but this is just another indication that the
markup in this example is XHTML 1.0.
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
</html>
4. Add the <head> and <body> elements inside the <html> element. You might remember that
the <head> element contains information about the document, while the main part of the
document lives in the <body> element:
<?xml version="1.0" ?>
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html
xmlns="http://www.w3.org/1999/xhtml">
<head></head>
<body></body>
</html>
5. Add in the <title> for the document inside the <head> element and don’t forget to put your
own name in there:
<head>
<head>
<title>Jon's Home Page</title>
</head>
</html>
6. The main part of what users will see goes inside the <body> element. In this example, you will
have a heading that welcomes people to your site and a couple of paragraphs of text about
yourself:
<body>
<h1>Welcome to Jon's Home Page</h1>
<p>Jon has been creating Web sites for more than eight years. He has written
several books on computer programming topics including HTML, XHTML, XML,
and ASP. He also runs InPreparation Limited, a small Web solutions
company based in London, with clients in the U.K., U.S., and
Australia. </p>
<p>When not sitting in front of a computer, Jon can usually be found
listening to music or playing his guitar.</p>
</body>
7. Create a new folder called WebExamples that you can put your examples for this book in. Check
that your file looks exactly like this, except the text about yourself, and save this page as
MyFirstPage.html.
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Jon's Home Page</title>
</head>
<body>
<h1>Welcome to Jon's Home Page</h1>
<p>Jon has been creating Web sites for more than eight years. He has written
several books on computer programming topics including HTML, XHTML, XML,
and ASP. He also runs InPreparation Limited, a small Web solutions
company based in London, with clients in the U.K., U.S., and
Australia. </p>
<p>When not sitting in front of a computer, Jon can usually be found
listening to music or playing his guitar.</p>
</body>
</html>
8. Open the page in a Web browser. In Internet Explorer, choose File ➪Open and then click Browse
to find the file you want. If you are using Netscape, choose File ➪Open File and find the page
you just saved.
This shows how you can write and test Web pages on your computer; now you have only to put them on
the Web when you are ready for others to see them.
If you are using a plain text editor and it tries to add the file extension.txt (or any other extension) rather
than.html, try to save it again, but this time put the filename and extension in quotes like this:
”contactUs.html”. This should stop the program from saving the file with a.txt extension.
This entry was posted on . You can follow any responses to this entry through the RSS 2.0 feed. You can leave a comment.
| Users' Comments (0) |
|
No comment posted
