Web page HTML and MS Front page

---

HTML

HyperText Markup Language (HTML) is the main markup language for displaying web pages and other information that can be displayed in a web browser.

HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets (like ), within the web page content. HTML tags most commonly come in pairs like

and

, although some tags, known as empty elements, are unpaired, for example . The first tag in a pair is the start tag, the second tag is the end tag (they are also called opening tags and closing tags). In between these tags web designers can add text, tags, comments and other types of text-based content.

The purpose of a web browser is to read HTML documents and compose them into visible or audible web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page.

HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. It can embed scripts in languages such as JavaScript which affect the behavior of HTML webpages.

Web browsers can also refer to Cascading Style Sheets (CSS) to define the appearance and layout of text and other material. The W3C, maintainer of both the HTML and the CSS standards, encourages the use of CSS over explicitly presentational HTML markup.

HTML 5 is the latest version of HTML which is being actively is tandardized by W3C and is also adopted in industry by various web browser.

MS Frontpage
Microsoft FrontPage (full name Microsoft Office FrontPage) is a discontinued WYSIWYG HTML editor and Web site administration tool from Microsoft for the Microsoft Windows line of operating systems. Microsoft FrontPage has since been replaced by Microsoft Expression Web and Sharepoint Designer.

 

---

You probably know that FrontPage is a Web site design tool. But it has another major role that's important to remember: FrontPage is also a Web site management tool. How exactly does FrontPage help you manage your site?

There are a handful of ways. One way is that you can use it to add, rename, delete, or move around files (without doing it in Microsoft® Windows® Explorer). You can use it to fix problems using special reports, like the broken hyperlinks report. And you can even publish a Web site using FrontPage.

The important thing to remember is that these management features are not available when opening and working on single HTML files. They are only available when you open and work on a FrontPage Web site. What is a FrontPage Web site? The next few pages will explain.

---

A FrontPage Web site is a site created in FrontPage. It contains Web pages, graphics, documents, multimedia—almost any kind of file you want.

More importantly, a FrontPage Web site also contains hidden folders and files that support FrontPage-specific functionality. These hidden items are the FrontPage metadata for your site. Don't let this term intimidate you; as you'll see in a second, FrontPage metadata is really quite simple.

 

To create a home page

The home page is the front door to your Web site. Greeting your visitors as you might do in person and providing some information about the content or subject matter of your site will spark interest in the people looking at your site. The home page also contains links to the other pages in a Web site.

1. On the blank page in Page view, type Welcome to my Web site! and then press ENTER.

   Just like in a word processor, pressing ENTER puts the cursor on a new line.

2. Next, type the sentence, see where people all over the world will be celebrating the new millennium, and look at pictures from past New Year's fireworks.
3. Press ENTER.

After typing such a long sentence, you may wonder how much typing you'll need to do before getting to the fun stuff. Don't worry, for most of the Millennium Celebration Web content, we've already done the typing for you. And when you're ready to make your own Web site, FrontPage lets you import any of your existing documents directly onto your Web pages without having to retype anything.

Your page should now look like this:

Next, you will add a picture to the bottom of the current page. Pictures can be scanned photographs, drawings, or computer graphics created in a drawing or image-editing program.

To insert a picture on the home page

1. On the Insert menu, point to Picture, and then click From File.

   FrontPage displays the Picture dialog box. Because you are editing a page that isn't part of a Web site yet, FrontPage also opens the Select File dialog box, which lets you choose a picture to insert from your local file system.

   The picture file you'll insert is located in the Tutorial folder that was installed with the FrontPage program files.

2. In the Select File dialog box, navigate to the folder named Program Files\Microsoft Office\Office\Tutorial by double-clicking each folder in this path until the Look in box displays the Tutorial folder.

   In the Tutorial folder, several files will be displayed. By default, FrontPage searches for picture files.

3. Click the file named fp2000, and then click OK.

   FrontPage inserts the selected picture file on the current page. It is a picture of a button that your site visitors will be able to click.

4. Press ENTER to create a new line.

Your page should now look like this:

Merely inserting a picture of a button doesn't mean that anything will happen when someone clicks it in a Web browser. To make a picture or a word "clickable," it must have a hyperlink associated with it.

A hyperlink is a pointer from text or from a picture to another page or file on the World Wide Web. On the World Wide Web, hyperlinks are the primary way to navigate between pages and Web sites.

In the next steps, you'll create a hyperlink from the button you just placed on the home page.

To create a hyperlink from a picture

1. On the home page, click the picture of the FrontPage button you previously inserted.

   When a picture is selected, it is shown with file handles Â—eight small squares around the outline of the picture. These can be used to resize a picture or change its appearance. When a picture is selected, FrontPage also displays the Pictures toolbar below Page view. The Pictures toolbar provides picture editing and formatting tools, which you'll learn about later.

2. On the Insert menu, click Hyperlink.

   FrontPage displays the Create Hyperlink dialog box. Here, you specify the target of the hyperlink you are creating. This can be a page or a file in your Web site, on your local file system, on a Web server, or on another site on the World Wide Web.

   Because you're creating a hyperlink from a button that is labeled "Microsoft FrontPage," you'll link to the Microsoft FrontPage home page on the World Wide Web. When site visitors click the button in a Web browser, they will be taken to the right place.

3. In the URL box, type www.microsoft.com/frontpage immediately after the https:// prefix that FrontPage has provided for you.

   URL is an acronym for Uniform Resource Locator. It is the technical term for what's commonly known as an "Internet address" or "Web site address." A URL specifies the unique location of a file or a collection of files on the World Wide Web.

4. Click OK to finish creating the hyperlink.

You may notice that the appearance of the button itself hasn't changed. Unlike text hyperlinks, which change the color of the clickable text and underline it, picture hyperlinks do not automatically indicate the presence of the hyperlink in an obvious way. This is intentional, because changing the appearance of the picture could obscure the intended page design in some cases.

You can quickly check the existence of a hyperlink from a picture by moving the mouse pointer over the picture. If a hyperlink is present, FrontPage displays the URL the hyperlink points to on the status bar.

Next, you'll insert an animation of the number 2000 at the top of the page. Animated pictures are inserted in the same way as normal pictures.

To insert an animated picture on the home page

1. Press CTRL+HOME to quickly jump to the beginning of the current page.

   The key combination CTRL+HOME places the cursor in the home position Â—the top left margin on the current page.

2. On the Insert menu, point to Picture, and then click From File.

   This time, FrontPage immediately displays the contents of the Tutorial folder. For the duration of each work session, FrontPage remembers the names and locations of the folders you've already navigated to.

3. In the Select File dialog box, double-click the file named 2000.

   Double-clicking file names is faster than selecting each file and clicking OK.

   FrontPage inserts the animated picture of the number 2000 on the current page. This picture will look great against a dark background, which you'll apply later. While you edit pages in Page view, FrontPage purposely does not show text or picture animations, so they don't distract you from your work. You will be able to see what the animation looks like when you preview the home page later in this lesson.

4. Press ENTER to move the welcome text to the line below.

Your page should now look like this:

To finish the home page, you'll center the text and pictures on it.

To center elements on a page

1. On the Edit menu, click Select All.

   FrontPage selects everything on the current page.

2. On the Format menu, click Paragraph.

   FrontPage displays the Paragraph dialog box. Here, you can change the alignment of selected elements, and apply indentation and custom spacing for text and graphics.

3. In the Alignment list, click Center, and then click OK.

   FrontPage centers the text and the pictures on the home page.

4. Click anywhere on the page to deselect all page elements.

Now that you've invested some time and completed a number of steps, it's a good idea to save your page.

To save the current page

1. On the File menu, click Save As.

   FrontPage displays the Save As dialog box. Here, you can specify the location for the current page, and review or change the page title, the file name, and the file type.

2. In the Save As dialog box, click the My Documents icon on the vertical Places bar.

   The contents of your My Documents folder is displayed. If no files are displayed in the file list, then you currently do not have any other Web pages stored here.

3. Next to the Page title field, click the Change button.

   FrontPage displays the Set Page Title dialog box. Here, the default page title is based on the first line of text on the current page. A title identifies the contents of a page when it is displayed in a Web browser. For this tutorial, you'll change the page title to something more descriptive.

4. In the Set Page title box, type Millennium Celebration - Home Page and then click OK.

   In the Save As dialog box, the default file name is based on the first line of text on the current page. For this tutorial, change the file name to something more descriptive.

5. In the File name box, change the suggested text to homepage, and then click Save.

   FrontPage saves the current page.