Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Download Creating and Editing a Web Page
Transcript
Creating and Editing a Web Page Presented by Stacy Cox Project – Community Food Drive • You will use Notepad to enter text and HTML tags to create a the Web page. • Notepad is a basic text editor you can use for simple documents or for creating Web pages using HTML. • You will use Internet Explorer to view the Web page created. Window Elements • Title – text that appears on the title bar of the browser; usually the first element you see • Body – contains the information that is displayed in the browser • Background – a solid color, a picture, or a graphic against which the other elements on the web page appear Text Elements • Normal text – the default text format used for the main content of a Web page – Can be used in a standard paragraph or formatted to appear as bold, italic, or underlined; in different colors; and so on • Headings – used to set off paragraphs of text or different sections of a page – Are a larger font size than normal text and often are bold or italic or a different color than normal text • Word wrap – causes text lines to break the right edge of the window and appear on a new line Image Elements • Web pages use several different types of graphics, or images, such as an icon, bullet, line, photo, illustration, or other pictures • Inline image – the image or graphic file is not part of the HTML file, but is merged with the web page when displayed in the browser • Image map – a type of inline image that is used to define one or more hotspots • Hotspot – an area of an image that activates a function when selected (example: link to another web page/site) Image Elements continued • Some inline images are animated, meaning they include motion and can change in appearance • Horizontal rules are lines that are displayed across a web page to separate different sections of the page Hyperlink Elements • One of the most important elements of a web page is a hyperlink, or link. • A link is text, an image, or another web page element that you click to instruct the browser to go to a location in a file or to request a file from a server. Defining the HTML Document • <html> and </html> indicate the beginning and ending of an HTML document • <head> and </head> contain the web page title and other document header information • <title> and </title> indicate the title of the web page • <body> and </body> contain the main content of the web page Using Lists to Present Content • Unordered list, also called bulleted list, formats information using small images called bullets – <ul> and </ul> • Ordered list, also called numbered list, formats information in a series using numbers or letters – <ol> and </ol> • After the <ul> or <ol> tag is entered to define the type of list, the <li> and </li> tags are used to define a list item Using Lists to Present Content – Unordered or Bulleted List Example Using Lists to Present Content – Ordered or Numbered List Example More About List Formats • If you use the <ul> or <ol> tags without attributes you get the default bullet (disc) or number style (Arabic numerals) • To change the default bullet or number type, the type attribute is added within the <ol> or <ul> tags Unordered List Types Ordered List Types Saving HTML Files • Before you can view your web page in a browser you must save it • HTML files must end with the extension .htm or .html Using a Browser to View a Web Page • After your file has been save you can now view what it would look like on the web • Locate the file in My Documents or whatever location you saved it in and double-click the Internet Explorer icon Improving the Appearance of Your Web Page • One goal in web page development is to create a web page that is visually appealing and maintains the interest of the visitors • Images are used to enhance the look of a web page and make it more interesting and colorful – To add background color, to help organize a web page, to help clarify a point being made in the text, or to serve as links – Can also be used to break up sections by using a horizontal rule Image Types • Web pages use three types of files – Graphics Interchange Format (GIF) – uses compression technique called LZW to make it smaller for download; file extension is .gif – Joint Photographic Experts Group (JPEG) – graphic image saved using compression technique other than LZW; often more complex, such as photos; file extension is .jpg, .jpe, or .jpeg – Portable Network Graphics (PNG) – also a compressed file format that supports multiple colors and resolutions; file extension is .png or .ping Image Attributes • Attributes are additional characteristics that can be added to the <img> tag Other Visual Enhancements • To change the background color of a web page the bgcolor attribute must be added in the <body> tag • A horizontal rule can be added to separate sections of the web page using the <hr /> tag Other terms • Source code is the code or instructions used to create a web page or program • When the browser opens, it displays a home page, or start page, which is a web page that appears each time Internet Explorer starts • A printed version of a file, web page, or other document is called a hard copy, or printout
