SSW Web Template

Home > SSW Standards > Templates > SSW Web Template - Test Visual Studio .Net

New web pages are to be consistent with the SSW Template. All new pages must also abide by the rules set out in SSW Rules to Better Websites. Please also read the standard on SSW Branding before you create a new page...

Sample Heading to look like this

This document has pretty good HTML (as per Jelliot). Note these rules:

Add this Include file for all SSW Products:

Demonstration Options

If you are in Sydney, call today for a free no-obligation demonstration at your office!
If you are not in Sydney, please take advantage of our SSW Phone Walkthrough. The SSW Phone Walkthrough is a service where we will call you, anywhere in the world and once you have installed our product we will guide you over the important features of the software. Saves you time, playing around with the software trying to work out all the useful features, please email us today.

Verdana is our standard Web font. This text is written in Verdana. By using our ssw.css you will automatically be using this font. Dont use the font tags eg. <font face="Verdana, Arial,Helvetica, sans-serif" size="2"> Instead this line is used in our css font-family: Verdana, Arial, Helvetica

Formatting will not be in a HTML file, as an example this will be in the CSS, not the HTML file
style="{font-weight: bold; color: #ffffff; background-color: #7d7d7d}

When you have large blocks of text, it's imporant to break up the page to make it visually appealling. Using text boxes like this is a good idea... eg. <table class="clsSSWTable" cellspacing="2" cellpadding="2" summary="Formatting Table" align="right" style="{width:40%;}">

When you have tables on your pages use the ssw colours ie. a red border (as below). Don't specify these colours in your HTML

BAD <table bgcolor=white cellpadding=0 cellspacing=0 width="100%" border=0>

GOOD <table class="clsSSWTable" cellspacing="2" cellpadding="2" summary="Tips On How to Show a Table" style="{width:90%;}">

Don't specify anything your <tr> or <td> tags

BAD <tr bordercolor="#cccccc" bgcolor="#cccccc">

GOOD <tr>

The heading is in a div tag ie. <div id="topTextShadow"> Note: We no longer use the Adobe Photoshop template for the Heading, located at //roo/ssw/ImagesPsd/hd_short.psd *** This image to be deleted ***

Table Headings

1. When you use named achors in a table, use meaningful names

1. When you use named achors in a table, use meaningful names

Orders of rules/lists often change. If you use named anchors like "#13" they become meaningless when the list order changes. Always use a meaningul anchor name.

When you have tables on your pages use the SSW colours i.e. a red border (as below). Just include the Table style by adding "class="clsSSWTable"" into the Table tag.

Header Column	Header Column	Header Column	Header Column
varchar, nvarchar	pstr	@pstrEmail	varchar(150)
int	pint	@pintContactID	int
bit	pbit	@bitPrimaryContact	bit

When you have tables that are displaying data (like a DataGrid) then use this color scheme.

ProdName	Downloads
Simple Table Documentor	233
SSW Performance PRO!	155
SSW SQL Script Wizard	128
SSW Data Renovator	122

Always write code in the CODE tag...

BAD <font face="Courier New, Courier, mono" size="2">

GOOD <code>Code in Here</code>

Option Explicit 

	Function Isloaded() 

	End Function

You will always close a lot of tags that offically need closing eg. <p>, <li>.
You also may want to close tags such as <br/>, <img/> as it will make it easier to go to XHTML in a couple of years.

Now that we are using a .NET template there are a couple things you will be aware of.

The Header and Footer tags. These are required on all pages so that you only need to keep the main body of the page and the heading html on the aspx page. The heading, menu, side, footer, table structure is all taken care of for you in the includes.
At the top of your page you must tell the page to use the templates. You do this by inserting these 2 lines:
```
<%@ Register TagPrefix="SSW" TagName="incBottom" 
    Src="/ssw/Include/incBottom.ascx" %>

    <%@ Register TagPrefix="SSW" TagName="incTop" Src="/ssw/Include/incTop.ascx" 
    %>
```
Now you can call the header template:
```
<SSW:INCTOP id="Inctop" runat="server" PageTitle="SSW 
      Template"></SSW:INCTOP>
```
At the end of your page you call the footer that will close the table structure and put the footer image on the page:
```
<SSW:INCBOTTOM id="incBottom" runat="server"></SSW:INCBOTTOM>
```
The page heading is now only text not an image.
You can change the heading in the IncTop tag at the top of the page.
```
 <SSW:INCTOP id="Inctop" runat="server" PageTitle="Page 
    Title Here"></SSW:INCTOP>
```
To use this template, you can just copy this file or if you want to include custom backend scripting you will be required to copy 2 files for this template. By default the webpage is using a custom code behind page to populate the side html in the template. When you use this template you have to rename the 2 files so they are similar. This is for ease of maintenance more than anything.
eg. Login.aspx and Login.aspx.vb
You also have to change the Class name. You must pick a totally unique class name than has not been used on the rest of the site.
Eg. LoginMaintancePage

This class name must be changed at the top of the aspx page:
```
<%@ Page Language="vb" src="Login.aspx.vb" AutoEventWireup="false" 
    Inherits="SSW. LoginMaintancePage " %>
```
And at the top of the aspx.vb page:
```
Public Class LoginMaintancePage
```
There are now two methods of placing some HTML in the left hand side bar in the template.
- Make a txt file in the same directory called .txt
  If this file exists when the page loads, it will display the html in the txt file in the side nav.
  i.e. If you call the page Default.aspx then you will have to make a default.txt file.
- If you have a page where the side content changes depending on different query strings on the page then you can enter the URL into the database and when the page loads, it will check the database for that URL and display the corresponding HTML.
  Eg. If I have a products aspx page (the product is dependant on the query string passed into the page) then I would use this method.

The Nav Bar is edited using by altering the appropriate table in SQL Server on Joey. Then you need to use a special web page on Seal to generate a new static text file from this table.

You will acknowledge any contributers in accordance with standard convention. If you are quoting another author directly you will use direct quotes - for example: As Cameron Shaw says in the SSW Web Template "You will acknowledge any contributers". OR, if you are just referring to another persons idea don't quote the author directly, but mention that it is his idea - for example: Adam Cogan recommends on his site (www.ssw.com.au) that every coding company will have a series of rules and standards that every developer must adhere to." Following this standard will ensure we don't get accused of plagiarism.

Finally if you are not sure then see www.w3.org

SSW Web Template

Sample Heading to look like this

Table Headings 1. When you use named achors in a table, use meaningful names

Table Headings

1. When you use named achors in a table, use meaningful names