Bài giảng Management information systems - Module F: Building a Web Page with HTML

Extended Learning Module FBuilding a Web Page with HTMLHYPERTEXT MARKUP LANGUAGE (HTML) HTML – the language you use to create a Web siteHTML allows you toSpecify the contentSpecify the formatting for content HYPERTEXT MARKUP LANGUAGE (HTML) To create a Web site, you must create an HTML documentHTML document – file that contains your Web site content and the HTML formatting instructionsWeb page is a view of an HTML document from within a Web browser Creating an HTML DocumentUse any text editorOur choice is NotepadClick on StartPoint at All ProgramsPoint at AccessoriesClick on NotepadCreate HTML document and save with htm or html extension HTML Document SectionsHTML tag – specifies the formatting and presentation of information in a Web siteStructure tags – HTML tags that set up the necessary sectionsTwo major sections in an HTML documentHead sectionBody section HTML Document SectionsBody sectionStructure tagsHTML TagsUsually are and Entire HTML document HTML DocumentResulting Web PageImageListsWorking LocallyFor all to see, Web site must be in Web spaceWeb space – storage area where you keep your Web siteWhile buildingKeep local on your computerUse browser to viewWorking LocallyTo view a local Web site in Internet ExplorerClick on File and OpenClick on BrowserChoose folder and HTML document nameClick on Open and OKBASIC TEXT FORMATTINGBasic formatting tags – HTML tags that allow you specify formatting for textStrong (bold) - and Underline - and Emphasis (italics) - and Line break - Horizontal rule - BASIC TEXT FORMATTINGMany different basic formatting tagsBASIC TEXT FORMATTINGCREATING HEADINGSHeading tags – make certain information, such as titles, stand out and , where number is from 1 to 6 and - largest and - smallestCREATING HEADINGSHeading tagsCREATING HEADINGSADJUSTING TEXT COLORDefault text color is black, can be changed and ExampleI like the color blue.Reads as I like the color blue.ADJUSTING TEXT COLORFont colorsADJUSTING TEXT COLORADJUSTING TEXT SIZEDefault is usually 3; can be changed and ExampleAstronomy is funReads as Astronomy is fun.ADJUSTING TEXT SIZEFont sizesADJUSTING TEXT SIZECHANGING BACKGROUND COLORDefault is white; can be changed with no ending tagExampleChanges background color to greenCHANGING BACKGROUND COLORChange background to greenADDING LINKS TO A WEB SITELink (hyperlink) – clickable text or image that takes you to another site or pageThree typesLinks to other Web pages or sitesLinks to downloadable filesLinks to e-mailADDING LINKS TO A WEB SITEFormat of a link tag isscreen textExampleTo provide a link to MTV’s Web siteVisit MTVDisplays as Visit MTVADDING LINKS TO A WEB SITELink to another site or pageADDING LINKS TO A WEB SITELinks usually appear blue and underlinedADDING LINKS TO A WEB SITEFor a downloadable fileReplace Web site address with file nameExampleMy Excel WorkbookDisplays as My Excel WorkbookLets someone download your Excel workbookADDING LINKS TO A WEB SITEFor a link to e-mailReplace address/filename with mailto: and your e-mail addressExampleE-mail meDisplays as E-mail meADDING LINKS TO A WEB SITELink to downloadable fileLink to e-mailADDING LINKS TO A WEB SITEADDING IMAGESImages can be useful or worthlessTo insert an imageImage file must be in Web spaceIs usually jpg or gif formatCannot use bmp file formatsADDING IMAGESADDING IMAGESAdjusting Image SizesCan adjust image size with height and width parametersProvide sizing in pixel countExampleSize would be approximately 1.5 inches squareAdjusting Image PositionCan adjust location; default is left; use align parameteralign=“right” is right justified is centeredADDING IMAGESADDING IMAGESUSING A TEXTURED BACKGROUNDCan use an image as backgroundBrowser will “tile” image to fill pageFile must be in Web spaceUSING A TEXTURED BACKGROUNDTextured backgroundCREATING AND USING LISTSLists can beNumberedUnnumbered (bulleted)Format is (for numbered)list contentlist contentCREATING AND USING LISTSFor unnumbered or bulleted list, replace “o” with “u”Format is (for unnumbered)list contentlist contentCREATING AND USING LISTSList tagsCREATING AND USING LISTSLists