1、Extended Learning Module LBuilding Web Sites with FrontPageINTRODUCTIONMicrosoft FrontPage is Web authoring softwareWeb authoring software helps you design and develop Web sites and pages that you publish on the Web INTRODUCTIONUsing FrontPage,you can create Web pages,complete with formatted text an
2、d graphics,tables,buttons,animations,and sound.You can add frames,borders,and hyperlinks to connect the pages into a Web site,or connect the pages to other Web sites INTRODUCTIONHypertext markup language(HTML)is the language you use to create a Web pageHTML allows you to specify the content of your
3、Web site and format the content such as adding bold,underline,and numbered listsFrontPage generates the HTML tags in the background INTRODUCTIONWEB SITES,WEB PAGES,&HTMLA Web site is a specific location on the Web where you visit,gather information,and perhaps even order productsA Web page is a spec
4、ific portion of a Web site that deals with a certain topicHTML is the language you use to create a Web site WEB SITES,WEB PAGES,&HTMLWEB SITES,WEB PAGES,&HTMLFrontPage Builds Web Sites Big and SmallYou can use FrontPage to build many different kinds of Web sites:Personal Web site Small business Web
5、site Corporate Web siteCorporate intranet NAVIGATION IN FRONTPAGEWith FrontPage,you can quickly create Web pages with all the familiarity and ease of use found in other Microsoft Office applicationsFrontPages menu structure,toolbar icons,dialog boxes,and working conventions strongly resemble these o
6、ther applications Understanding the InterfaceThe Menu BarBy default,FrontPage displays personalized menusUnderstanding the InterfaceThe Standard ToolbarTo display or hide a particular toolbar:Choose Toolbars from the View menu,and select or deselect the appropriate toolbar.Or right mouse click a too
7、lbar,and choose the toolbar you want from the shortcut menu FrontPage ViewsLike other software,FrontPage has a main menu and toolbars along the top of the screen for giving commandsEach view presents a different type of information about the Web site you are working on and enables you to work with t
8、he site in a different way Page ViewThe view where youll probably spend most of your time in FrontPage is the Page view Page ViewDesign Page ViewTo switch to this view from any other view,click on the Design button at the bottom-left corner of the working areaDesign Page view is where you actually b
9、uild your Web pages Split Page ViewThe Split Page view(see Figure L.6)shows you both the code and the design views of the page on one screenCode Page ViewThe Code Page view enables you to view and even modify the defining code for a Web pageTo switch to this view from another view,click on the Code
10、button at the bottom-left corner of the working area Preview Page ViewThe Preview Page view does a pretty good job of showing you how your page will look in a browser.However,the view you get is not exact,and certain features do not work in the Preview Page view BUILDING A WEB SITEStarting FrontPage
11、Starting FrontPage requires the same steps as starting most other Windows applicationsTo start FrontPage,click on the Start button,select Programs,then choose Microsoft Office,then Microsoft FrontPageThere are three ways that you can create a Web site using FrontPage:1.With templates2.With a wizard3
12、.Using an empty Web site Creating a Web Site with TemplatesA template is a ready-made Web site where all that is required of you is entering text where the placeholder text is and,if you wish,inserting new graphics where the placeholder graphics areThe idea is for you to customize these ready-made p
13、ages with your own text and designs Creating a Web Site with TemplatesCreating a Web Site with a WizardFrontPage offers several types of wizards:Corporate Presence Web Wizard Discussion Web Wizard Import Web WizardDatabase Interface Wizard Creating a Web Site with a WizardCreating an Empty Web SiteI
14、f you know your way around FrontPage and you want to start from scratch,you can start with a single blank Web site Creating an Empty Web SiteBUILDING A WEB PAGECreating a Web Page from a TemplateTo create a new Web page from a template:1.Choose File,then New2.In the New Page section of the Task Pane
15、,select More page templates3.Select a page,such as Photo Gallery4.Click OK Creating a Web Page from a TemplateCreating a Blank Web PageTo add a Web page to your Web site that you created from the previous section,you will want to create a new blank page from scratch.Follow these steps:1.Choose File,
16、then New2.In the New Page section of the Task Pane,select Blank page3.The filename is called new_page_1.htm,unless you are starting from a template(in that case,the file is called index.htm)4.Press Enter to create the new page Creating a Blank Web PageEntering Text on a Web PageEntering text on a We
17、b page is very much like entering text in a word processing documentYou can also copy or cut text from a text file,a Microsoft Word file,an e-mail message,or another Web page,and then paste it into the page youre working on Formatting TextControlling fonts on Web pages presents unique difficultiesTh
18、eres no way of knowing what fonts or font technologies a given Web visitor will have availableIts unlikely that all the same fonts will be available to any two Web visitorsEven fonts that appear identical down to their names might have subtle differences Formatting TextParagraphsIn HTML,paragraph br
19、eaks dont mean quite the same thing that they do on the printed page.A paragraph in FrontPage is simply all the text that comes before a paragraph break ParagraphsInserting a Paragraph BreakIn Page view,inserting a paragraph break is as simple as pressing the Enter keyBreaking a LineLine breaks,repr
20、esented as in HTML,can be used to format text when you want to end one line and continue it on the following line ParagraphsParagraphsAligning ParagraphsThere are different ways that you can align textParagraphsFormatting ParagraphsThe arrangement and layout of paragraphs,or any blocks of text,are k
21、ey elements of page layout and visual communicationWORKING WITH GRAPHICSUsing Ruled LinesHorizontal rules are pretty much what they sound like:horizontal lines that separate one part of a Web page from anotherPutting Your Own Images on a Web PageGif and jpeg graphics are the best choice for a Web pa
22、ge because all browsers can display them easily Changing Size,Alignment,&SpacingFrontPage offers four different ways to open the Picture Properties dialog box;1.Choose Format,then Properties,or 2.Double-click the graphic;or 3.Right mouse click and choose Picture Properties,or4.Press Alt+Enter Changi
23、ng Size,Alignment,&SpacingChanging Size,Alignment,&SpacingPicture Properties Wrapping Style Layout AlignmentHorizontal and Vertical Spacing Border Thickness Size Changing Size,Alignment,&SpacingLeft,right,and topTexttop top of tallest character in a lineMiddle middle of surrounding textAbsmiddle ali
24、gns with largest item on lineBaseline Aligns bottom of image with bottom of lineBottom another name for baselineAbsbottom aligns with bottom of lineINCLUDING HYPERLINKSHyperlinks probably constitute the biggest difference between the Web and other mediaA link can point to any address on the Internet
25、Click a link to download a file,hear a sound,or play a videoClick certain links and your e-mail software opens so you can send an e-mail message INCLUDING HYPERLINKSINCLUDING HYPERLINKSINFORMATION IN LISTS&TABLESTwo ways that allow organization of information are using lists and tables Working with
26、ListsWhen you need to present information in a structured way,lists are extremely usefulLists help you communicate information in a concise and linear wayYou can use unnumbered(i.e.bulleted)lists or numbered listsUnnumbered lists are better when there is no particular order to the listNumbered lists
27、 help you represent the order of the informationWorking with ListsWorking with TablesThe basic premise of tables is that they arrange information into rows and columnsThe intersection of each row and column is referred to as a cell,much like the cells in a spreadsheet Working with TablesWorking with
28、 Rows and ColumnsIf you dont get the table exactly the right size,you can add rows and columns to the table You can change the size of a row or column You can select multiple adjacent columns or rows to make all the selected columns or rows the same size Working with CellsYou can modify a table stru
29、cture by working directly with the cellsUnlike a spreadsheet,tables do not have to be even sets of rows and columnsYou can remove cells,merge multiple cells into a single cell,and even stretch a cell across multiple columns and rows Working with CellsFORMATTING PAGESFormatting includes specifying th
30、e page background,applying“themes”(coordinated sets of colors and bullets),setting margins,and managing pages with the workgroup tools Setting Page PropertiesYou can set many properties for your Web pages using the Page Properties dialog box Setting Page PropertiesGeneral Properties-From the General
31、 tab,you can change the title of the pageFormatting From the Formatting tab,you can change different formatting properties Background Picture Background Colors Text Colors Hyperlink Colors Setting Page PropertiesThemesA theme is a collection of properties you can apply to selected pages or to your whole Web site.These properties include a coordinated palette of colors,button styles,bullet styles,page background properties(graphic,color,rollover effect),and text styles ThemesSet Theme OptionsVivid ColorsActive Graphics Background Picture Set Theme Options
