A webpage is a file that ends in .htm or .html. Just look in the address bar for an example: what_webpage.htm is a webpage.
You should always name your homepage either index.htm or index.html. Be careful to not have both!
You create webpages in a web editor, like Dreamweaver. You and other people surf webpages in a web browser, like Internet Explorer.
You can edit images in an image editor, like Photoshop.
A webpage must be on a server for other people to surf it. At UWSP, your page must be in the inetpub folder in MyFiles.
Hyperlinks, or links, connect webpages. They're what make webpages so useful. Some links are to pages in the same website; these are called internal links. Other links are to pages on other websites (e.g., the DPI); these links are called external links. Notice the difference:
- index.htm - this link (at the top of this page) will take you to another page in the same website
- http://www.msu.edu/ - this link will take you to the university where I earned my PhD. It starts with http://
There are three main ways to format text: bold (also called strong), italics (also called emphasis), and headings. On this page, "Getting Started" is Heading 1, and "Basics" is Heading 2. There are 6 levels of headings, like an outline. Most people only use the first three. (I'm using CSS to do some fancy things with my headings, like that dotted gray line.)
There are two kinds of lists:
- Unordered
- lists
- have
- bullets
- Ordered
- lists
- have
- numbers
Tables are a popular way to format webpages. But be careful! You should only use tables for tabular information.
| A |
table |
can |
| have |
visible |
borders |
or
| A |
table |
can |
| have |
invisible |
borders |
There are many other ways to format webpages and text, including backgrounds and color. This page has a white background and black and red text. You probably didn't notice the background, but it was a deliberate choice: it makes this easier to read, especially on a digital projector!
Learn by experimenting. Try, save, view. There is no better way to learn.
Q: What does ___ mean? All these new words are so confusing!
A: Try HTML Help by the Web Design Group (http://www.htmlhelp.com/). There is a lot of jargon (i.e., technical words) about web publishing. But you need to learn this jargon to use the software and to ask fruitful questions. Unfortunately, it's like learning a language by reading a dictionary. You have to start somewhere, but it will get easier.
Q: Will I break it if I try ___?
A: While creating and publishing webpages, it's very difficult to break the computer, the software, or the Web. In most cases, your page simply won't appear correctly (or at all!). Try to retrace your steps and find the mistake. Test every major change immediately, so mistakes don't pile up.
Q: What's the difference between Microsoft Internet Explorer (or Firefox, or Safari) and Adobe Dreamweaver (or Microsoft FrontPage)?
A: Web browsers can only read webpages. You can't make changes. Web editors can only create and publish pages. You can't surf the web with a web editor. Unlike in word processing, in web publishing we use one kind of program to create content and another kind of program to consume content.
Q: What's the difference between a website and a webpage?
A: A website is a collection of similar webpages. You can only see one page at a time. Usually, all the webpages in a website start with the same address. For example:
- http://www.uwsp.edu/education/kbuchana/index.htm
- http://www.uwsp.edu/education/kbuchana/portfolio/getting_started.htm
One big website can hold many smaller websites. For example, the website for this course is part of my personal website, which is part of the education website, which is part of the UWSP website.
Q: I made a change, but it's not showing up on the web.
A: There are many reasons your page might show up. Here are some frequent solutions:
- You haven't refreshed your browser. Press F5
- You haven't saved the page. The browser is only showing the last version you saved.
- You're not looking at the correct page. You were editing a similar page. Or worse, you accidentally made a copy of the page, and now you have two diverging pages.