TeamSite Refguide Nov2011 (1)

60
TeamSite ContentCenter Version 6.7.5 Reference Guide for the BWH Internet Technical Assistance: BWH Help Desk – (617) 732-5927 Web Policy Items & Staff Updates: Paulette Bouchard ©2010 PHS Information Systems Training 11/22/2011

description

Teamsite

Transcript of TeamSite Refguide Nov2011 (1)

  • TeamSite ContentCenter Version 6.7.5

    Reference Guide for the BWH Internet

    Technical Assistance: BWH Help Desk (617) 732-5927

    Web Policy Items & Staff Updates:

    Paulette Bouchard

    2010 PHS Information Systems Training 11/22/2011

  • TeamSite 6.7.2 Reference Guide v4 11/22/2011

    Table of Contents I. ACCESSING TEAMSITE .....................................................................................................................................1CHECKING INTERNET EXPLORER SETTINGS....................................................................................................................1SYSTEM REQUIREMENTS ................................................................................................................................................1WEB ADDRESSES............................................................................................................................................................3II. INTRODUCTION TO THE TEAMSITE ENVIRONMENT ............................................................................4LOGGING IN TO TEAMSITE .............................................................................................................................................4CONTENTCENTER HOME BASE.......................................................................................................................................6HOW DO I...................................................................................................................................................................7MY WORKAREAS...........................................................................................................................................................7MY FAVORITES ..............................................................................................................................................................8FINDING YOUR FOLDER IN TEAMSITE ............................................................................................................................9SETTING YOUR FOLDER AS A FAVORITE ......................................................................................................................10NEW CONTENT FORMS .................................................................................................................................................12SEARCH ........................................................................................................................................................................13MY WORK IN PROGRESS ..............................................................................................................................................13DESCRIPTION OF ICONS ................................................................................................................................................14III. WORKING IN TEAMSITE .............................................................................................................................15EDITING AND PUBLISHING AN EXISTING WEB PAGE ....................................................................................................15FORMATTING A WEB PAGE ..........................................................................................................................................17INSERTING A TABLE .....................................................................................................................................................18IMPORTING AN IMAGE OR FILE INTO TEAMSITE ...........................................................................................................19INSERTING AN IMAGE ONTO YOUR PAGE ......................................................................................................................20INSERTING A HYPERLINK TO A TEAMSITE PAGE OR IMPORTED FILE ............................................................................22INSERTING A HYPERLINK TO AN EXTERNAL WEBSITE..................................................................................................22INSERTING AN ANCHOR................................................................................................................................................23CREATING AND PUBLISHING A NEW WEB PAGE USING A FORM ..................................................................................24UNDERSTANDING THE CREATING AND SAVING PROCESS .............................................................................................29CREATE/EDIT A PAGE ...................................................................................................................................................29STAGING WORK IN PROGRESS..................................................................................................................30LEFT NAVIGATION BAR................................................................................................................................................31CREATING A CUSTOM OR CLINICAL SERVICES LEFT NAVIGATION BAR .......................................................................31INSERTING A CUSTOM OR CLINICAL SERVICES LEFT NAVIGATION BAR.......................................................................34RIGHT-PANEL DISPLAY BAR.........................................................................................................................................35CREATING A RIGHT-PANEL DISPLAY BAR ....................................................................................................................35IV. MANAGING THE DEPARTMENT FOLDER................................................................................................39CREATING A NEW FOLDER ...........................................................................................................................................39MOVING FILES .............................................................................................................................................................39DELETING FILES ...........................................................................................................................................................39DELETING FOLDERS .....................................................................................................................................................41UNLOCKING FILES........................................................................................................................................................41HELP AND SUPPORT......................................................................................................................................................42LOGGING OUT ..............................................................................................................................................................42APPENDIX A: TIPS FOR ADVANCED USERS...................................................................................................43EDITING THE CONTENT BODY ......................................................................................................................................43WEB FORMS .................................................................................................................................................................43ASP.NET AND CODE BEHIND PAGES .............................................................................................................................43COPYING FILES WITHIN A BRANCH..............................................................................................................................44APPENDIX B: IMAGE EDITING ..........................................................................................................................47GRAPHIC EDITING SOFTWARE ......................................................................................................................................47APPENDIX C: SAMPLE PAGES............................................................................................................................48

  • I. ACCESSING TEAMSITE

    Checking Internet Explorer Settings

    There are two very important settings on your Internet browser that you should check to ensure that TeamSite works properly on your machine. Please complete the steps below to prevent you from running into problems while working in TeamSite. Check the Internet Options to be sure that it checks for newer versions of stored pages every visit to the page.

    1. Open Internet Explorer. 2. Click TOOLS on the Internet Explorer menu bar. 3. Choose INTERNET OPTIONS. 4. On the GENERAL Tab, click the SETTINGS button under TEMPORARY INTERNET

    FILES. 5. Under CHECK FOR NEWER VERSIONS OF STORED PAGES choose EVERY VISIT TO THE

    PAGE. 6. Click OK twice.

    Remove any pop-up blockers you have turned on for the Internet. TeamSite uses pop-up windows while you are working. When you have a pop-up blocker turned on, like Google or Yahoo, it prevents TeamSite from working properly.

    TIP When working in TeamSite, do not use the buttons on your browser. In order to keep things working properly, use the buttons within TeamSite to navigate.

    System Requirements

    TeamSite is designed to run smoothly on a standard Partners computer. If you are using a non-Partners computer, such as your own personal laptop or pc at home, you will need to be sure your machine meets these requirements: OPERATING SYSTEM:

    Windows XP SP1a Windows 2000 Mac 10.3

    Must be one of these.

    BROWSER: Windows 2000: IE 6.0 SP1, IE 5.5 SP2, SP3, Mozilla 1.5 Windows XP SP1 IE 6.0 SP1 Mac 10.3: Mozilla 1.6

    Must be one of these. Other Requirements General Knowledge of Using the Internet Understanding url, web address, where to look for the web address, how to differentiate from a TeamSite address and a live Internet address. How to search for information.

    1

  • URL Abbreviation of Uniform Resource Locator, the global address of documents and other resources on the World Wide Web. The first part of the address is called a protocol identifier and it indicates what protocol to use, and the second part is called a resource name and it specifies the IP address or the domain name where the resource is located. The protocol identifier and the resource name are separated by a colon and two forward slashes.

    For example, the URL below points to a file at the domain brighamandwomens.org. It specifies a Web page that should be fetched using the HTTP protocol, meaning using a program such as Internet Explorer:

    http:// www.brighamandwomens.org/stuff.aspx Installing the new Visual Formatter (WYSIWYG Editor) The first time you edit or create a file using the new version of TeamSite, you may need to install the Tiny MCE Visual Formatter. This is the program that allows you to edit the contents of your pages. If you need to install this, the program will automatically prompt you to do so. Click the Install Now button at the bottom of the screen to allow the program to be installed on your computer. You may be prompted a second time. Click Yes. When the installation is complete, click the Close button.

    2

  • Web Addresses

    TeamSite Server (WorkArea) http://teamsite.partners.org

    Internet Live Server http://www.brighamandwomens.org

    Important Web Addresses

    Work Area: http://teamsite.partners.org Internet Site: http://www.brighamandwomens.org

    Training: http://is.partners.org/training Web Policies: http://www.brighamandwomens.org/training/WebEditorResources/default.aspx

    From BWH PikeNotes: http://www.bwhpikenotes.org/Departments_Centers/Marketing/policy.aspx

    3

  • II. INTRODUCTION TO THE TEAMSITE ENVIRONMENT

    Logging in to TeamSite

    1. Open the Internet to the TeamSite WorkArea: http://teamsite.partners.org. 2. Enter your username and password. 3. Make sure that you select Partners as the domain. 4. Click LOGIN.

    4

  • ContentCenter Home Base By default, you will be logged into the Standard view. Most Web Editors use this version of TeamSite. This is the home base for all TeamSite features.

    If, however, you have used Professional view in the past and wish to continue doing so, you can switch back and forth between the two views by clicking the CCPro link at the top of the screen.

    5

  • ContentCenter Home Base

    SEARCH allows you to perform a simple or advanced search for a specific file. (Not being used at BWH.)

    HOW DO I is the built-in Help section, providing one-click access to context-sensitive help.

    TASKS is not being used at BWH.

    WORK IN PROGRESS helps you track the files you are currently working on and have not yet published.

    NEW CONTENT FORMS allows one-click access to form choices.

    MY WORKAREAS lists those branches that you have access to edit.

    MY FAVORITES allows you one-click access to your most commonly used files and folders

    6

  • How Do I

    TeamSite has a terrific Help feature. From the CONTENTCENTER HOME page, you will find links to Help for many common functions under the HOW DO I section. Click any link to find specific instructions for performing each task. A new window will open with the information. When you have clicked on one of the Help topics you will see a link for CONTENTS, INDEX, and SEARCH.

    Additionally, TeamSite has built-in contextual Help sections to guide you through the various steps you will be completing. Wherever you are in TeamSite, a circled question mark will indicate that additional Help is available.

    My WorkAreas

    Under MY WORKAREAS you will see only the WorkAreas that you have rights to edit. Most BWH departments are assigned access to a folder under the BWHInternet WORKAREA. To see your complete list of files and folders, click BROWSE next to your WorkArea.

    7

  • Access to Folders You will be able to tell more quickly which folders you can edit within a branch; folders you do not have access to will be grayed out. If a folder you should be able to access is grayed out, please open a Help Desk ticket and the support team will resolve the issue.

    My Favorites

    If there are files or folders you frequently edit, you can add them to the MY FAVORITES section for convenient access. This will prevent you from having to navigate through your WORKAREA each time to get to them. We also recommend that you set your folder as a favorite rather than navigating through the entire

    folder list in the BWHInternetContent WorkArea. The ADD TO MY FAVORITES button is at the top, right-hand corner of the folder screen.

    TIP My Favorites is just another pass way to the same file/folder on the BWHInternetContent WorkArea.

    8

  • When you submit a page, you are given an option to ADD TO MY FAVORITES. If you put a checkmark in that box, the file will be added to MY FAVORITES on the CONTENTCENTER HOME page.

    You can also add a file to your favorites from your WORKAREA or WORK IN PROGRESS section. There is a FILE ACTIONS MENU next to each of your files. Click the drop-down menu and select ADD TO MY FAVORITES.

    Finding Your Folder in TeamSite

    Before you start looking for your folder you will need to know where your folder lives. All user folders live in one of these top folders:

    About_BWH Departments_and_Services Diseases_and_Conditions Patients_Visitors Research Medical_Professionals

    9

  • Prior to the training, you should have received the folder path to your site. Example: /Departments_and_Services/medicine/services/cvcenter/ This path shows you that you need to look inside the folder /Departments_and_Services/, then inside the /medicine/ folder, and likewise then inside /services/ folder and then you will arrive at your folder /cvcenter/.

    Setting Your Folder as a Favorite

    The first time you access a new department folder in TeamSite, you will need to do so through the WORKAREA. It is strongly recommended that you set your department folder as a favorite; otherwise, you will have to page through a very complex list of department folders in the BWHInternetContent WORKAREA. When you click BROWSE next to your WorkArea on the CONTENTCENTER HOME page, you will be taken to your WORKAREA. From the WORKAREA, click through to your folder and there you will find all your files and folders. If you do not see your department folder listed please contact the Marketing Department. To add your department folder to your Favorites, click Add to my Favorites.

    To return to the CONTENTCENTER HOME page, click the HOME link.

    10

  • From now on, you can go directly to your department folder by selecting it from MY FAVORITES

    Inside Your Folder Each departmental folder contains important folders such as Images, NavigationFiles, RightPannels. Moving around in the folders/files use the Breadcrumbs trail to go back to the structure instead of Back Button on the internet browser. To find a file for editing, first look on the Internet at the live site (not TeamSite) for the page that needs updating. It is easier to look at the pages online. Look at the url (address) and it will give you an idea of where in TeamSite it is. TIP Moving files within the folder might result in a number of broken links on

    your site, customers bookmarks, and/or on another site that links to your page.

    11

  • New Content Forms

    The NEW CONTENT FORMS section shows you the list of forms you have access to use when creating new pages. All pages are created using a form.

    DEPTBLANK: This form should be used to create pages other than your home page. This page does not allow you to add a right-panel display bar. DEPTHOME: This form should be used to create your home page. Home pages should be titled DEFAULT. You may also use this page to create secondary pages with a right-panel display bar. Clinical departments are required to include the CONTACT US box, a right-panel display option, on their department home page. DEPTNAVIGATION: This form is for clinical departments to create a custom left navigation bar. All left navigation files should be saved in the NAVIGATIONFILES folder. DEPTRIGHTPANEL: This form allows you to create a custom right panel for your home page. This includes the CONTACT US, right PROMO BOX, and FOR MORE INFORMATION (Related Links) options. The CONTACT US box should appearthe department home page and is required for clinical departments. All rigpanel files should be saved in the RIGHTP

    only on

    ht

    ANELS folder.

    MKTMICROSITE: This form is available for use only by the Marketing department.

    NONCLINICALNAVIGATION: This form is for non-Clinical departments to create a custom left navigation bar. All left navigation files should be saved in the NAVIGATIONFILES folder. To view some examples of pages created with forms, see Appendix C.

    12

  • Search

    This feature is not used at BWH.

    My Work in Progress

    If you edit a file and you are not ready to publish it to the web, you can save the file as a work in progress.

    After you generate your file, click NEXT. This will bring you to the SELECT NEXT ACTION page.

    Use the NEXT Action

    drop-down menu to select KEEP AS WORK IN PROGRESS.

    Choosing KEEP AS WORK

    IN PROGRESS adds the file to the MY WORK IN PROGRESS section on the CONTENTCENTER HOME page.

    13

  • Description of Icons

    The following icons are used in file listings throughout TeamSite:

    The file is not locked or restricted in any way. It has not been modified since its last submission to the content area. You and others can modify the file.

    The file has been modified; it differs from the most recently submitted and approved version in the content area. The file is not locked; you and others can modify it.

    The file is locked by you but has not been modified; you can modify it and submit it.

    The file is locked by you and you have modified it. You can continue to modify it.

    The file is locked by someone else but has not been modified. You cannot modify it.

    The file is locked by someone else and has been modified. You cannot modify it.

    The file is private and is not available to other users.

    The file has been deleted, but the deletion has not been submitted and approved.

    The file is missing. When a file has been added to My Favorites, but later the file is deleted, the bookmark to it remains in My Favorites. Files from the My Favorites folder are not automatically deleted if you delete from the content area.)

    14

  • 15

    isting Web Page

    r

    SE next to your RITES, select your department

    folder and click the file name.

    . When your page opens you will see a VISUALPREVIEW toolbar.

    e

    lected in the General Page Information section before if

    w.

    fter closing the generated preview, you will be back to your original page

    n

    7. Leave the Next Action as SUBMIT which will automatically publish the page. If you

    are not finished editing a page, you can save the file as a work in progress by selecting KEEP AS WORK IN PROGRESS from the drop-down menu. Click NEXT.

    III. WORKING IN TEAMSITE

    Editing and Publishing an Ex

    In order to edit your existing web pages, you may need to first BROWSE youFAVORITES for all your existing files. You 1. Click BROW

    FAVO

    23. Click EDIT.

    4. Onc

    you edits are complete, click the GENERATE button to Save

    r edits. Your page will open in a new window.

    TIP If an existing page uses a Custom Subtitle, make sure that Yes is segenerating. Due to a form change, Custom Subtitles may be lost

    this selection isnt updated the first time the page is edited. 5. After generating, close the page by clicking the X in the upper right-hand corner of

    the windo . A

    6template/page. If you are finished with your edits, click NEXT on the bottom right-hand side of the window. If you need to continue editing your page therepeat steps 5 and 6.

  • 16

    8. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want

    your page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    9. Click NEXT. 10. On the SUBMIT TO LIVE SITE OR SUBMIT TO

    STAGING page, enter comments regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    11. Click NEXT.

    12. On the next page you should see SUBMISSION

    SUCCEEDED. Click DONE.

    13. Youll be back at your folder at the ContentCenter. If you close the window, you will close TeamSite!

  • 17

    Formatting a Web Page

    TeamSite has a VISUALFORMAT toolbar that allows you to format your web pages using rich-text; commands and buttons like those in Microsoft Word. Formatting can be done directly in a large editing box using icons for features such as:

    Bullets Spell Check Insert a Picture ALT tag Table Cut Paste Copy Find Undo Font Anchors

    VisualFormat Toolbar

    While editing, place your mouse over any button for a description of its function. You can also use the Help tool for more information.

    Content entered into the Main Body Content Information field appears as it will on the actual Webpage. Although space is allotted for them the actual photos will not display. To view the page as it will appear, you will need to preview the page. Content that is cut and pasted into the Main Body Content from another application such as Microsoft Word, Excel or Internet retains some of the original text formatting, and ultimately adds additional code behind the scene. This practice does not coincide with the BWH style guide. Using the Paste From Word icon and the Remove Formatting icon (looks like an eraser) does not strip the text of all of the formatting. It is recommended that you do not use these buttons to import content. For the best success, use the NotePad application (Start/All Programs/Accessories in Windows), it will strip all the text of formatting and your content will look like the rest of the BWH web site.

    TIP Do not copy from Word files that have been saved as HTML. This code is not compatible with TeamSite and you will encounter problems saving your page.

    TIP Double-spacing is the default setting for web editing programs. If youd like to single-space your text, hit Shift + Enter on your keyboard.

  • 18

    Inserting a Table

    1. Click the INSERT/EDIT TABLE button on the VISUALFORMAT toolbar.

    2. Determine the number of rows and columns you want, the width youd like the table to span on the page, and the border size (0 or 1 is usually sufficient), as well as the border color (black is standard for the BWH site).

    3. Use Advanced tab only if you are a CCPro user of TeamSite.

    4. Click INSERT and enter your information into the table.

    TIP When entering your content into the table, you cannot use TAB to move between cells. Use your arrow keys or your mouse to navigate in the table.

    Follow these steps to adjust the properties of the table:

    1. Left-click the table and select the INSERT/EDITTABLE icon.

    2. Adjust your columns, rows, width, and border as necessary.

    3. Specify changes and click INSERT.

    TIP Do not use fixed widths for tables. Setting a table too wide can cause the design container of a page to break. Table sizes should be rendered in percentages instead.

  • 19

    Importing an Image or File into TeamSite

    In order to add an image or link to a file on your web pages, you must first import the image or file into TeamSite. As with other naming in TeamSite, image and file names should not include spaces or odd characters, and names should be kept short. Before importing, make sure the image and file names use only letters, numbers, or underscores. Images should be edited before they are imported see APPENDIX B. Example of file name: logo.gif or foot_ankle.jpg To import an image or file: 1. From your WORKAREA, click your department folder and select the folder in which

    youd like to store the imported image or file, e.g. IMAGES. (If you do not have an images folder, follow the instructions in this reference guide for Creating a New Folder.)

    TIP The preferred and supported file types for images are .jpg or .gif. Other file types may be too large and your pages may take more time to open.

    2. Click the IMPORT FILES link at the top of your file list.

    3. When you are importing files for this first time, you will be prompted to install and run

    a temporary file. Put a checkmark next to ALWAYS TRUST CONTENT FROM INTERWOVEN, INC. Click YES.

    4. When the

    TEMPORARY FILE LOCATION

  • 20

    window opens, click OK. (This will only happen when you are importing files for this first time on the computer.)

    5. Navigate to the location where your file is stored either by selecting the folder from the list or by clicking the drop-down menu next to the Add button. (You cannot access files from My Network Places.)

    6. Select the file(s) you would like to import and click the

    ADD button. You should now see your selected files in the FILE PATH box.

    TIP To save time, you can select several files at one time. Hold Ctrl key down and click files with mouse.

    7. Click IMPORT.

    8. To SUBMIT your image or file so you can use it on your web page, click NEXT. 9. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want your

    page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    10. Click NEXT. 11. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING page, enter comments regarding

    the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time. Note, in order for you to see your newly imported image in a TeamSite template, your image first has to be submitted to live LIVE SITE.

    12. Click NEXT.

    13. On the next page you should see SUBMISSION SUCCEEDED. Click DONE.

    Inserting an Image onto your Page

    1. Click the location on the page where you would like to insert the image.

    TIP To format text to wrap nicely around an image, enter the text on the page first. Click the cursor at the beginning of the paragraph where you want the image to appear, insert image and select the preferred

    alignment.

  • 21

    2. Click the INSERT/EDIT IMAGE button on the VISUALFORMAT toolbar. 3. Click the Browse button next to IMAGE URL to bring up the TEAMSITE folders.

    4. Navigate to the image you have imported. Click OK. In this window you should be

    able to view your image in the preview.

    5. Enter the title of the image in the IMAGE DESCRIPTION AND TITLE fields. (These are mandatory fields. It assists users with disabilities. For example, if a person has a reader on their machine, it will tell them the name of the image when they hold their

    cursor over it.)

    6. Click the Appearance tab. 7. Click the drop-down menu

    to select the alignment of the image on the page. NOTE: Use only the LEFT or RIGHT options, and only if you wish your text to wrap around and below the image.

    8. Leave BORDER set to 0. Image borders should not be used on the BWH internet.

  • 22

    9. In order to add some breathing room between the image and the text, enter a 7 in

    the Horizontal Spacing field, and a 1 in the Vertical Spacing field. 10. Click INSERT. The ADVANCED TAB IS FOR CCPRO USERS ONLY.

    Inserting a Hyperlink to a TeamSite Page or Imported File

    When you create new pages using TeamSite, you will need to link them to an existing page. You may also want to create a link to another file you have previously imported, such as a Microsoft Word document or an Adobe Acrobat file. 1. Type the text youd like to use as the link and highlight it.

    2. Click the INSERT/EDIT LINK button on the VISUALFORMAT toolbar.

    3. Click the BROWSE button to search your list of existing TeamSite pages and imported

    files.

    4. Select the file you would like to link to. 5. In the TARGET field choose SAME WINDOW (_SELF). If you are linking to a site outside

    of brighamandwomens.org then choose NEW WINDOW (_BLANK). This opens a new browser window for the user. See below. Click OK again.

    TIP Remember to test your links by generating and previewing the page.

    Inserting a Hyperlink to an External Website

    On your pages you can link to various related website addresses outside of the Brigham and Womens pages, with the exception of for-profit web pages generally ending in .com; they may not be aligned with the hospitals mission.

  • 23

    1. Type the text youd like to use as the link and highlight it.

    2. Click the INSERT/EDIT LINK button on the VISUALFORMAT toolbar.

    3. Make sure the TYPE: is HTTP:

    4. Type in the full website address in the LINK URL: field. Be sure to include the HTTP:

    In the TARGET FRAME: field, click the drop-down menu and choose NEW WINDOW.

    5. Click OK.

    TIP If you want to create a link for an email address, type MAILTO: followed by the email address in the LINK URL: field.

    Inserting an Anchor

    An anchor allows the user to link to other places on the web page without scrolling. This is particularly helpful when viewing a very lengthy page. Anchors are also used to link the user back to the top of the page if the content is long. 1. Type the text youd like to use as the link clicking on this will link to other areas on

    the same web page.

    2. Next, put a cursor next to where you want to place the anchor. Click the INSERT/EDIT ANCHOR button on the toolbar.

    3. Type a name in the Anchor name box and click INSERT.

    4. Highlight the text you typed in Step 1 and click INSERT/EDIT LINK on the toolbar.

    5. In the LINK URL field, type # followed by the name you gave your anchor.

    6. Click OK.

  • 24

    7. Preview your page.

    Creating and Publishing a New Web Page Using a Form

    Under NEW CONTENT FORMS on the CONTENTCENTER HOME page you should see a list of available forms to use when creating new web pages. Or use the New Form Entry button once you are in your folder in TeamSite. 1. In your WorkArea (your folder), select the area or folder where you want to create a

    new content template.

    2. Select NEW FORM ENTRY button and choose the type of template you want to create. DEPTHOME is primarily used for your home page. The title of your home page should be called DEFAULT. You will only have one home page. Additional pages are often created using DEPTBLANK. See Appendix C for examples.

    3. The first time you open a form to edit the content on the page, you may be prompted to install the VISUALFORMAT software. (This may have to be done on each machine you plan to use to edit pages.) A pop-up window will appear prompting you to install. Click INSTALL NOW at the bottom of the window and follow the instructions for installation. If you are not prompted to install the VISUALFORMAT software, you can begin editing

  • 25

    your page.

    Field Information Description PLEASE SELECT THE FOLDER YOUD LIKE TO SAVE TO*

    This appears only for Web Editors with access to more than one department folder. Select the department folder from the drop-down listed. You will need to do this only when you first create a new file.

    RELATED DEPARTMENT* Clinical departments should select the appropriate option from the drop-down menu. Other departments should select other Non-Clinical.

    SEARCH KEYWORDS & PHRASES* Insert key words or phrases for search engines like Google to locate. Separate words or phrases by commas.

  • 26

    PAGE DESCRIPTION* Insert a brief but descriptive summary of the page contents. This will display under the title after a search to help people decide whether or not to visit your page.

    SEARCH TITLE* Insert the title as you would like it to read when displayed by the search engine. This will also display as the Title Bar in the browser window.

    FEEDBACK NAME* Contact name that will appear at the bottom of the page

    FEEDBACK EMAIL* Email address of the contact PAGE TITLE (ORANGE HEADER) * Repeat the name of your division, for your

    home page. For other pages, enter the section name or page title that reflect the left navigation or the title for the page. This title will also display as a Breadcrumb Title.

    CHOOSE A LEFT NAV FILE* Select the default file navigation.xml or a nav file you have created. NOTE: If you have access to more than one department folder, make sure to select the navigation file(s) located in the correct folder.

    CHOOSE A RIGHT PANEL FILE* Select the default file RightPanel.xml or a file you have created. NOTE: If you have access to more than one department folder, make sure to select the file(s) located in the correct folder.

    TIP Fields with a * are required fields.

    4. On the form page, the SEARCH INFORMATION. These fields are extremely important, as they will determine how well your page will turn up in both internal and external search engines.

    a) RELATED DEPARTMENT: Choose the department most closely related to your page.

    b) SEARCH KEYWORDS AND PHRASES: These should be words and phrases

    related to your pages contents. You may wish to keep a file with common keywords your department would wish to place on every page. Example: (For a page about menopause): Example: stages of early menopause symptoms treatment, hot flashes, information about on menopause and hot flashes information, signs of premature pre post peri menopause perimenopause symptoms Brigham and Womens Hospital Boston

    c) PAGE DESCRIPTION: This should be a brief summary of the page in plain

    English. Many search engines print the contents of the Description field within

  • 27

    ternet.

    the Search Results. Example: What is menopause? Learn about the early symptoms of menopause such as hot flashes or the different stages of menopause such as perimenopause. Get menopause treatment information and more at Brigham and Womens Hospital.

    d) SEARCH TITLE: The contents of this field will appear at the top of the browser

    when the page is loaded. They are often the most important field considered by search engines, so be sure that your title accurately reflects the contents of your page. It should also include Brigham and Womens Hospital. Example: Menopause Symptoms, Treatments and Stages of Menopause Brigham and Womens Hospital

    5. Next, enter the GENERAL PAGE INFORMATION as instructed by the field descriptions. The contents of these fields appear on the page itself. Feedback name and feedback email will appear at the bottom of the page as part of the Send Feedback to section. The Title and Subtitle you enter here will appear at the top of the pages contents.

    TIP Always check with any individuals who will be entered as a contact in the Feedback field. Make sure to obtain permission to publish their e-mail address on the in

    6. Click in the FULL BODY field under the MAIN BODY CONTENT INFORMATION section to

    enter your page content. When you click the field the VISUALFORMAT toolbar will appear.

    7. Click the GENERATE button. (This saves the file as well.)

    8. Click the BROWSE button and navigate to the folder where you would like to save

    your new page.

    9. Type in the file name for this page. IT IS MANDATORY TO NAME YOUR HOME PAGE DEFAULT.ASPX.

    TIP Do not use spaces, ampersands, or special characters when naming your files. Only letters, numbers, or underscores. For example: MyFile. Do not add an extension such as .aspx. TeamSite assigns the appropriate file extens

    ion.

    10. Click OK. Then click OK again. 11. Your generated page will open in a new window. Review the page and click the X in

    the upper right-hand corner of the window to close.

  • 28

    12. Click the NEXT button on the bottom right-hand side of the FORMSPUBLISHER page. 13. Leave the Next Action as SUBMIT (which will automatically publish) and click NEXT

    again. If you are not finished editing a page, you can KEEP AS A WORK IN PROGRESS. Then, click NEXT.

    14. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want your

    page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    15. Click NEXT. 16. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING

    page, enter comments regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    17. Click NEXT. 18. On the next page you should see SUBMISSION

    SUCCEEDED. Click DONE.

  • 29

    Understanding the Creating and Saving Process

    Create/Edit Page Save Generate Submit & Publish

    First save creates the DCR, named automatically by TeamSite

    DCR Data Capture Record

    Form Saves changes to web page

    Page can now be viewed online.

    On first generate, Editor names the page, MyPage, and TeamSite adds extension, such as .aspx

    MyPage.aspx

    Create/Edit a page

    Click EDIT to make changes in an existing page or NEW to create a new page. When you do this, you are editing a form. You know this because youll see pre-defined fields in which you enter your content. You enter or modify content for the .aspx page by filling in the form. (.aspx is the extension for an Active Server Page created with asp.net. The .aspx page is your actual web page.) Save Data Capture Record When you click save, you are saving a Data Capture Record (DCR). If you are creating a new page, a DCR is created. If you are editing an existing page, the DCR was previously created. (This is not the Web Page!) Generate After you save your edits, you must now tell the system to use that data to generate a page. Clicking Generate combines the content you entered in the form with a presentation template. (This is the Web Page!) Submit & Publish The generated output file must now be published to the live web site. After the file is generated, you need to publish the resulting .aspx web page (or other content such as images or Adobe files) by clicking SUBMIT.

  • 30

    Staging Work in Progress The staging area of TeamSite contains multiple versions of content. Every time a page is submitted to Keep as Work in Progress or staging from the workarea, a new version is created and the old one is retained. To make this idea easier to understand, let us consider the following case: Case: The Correct Department

    The Correct Department creates a page in their TeamSite called about_us.aspx. This page is created and submitted to staging but is not submitted to the live site yet. The act of Generating is saving your created page/edited page in staging.

    The next day another employee of the Correct Department, with permission to access TeamSite, decides he doesn't care for the appearance of the new page, and makes several changes which he then submits to staging.

    On the third day, the director sees the changes made by the employee on day two, and emails him to let him know the previous version was more appropriate. The employee agrees to make the page look like it did on day one. Due to the fact the staging area retains all versions submitted to it, the employee simply had to select the previous version to revert to the older look. Without version control, the employee would have had to completely recreate the first version.

    TIP - As long as you are careful to submit your work to staging frequently (especially after making drastic changes), you can easily utilize the version control feature of TeamSite (located under File Actions) . It is important to

    understand that if you do not submit your work to the staging area, a new version will not be created. A good habit to practice would be to submit changes to staging as soon as you make an edit. Unless a previous version is manually selected, the live web site will always display the most recent version of content submitted to live site.

  • 31

    Left Navigation Bar

    Each TeamSite branch is set up with a folder called NavigationFiles. The default left navigation file that is stored within that folder is named Navigation.xml. Editors may select the Navigation.xml file if they wish to include the standard left-navigation bar on their departments pages. Editors also have an option to create department-specific left navigation files. Steps that need to be completed are: 1) Create the navigation file, and 2) Add it to each page you want it to appear on. You

    can create more than one navigation menu to use on your various web pages. TIP It is strongly encouraged that the links on your custom nav bar file point only to pages within your own section. Links to other departments, and especially to other websites, are likely to be broken (because of pages moving, expiring, changing names) and need updating more frequently. The purpose of the menu should be to guide users through your website.

    Creating a Custom or Clinical Services Left Navigation Bar

    Editors are able to create department-specific left navigation file(s). The appearance of the menu will remain the same; however, the links can be altered to reflect content of your section rather than the default content. NOTE: Research departments should build a "Non-clinical" navigation.

  • 32

    1. Under NEW CONTENT FORMS on the CONTENTCENTER HOME page, be sure your

    WorkArea is selected from the drop-down menu. Clinical Departments: Click NEW next to the form DEPTNAVIGATION. Non-clinical Departments: Click NEW next to the form

    NONCLINICALNAVIGATION

    2. ENTER THE LEFT NAVIGATION HEADLINE 3. Enter the DESCRIPTION and BROWSE to select the department home page,

    DEFAULT.ASPX. Clinical Departments: There are 6 hard-coded links that cannot be modified.

    You will begin at the bottom of the list Non-clinical Departments: You can start at the top of the link box.

    4. On the link toolbar, click the + sign to create a new link which can be

    either a heading or submenu. A heading is larger font, aligned left. A submenu is slightly smaller font, indented underneath a Heading.

    5. Enter the link information.

    If you want the text to be a submenu, put a checkmark in the box next to YES I WANT A SUBMENU. NOTE: The link that opens the sub-links list (a.k.a. submenu) must have # listed as the URL. It cannot link to an actual page.

    Enter the text that will appear for the link in the DESCRIPTION field.

    Type the full web address in the URL field or browse to an internal page.

    If the URL is pointing to a BWH web address, select INTERNAL. This will open the web page in the same window. If the URL is pointing to a non-BWH web

  • 33

    address, select EXTERNAL. This will open the link in a new window. Click OK.

    Select the appropriate department if you would like a link to the STAFF PHYSICIANS LISTING.

    11. To add another link, click the + sign on the link toolbar. Repeat step 4 above.

    TIP You can change the order of your links by choosing the up or down arrow from the link toolbar. To delete a

    link, click the X next to it.

    12. When you have finished creating all your links, click GENERATE. Navigate to your branch and the NAVIGATIONFILES folder. All Navigation files should be saved in the NAVIGATIONFILES folder.

    13. Type in the file name. Do not include any file extension. TeamSite will automatically

    add the .aspx extension. Do not use spaces, ampersands, or special characters, only letters, numbers, or underscores. Click OK.

    14. Click OK again. (The generated file will display as plain text, however, it will

    appear as a nav bar on the pages where you have added it.)

    15. After you have reviewed the generated file, click CLOSE.

    16. Click NEXT to submit the file.

    17. Click NEXT again and another time click NEXT. 18. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want

    your page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    19. Click NEXT. 20. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING page, enter comments

    regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    21. Click NEXT. 22. On the next page you should see SUBMISSION SUCCEEDED. Click DONE.

    TIP If you put a checkmark in the Add to My Favorites box, the file will appear in your Favorites section of the ContentCenter Home page.

  • 34

    Inserting a Custom or Clinical Services Left Navigation Bar

    For each page you want your custom left navigation bar to appear on, you need to open and edit that page and add the navigation bar. When you have the page open, go to the section titled Left Navigation Information.

    1. Select the appropriate navigation file from the drop-down menu.

    2. Click GENERATE, this action saves your work. Your page will open in a new window. 3. After generating, close the page by clicking the X in the upper right-hand corner of

    the window.

    4. Click NEXT to submit the file.

    5. Click NEXT again.

    6. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want your page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    7. Click NEXT.

    8. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING page, enter comments regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    9. Click NEXT.

    10. On the SUBMISSION SUCCEEDED page, click DONE.

    TIP Any time you make a change to a link in your navigation menu file, you only need to edit the navigation file. Once you submit and publish the navigation menu file, the changes will update on all other pages.

  • Right-panel Display Bar

    Each department editor has the ability to create and edit a right panel display bar for the Home page. Typically, this right panel will provide visitors to the page a contact information box. In addition, five promo boxes can be added to highlight department-specific news and events. Promo boxes can include images and text and serve as links to other web pages. Promo boxes can be included on other pages, not just home page. Select the DEPTHOME form rather than DEPTBLANK to include promo boxes on any page. (Be sure not to name it default.aspx). Promo box images must be 80x80 pixels in size and should be e-mailed to the marketing department to be added to the dropdown menu. Steps that need to be completed for a Right-panel Display Bar are as follows: 1) Create the right-panel file, and 2) Add the file to your Home page.

    Creating a Right-panel Display Bar

    1. In your WorkArea (your folder), select RightPanels folder where you want to create the new panel.

    2. Select NEW FORM ENTRY button and choose DeptRightPanel option.

    3. Click Next.

    4. Enter the information for the RIGHT CONTACT INFORMATION BOX section.

    If you are building a Research page, select Yes at the top of the Dept Right Panel template. Researchers have a different Right Panel.

    SHOW STAFF PHYSICIANS FOR: Select OTHER NON-CLINICAL if that is applicable.

    35

  • 1. Enter the information for the PROMOBOXES section

    Select YES if you would like to add a promo

    box. Expand the promo box by clicking on the +

    sign Add the Promo Box TITLE, TEXT, IMAGE and URL.

    36

  • 2. If there are other sites that may be related or helpful, add them under the RELATED LINKS section.

    3. When you have finished entering your information, click GENERATE. 4. Navigate to save the file to your branch and the RIGHTPANELS folder. All Right

    Panel files should be saved in the RIGHTPANELS folder!

    5. Type in the file name. Do not include any file extension. TeamSite will automatically add the .xml extension. Do not use spaces, ampersands, or special characters, only letters, numbers, or underscores. Click OK.

    6. Click OK again.

    7. After you have reviewed the generated file, click CLOSE.

    8. Click NEXT to submit the file.

    9. Click NEXT again. 10. Click NEXT again.

    11. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want

    your page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    37

  • 12. Click NEXT.

    13. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING page, enter comments regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    14. Click NEXT. 15. On the next page you should see SUBMISSION SUCCEEDED. Click DONE.

    Inserting a Right-panel Display Bar The Right-panel Display Bar can be added to your department Home page as follows: 1. Open the department Home page (DEFAULT.ASPX).

    2. Go to the RIGHT PANEL INFORMATION section and select the appropriate file from the

    drop-down menu.

    3. Click GENERATE. Your page will open in a new window. After reviewing, close the

    page by clicking the X in the upper right-hand corner of the window.

    4. Click NEXT to submit the file.

    5. Click NEXT again. 6. Click NEXT again.

    7. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want your

    page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    8. Click NEXT.

    9. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING page, enter comments regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    38

  • 39

    you

    10. Click NEXT.

    11. On the SUBMISSION SUCCEEDED page, click DONE.

    TIP Any time you make a change to your right-panel display file, you only need to edit that file. Since the link to your Home page has already been established, it will update automatically once submit and publish the right-panel display file.

    IV. MANAGING THE DEPARTMENT FOLDER

    Creating a New Folder

    1. From your WORKAREA, navigate to your department folder and click NEW FOLDER.

    2. When prompted, enter the name of the new folder. (Do not use spaces, ampersands, or special characters when naming your folders. Only letters, numbers, or underscores.)

    3. Click FINISH.

    Moving Files

    If for any reason you need to move files, please contact the Marketing Department.

    Deleting Files

    1. Next to each of your files in your WORKAREA, there is a File Actions drop-down menu. Click the drop-down menu next to the file youd like to delete.

    2. Select DELETE.

    3. On the next screen, change the DELETE OPTIONS: to DELETE.

  • 40

    4. Click NEXT to complete the deletion.

    5. Click NEXT again.

    6. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want your page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    7. Click NEXT.

    8. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING page, enter comments regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    9. Click NEXT.

    10. On the SUBMISSION SUCCEEDED page, click DONE.

  • 41

    Deleting Folders

    1. Click the drop-down menu next to the folder you would like to delete from your WORKAREA.

    2. Select DELETE FOLDER.

    3. Click NEXT to complete the deletion.

    4. Click NEXT again.

    5. On the SELECT A WORKFLOW page, you should SUBMIT TO LIVE SITE if you want

    your page posted to the live site immediately. If you want to SUBMIT TO STAGING, which keeps the file on the staging server, select that option.

    6. Click NEXT.

    7. On the SUBMIT TO LIVE SITE OR SUBMIT TO STAGING page, enter comments regarding the changes you made to the page in the SUBMIT COMMENTS field. This will help you keep track of any changes you make to the page over time.

    8. Click NEXT.

    9. On the SUBMISSION SUCCEEDED page, click DONE.

    Unlocking Files

    Unlocking a file may be necessary when 2 or more editors share files within a branch and save the files as a Work in Progress instead of directly publishing them. In order to allow others to edit the file, the editor who last modified the file must unlock it.

    1. Next to each of your files in your WORKAREA, there is a File Actions drop-down menu. Click the drop-down menu next to the file youd like to unlock.

    2. Select unlock. Click YES to unlock the associated .dcr file. If you are unable to unlock a file please contact Marketing.

  • 42

    Help and Support

    Use the HOW DO I section of the TeamSite ContentCenter Home page. 1. Refer to the HELP section of TeamSite by clicking

    Help on the Utility Navigation Bar. 2. Use the contextual Help located in each section of TeamSite. Contextual

    Help is indicated by the yellow-circled question marks.

    3. Contact the BWH HELP DESK at (617) 732-5927.

    Logging Out

    When you are finished in TeamSite, make sure you log out. If you do not logout properly, you remain logged in for a period of time. 1. Click the LOGOUT button on the Utility Navigation Bar.

    Please e-mail reference guide edit suggestions to: [email protected]. Current versions of this reference guide and other IS Training guides are posted at: http://is.partners.org/training.

  • 43

    APPENDIX A: TIPS FOR ADVANCED USERS

    Editing the Content Body

    Do not copy from MS Word HTML, or use the MS Word Save as HTML or Convert to HTML options and then copy the code into the TeamSite editing window. This creates excess fonts, table cell sizes that may be larger than the content area of the site, and formatting that is very hard to clean up. Furthermore, it may crash your session of Interwoven, causing you to lose all your changes.

    If you find the Interwoven TeamSite HTML editing window cumbersome to work with, following is a list of HTML authoring tools that may be more useful:

    Textpad. Text-only authoring tool. Free, unlimited evaluation version available for download at http://www.textpad.com

    Macromedia Dreamweaver. Macromedia Contribute.

    If you choose to use an external HTML editor, you will still need to import the completed HTML into your template pages using the Interwoven window. You can use the View Source tool in the Interwoven TeamSite HTML editing window to do this.

    TeamSite does not allow for the use of external stylesheets, however, you may use any of the CSS styles defined in the BWH public site global stylesheet. You may refer to the global Brighamandwomens.org stylesheet at http://www.brighamandwomens.org/styles/styles.css

    As mentioned in the Inserting a Table chapter, do not use fixed width for tables. Setting a table too wide can cause the design container of a page to break. Table sizes should be rendered in percentages instead.

    Web Forms

    If you wish to make a form similar to the Contact Us form or the Request Appointment form, please submit a request through the Help Desk to involve either Partners IS or the Brigham Marketing Team. We will be able to assist you with any form functionality you require. Please DO NOT create forms within content files without first talking to Marketing or IS. For a sample of what we are referring to as a web form please visit: https://www.brighamandwomens.org/forms/contactus.aspx

    ASP.Net and code behind pages

    If you are familiar with ASP.Net and would like to create a page using Visual Studio .NET, please contact Partners IS. If you are planning to use a vendor who will be using ASP.NET or ASP, please contact IS or Marketing. It is very important that we know about any use of Dot Net code or classic ASP scripting, as it could seriously affect functionality of the templates.

  • 44

    Copying Files Within a Branch

    When creating multiple files within an existing section, some users prefer to save some time by copying existing files instead of creating new files individually. Copying a file in Interwoven, however, is not the same as copying a file on your computer. It requires one extra step. If you do decide to copy a file, you MUST make sure to manually change the DCR name associated with the new file. If you dont, when you edit one file, the same edits will be applied to the other file.

    ` To properly copy a file in Interwoven, you MUST complete ALL following steps:

    o Copy the file, making sure to add either the .asp (PikeNotes) or .aspx (Brighamandwomens.org) extension

  • 45

    IMPORTANT. Make sure that you perform these next steps, or both your new and your copied file will not work properly. Immediately edit the new file you just created. In the Edit ContentSection window, click Save As.

    In the Save Form As dialog box, change the file name, making sure to include iwDCR0_ as the first part of the file name.

  • 46

    NOTE: You must include iwDCR0_ as the first part of the file name. You may enter any alphanumeric combination after the underscore, provided that it (a) is unique (b) does not contain any spaces (c) does not contain any special characters such as #, ., / or $.

  • 47

    APPENDIX B: Image Editing

    Graphic Editing Software

    You will get the best results if you edit images before uploading into TeamSite. Cropping, shading correction, changing size/resolution and other image editing tasks are more easily handled using software specifically designed for editing graphics.

    TIP For the best balance, keep image widths to one third of the total page width, excluding the left navigation but including any right panel display.

    To download basic image tutorial, go to http://www.brighamandwomens.org/training/WebEditorResources/default.aspx Popular graphic editing software:

    Adobe Photoshop Macromedia Fireworks Photoshop Express (freeware)

    For purchasing details, contact the PHS Software Asset Administrator at [email protected] Recommended Software:

    Microsoft Office Picture Manager - This program is available on any Partners workstation. Go to http://www.brighamandwomens.org/training/WebEditorResources/interwoven/Microsoft_Picture_Manager.pdf for steps to install and use Microsoft Office Picture Mangager.

  • TeamSite GuideNovember 2011 | Issue No.01 | Department of Marketing and Planning

  • BWH Web Style Guide

    8

    The screen shots below are good examples of our template design. Take a look at each page and familiarize yourself with the new design and layout.

    The demo pages below can be viewed online at:www.brighamandwomens.org/training/WebEditorResources/design_samples/default.aspxwww.brighamandwomens.org/training/WebEditorResources/design_samples/DeptBlank.aspx

    Template Overview

    Department Blank(No Right Panel) Department Home

    (Includes Right Panel)

  • BWH Web Style Guide

    9

    Please note the new placement of the Left Navigation Header and Page Title (Orange Header).

    Each page on the site must have the Left Navigation Header and Page Title (Orange Header) field completed. NOTE: If your pages do not have a Page Title (Orange Header), the bread crumb navigation will be broken.

    Department / Page Titles

  • BWH Web Style Guide

    10

    Body Text

    Headline

    Hyperlink

    Bulleted List

    Caption Text

    Subhead

    TeamSite Text Formats

    Please take a look at the page below to familiarize yourself with the styles.

    Formatting Text

  • BWH Web Style Guide

    11

    Please look at the layout of your pages for alignment problems.When adding or editing images on your pages, pixel width is the most important number to keep in mind. If your images are wider than the template, you may see problems with your layouts.

    Image Standards

    Header Image666px wide x 200px high

    Department Blank(No Right Panel)

    Header Image460px wide x 200px high

    Department Home(Includes Right Panel)

    Content Image240px wide x 200px high

    General Content Images

  • BWH Web Style Guide

    12

    Each Department Home page automatically places the Quick Links section on your page. Quick links include Find a Doctor, Request an Appointment and Maps and Directions. Any Promo Boxes you create will display under the heading News and Features. Please keep your Promo Box text limited to six lines. Any more text may interfere with content below it.

    Right Panel for Department Home Pages

  • BWH Web Style Guide

    13

    Default / Home Page Management All home pages must be named default.aspx.

    Breadcrumbs will only work properly when: 1) All .aspx pages have the Page Title (Orange Header) field filled out. 2) All folders containing .aspx pages have a default.aspx page.

    File Management To save a new TeamSite file or edits to an existing file, you must click Generate before you submit the file to the live site.

    DO NOT uSE THE BuTTONS fOR SAvE AND SAvE AS. Those buttons will not save your work and dont need to be used.

    When naming your files, do not use ampersands ( & ) or any other special characters ( for example: &, ^, >, ?, #, ! ). use only letters, dashes, numbers, or underscores.

    DO NOT uSE SPACES in your file names (incorrect: clinical labs.aspx; Correct: clinical_labs.aspx).

    DO NOT DuPLICATE TEAMSITE fILES. Duplicating files will confuse the database that creates the page you see online and content may be lost.

    DO NOT MOvE fILES TO NEW fOLDERS. Moving files will result in broken links on your site for, users bookmarks, and/or on another site that links to your page.

    DO NOT STORE fILES IN TEAMSITE. Only files that are used on your site or linked to your site may be uploaded to the server.

    TeamSite and Microsoft Aplications DO NOT COPy/CuT TEXT from Microsoft Word or Excel and paste into TeamSite. This causes significant formatting

    errors. If you need to copy and paste, first paste into the NotePad application (in Windows: Start/All Programs/Accessories), and then copy and paste into TeamSite.

    DO NOT COPy TABLES fROM WORD OR EXCEL. Text copied directly from Microsoft Word and Excel carry code that will conflict with BWH web styles. you should build tables in the TeamSite template only.

    Image Management If you are planning to import an image, make sure you have read the tutorial on image editing

    (http://www.brighamandwomens.org/training/WebEditorResources/interwoven/image_editing.aspx).

    DO NOT IMPORT OvERSIzED IMAGES INTO TEAMSITE. Large file sizes will decreas the performance of your pages.

    Search Engine Optimization Include major keywords in your Search Title field.

    If you want people using search engines like Google, yahoo, or Bing to find yOuR page, place your keywords in this field. (Google looks more closely at the Search Title than at the meta keywords.) This is what will appear in blue on the Google Search Results page, and it appears in the top of the frame of the web page browser. Keep this to around 50-75 characters, including spaces. Separate multiple terms or phrases with a | (as in arrhythmia | ICD support group).

    TeamSite Dos and Donts

  • BWH Web Style Guide

    14

    Search Engine Optimization (SEO) Guidelines

    Search engine optimization (SEO) is the process of improving your ranking on Google and other search engines. SEO considers how search engines work and what people search for.

    Below are a few things you should keep in mind when creating content for BWH.org:

    META Title:This is the most important part of the META Data. Keep this to around 65 characters including spaces. It is OK to go a little over or under, based on phrasing that makes sense. In cases where you want to put in multiple terms or phrases, they should be separated with a | . There should be a space on either side of the | (as in arrhythmia | ICD support group). This is what will appear in blue on the Google Search Results page, and it appears in the top of the frame of the web page browser.

    META Description:This should contain the keywords from the META Title, verbatim if possible. It is more important that this make sense than it is to cram in keywords. Around 155 characters with spaces will work well. This is what will appear in black on the Google Search Results page. If it is too long, it will be cut off.

    META Keywords:Try to put in around eight keywords, separated with a comma and a space between each.

    Content:When writing page content, try to target the most important keyword(s) so that they are included on the page between 2% and 4% of the time. using the terms in the META Title is a good way to decide which terms to target. About 400 words is a good target length for the page; however, if you require more or fewer words to adequately present your content, it is OK to go above or below the target. Generally, any words that can be highlighted should be counted in the word count. (If there are words within a graphic on the page, do not count those in the word count; Google will not be able to read them.) On a page with 400 words, 8 uses of an individual targeted term is about right.

  • BWH Web Style Guide

    15

    Editorial Styles

    Font StyleThe TeamSite templates give you all the styles you need to create web content that looks consistent and loads quickly. We ask that you do not add any additional inline/nontemplated text styles to your HTML.

    Using inline/nontemplated text styles will: separate your content from the BWH site design make it more difficult to maintain style consistency across multiple pages make it more difficult for search engines to catalog your content make your pages load slower

    Below is an example of what an inline style looks like in HTML:Example Text Style

    Underlined Text:Underlining text may confuse your reader into thinking that word is an HTML link. If you want to make text stand out, we suggest you bold the text in question.

    Below is an example of an underline tag in HTML.underlined Text

  • BWH Web Style Guide

    16

    New Web Content Checklist

    When developing new content for the website, the content writer must first consider these issues.

    Part I

    1) Where on the site will this new page or sub-site exist? Also, where on the site will we link to this new page or sub-site? Please provide uRLs.

    2) Is this a new page (or series of pages) or a new sub-site? A sub-site has its own unique left navigation. There must be at least one page/URL for each bolded category below. Sub-pages within categories are optional. If you do NOT have info for ALL categories, then this can NOT be a sub-site.

    If this is a sub-site, please provide left navigation below. Indicate whether each link is a new page, new content to replace an existing page, or an existing page that should remain as is.

    [Home page; please provide name] About Us

    o [add sub-page if needed]o [add sub-page if needed]o [add sub-page if needed]

    Our Serviceso [add sub-page if needed]o [add sub-page if needed]o [add sub-page if needed]

    For Patientso [add sub-page if needed]o [add sub-page if needed]o [add sub-page if needed]

    For Medical Professionalso [add sub-page if needed]o [add sub-page if needed]o [add sub-page if needed]

    [Optional:] Education and Training [info on residencies, fellowships, etc.] Our Research [note: this often links to BRI pages]

    o [add sub-page if needed]o [add sub-page if needed]o [add sub-page if needed]

    Contact Us [Optional: If this sub-site is part of a larger site, then list larger site name here. for example, on the Osteoarthritis

    Center sub-site, since Osteoarthritis is within the Rheumatology site, we list Rheumatology, Immunology and Allergy here.]

    3) Do you have any photos we can use for these pages? Any upcoming photo shoots? Any other thoughts on photos to consider?

  • BWH Web Style Guide

    17

    Part II

    EvERy NEW page developed in TeamSite requires specific fields, and each field has certain parameters. Please provide this info for EvERy new page:

    Right panel: Is a right panel required for this page? (A sample right panel can be seen at http://www.brighamandwomens.org/Departments_and_Services/dermatology/.) o All right panels MUST include the Quick Links section at the top. This can NOT be edited. o Right panels also can include promo boxes. Provide text (maximum of 60 characters), URL that it will link to, and

    suggestion for a corresponding photo.o Right panels also can include Related Links; these have no character limit. Provide text (e.g.s: American Cancer

    Society) AND the URL (e.g.s: http://www.cancer.org). Meta Keywords: these are not seen by the user and are for search engines only; choose up to 8 keywords (words that

    someone using Google might use to find a page like this). Meta Title: This is what appears in blue on the Google search results pages; should be about 50-75 characters. Meta Description: This is the page description that appears on Google search results pages; should be about 120-

    175 characters. Feedback name and email address: Shows on bottom of page as Send Feedback to: xxxx Dept/Division/Program title: This is what appears at the top of the left navigation, and it identifies which sub-site the

    page belongs to. (It should be the same name as the home page of this sub-site.) Orange Heading: This is the main heading on the page. If this page is linked from the left navigation, the heading

    should be the same as what appears in the left navigation (e.g.s: Our Services; not Orthopedic Services). Left navigation: If this page is part of a new sub-site, then you already have provided the new left navigation. If this

    page is going into an existing sub-site, just clarify which left navigation it should get (for example, orthopedic surgery left nav).

    Content: This is the main content of the page; if you have specific ideas for photos/presentation, please include. Make sure to include major keywords (as listed above) within your content; if possible, repeat those keywords so that they are included on the page about 2-4% of the time. This is important for Google rankings.

    New Web Content Checklist

    I. ACCESSING TEAMSITEII. INTRODUCTION TO THE TEAMSITE ENVIRONMENTIII. WORKING IN TEAMSITE4. Navigate to the image you have imported. Click OK. In this window you should be able to view your image in the preview.

    Staging Work in ProgressIV. MANAGING THE DEPARTMENT FOLDERAPPENDIX A: TIPS FOR ADVANCED USERSAPPENDIX B: Image EditingRecommended Software:

    APPENDIX C: Sample Pages