HTML 2Creating and Editing a Web Page Using Inline Styles

Html 2creating And Editing A Web Page Using Inline Styles-Free PDF

  • Date:21 Sep 2020
  • Views:5
  • Downloads:0
  • Pages:54
  • Size:7.00 MB

Share Pdf : Html 2creating And Editing A Web Page Using Inline Styles

Download and Preview : Html 2creating And Editing A Web Page Using Inline Styles


Report CopyRight/DMCA Form For : Html 2creating And Editing A Web Page Using Inline Styles


Transcription:

2 Creating and Editing a Web,Page Using Inline Styles. Introduction, With an understanding of the Web development life cycle you should have a good idea. about the importance of proper Web site planning analysis and design After completing. these phases the next phase is the actual development of a Web page using HTML As. discussed in Chapter 1 Web pages are created by using HTML tags and attributes to. define the structure layout and appearance of a Web page In this chapter you create and. edit a Web page using basic HTML tags,Project Rock Climbing Fun Web Page. Chapter 2 illustrates how to use HTML to create a Web page for a rock climbing company. as shown in Figure 2 1a As an employee of the company one of your tasks is to develop a. Web page to advertise the company s rock climbing classes The Rock Climbing Fun Web. page will include general information about the company along with i nformation on the. equipment needed to start rock climbing, To enter text and HTML tags used to create the Web page you will use a program. called Notepad as shown in Figure 2 1b Notepad is a basic text editor that you can. use for simple documents or for creating Web pages using HTML Previous editions of this. book used Notepad a text editor that is a part of the Windows operating system Notepad. worked well to enter the HTML elements and Web page content but Notepad is a more. sophisticated text editor with more features Notepad has line numbering which is very. helpful when reading code It also highlights code and text with different colors as you. will see later in the chapter Because of this added versatility Notepad is the chosen text. editor for this edition You will use the Microsoft Internet Explorer browser to view your. Web page as you create it By default Internet Explorer is installed with Windows and. Notepad can be downloaded for free on the Web If you do not have Notepad on your. computer you can download it from the notepad plus plus org Web site If you do not have. Internet Explorer available on your computer another browser program will work. As you read this chapter you will learn how to create the Web page shown in. Figure 2 1 by performing these general tasks,Enter HTML code into the Notepad window.
Save the file as an HTML file,Enter basic HTML tags and add text to the file. Organize the text by adding headings and creating a bulleted list. Enhance the Web page s appearance with an image and inline styles. View the Web page and HTML code in your browser,Validate the Web page. Print the Web page, Copyright 2012 Cengage Learning All Rights Reserved May not be copied scanned or duplicated in whole or in part Due to electronic rights some third party content may be suppressed from the eBook and or eChapter s. Editorial review has deemed that any suppressed content does not materially affect the overall learning experience Cengage Learning reserves the right to remove additional content at any time if subsequent rights restrictions require it. Art courtesy of Openclipart org Darren Beck,ock Climbing. Fun Web page,b HTML code used to,create the Web page.
Figure 2 1, Copyright 2012 Cengage Learning All Rights Reserved May not be copied scanned or duplicated in whole or in part Due to electronic rights some third party content may be suppressed from the eBook and or eChapter s. Editorial review has deemed that any suppressed content does not materially affect the overall learning experience Cengage Learning reserves the right to remove additional content at any time if subsequent rights restrictions require it. HTML 36 HTML Chapter 2 Creating and Editing a Web Page Using Inline Styles. Plan General Project Guidelines, Ahead When creating a Web page the actions you perform and decisions you make will affect the. appearance and characteristics of the finished page As you create a Web page such as the. project shown in Figure 2 1 on the previous page you should follow these general guidelines. 1 Complete Web page planning Before developing a Web page you must know. the purpose of the Web site identify the users of the site and their computing. environments and decide who owns the information on the Web page. 2 Analyze the need for the Web page In the analysis phase of the Web development life. cycle you should analyze what content to include on the Web page In this phase you. determine the tasks and the information that the users need Refer to Table 1 4 on page. HTML 15 in Chapter 1 for information on the phases of the Web development life cycle. 3 Choose the content for the Web page Once you have completed the analysis you. need to determine what content to include on the Web page Follow the less is more. principle The less text the more likely the Web page will be read Use as few words as. possible to make a point, 4 Determine the file naming convention that you will use for this Web page Before you. start creating and saving files you should decide on a standard way of naming your. files Should you use the htm or html extension As explained later in the chapter. you use the htm extension when the host Web server only allows short file names. You use html when the host Web server allows long file names What name should. you give your file to indicate the file s content or purpose For instance naming a Web. page page1 html does not describe what that Web page is a more descriptive name is. helpful in development of the Web site, 5 Determine where to save the Web page You can store a Web page permanently or. save it on a variety of storage media including a hard disk USB flash drive CD or. DVD Your instructor or the company for whom you are developing the Web page may. have specific storage media requirements, 6 Determine what folder structure to use on your storage device Once you have.
determined the storage media to use you should also determine folder location. structure and names on which to save the Web page This should be done before you. start to save any of your files, 7 Identify how to format various elements of the Web page The overall appearance of a. Web page significantly affects its ability to communicate clearly Examples of how you. can modify the appearance or format of the Web page include adding an image color. to headings and horizontal rules, 8 Find appropriate graphical images Eye catching graphical images help convey the Web. page s overall message and add visual interest Graphics can be used to show a product. service result or benefit or visually convey a message that is not expressed easily. with words, 9 Establish where to position and how to format the graphical images The position and. format of the graphical images should grab the attention of viewers and draw them. into reading the Web page, 10 Test the Web page for W3C compliance An important part of Web development. is testing to assure that your Web page follows standards The World Wide Web. Consortium W3C has an online validator that allows you to test your Web page and. clearly explains any errors, When necessary more specific details concerning the above guidelines are presented.
at appropriate points in the chapter The chapter will also identify the actions performed. and decisions made regarding these guidelines during the creation of the Web page shown. in Figure 2 1a, Copyright 2012 Cengage Learning All Rights Reserved May not be copied scanned or duplicated in whole or in part Due to electronic rights some third party content may be suppressed from the eBook and or eChapter s. Editorial review has deemed that any suppressed content does not materially affect the overall learning experience Cengage Learning reserves the right to remove additional content at any time if subsequent rights restrictions require it. Elements of a Web Page HTML 37,HTML Chapter 2,Elements of a Web Page. Today many people individuals students teachers business executives Web. developers and others are developing Web pages for personal or professional reasons. Each person has his or her own style and the resulting Web pages are as diverse as the. people who create them Most Web pages however include several basic features or. elements as shown in Figure 2 2,title grey background. Smithsonian,text links,image links,The Smithsonian Institution. Figure 2 2 Elements of a Web page,Browser Window Elements Favorites and.
The title of a Web page is the text that appears on the title bar and taskbar of the Internet Explorer Google. browser window when the Web page appears The title is also the name assigned to the Chrome and Mozilla. Firefox have a feature, page if a user adds the page to the browser s list of favorites or bookmarks Because of that allows you to add. its importance you should always include a title on your Web page The title which usu Web pages to a list so. ally is the first element you see should identify the subject or purpose of the page The you can quickly access. title should be concise yet descriptive and briefly explain the page s content or purpose to them in the future. Internet Explorer refers to,the visitor,these as Favorites while. The body of the Web page contains the information that is displayed in the browser Chrome and Firefox calls. window The body can include text graphics and other elements The Web page displays them Bookmarks Web. anything that is contained within the body start body and body end body tags developers need to make. sure that they include a, The background of a Web page is a solid color a picture or a graphic against which the. descriptive title on their, other elements on the Web page appear When choosing your background be sure it does Web pages because that is. not overpower the information on the Web page As you surf the Web watch for back the title that is shown in. ground colors or images that do not allow the content of the Web page to show through the bookmark or favorite. This is certainly a what not to do guideline for Web developers. Copyright 2012 Cengage Learning All Rights Reserved May not be copied scanned or duplicated in whole or in part Due to electronic rights some third party content may be suppressed from the eBook and or eChapter s. Editorial review has deemed that any suppressed content does not materially affect the overall learning experience Cengage Learning reserves the right to remove additional content at any time if subsequent rights restrictions require it. HTML 38 HTML Chapter 2 Creating and Editing a Web Page Using Inline Styles. HTML Resources,Text Elements,The Web has many, wonderful sources of Normal text is the default text format used for the main content of a Web page.
information on HTML and Normal text can be used in a standard paragraph or formatted to appear as bold italic. Web page development, One of the better sources or underlined in different colors and so on You can also use inline styles to alter the. is the HTML Goodies Web format of the text an approach used throughout this book Normal text can also be used. site which has primers in a series of text items called a list Typically lists are bulleted or numbered Various. and tutorials on a variety attributes of lists can be altered For example you might want to have square bullets. of topics as well as free,downloads and discussion. rather than the default round bullets or to have your list text in italic or bold. areas To learn more about Headings are used to set off paragraphs of text or different sections of a page. this Web site search for Headings are a larger font size than normal text and are often bold or italic or a d ifferent. the term HTML Goodies color than normal text Heading sizes run from 1 the largest to 6 the smallest You. in a search engine, generally go from one heading size to the next smallest when setting up a Web page. Image Elements, Web pages typically use several different types of graphics or images such as an. icon bullet line photo illustration or other picture An image used in a Web page is. also called an inline image which means that the image or graphic file is not part of the. HTML file Instead the Web browser merges the separate graphic file into the Web page. as it is displayed in the browser window The HTML file contains img tags that tell the. browser which graphic file to request from the server where to insert it on the page and. how to display it, Web pages typically use several different types of inline images An image map is a.
special type of inline image in which you define one or more areas as hotspots A hotspot. is an area of an image that activates a function when selected For example each hotspot. in an image map can link to a different Web page 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 Although the appearance of a horizontal rule can vary. many Web pages use an inline image as a horizontal rule Alternatively you can use the. horizontal rule tag hr to add a simple horizontal rule such as the one used in this. chapter project,Hyperlink Elements, One of the more 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 On the Web links are the primary. way to navigate between Web pages and among Web sites Links point not only to Web. HTML 36 HTML Chapter 2 Creating and Editing a Web Page Using Inline Styles General Project Guidelines When creating a Web page the actions you perform and decisions you make will affect the appearance and characteristics of the finished page

Related Books