Creating Your First Web Page
This chapter is from the book
This chapter is from the book
This chapter is from the book
)
Have you ever wanted to create your own website but thought that the task was too daunting? Do you think that only folks with years of computer training and experience have the knowledge necessary for building web pages? These are common misconceptions that many people have. With the right tools and information, creating websites is as easy as pointing and clicking! If you are interested in quickly creating a professional-looking website, then you've picked up the right book.
This book includes a CD with website templates, along with software for editing the web templates. This chapter looks at the fundamental building blocks of websites and then steps through the installation process of SeaMonkey, the web page creation software included on the CD. The next chapter examines the necessary steps to create a website and shows how to move the web page templates from the CD to your website. Chapters 3 and 4 illustrate how the templates on the book's CD can be customized to create your own website.
In addition to the website templates, Chapters 5 through 10 examine online tools that assist in creating websites. Specifically, you learn how to sell products through a website using eBay Stores and publish content through a blog at Blogger.com. You see how easy it is to share photos and videos with friends and family via Snapfish.com and YouTube. You also learn how to get started with two popular social networking sites: MySpace and Facebook.
While there are literally millions of websites available on the Internet, virtually all fall into one of three categories:
- Family/Personal Website—Keep your extended family and friends up to date with the latest happenings of your family.
- Online Storefront Website—Sell products and services online! A great revenue stream for home-based businesses.
- Content Publishing Website—Publish your content on the World Wide Web. Be it your poetry, your political or philosophical views, or your hilarious home videos, by distributing your content online, you open it up to a potential worldwide audience of millions.
As you'll see, creating websites that fall into any of these three categories is a snap with the provided templates and website tools. To get started, all you need is this book, its CD, and access to a computer with Internet connectivity.
The Components of a Website
In your experiences with the Internet, you've likely visited several different websites. Some of the more popular websites in terms of the number of people who visit the site on a daily basis include Yahoo.com, CNN.com, Google.com, Amazon.com, eBay.com, MSN.com, and others.
To visit a website, you must have an Internet connection. Virtually all computers in places of business have an Internet connection, while millions of home users connect to the Internet through services provided by companies such as AOL, MSN, EarthLink, or local cable or telephone providers.
Visiting a website from an Internet-connected computer is a cinch. Simply open up a web browser and type the domain name of the website into the web browser's Address bar.
Figure 1.1 shows a screenshot of Amazon.com's website when viewed through Internet Explorer.
)
Figure 1.1 Amazon.com is displayed in the web browser.
Notice that Figure 1.1 has the browser's Address bar circled. To visit Amazon.com simply enter the domain name of the site—www.amazon.com—into the browser's Address bar. That's all you have to do.
Before you begin creating your own web pages, it is vital that you know of the basic components inherent to all websites. Specifically, all websites are made up of the following three components:
- A Web Server—A web server is an Internet-connected computer whose sole purpose is to provide a location for the web pages of a website and to handle incoming requests for these web pages.
- A Domain Name—A website's domain name is a unique identifier for a website, much like your mailing address is a unique identifier for your home. A website's domain name identifies the web server on which the site's web pages are located.
- Web Pages—A collection of files that make up the content of a website.
Serving Web Pages with a Web Server
All websites are located on a special type of computer referred to as a web server, which is an Internet-accessible computer that holds the contents of the website.
When visiting a website through a web browser, the web browser makes a request to the web server that hosts that particular website. The web server then returns the requested web page to the browser. Finally, the browser displays the web page, as shown in Figure 1.1.
Figure 1.2 details this interaction from a high-level view.
)
Figure 1.2 Visiting a web page involves a request to a web server.
If the details of this interaction seem a bit hazy, don't worry; you don't need to be concerned about the specifics. For now, just realize that the contents of a website reside on a remote computer that, like your computer, is connected to the Internet. The browser obtains the contents of the website you are visiting by making a request to the site's web server. The web server returns the web pages being requested, which are then displayed in the browser.
Understanding Website Domain Names
Did you know that there are literally millions of websites in existence? To visit a particular website from the list of millions, it is vital that all websites be uniquely identified in some manner. The way websites are uniquely identified is by their domain name.
A domain name is, ideally, an easily remembered phrase, like eBay.com, Yahoo.com, or CNN.com. All domain names end with some sort of extension, which is a period followed by two or more letters. Most domain names end with extensions like .com, .net, or .org. Other extensions are available, though.
Web Pages, the Building Blocks of a Website
Web pages are the atomic pieces of a website; each website is a collection of web pages. When visiting a website with a web browser, what you are actually viewing is an individual web page.
On a website, each web page is, in actuality, a separate file. A file is a document that's stored on a computer. For example, if you use Microsoft Word to write a letter to your nephew, you can save the letter. This saved letter is referred to as a file.
You can request a particular web page from a website by typing the web page's URL into a web browser. You don't have to type in a URL to view a web page. As we saw earlier in Figure 1.1, typing in just the domain name of a website displays a web page as well. When typing in just the domain name of a website, a specific web page is automatically loaded—this page is referred to as the home page.
Getting Around a Website
A website is composed of a number of web pages. Each web page is uniquely identified by a URL. To visit a particular web page, you can enter the web page's URL in your browser's Address bar. However, as you know from surfing the Web on your own, rarely, if ever, do you take the time to enter a URL directly into the browser's Address bar.
An easier way to visit a particular web page is by first loading a website's home page, and then clicking on hyperlinks that take you to other pages on the site. Hyperlinks are clickable regions on a web page that, when clicked, whisk you to some other, specified web page.
Idea Gallery
http://en.wikipedia.org/wiki/Comparison_of_Web_browsers
)
DOES YOUR WEBSITE LOOK RIGHT IN EVERY BROWSER?
Webmonkey is a particularly good site for tutorials on web building. We found a nice article and chart on what standards different browsers support. You may design and test your website using the browser on your computer. It may look fine to you, but what about all of your visitors and the browsers they're using? If you check out the browser statistics on http://www.thecounter.com/stats/, you'll find that 41% of people are using Microsoft Internet Explorer 7.x, 37% are using Internet Explorer 6.x, and 16% use Firefox. That at least narrows it down for you when you're trying to make sure your site can be viewed properly by most people. If you want to accommodate more people than that, pay attention to the standards on Mozilla, Netscape, Safari, and Opera, too.
To demonstrate page navigation in a website, take a moment to visit the website of the San Diego Chargers football team at www.chargers.com. As Figure 1.3 shows, this website (like all websites) has a number of hyperlinks. Along the top of the page, there are several hyperlinks to various sections of the site: Schedule, Team, News, Charger Girls, Tickets, and so forth.
)
Figure 1.3 Visiting a web page involves a request to a web server.
Clicking the Schedule hyperlink whisks you to a new URL—http://www.chargers.com/schedule/schedule.htm—which is shown in Figure 1.4. Notice that the Address bar in Figure 1.3 differs from that in Figure 1.4. In Figure 1.3, the Address bar reads http://www.chargers.com, the domain name of the San Diego Chargers website. After clicking on the Schedule hyperlink, we were taken to a different URL. The Address bar has been updated accordingly, illustrating that we are viewing a different web page.
)
Figure 1.4 The Schedule web page is displayed.
Figure 1.5 shows the interactions that take place between the web browser and the Chargers.com web server when first visiting the Chargers.com home page, and then when clicking on the Schedule hyperlink. (Again, if you do not fully understand this interaction, don't sweat it!)
)
Figure 1.5 Each time a new web page is navigated to, the web browser requests the web page from the web server.
Table 1.1 summarizes the core pieces of a website.
Table 1.1. Key Website Building Blocks
|
Building Block |
Description |
|
Web Server |
A web server is an Internet-accessible computer that hosts one or more websites. When viewing a web page, your browser sends a request to the web server for the specified URL. |
|
Website |
A website is a collection of related web pages. Websites have a bevy of purposes: They can be used to share pictures, provide information, or even sell products. Each website is uniquely identified with a domain name. |
|
Web Page |
A web page can have a mix of text and graphics. A web page is like a single page in a book. Web pages can be linked to one another using hyperlinks, allowing the visitor to quickly jump from one web page to another. |