90 likes | 233 Views
CPSC 203 Introduction to Computers. Lab 39, 40 By Jie (Jeff) Gao. What Is a Web Page?. A file with the extension “htm” or “html” This file can be at the remote server (with a web address) or at the local computer (with a file path). Examples: http://www.cpsc.ucalgary.ca/~gaoj/index.html
E N D
CPSC 203Introduction to Computers Lab 39, 40 By Jie (Jeff) Gao
What Is a Web Page? • A file with the extension “htm” or “html” • This file can be at the remote server (with a web address) or at the local computer (with a file path). Examples: • http://www.cpsc.ucalgary.ca/~gaoj/index.html • D:\documents\sample.htm • This file can be parsed and displayed in a web browser (Internet Explorer or Netscape) CPSC Labs by Jie Gao
Elements in a Web Page • Title: The text appears in the browser title bar • Content: • Paragraphs • Headers • Images • Links • Tables • … CPSC Labs by Jie Gao
Behind the Scene • A web page is actually a text file • It contains a particular language for web page contents • The resources like images are not stored inside the web page file. They are only referred by the web page CPSC Labs by Jie Gao
HTML Language • HTML (Hyper Text Markup Language) is used in a web page file to define its appearance and behaviours • Tags in hierarchical structures are used to describe various elements in the web page • Examples CPSC Labs by Jie Gao
Tools to Create a Web Page • You can write HTML directly in note pad, or • Use WYSIWYG (What You See Is What You Get) tools for creating a web page: • Word: Create a document, then “Save as Web Page…” • FrontPage: A web page editor; the interface is similar to Word • Netscape composer: A free web page editor in Netscape CPSC Labs by Jie Gao
Using FrontPage • FrontPage is a component dedicated for creating web pages in MS Office • It might not be included in some Office packages. Thus it’s possible you cannot find it on your computer at home. • It can create a single web page, multiple pages, and organize the whole web site, including publishing CPSC Labs by Jie Gao
A Simple Web Page • The workspace is like Word • Just type the content you want • Insert images or tables • Insert a link (just a simple one, more details will be given later) • Choose a place to save. The saved file is a web page (htm or html file). • Use a web browser to view that web page CPSC Labs by Jie Gao
Using Word • Create a new document • Edit it in the same way as a normal document • You can add links or images by using the Insert menu • You can switch to web layout view to have a continuous workspace • Finally when you save it, choose “Save as web page …” CPSC Labs by Jie Gao