LSU Health New Orleans Template
If you have a main page, give this page the name default.aspx. This will allow the page to show up automatically when only the directory name is given. For example, the full URL for the main page is http://www.lsuhsc.edu/default.aspx, however since default.aspx is a default document, it is unnecessary to include the filename for it to appear.
Be careful when including email addresses on a webpage. One of the methods that spammers use to get email addresses is to parse web pages for email addresses. This includes the html code as well as the presentation, meaning if you hide the address but still link to it, they can still get the address. The current method we are using to display address is to use animated images that appear to be plain text. The user will need to type the address in because there is no link. The format is username [@domain image] [.tld image]. These images are available under /template2011/images. An example is user . Source code:
user<img src="/template2011/images/atLSUHSC.gif" alt="Call (504) 568-4808 for Email Address" style="position: relative; top:3"> <img src="/template2011/images/Edutld.gif" style="position: relative; top:3">
The reason we give a number to call for the email address is so this is accessible to users who are visually impaired. If we include the domain in the alt tag, the spammers would have access to the email address.
Be sure to update the Title of each page to give users and accurate description of what the page is. This will show up in searches both on the website and from external search engines. When viewing the HTML tags, the title bar text can be set by editing the text between <head><title> and </title></head>.
In Visual Studio.Net (VS.NET), this can be edited by opening the properties window, selecting DOCUMENT, and editing the title attribute.
In Microsoft Expression, this can be edited by right-clicking on the page and selecting Page Properties. A dialog box will appear with options to change including the Title. It can also be changed when doing a Save As. The Save As dialog box presents a button entitled Change Title.
Max Width When Using Menu
When using the menu, the maximum width of a table or an image is 750px. Any wider will expand the middle section of the page.
When editing the XML files for the menus, the & symbol is not allowed as is. In order to use the & symbol, you must use &. This is called an entity. Other entities are listed below:
If you plan on using one of the characters in the table in an xml file, you should replace the character with the corresponding entity.
To reference the template's css stylesheet, reference the following in your code:
- <link rel="stylesheet" href="/Template2011/css/stylesheet.css?v=<%Response.Write((System.IO.File.GetLastWriteTime(Server.MapPath("/Template2011/css/stylesheet.css").ToString()).ToString("yyyyMMddHHmmss")));%>" type="text/css" />
The reason for the query string is so that when a change is made to the file, the browser cache is updated automatically.
The following tags are formatted with CSS:
- Body: font, color
- p, ul, ol, table: font, color
- p: justification
- a: color, text-decoration
- h1, h2, h3, h4: size, color
Benefits of using this:
- Maintains consistency throughout the site
- Eliminates having to set styles for every item on a webpage
- When the style sheet is changed, everything relying on the sheet is changed at the same time
- Shrinks bloated pages, saving bandwidth and time
When converting pages to use the template, to take of advantage of the stylesheet, these tips should be followed:
- If the page has font tags, remove them
- Remove any style= attributes in span or div tags, possibly remove the whole tags
- Remove align attribute from p tag
Headings should use the heading tags
- Paragraphs should be surround by the p tag instead of formatted using the br tag
- It may be easiest to start with a fresh template page and copy the content into notepad before copying it into the webpage.
Please note that when formatting in this way, not all editors will show you what the results will be on the server. The only way to see the results are to load the actual webpage from the webserver.
There is more than one way to reference a file, whether the file is an image or an XML file. Here are three ways to reference a file:
- If images are left in same place, reference works when page is moved
- This initial slash references the root of the website
- Must be used by users who have different paths in development and production
- ../ references previous directory
- NOT Recommended
- When moved to production, references will need to be updated on all pages
- Even if same website, performance will not be as good