MS-FrontPage is a powerful tool used for creation of web pages and web sites with ease.

It helps in planning,building and maintaining large web sites. The MS-Frontpages interface is customizable and so easy to use that even the non-professional people can also simple start designing webpages and web sites. You can add and format text,pictures and other pages contents using neuns and tool bar buttons. Unlike HTML where users had to remember complex tags to build webpages. The MSFrontPage provide graphical user interface to do the same.Users can simple choose from the list of options available to build up their websites. MS-FrontPage is a WYSIWYG(what you see is what you get).You can actually see what your page will look like while creating it. It also makes publishing of your web pages very simple.You can upload your website to the server and even to create if necessary. MS-FrontPage comes with MS-Office. So if MS-Office is already installed that you might also have MS-FrontPage installed on your computer. However,if you have standalone version of MS-FrontPage then you can simple install it b following a series of steps in the wizard that is displayed when installed proceeds. MS-FrontPage 98, MS-FrontPage 2000, MS-FrontPage 2002MSFrontPage 2007 are some of the versions of FrontPage, software. We will be using MS-FrontPage 2000 through the course. FEATURES OF MS-FRONTPAGE MS-FrontPage 2000 provides a number of features that make it most suitable software for designing websites.:1. GUI interface:- MS-FrontPage provides a Graphical User Interface to create page which is very easy to operate. Users can also view the HTML code of the designed web pages. MSFrontPage also automatically adds color codes to differentiate between tags,attribute names , attribute value , comments , scripts and text on a page which can also turn off color coding. 2. Themes available:- There are a large number of pre-designed themes available that can help to provide a consistent look to a web page or an entire web site. You can also customize any of the predesigned themes. 3. Positioning:- MS-FrontPage provides the feature of positioning the elements such as text and graphics anywhere on a page. Generally, the positioning order is sequential. Positioning can also be applied to a group of elements together. The various styles of positioning are absolute-style positioning. Floating style positioning , Z-order positioning , Relative-Style positioning. 4. Manages Work Flow:- MS-FrontPage monitors task status for you. You can create tasks to track work that needs to be done , prioritize the importance of task and associate the task with a specific file. On saving a page associated with a task in Page view , FrontPage asks if you want to change the task status to completed. 5. Spell Check:- Ms-FrontPAge allows automatic checking of the spelling of a word as you type, misspelled words are highlighted which can then be corrected. 6. Alllows to use VB editor:- MS-FrontPage allows to create macros , applications, controls and forms for you web using the VB editor. You can even create web sites and changes their structure within a programming environment.

7. Multlingual Support:- MS-FrontPage is available in man languages. You can set the language for each page making it easier for you to create a web site in multiple languages Moreover it also allows to display the front page user interface in one language but create content in other languages. 8. MS-FrontPage fully intergrates with fully MS-Office 200 applications usch as MS-Word MSexcel, MS-Access and MS-Powerpoint. It is easy to use information from MS-Office components as you can use information from MS-Excel databse. Moreover many themes available are common with other MS-office applications such as MS-Word, Ms-Excel, MsAccess , MS-Frontpage also allows to add MS-Office web components such as spreadsheet, pivot table views and chart to web pages 9. Web server management is very easy in MS-Frontpage. It uses the same management console as windows NT ans IIAS(internet information services) you can also manage webs remotely. 10. MS-FrontPage allows to target a specific environment such as web browser, web server etc.It automatically restricts features that will not work on target computer. 11. MS-FrontPage allows you to customise and personalize tool bars according to once requirements. 12. MS-FrontPage provides more control over publishing as you can specify which web pages you want to publish and which you dont want to. Moreover you can publish to any ISP.

HOW TO START MS-FRONTPAGE:We assume MS-FrontPAge is already installed in your PC.MS-FrontPage requires that you must atleast run window 98. It is also compatible with MS-Internet Explorer version 3.0 and later. If you are using Netscape you can use version 305 or later MS-FrontPAge is already installed with MS-Office 2000. However if you have purchase a stand alone versions that you need to install it by following the steps in wizard. You can open MS-FrontPage application window by following either of the methods:1. Clicking at the start button on the task bar. As a result a pop up menu is displayed, follow Start>Programs>Microsoft frontpage. On clicking it MS-FrontPage window will open. 2. Using run command: In the run dialog box type FRONTPG in open drop down box or search for FRONTPG.EXP , file using the browser button. when you are done click OK button. 3. Using shortcut: If some shortcut is made on the desktop on any other location that you can double click on it to run. 4. Using Dos: At the common prompt you can specify the path to reach the common pages and click enter. 5. Using Find: in order to open MS-FrontPage using find option we search for file name FRONTPG.EXE. after searching the file it can be open by double clicking on its icon. 6. Using my Computer or window explrer.: you can either move to my computer or windows explorer after the filename FRONTPG is located you can double click on its icon to open it.

ANATOMY OF MS-FRONTPAGE:

All Windows based Application Programs operate in much the same way. As such, many of the features of a given program are common to all. Therefore, if you are in any way familiar with using programs such as Word or WordPerfect, you have probably seen much of the following. Let's start with the basic components of the program interface (what you actually see when you look at FrontPage). Here is a screen-shot from FrontPage 2000 showing a new document followed by a breakdown of the major components:
The Title Bar The Views Bar The Menu Bar Normal Interface The Tool Bar HTML Interface The Formatting Bar Preview Interface

1. The Title Bar This is the bar at the top of the program interface for most Windows programs. In this case, the title bar indicates that the program is Microsoft FrontPage and includes a picture of the FrontPage Icon (a familiar up-left arrow in

a blue circle). Additionally, the title bar also normally includes the Minimize button , the Maximize button , and the Close Program button . The first two allow you to jump quickly from program to program while the third allows you to close it down and complete a session. Always make sure you save your work before closing the program... normally it will prompt you to save before closing but I've experienced situations where the program has skipped this step.

2. The Menu Bar This bar is featured directly under the title bar in a given program. Whereas the headings or names of the menus in the menu bar are quite common, a quick perusal of each will quickly show you that this is not the case! Each heading in the menu bar has a drop-down list which appears when the heading is clicked. Again, this is a common feature. Additionally, you will notice that in the heading: File, that the F is underlined whereas in the heading: View, the V is underlined. This is indicates a shortcut for those of us who are keyboard friendly rather than mousehappy... that is, you can access the same dropdown menu by holding the <Alt> key and pressing the underlined letter. Hence <Alt> + "a" will yield the dropdown Table menu. Likewise, the same principle applies for selecting items from within the dropdown menu. Hitting Esc (Escape) on your keyboard will close the dropdown menus. Note: if a double chevron (ie down arrows) appear at the bottom of a dropdown menu, this indicates that only the most commonly used items have been shown. This common list is subject to change, depending on your use of the unseen items. For your understanding of this matter, I have included two screenshots of each dropdown menu: a shot of the initial dropdown menu (first image in each section) and an expanded dropdown menu (second image in each section). FILE MENU:New this choice will allow you to open a new page or web depending on your desire. There are other options but will not be dealing with them in this introduction.. Open and Close -- these allow you to open a new page or close the current page. Be sure to save your work! Open Web this links the user directly to the My Webs section in My Documents located on the C:\ directory. We will discuss more on the concept of webs in another section. Save Allows the user to save the current document. Save As... Sometimes it is desirable or necessary to save the current document under a different name.

Save All Saves all open pages automatically. Search Finds files and pages based on the criteria you set. Import allows you to copy files and folders directly into your website. Preview in Browser sometimes it is better to view your page in an internet browser program like Explorer or Netscape. Page Setup allows you to modify the design and layout of your page. Print Preview gives you a different perspective of your work (not often used in this program because the idea is not to print but to publish). Print self explanatory. If you have configured your system to send email from outlook express, this will allow you to send your work as an email attachment. Properties allows you to view the properties of the current or selected page(s). Recent Files allows you to view the last few files that you have had open. Recent Webs has the same function as Recent Files, but with complete webs. This makes for quick referencing. Exit Quit the program. If you have not saved your current page or web, the program will prompt you to do so. If you choose no, then your information will be lost.

EDIT MENU Undo automatically reverses any blunders that you may have made (eg. You cut something out by accident and you want it to come back. Redo When you realize that you want something reversed back to the original change. Cut removes a selected item/text and places it on the clipboard. Copy copies a selected item/text without removing it and places it on the clipboard. Paste inserts an item from the clipboard into a selected area... you can paste cut and copied items/text. Paste Special sometimes the items selected, cut, or copied have a special format (eg. A table). Delete cuts a selection without placing it on the clipboard. Select All selects all items/text in an open document/page. Find allows you to search through a document/page for specified text or web. Replace searches for and replaces text or webs. Check Out makes a specified file unavailable for editing by anyone but you. Check In allows others to edit a previously checked out file. Undo Check Out simply does what it says. Task not normally used by average users.

VIEW MENU

Page allows you to view the page you have selected to work on. It is the view you use when you create, edit, and publish. Folders shows how the content of a web is organized. Reports allows the viewing of various site reports or summaries. Navigation allows you to see the structure of your web in an organized chart/diagram. Hyperlinks allows you to view the status of hyperlinks in your web. Tasks allows you to view tasks that you have set for yourself using the edit menu... this is a way of helping you plan you web. Views Bar allows you to view or hide the displays bar on the left of your screen. This bar contains quick links to many of the options listed in this menu. Folder List allows you to view the complete contents of your web while still working on individual pages. Navigation Pane allows you to view the navigational structure of your web. Reveal Tags displays or hides html tags in the Normal tab view. Toolbars allows you to display or hide a variety of toolbars that are available for your use. Refresh a very useful tool... you will need to refresh your page/web constantly if you want to be sure that any changes you have made are going to be effective. Basically, this works the same as the refresh option in a web browser.

INSERT MENU

Break inserts a page break at the selected insertion point. Many browsers will not display empty paragraphs (this tends to make a page look jumbled) but they will display breaks as blank spaces. Horizontal Line inserts a basic line that can be modified for use as a separator bar, a heading bar, etc.. Date and Time... inserts the date and time according to the format you choose.

Symbol a wide variety of symbols are available for your use. is just one example. Comment Sometimes an author or editor may want to make a comment on an item or selection of text. Navigation... insert navigation points based on the structure of the website. Component inserts a component such as a scrolling marquee, a hover button, etc. This is a very useful tool. Database insert a new or previously composed database into your website. Form insert a form such as a text box or a depressible button, etc Advanced - contains features such as ActiveX Controls, Java Applet controls, etc. This is beyond the scope of our current discussion. Picture allows you to insert a picture from a file, clip art, or other location (eg. From the internet). File... allows you to insert a previously created file directly into your site. Bookmark a kind of link for internal navigation in a website. It creates a hyperlink between two points on the same page. Hyperlink similar to a bookmark but it links the selected text/item to another page either in your own web, an email address, or on the internet.

FORMAT MENU

Font this item allows you to change the colour, size, appearance, etc. of the font you are using. Paragraph allows you to format an entire paragraph (spacing, placement, etc.)

Bullets and Numbering allows you to set a bullet list/number list; allows you to change the style of bullet/numbering, etc. Borders and Shading formats the border/shading of tables and other selected items on a page, including the page itself. Position sets the wrap style and positioning of selected pictures and items. Dynamic HTML Effects allows you to insert java script at the click of a button which will cause the appearance of the text or item that you select, depending on the selection. More on this in later sessions. Theme Front Page has a number of themes that can be selected; these create a sense of unity and coherence in a web. More on themes in later sessions. Style creates or modifies the style for a page (the font, paragraph settings, etc.) Style Sheet Links... links the active page to a cascading style sheet. Shared Borders... sets shared borders for the current page or for the entire web. Shared borders are regions where you want your material to appear consistently. Page Transition... creates a special effect when a user enters or leaves a page (eg. Dissolve, Spiral, Box In, etc.) Background part of the Properties of your page. you can modify the background, font, hyperlink, colour or even insert an image. Note: Images appear tiled therefore some may not be suitable for web design due to contrast with other visuals and text. Remove Formatting a failsafe... at any time, you can remove the last change to the format. This has the same function as undo. Properties this controls how the font is presented on the page or entire site.

TOOLS MENU

Spelling... this is the spell checker for Front Page. It is always a good idea to double check. Thesaurus... why use the same words over and over? Recalculate Hyperlinks... updates the display of the current web. Macro a macro is a user defined shortcut for performing commonly used actions. You can write short programs that make your work easier (<ctrl>+i = italics is a pre-installed macro). Add-Ins... registers, loads, and unloads add-ins that you have installed on your computer. Customize... Allows you to add and take options away from existing menus and toolbars. Web Settings... displays web settings for viewing and editing. Options... allows you to customize your internet loading options, such as whether to overwrite existing pages during upload, etc. Page Options... displays options for viewing and editing pages, including general options for creating thumbnail images, font settings, color coding for the HTML tab, and browser- compatibility settings.

TABLE MENU

Draw Table allows you to use the mouse to create a table by dragging the image. Insert allows you to specify the dimensions and number of rows/columns before inserting the table. Delete Cells allows you to select and delete specific cells in a table. Select allows you to choose cells, rows, columns, or the entire table for modification. Merge Cells Joins two or more cells together to make one larger cell. Split Cells... breaks a cell into two cells.

Distribute Rows Evenly - spaces unevenly set row heights to average intervals. Distribute Columns Evenly - sets all columns in a table to equal widths. AutoFit -automatically sets the width of all columns to the exact dimensions of their contents. Convert - gives the user the option to automatically convert text into tables or tables into text. You can create tables to surround your text or take tables filled with text and remove the table borders leaving just the text. Properties - controls how the columns, rows, cells, text, borders, etc. are presented in a table. FRAME MENU Split Frame - splits a selected frame either vertically or horizontally. Delete Frame - I won't insult your intelligence. Open Page in New Window -- frames can be quite small and make the pages displayed within them quite difficult to work on... for this reason, this option allows you to open the same page in a new window for design/editing... changes will be made to both open versions of the page. Save Page - saves a page in an individual frame rather than as part of a group. Save Page As... - sometimes it is desirable to save a page under a different name... your reasons are your own. Frame Properties - allows you to manage how the frames are displayed on a given page.

HELP MENU What's This? - this allows you to click on any icon in the menus or in the toolbar and get a brief explanation of its function. Office on the Web - this links directly to Microsoft's Office Website Detect and Repair... - automatically searches out, detects, and fixes any problems that may have occurred in your FrontPage document. NOTE: never depend entirely on these things... it's like using the "spill chick" to fix spelling mistakes!

About Microsoft FrontPage - this provides you with licensing information, technical support, network information, system information, copyright date and program version number, etc.

The Tool Bar

This bar is located directly under the Menu Bar and essentially contains shortcuts (in the form of depressible buttons) to commonly used items in the various menus. Each item is indicated by an Icon (pictorial image) which looks similar to what it represents. The Tool Bar may be modified to fit the user's preferences... the one pictured above contains each available item. These can be removed by clicking on the down-arrow at the extreme right of the bar and selecting "Add or Remove Buttons". NOTE: Some of the icons are initially presented without colour, like the "Publish Web" button... this means that until you do something (like highlight some text, for example) it is unavailable for use. Here is an explanation of the buttons in the Tool Bar: This is the New Page button. Essentially, clicking this button opens a new page in the workspace window. A down-arrow next to this button initiates a dropdown menu which offers further options of starting a new Web, a new Folder, or a new Task. This is the Open button. Like its counterpart in the File menu, it allows you to open an existing page and the down-arrow next to it allows you to open an existing web. This is the Save button allows you to quickly save your current page. Notice that this does not include a Save As... option. Be careful -- always check to make sure you aren't going to overwrite something you don't want to lose!

This is the Publish Web button. It allows you to publish the files in the current web when you are ready to present your web for public viewing, or when you want to update the files in your web. You can publish using HTTP (HyperText Transfer Protocol) if the the FrontPage Server Extensions are installed on the Web server to which you are publishing. It also allows you to publish the current web using FTP (File Transfer Protocol) if the FrontPage extensions are not on your server. NOTE: generally, I find it best to upload my webs using a WSFTP Program. More on this under the section for Publishing to the Internet. This is the Folder List button which allows you to open and close an explorer like view of all folders in a given web. The Print button simply prints all text and images displayed in the normal view of your workspace window. The Preview button allows the user to see what the page will look like when it is displayed in a web browser... the default setting is to preview in Internet Explorer. NOTE: In order to preview in a browser, you must have already saved all information in the page you wish to view. This is the Spell Check button. The name says it all... it will check the spelling of a word, in a paragraph, or in an entire page. Be careful... sometimes words will appear to be spelled wrong, such as a person/place name, when it is actually correct. Additionally, abbreviations and Canadian spelling (ie: colour) will show up as misspelled as well. Use spell check as a resource, not as a rule! This is the Cut button. It will appear greyed-out until you select some text or an image. It literally cuts out what you have selected. Don't worry... you can paste it back-in (as long as you don't cut something else first). When an item is cut or copied, it is saved to the Clipboard... a place where Windows stores cut and copied images, text, etc. and keeps it for a period of time just in case you want it back again. Similar to Cut, the Copy button saves material to the clipboard but it does so without actually removing the selected item first. Paste from Clipboard allows you to paste items you have cut from other places directly into your FrontPage document. Format Painter allows you to copy the formatting of a selection directly to other text... basically it allows quick and easy reformatting of various items without going through all of the steps for each item.

The Undo button allows you to quickly undo a mistake (such as accidental cutting or formatting). Redo is used when you accidentally undo something. It's hard to make mistakes that last in FrontPage! This is the Insert Component button. It is used to insert features that go beyond the normal text you are used to using. These features include items

like , , and a variety of other items that would require knowledge of code forms to accomplish. The Insert Table button is an essential tool for all web design. Basically, the most efficient way to format a webpage would be to use tables (hidden or otherwise). This button allows you to insert a table with a specified number of rows and columns by highlighting empty blocks in a sample matrix. Insert Picture from File allows you to quickly insert a picture from any location on your computer. It ought to be noted however that your pictures ought to be all saved in the same parent directory folder as the webpage/site. The Insert Hyperlink button allows you to convert normal text or pictures into links to another position on a page, on another page in your web, or to another file located somewhere on the internet. The Refresh button allows you to re-load a page after you have made changes. Some changes cannot be viewed until the page has been refreshed. The Stop button is almost self-explanatory. That is, it stops a current action. However, it is important to note that it only applies to two kinds of actions: loading a page or following a hyperlink. As such, it is most often greyed out as shown here. The Show All displays all hidden page elements such as line breaks, unknown html tags, form markers (such as in a scrolling marquee or other java form) etc. For most users, this button is irrelevant. Front Page Help -- self explanatory. Click here if you can't figure out how to do something or have some questions that you need answered.

The Formatting Bar / Font Bar

This bar is used to directly make specifications as to the layout of text and images on a page. Primarily, the formatting bar is designed to manipulate text but many of its functions can govern the display of images or table-layout as well. For this reason, the formatting bar is often referred to as the "font bar." A quick look will explain why. Again, as with the Tool Bar all of these elements are merely shortcuts to their counterparts in the dropdown menus. Here is a breakdown of the major elements of this bar:
The Style formatting option allows you to select from a list of font-styles. This saves the time of inserting code... for example "Heading 1" (indicated in code by <h1>...</h1>) is the largest formatting for font display on a webpage.

The Font formatting option allows you to choose from a large variety of fonts (these are installed by default with the FrontPage software and can beadded to through downloads and fontpackage purchases).

The Font Size formatting option allows the user to choose from a variety of display sizes

from a minimum of 8 to a maximum of

36

The Bold button allows you to bold any selected text, regardless of size, style, etc.

This button places any selected text in Itallics.

The Underline button underlines any selected text.

The Align Left button juxtaposes the selected text and/or images, etc. with the left margin of the page or to the left border of a table.

The Align Center button centers all selected text and images on the page or in a table.

The Align Right button juxtaposes the selected text and/or images, etc. with the right margin of the page or to the right border of a table.

The Numbering button allows you to create a numbered list from scratch or convert existing text into a numbered list.

Bullets is a button which performs a function similar to Numbering, but instead of having progressive increments, shapes indicate each point in the list.

The Decrease Indent button is useful for formatting previously created lists (butteted or numbered). It moves an indented bullet back to become part of the frame list. It is also used in place of undo when a mistake is made with the Increase Indent button!

The Increase Indent is used to move the selected text further away from the margin or to create sub-lists within established lists. These sub-lists are marked graphically by position and by an alternate bullet shape.

Highlight Color allows you to create a coloured background behind any selected text to make it stand-out from the rest of a document. Generally this item isn't used because it is a rather elementary and overt method of emphasis.

The Font Color allows you to change the colour of any selected text.

The Add or Remove Buttons tool is selected by depressing the down-arrow at the end of the formatting bar. Here, I have shown the menu with all items selected. If you didn't want to have the highlight color displayed (because you never use it) you could get it out of your way for good.

The Views Bar

The Views bar, shown by default at the left of the workspace in FrontPage, lets you switch quickly from one view of your web to another. You can hide the Views bar if you want more space to view pages in Page view, reports in Reports view, and so on. To do this, you must open the dropdown menu from Views (ironically enough) and remove the check mark next to the Views Bar item in the list. If the Views Bar is not currently displayed in your copy of FrontPage, follow the same steps to make it visible.

Normal Interface In my description of the program, I noted that FrontPage allowed the user to compose web documents without having to worry about knowing HTML. The Normal Mode, indicated by the Normal Tab at the bottom of the composition window, is the main workspace of the average FrontPage user... it makes it possible to construct relatively complex documents without even having to look at a line of code -- this kind of format is known as WYSIWYG. Basically, this is a pseudo-technical adjective used to describe any kind of formatting which allows the text and images to be printed (or displayed) exactly as it appears on the screen during construction. HTML Interface While it is possible to construct web documents entirely in WYSIWYG fashion, I also hinted in my earlier discussions of FrontPage that it would not be invaluable to have some sort of HTML knowledge. In other words, you don't need to know HTML but if you do, it could actually make certain things easier. To facilitate those of you who already know some basic HTML, FrontPage also has an HTML Interface which can be accessed by clicking on the HTML Tab next to the normal tab at the bottom of the screen. This interface allows the user to manipulate the FrontPage document from the inside-out, as it were, by altering, adding to, taking away, etc. parts of the code. Additionally, java scripts, etc. can be inserted (with the right knowledge) into the document, allowing for endless possibilities in terms of what can be created and displayed. NOTE: For those of you who are unfamiliar with HTML, this interface provides an added benefit -- by starting with a blank page and inserting items in the normal interface and switching back and forth between it and the HTML interface, you can actually learn HTML! Preview Interface The Preview Interface, accessed through the Preview Tab , allows sneak peeking at the finished result before a document is ready for upload. Similar to a web browser, Preview allows the user to explore hyperlinks, see components like marquees in action, examine the effects of hover buttons, etc. It should be noted however, that the layout may not be precisely as it will appear in a browser and that in order to preview certain items (eg. hover buttons) it is necessary to save all changes first.

Guru Nanak Khalsa College,For Women

PROJECT FILE ON
PERSONAL COMPUTING SYSTEM(PCS)
SUBMITTED TO:Miss. Anupama Sharma
SUBMITTED BY:Khushboo BCA-1 Roll.no.:-