Reflection on ASP website construction

VBScript and JScript interaction in ASP page

ASP is able to manage scripts in different languages, automatically invoke the appropriate script engine to interpret the script code and execute predefined functions. ASP development environment provides two script engines: VBScript (the default) and JScript.

1. VBScript and JScript in the built-in functions

In the VBScript and JScript, there are a large number of built-in function are the same or similar. However, in a scripting language built-in function is not always in another scripting language also has a corresponding function. For example, VBScript provides a number of strings and format data for the operation of the functions that does not exist in JScript. These functions include StrReverse (), Filter () and FormatCurrency () and so on. On the other hand, JScript provides for management of arrays, strings, a function of coding is also not defined in VBScript, such as join (), reverse (), pow (), bit manipulation, escape () and unescape () and so on.

So, how to do if need a VBscript JScript function of the program?

2. Different scripts invoke heterogeneous

If need to invoke a built-in functions of VBScript in JScript, it should be written a VBScript that user defined function (here invoke VBScript built-in function), then as common as invoking the user defined function in JScript. For example, if you want to invoke VBSCript built-in function is FormatCurrency (), you can state the following custom function:



Then the code in JScript function to be as common as invoking FormatValue (). A similar method can also be used to achieve VBScript code to JScript.Apply the same rules, we can invoke script in any user-defined functions.

3. Data sharing

In some cases, mixed-use VBScript and JScript function is very useful, but in different languages to share data between scripts may also be useful. Achieve this shared approach is very e: no matter what language to use, as long as the page-level statement of the variable can be any references.

Object is using similar methods, you can choose any appropriate language to read, modify object properties or invoke. Certainly, it is defined by the language that given object properties and methods to create the object instance.

CSS study notes: Reset the default css

Recently, I read a word called css reset. What is css reset? I understand that as a reset css, that is, reset the default style. Some elements in the HTML tag and there is a default property value, When writing a css, in order to avoid duplication in css to define them, we need to reset the default style (css reset). I find an article on the survey about css reset, can be used to see the proportion of investigations.



There is a more comprehensive summary of css reset, css reset cited a variety of wording, which can be a reference.

Then I also see the two Chinese sites, with Firebug to see them, press F12, how to write css reset.

1. Taobao.com


<----! html {

overflow-x:auto;

overflow-y:scroll;

}

body, dl, dt, dd, ul, ol, li, pre, form, fieldset, input, p, blockquote, th, td {

font-weight:400;

margin:0;

padding:0;

}

h1, h2, h3, h4, h4, h5 {

margin:0;

padding:0;

}

body {

background-color:#FFFFFF;

color:#666666;

font-family:Helvetica,Arial,sans-serif;

font-size:12px;

padding:0 10px;

text-align:left;

}

select {

font-size:12px;

}

table {

border-collapse:collapse;

}

fieldset, img {

border:0 none;

}

fieldset {

margin:0;

padding:0;

}

fieldset p {

margin:0;

padding:0 0 0 8px;

}

legend {

display:none;

}

address, caption, em, strong, th, i {

font-style:normal;

font-weight:400;

}

table caption {

margin-left:-1px;

}

hr {

border-bottom:1px solid #FFFFFF;

border-top:1px solid #E4E4E4;

border-width:1px 0;

clear:both;

height:2px;

margin:5px 0;

overflow:hidden;

}

ol, ul {

list-style-image:none;

list-style-position:outside;

list-style-type:none;

}

caption, th {

text-align:left;

}

q:before, q:after, blockquote:before, blockquote:after {

content:"";

}----!>

2. Baidu.com

<---! body {

font-family:arial,helvetica,sans-serif;

font-size:13px;

font-size-adjust:none;

font-stretch:normal;

font-style:normal;

font-variant:normal;

font-weight:normal;

line-height:1.4;

text-align:center;

}

body, ul, ol, dl, dd, h1, h2, h3, h4, h5, h6, p, form, fieldset, legend, input, textarea, select, button, th, td {

margin:0;

padding:0;

}

h1, h2, h3, h4, h5, h6 {

font-size:100%;

font-weight:normal;

}

table {

font-size:inherit;

}

input, select {

font-family:arial,helvetica,clean,sans-serif;

font-size:100%;

font-size-adjust:none;

font-stretch:normal;

font-style:normal;

font-variant:normal;

font-weight:normal;

line-height:normal;

}

button {

overflow:visible;

}

th, em, strong, b, address, cite {

font-style:normal;

font-weight:normal;

}

li {

list-style-image:none;

list-style-position:outside;

list-style-type:none;

}

img, fieldset {

border:0 none;

}

ins {

text-decoration:none;

} ----!>

Css reset with those reference, and then according to their actual situation, write a perfect line with your site css reset.

Create dynamic ASP page using a template

For the template, I think we may have some concepts. Many of the template in the MS word, probably good design layout, you just fill in your own words to those occupying the character just fine. Here is the template probably mean that a relatively stable part of the page fixed, the other part of the root of different situations different content in the input. In fact, DreamWeaver also has templates, but the static content can only be filled manually, and here about the dynamic content automatically populated.

First of all, let me explain why use template file. Sometimes, the template will give you the layout of web features and more complete concept. When you see the Word template format, you will know the final layout looks like, so ASP does.

For example, you can keep the ASP statement, and use different templates to create different page styles. In this way, you do not have to create pages for each different styles, which to save a lot of time. Moreover, the template file to make it easier to browse the page code. You can only focus on HTML, while the ASP is no need to to manage. Also, templates is very simple, you definitely get to know quickly. I will use a database - a very broad use of the product table. Including product ID, names, photos, and summary. Here is the Access database structure:

File name - myDatabase.mdb

table name - Product

ID

Autonumber

FullName
txt - 100 chars max

PicURL
txt - 255 chars max

Descriptions

PicCaption
txt - 50 chars max

Set up a database, we can start building the template file. This file is the skeleton of each page. So in the end, it looks like is like this:

Product Name:
%name%
Description:

%description%

This picture was taken: %date%

product ID: %prod%

This is a simple template. Save it for the template.tmp, in the ASP page will be a reference to it. Those % around the field in the database and the corresponding meaning. Consider the following ASP code, how to read into the template and database files, then output HTML pages what we want to.

It's just open the template file, read each line in sequence, and then read in the database field values instead of the actual template that% img%,% name% tag. In some applications, such as real-time news, so it may be more convenient.

ASP website code and use MD5 encryption

When design Asp website,always need involve encrypted data which is stored in the database, such as registered users, user name and password storage. If just use codes stored in the database directly, once the database is trespassed by malicious program of hacked, it can be directly seen the user's user name and password, cause to leakage of sensetive information.

To solve the above problem, the solution is stored in the database after the data encryption, common idea is the user name codes stored, then encrypted password storage. Certainly, encryption algorithms have certain requirements that should be a one-way encrypted information, irreversible, can not be restored by other algorithms.

Among the algorithms, md5 algorithm is the most famous and commonly used encryption algorithm. md5 encryption algorithm is based on a variable-length binary value, the method is mapping into a fixed length hash value. If there are any changes to the encrypted file, the map will change the hash value. This feature is not only the key used to encrypt database data, also used to verify the download data whether the packet is identical with the published data packets, mainly used in CD image verification system.

md5 algorithm implementation (md5.asp) has become a common subroutine contains the md5 algorithm function. For the encrypted data, you can call the file contains and md5 () function to implement data transfer before the encrypted and storage. Specific form as follows:

1. Register user encryption

\'includes md5 file

... ...

password=md5(ltrim(request.form("password"))) \'use md5 encryption (sql server)

password=md5(trim(request.form("password"))) \'use md5 encryption (Access)

... ...

2. Process user login

\'inc md5 file
... ...

dim rs

UserName1=request.form("UserName")

password=md5(trim(request.form("password")))　　　 \'through md5 encryption to get pw(Access)

verifycode=request.form("verifycode")

set rs=server.createobject("adodb.recordset")

sql="select * from admin where username=\'"&username1&"\'"

rs.open sql,conn,1,3 \'Generated record set

　　if password<>rs("password") or verifycode<>session("verifycode") then

　　response.write "

The runat = server line tells us that it was executed on the server. So it can not use msgbox () function, can not use the document.Write method.

Full method is:

<---!SCRIPT LANGUAGE="VBScript" RUNAT="Server"---!>

Sub Application_OnStart
... ...
End sub

Sub Application_Onend
... ...
End Sub

Sub session_OnStart
... ...
End Sub

Sub session_Onend
... ...
End Sub

When you visit a website. If it is html based, then the program will not run because there is no application, session objects occur.

If it is ASP based, the server firstly checks the root www directory or virtual directory to see whether there is a global.asa file. If so, then run the program to the corresponding code

How to remind the user once a failure to object in the session?
First of all, I will discuss how to reminder after failure. Does it need remind? Why do not use direct detection value of session ("**").
** means you want to test whether the failure of its session ("**") value. This is not good, because the people who come firstly may be null of its session ("**").

So, we will look at where will be applied for. The most obvious example is the login page, if you use session to store the user's login status. You have to tell him whether the failure of login.

Now This is a sample for my assignment:

<---!SCRIPT LANGUAGE="VBScript" RUNAT="Server"---!>
Sub Application_OnStart
Application.Lock
Application("site_name") = "Welcome to Australia Wine Distributors Network--AWDN official website"
Application("user_online") = 0
Application("template") = "template"
Application("conn") = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source="&Server.MapPath("data.mdb")&";"
Application.UnLock
End Sub

Sub Session_OnStart
Session.Timeout=20

Session("userid") = "0"
Session("username") = "0"
Session("level") = "0"

Set conn = Server.CreateObject("ADODB.Connection")
conn.Open Application("conn")
set objRs = Server.CreateObject("ADODB.RecordSet")
szSql = "select top 1 * from [count]"
objRs.open szsql,conn,1,3
if not objRs.eof then
objRs("count") = objRs("count")+1
else
objRs.addnew
objRs("count") = 1
end if
objRs.update
objRs.close
set objRs = nothing
set conn = nothing
End Sub

Sub Session_OnEnd
Session("userid") = "0"
Session("username") = "0"
Session("level") = "0"
End Sub

Sub Application_OnEnd
Application.Lock
Application("user_online") = 0
Application.UnLock
End Sub
<---!/SCRIPT---!>

When user login to database, s welcome will be appeared. A record will be in database such as yser's operation and session. If user doesn't use it more than 20 minutes (Session.Timeout=20), system will lock and require user login again.

Note: ---! need be removed.

The object of ASP Summary

ADO object (very common):

Connection

Command

RecordSet

Record

Stream

ASP supports too much object , you write your own COM components, I often use the following:

Server.CreateObject("Scripting.FileSystemObject")
Server.CreateObject("Scripting.Dictionary") HashTable
Server.CreateXObject("Word.Application") //Server
ActiveXObject("Word.Application") //Client
Server.CreateObject("Excel.Application") //Server
ActiveXObject("Excel.Application") //Client
CreateObject("PowerPoint.Application")Server.CreateObject("Microsoft.XMLHTTP")
Server.CreateObject("Microsoft.XMLDOM")Server.CreateObject("MSXML2.XMLHTTP.4.0")
Server.CreateObject("WScript.Shell")Server.CreateObject("wscript.network") //Network Address
Server.CreateObject("MSWC.AdRotator")

CreateObject("Excel.Sheet")
MS FrontPage: oFP = CreateObject("FrontPage.Application")

MS Access: oAccess = CreateObject("Access.Application")

MS Graph: oGraph = CreateObject("MSGraph.Application")

Should be aware of the following:

CreateObject("PhotoShop.Application")
//About SQL Server

CreateObject("SQLDMO.SQLServer")

CreateObject("SQLDMO.Login")

CreateObject("SQLDMO.Backup")

CreateObject("SQLDMO.User")

Server.CreateObject("SQLDMO.BackupDevice")

Server.CreateObject("SQLDMO.Database")

Server.CreateObject("SQLDMO.Restore")

//MSMQ

Server.CreateObject("MSMQ.MSMQQueueInfo")

CreateObject("MSMQ.MSMQQuery")

//index

Server.CreateObject("ixsso.Query")

Server.CreateObject("ixsso.Util")

I did not put summary of the mail components, such as:CDO,Jmail,Imail etc.

Here are some unusual common objects:

AccPac Advantage Corporate:

oAccPac=CreateObject("ACCPAC.xapiSession")

AccPac Report Master for Windows:

oImpApp=CreateObject("Impromptu.Application.30")

BarTender:

oBarTender = CreateObject("BarTender.Application")

CrystalReports:

oCRApplication = createobject ("CrystalRuntime.Application")

This doesn't invoke an IDE actually.

EUDORA:

oEud = CreateObject("Eudora.EuApplication.1")

FaxMaker:

oFax = CREATEOBJECT("fmfaxapi.application")

GroupWise:

oGroupWise = CreateObject("NovellGroupWareSession")

LotusNotes:

oNotes = CreateObject("Notes.NotesSession")

oNotes = CreateObject("Notes.NotesUIWorkspace")

oNotes = CreateObject("Lotus.Notessession") (Domino 5.0.3)

MS Common Dialog:

oCommmonDialog = CreateObject("MSComDlg.CommonDialog") && !!! You can't directly create this object without a development licence, so for dynamically doing it on another machine, see below. -- PeterCrabtree

MS Internet Explorer:

oIE = CreateObject("InternetExplorer.Application")

IEAutomationExample

MS MapPoint:

oMapPoint = CreateObject("MapPoint.Application")

MSN Messenger:

oMessenger = CREATEOBJECT("MSNMessenger.MessengerApp")

MS NetMeeting:

oNetMeeting=CREATEOBJECT("netmeeting.app.1")

MS Outlook:

oOutlook = CreateObject("Outlook.Application")

MS Outlook Express:

None - It is not a COM server!

MS PowerPoint:

oPP = CreateObject("PowerPoint.Application")

MS Project:

oProj = CreateObject("msProject.Application")

MS SourceSafe:

oVSS = CreateObject("SourceSafe.0")

MS Word:

oWord = CreateObject("Word.Application")

MS Visio:

oVisio = CreateObject("Visio.Application")

MS VisualBasic: Not sure

MS VisualCPlusPlus:

(VC )oCpp = CreateObject("MSDev.Application")

MS VisualFoxpro:

oVFP = CreateObject("VisualFoxPro.Application")

MS WindowsScriptingHost:

oWSH = CreateObject("WScript.Shell")

Novell GroupWise:

oGroupWise = CreateObject("NovellGroupWareSession")

PCAnywhere (host):

oPCAHost = CreateObject("WinAWSvr.BeHostDataManager")

PCAnywhere (remote):

oPCARem = CreateObject("WinAWSvr.RemoteDataManager")

QuickBooks:

QBSessionManager = CreateObject("QBFC2.QBSessionManager")

RationalRose:

oRose = CreateObject("Rose.Application")

TAPIFax:

oTAPIFax = CreateObject('FaxServer.FaxServer')

WindowsShell:

oWSH = CreateObject("Shell.Application")

Windows Media Player:

oWMP = CREATEOBJECT("WMPlayer.OCX")oPlayList = oWmp.PlaylistCollection.GetAll()oWmp.currentPlaylist = oPlayList.Item(0) && Zero based array*!* Music starts!

Windows Messenger:

oMessenger = CREATEOBJECT("Messenger.MessengerApp")

WinFax:

oWinFax = CreateObject("WinFax.SDKSend")

WinPrint :

oWinPrint = CreateObject("WinPrint.WinPrintX")

SQL-DMO object:

loSQL = CREATEOBJECT("SQLDMO.Application")

Others:
Scripting Shell:

oShell = CreateObject("WScript.Shell")
Scripting Network Object: oNet = CreateObject("WScript.Network")

Scripting Regular Expression Parser:

oReg = CreateObject("VBScript.RegExp")
SQL DMO SQL Server: CreateObject("SQLDMO.SQLServer")

Collection of commonly used ASP function

*******************************************************************
To obtain IP address
*******************************************************************
Function Userip()
Dim GetClientIP
'If the client use a proxy server, it should be ServerVariables("HTTP_X_FORWARDED_FOR") Method
GetClientIP = Request.ServerVariables("HTTP_X_FORWARDED_FOR")
If GetClientIP = "" or isnull(GetClientIP) or isempty(GetClientIP) Then
'If the client does not use a proxy server, it should be Request.ServerVariables("REMOTE_ADDR")Method
GetClientIP = Request.ServerVariables("REMOTE_ADDR")
end if
Userip = GetClientIP
End function

*******************************************************************
Pop-up dialog window
*******************************************************************
Sub alert(message)
message = replace(message,"'","\'")
Response.Write (" ")
End Sub

*******************************************************************
Back to previews page
*******************************************************************
Sub GoBack()
Response.write (" ")
End Sub

*******************************************************************
Connection redirection
*******************************************************************
Sub Go(url)
Response.write (" ")
End Sub

*******************************************************************
Connection redirection with specified number of seconds count down
*******************************************************************
sub GoPage(url,s)
s=s*1000
Response.Write " "
end sub

*******************************************************************
To obtain file name extension
*******************************************************************
function GetExtend(filename)
dim tmp
if filename<>"" then
tmp=mid(filename,instrrev(filename,".")+1,len(filename)-instrrev(filename,"."))
tmp=LCase(tmp)
if instr(1,tmp,"asp")>0 or instr(1,tmp,"php")>0 or instr(1,tmp,"php3")>0 or instr(1,tmp,"aspx")>0 then
getextend="txt"
else
getextend=tmp
end if
else
getextend=""
end if
end function

' *----------------------------------------------------------------------------
' * Function: CheckIn
' * Description: Detection parameters have SQL dangerous characters
' * Parameters: str data
' * Back: FALSE:Safe TRUE:Unsafe
' * Autor:
' * Date:
' *----------------------------------------------------------------------------
function CheckIn(str)
if instr(1,str,chr(39))>0 or instr(1,str,chr(34))>0 or instr(1,str,chr(59))>0 then
CheckIn=true
else
CheckIn=false
end if
end function

' *----------------------------------------------------------------------------
' * Function: HTMLEncode
' * Description: filter HTML code
' * Parameters: --
' * Back:--
' * Autor:
' * Date:
' *----------------------------------------------------------------------------
function HTMLEncode(fString)
if not isnull(fString) then
fString = replace(fString, ">", ">")
fString = replace(fString, "<", "<")

fString = Replace(fString, CHR(32), " ")
fString = Replace(fString, CHR(9), " ")
fString = Replace(fString, CHR(34), """)
fString = Replace(fString, CHR(39), "'")
fString = Replace(fString, CHR(13), "")
fString = Replace(fString, CHR(10) & CHR(10), "

")
fString = Replace(fString, CHR(10), "
")

HTMLEncode = fString
end if
end function

' *----------------------------------------------------------------------------
' * Function: HTMLcode
' * Description: filter table
' * Parameters: --
' * Back: --
' * Autor:
' * Date:
' *----------------------------------------------------------------------------
function HTMLcode(fString)
if not isnull(fString) then
fString = Replace(fString, CHR(13), "")
fString = Replace(fString, CHR(10) & CHR(10), "

")
fString = Replace(fString, CHR(34), "")
fString = Replace(fString, CHR(10), "
")
HTMLcode = fString
end if
end function

The center issues under W3C standard

I wrote CSS to make website be center displayed for both IE and Firefox(FF). Then I tried:

1. Use text-align:center;, it works in IE but not FF. W3C valid.
2. Insert text-align:-moz-center;, it works in FF but not IE. W3C invalid.
3. Modify it to text-align:-moz-center;#text-align:center;, both work but W3C invalid.

Also tried margin-left: auto;margin-right: auto;, and margin:0 auto;but doesn't work at all.

Fw: CSS Centering – fun for all!

Date: 8 November 2003
Author: Russ Weakley

How do you center a containing block on a page using CSS? There are two main methods and the choice should be made based on whether your page layout is liquid (will move in and out depending on the size of the browser window) or fixed width.
Centering liquid layouts

Liquid layouts are easy to center using margins on each side of the containing box. The margins can be set with em, pixel or percentage units.

div#container
{
margin-left: 10%;
margin-right: 10%;
}

Centering fixed-width layouts

Theoretically, you should be able to apply auto margins to the left and right of the containing block and it should center on the page.

The W3C Visual formatting model states: “If both ‘margin-left’ and ‘margin-right’ are ‘auto’, their used values are equal. This horizontally centers the element with respect to the edges of the containing block.”

So, a containing block should be able to be centered using the following rules:

div#container
{
margin-left: auto;
margin-right: auto;
width: 50em;
}

However, some browsers do not center the containing blocks using this method as they ignore the auto margins. These browsers include:

* NN4 (Mac and Win)
* Win/IE4
* Win/IE5
* Win/IE5.5
* Win/IE6 (when in quirks-mode)

By adding two simple rules, this problem can be overcome in all of the browsers mentioned above, excluding NN4.
1. Center the body

While these browsers ignore auto margins, they will follow “text-align: center”. If this is applied to the body, the containing block will center correctly. So, a new rule is added:

body
{
text-align: center;
}

div#container
{
margin-left: auto;
margin-right: auto;
width: 50em;
}

2. Resetting text-align

The only problem with this new rule is that all content on the page is now center-aligned. To overcome the center alignment problem, a new declaration is added within the containing block rule set – “text-align: left”. The final CSS code is:

body
{
text-align: center;
}

div#container
{
margin-left: auto;
margin-right: auto;
width: 50em;
text-align: left;
}

The draft of Macro and micro technological analysis

Macro and micro technological analysis draft v.1

Using ASP to connect various databases

Using ASP to connect DBF, DBC, MDB, Excel, SQL Server database approach:

1. ASP database object access method
In ASP, to access the database objects referred to ADO (Active Data Objects) which mainly contains three kinds of objects: Connection, Recordset, Command.

Connection: connection data for opening
Recordset: for access data table
Command: for implementation of action on the database query command

2. Connecting database driver

The database can be connected by the driver, or can also use the data source. I think that use the driver is easier than data source.

3. ODBC Link:
Database type; Link mode
access "Driver={microsoft access driver(*.mdb)};dbq=*.mdb;uid=admin;pwd=pass;"

dBase "Driver={microsoft dbase driver(*.dbf)};driverid=277;dbq=------------;"

Oracle "Driver={microsoft odbc for oracle};server=oraclesever.world;uid=admin;pwd=pass;"

MSSQL server "Driver={sql server};server=servername;database=dbname;uid=sa;pwd=pass;"

MS text "Driver={microsoft text driver(*.txt; *.csv)};dbq=-----;extensions=asc,csv,tab,txt;Persist SecurityInfo=false;"

Visual Foxpro "Driver={microsoft Visual Foxpro driver};sourcetype=DBC;sourceDB=*.dbc;Exclusive=No;"

MySQL "Driver={mysql};database=yourdatabase;uid=username;pwd=yourpassword;option=16386;"

4. OLEDB Link
Database type; Link mode
access "Provider=microsoft.jet.oledb.4.0;data source=your_database_path;user id=admin;password=pass;"

Oracle "Provider=OraOLEDB.Oracle;data source=dbname;user id=admin;password=pass;"

MS SQL Server "Provider=SQLOLEDB;data source=machinename;initial catalog=dbname;userid=sa;password=pass;"

MS text "Provider=microsof.jet.oledb.4.0;data source=your_path;Extended Properties'text;FMT=Delimited'"

5. More about Access database
Generally we use Access databases, I think we can connect Access database using the following method:

dim conn
set conn = server.createobject("adodb.connection")
conn.open = "provider=microsoft.jet.oledb.4.0;" & "data source = " & server.mappath("../db/bbs.mdb")

Including .. / db / bbs.mdb is stored in the relative path! If the database and ASP files in the same directory, need only to write on:

dim conn
set conn = server.createobject("adodb.connection")
conn.open = "provider=microsoft.jet.oledb.4.0;" & "data source = " & server.mappath("bbs.mdb")

Once chosen correct driver and path of the database, database connection will not be a problem.

FW: 7 Crucial Tips for Designing and Maintaining a Large Site_A great lesson from Collis Ta'eed

Collis Ta'eed once wrote a blog named "7 Crucial Tips for Designing and Maintaining a Large Site" to share us the key skills of large Website design and maintenance. Now I am reproducing here for everyone to learn as follows:


Projects vary in scope and size, and the challenges they entail vary likewise. As a lone web designer, the biggest job I am responsible for is FlashDen. Along with thousands of active members all chatting, uploading and buying, the site processes large amounts of money and large amounts of traffic.

Designing, redesigning, maintaining and working with developer team has given me some useful insights and tips for making life easier. And since today we’ve launched my latest redesign of the site, it seems like a good time to write up my top 7 tips!
1. Design and Code for Maintainability

The first and biggest tip I can give, is to design the site so that it’s easy to maintain. Often times when designing a site you might sacrifice things for aesthetics. For example you might use images where text or styles would suffice. Or you might deliberately choose a menu structure that has no room to grow. When the site is large, this becomes a really bad idea.

When I built the very first version of FlashDen almost two years ago, I used images for buttons. They looked really nice, but I wound up with a library of 100 different button images, not to mention rollovers. Then in the next couple of months every time a developer needed a new button they had to ask me to create an image. Needless to say I learnt that lesson pretty quick and we switched to a single button class that maybe doesn’t look as good, but is much better for peace of mind.

Another aspect of maintainability is thinking about how the site is going to grow and change. For example, as new pages get added on, where do they go? Early on I wanted to have a horizontal navigation, but this is really limited After some experimenting, we wound up using a vertical nav, allowing for submenu items, and then on top of that, added a tab structure into pages to allow for related pages to be grouped together. I’m not saying it’s the best navigation in the world, but it certainly means we’re not redesigning every time a new section is added to the site!

So in designing for a large site, look for ways to make life simpler later, because you’ll be glad you did!
2. Figure out your User Groups and Tasks

One of the biggest differences between a large site and a small one, is the number of different user types who might be using the site. For example on FlashDen, there are buyers, authors, visitors, admins, and members. Each group has a different set of aims and tasks they have to carry out. Sometimes these tasks overlap, but sometime they are quite different.

The best example of a place where user tasks are at odds with each other is on a homepage. Nowhere else on a site does every user group converge, and nowhere else is it so vital to make sure everyone gets what they want. And of course you have to be careful that in serving one user group you aren’t ignoring another.

In this latest redesign of FlashDen, the biggest area that I worked on was the homepage. The first thing I did was list out to myself all the things that each user group needs to do:

1. Buyers – People who are on FlashDen to purchase files
Start browsing items, start searching, access their personal homepage, deposit money, learn how the site works (for newer buyers)
2. Authors – People who are selling goods on FlashDen
Chat with other members, get featured on the homepage to push their items, find out about site news, quickly get to their portfolio & earnings
3. New Visitors – Potential Buyers/Authors/Members, who have just arrived
Learn what the site is/does very quickly, get started, find out types of files and prices
4. Members – People who aren’t really buyers or authors, but just participate in the community
Chat with other members, see site news, browse files
5. Admins / Reviewers – Our staff who manage file approvals, moderate forums, and generally participate
Get quickly to file approvals, see the latest forum threads, hear site news

When you know what different user groups want to do, then you can design a page that solves all their needs. Needless to say this is a task that gets exponentially harder the more groups and tasks there are. On other pages in the site, you will often get a subset of user groups to worry about, but on the homepage they all converge. Not coincidentally, the homepage is the most important bit of design work you have to do on a site.

Before you can solve the different needs though, you need to prioritize the user groups, and in order to do that, you’ll need to understand what the site is trying to achieve.
3. Understand the Site Goals

Although every user group naturally feels they are the most important, it is up to you to prioritize them according to what the site itself is trying to achieve. For example on FlashDen after sitting down with the team we drew a few conclusions as follows:

* The top priority for the site is to serve buyers. When buyers are served well they keep buying bringing income and simultaneously serving the authors.
* It’s vital to get new visitors to quickly learn about the site and hopefully become members. FlashDen is still in a relatively new market, and new competitors are still appearing, so that makes it more important to capture visitors and convert them to buyers or authors or members.
* Authors are important because at its heart FlashDen is really about her authors, but out of all the user groups they are the most committed to the site.
* Members are not as important as Authors and Buyers, but do contribute to the community surrounding the site.
* Admins / Reviewers are the least important as they are a paid group.

So following from this, it’s possible to conclude that the homepage needs to server users in this order: Visitors > Buyers > Authors > Members > Admins.

Understanding what your site is trying to achieve is the final thread that sews your user tasks together and tells you what you should be trying to put on the page. Ideally on every key page you should identify the user groups, tasks and priorities. For a vital page like the homepage I do this formally on paper, and for lesser pages I will often just do it in my head while designing.
4. Design, Refine, Refine, Refine …

It’s only after you’ve figured out user groups, tasks, site goals, priorities and so on, that it’s time to design! It is really vital that you do this first, because on a practical level, it dramatically lowers the odds that you are going to have go back and redo your design. Whenever I have just started designing a big site, without really analysing first, I have inevitably had to rework lots of screens or even whole interfaces.

Lots of designers like to use wireframes at this point – that is to simply lay out a bunch of lines and boxes indicating roughly where things should go. Personally I prefer to work in Photoshop from the start because I’m quick enough and it lets me really see what’s going to happen. I also think that there is more to information design than where something appears on a page. Simply altering colours and background colours can make a page element further down the page suddenly seem more important.

Once you do have a rough idea of how the information needs to work together, you should come up with a working design that is generally OK, and then refine, refine, refine. I often will wind up with 5 or 6 versions of the same look, where I’ve tried varying different things like type sizes, images, layout alterations, backgrounds, and so on, to see how it affects the information you’re presenting.

No matter how good you think the first layout is, I can guarantee that after spending more time and coming up with more versions you’ll have discovered that your original wasn’t quite as good as you first thought. Sometimes you wind up throwing out the whole design and starting again, but if you do have a good base, then refining should get you to a great finish.
5. Get Others’ Opinions, but Make the Final Calls

In any large job you are going to have a lot of other opinions involved. In most cases these will be the opinions of your client. Prior to starting FlashDen, I used to work with all sorts of companies building websites. Among them I did have the misfortune to design for several large insurance companies and a few governmental organisations. I say misfortune because when you get to that size of client you are dealing with a lot of stakeholders, and in many situations it isn’t clear where the real power to make decisions lies. This can result in endless meetings, endless changes and a high degree of difficulty for carrying through your vision.

Whatever the client, it’s really important to get their opinions. Aside from anything else in most cases they know a lot more about the business than you do. Hopefully they also know more about the users than you do, and with this knowledge will be able to give constructive advice.

It’s also important to get the opinion of the development team you are working with. At FlashDen we’re fortunate to have two devs who have a lot of skill in user interface design and usability. And their input, along with the rest of the team, made a lot of difference to the end product.

But in the end, it’s up to you as the expert designer to come up with the final call. If you have a tough client this can be tricky, because a client often believes they should make the final calls. If that is the case, you need to (a) find ways to explain, educate and show the client that your choices are for their benefit; and (b) sometimes bite the bullet and accept the client’s directives as a further constraint in your project, and find ways to make it work.
6. Organise for the Future

When you are coding up a design for a big site, it’s really important to again think about the future. How you manage your files and folders will impact you greatly later. For example recently we have decided to build a sister site to FlashDen that focuses on audio only called AudioJungle. To make things simpler the site is going to run the same HTML, with just stylesheets to make it look like a different site. A development like that throws up all sorts of new challenges to my file and folder structures, my stylesheets and my HTML. Here are some things to keep in mind:

1. Organise yourself into a good folder structure
Scripts, stylesheets, interface images, content images, and so on, all need to be kept separately. With a small site you might be able to just dump things together, but the bigger you get the more important it is to be able to find what you need.
2. Use a coherent and intelligent naming system for your files
There’s nothing worse than looking at a pile of images with names like "gd_l3.jpg". How you do it is largely a personal matter, but I find naming using common prefixes and descriptive file names helps a lot. So for example I might start every image going in the header with the word ‘header_’, every background with ‘bg_’ and then a menu background from the header would be called ‘header_bg_menu.jpg’. Prefixes have the advantage that when your files are sorted by name, they all appear together.
3. Use Subversion
This was forced on me by our developers, but thank goodness it was! Subversion tracks files and file changes and stops you from overwriting other designers/deveopers working on the same project. Also importantly it helps you roll back to old versions of things. It takes some getting used to, but even minus all the reasons developers use it, it’s worthwhile for HTML/CSS designers. Don’t know about Subversion? Check out Subversion for Designers
4. Be thoughtful about how you write your HTML and CSS
It’s really easy to make a mess with your HTML and CSS files, and it’s really hard to clean them back up. After four redesigns, I’m still using many of the same CSS files and it is a mission cleaning up classes that aren’t used any more or finding obscure definitions wrapped in lots of layers. Use lots of comments, possibly even multiple stylesheets, and make sure you name your styles well!

5. Get Browser Compatibility working EARLY
This is an area I went really wrong with FlashDen and we’ve been paying for it ever since. My initial layout worked in IE7 and I ignored IE6 until after we’d finished building the whole site. Ever since we’ve been adding IE conditionals, and hacks and workarounds. It’s much easier to make something compatible when there are only a few elements on the page than when you’ve built a massive site, so don’t follow my foolishness!

7. Make it Easy to Develop With Your Stylesheet

The bigger the site, the less likely a designer will get to see or modify every single page. If you’re a single designer on a big site – like me – then you also might not want to be called in for every thing. So it pays to make a stylesheet that can almost by default makes things look nice. For example:

1. Make sure you style default elements like , , and so on.
That way the page will automatically present well. If you rely on people doing things like then inevitably you’ll wind up with variance on pages.
2. Create reusable elements that developers can use.
For example on FlashDen we have a table class called "general_table", that makes a good fall-back style for data. When I have a chance to style a page I can do more specific types of tables and data highlighting, but at the very least a developer putting together a page has a good all-round table style to use.
3. Make sure your page layout has a structure that looks nice even when it’s just got text in it.
Inevitably there will be pages which you haven’t had a chance to add images to, and which may look a little boring. By using things like heading styles, sidebars, and so on, you can make sure that they still look pleasant and have some visual style. For example on FlashDen we wrap most text blocks in:

Heading

Content

And this by default wraps the text up with a nice little border around it and a heading. It’s easy for a developer to work with and does a good job of separating text up and making it look more readable. We also have a sidebar component which is just another package for extra text content, but that again makes the page look more visual.

Naturally it’s optimal if every page does go through a designer, but it’s also much less stressful knowing that even if they don’t, it’ll still look professional and uniform.

Click here to see original Link

Pseudo-static ASP website: html file is generated by ASP technique

Pseudo-static ASP website's benefit:
1. Is friendly to search engine
2. Ease to be listed and searched
3. Reduce the pressure of database
4. Accelerate response of webpage

Sample 1. Invoke FSO to write html file, genenrate *.html

＜%
filename="test.html"
if request("body")＜>"" then
set fso = Server.CreateObject("Scripting.FileSystemObject")
set htmlwrite = fso.CreateTextFile(server.mappath(""&filename&""))
htmlwrite.write "＜html>＜head>＜title>" & request.form("title") & "＜/title>＜/head>"
htmlwrite.write "＜body>Output Title: " & request.form("title") & "＜br /> Output Body content:" & request.form("body")& "＜/body>＜/html>"
htmlwrite.close
set fout=nothing
set fso=nothing
end if
%>
＜form name="form" method="post" action="">
＜input name="title" value="Title" size=26>
＜br>
＜textarea name="body">Body＜/textarea>
＜br>
＜br>
＜input type="submit" name="Submit" value="generate html">
＜/form>

Sample 2. Use template to manage the code. This method is most used by CMS.

＜head>
＜title>$title$ by asptest.com＜/title>
＜/head>
＜body>
$body$
＜/body>
＜/html> ?
TestTemplate.asp '// generate html ＜%
Dim fso,htmlwrite
Dim strTitle,strContent,strOut
'// Create file system objective
Set fso=Server.CreateObject("Scripting.FileSystemObject")
'// Open Webpage template file，read template
Set htmlwrite=fso.OpenTextFile(Server.MapPath("Template.htm"))
strOut=f.ReadAll
htmlwrite.close
strTitle="Webpage title"
strContent="Webpage content"
'// Replace template tab by real content
strOut=Replace(strOut,"$title$",strTitle)
strOut=Replace(strOut,"$body$",strContent)
'// Create html file
Set htmlwrite=fso.CreateTextFile(Server.MapPath("test.html"),true)
'// Write webpage content
htmlwrite.WriteLine strOut
htmlwrite.close
Response.Write "Generate html file done！"
'// Release file system objective
set htmlwrite=Nothing
set fso=Nothing
%>

Sample 3. Use XMLHTTP to achieve html content, then save html file by ADODB.Stream or Scripting.FileSystemObject.
＜%
'Function
'1. Input url address, return value getHTTPPage is the code of objective webpage
function getHTTPPage(url)
dim Http
set Http=server.createobject("MSXML2.XMLHTTP")
Http.open "GET",url,false
Http.send()
if Http.readystate＜>4 then
exit function
end if
getHTTPPage=bytesToBSTR(Http.responseBody,"UTF-8")
set http=nothing
if err.number＜>0 then err.Clear
end function
'2. Translate messy code by adodb.stream
Function BytesToBstr(body,Cset)
dim objstream
set objstream = Server.CreateObject("adodb.stream")
objstream.Type = 1
objstream.Mode =3
objstream.Open
objstream.Write body
objstream.Position = 0
objstream.Type = 2
objstream.Charset = Cset
BytesToBstr = objstream.ReadText
objstream.Close
set objstream = nothing
End Function
txtURL=server.MapPath("../index.asp")
sText = getHTTPPage(txtURL)
Set FileObject=Server.CreateObject("Scripting.FileSystemObject")
filename="../index.htm"
Set openFile=FileObject.OpenTextfile(server.mapPath(filename),2,true) 'true means not existing, create one openFile.writeline(sText)
Set OpenFile=nothing
%>
＜script>
alert("HTML file done!");
history.back();
＜/script>

After learning ASP and PHP, I felt at the aspect of generating html, PHP is too much better than ASP.

ASP site Architecture design

1. DNA Architecture
ASP is a typical Microsoft DNA Architecture including data layer, business layer and presentation layer. Business layer is the core component.

2. Data layer
Data layer provides data sources for applications, MicrosoftSQLServer、Oracle or other OLEDB/ODBC compatible data source. Main methods to determine the database structure is whether can meet customer demand. Database design must follow the same standard, making preparation of corresponding stored procedures and triggers.

3. DAL(Data Access Layer)
Responsible for all database access and control.

4. Business Logic Layer
The related business activities can be seen as one package of VBS CLASS. In particular, need consider access control layer.

5. Presentation layer
Java Script+XML

ASP learning checking list

Due to I want to build a interactive site through ASP plus database, and a basic CMS system. There is a checking list to show the technology needed:

1. Programming language
HTML/XHTML
JavaScript/VBScript

2. Active Server Pages(ASP)
Windows server 2003 with IIS 6.1
ASP was design by Microsoft, ChiliASP and InstantASP can run ASP on non-Microsoft Operating System.

3. What is ASP?
It is a similar language with HTML.
ASP includes: txt, HTML/XHTML, Script
The script of ASP can be executed on the server.
ASP files' extension is *.asp

4. What are the differences between ASP and HTML?
When brower requests a HTML file, web server gets this file back.
When brower requests a ASP file, IIS transfers this request to ASP engine which reads ASP file line by line, and execute the script. Eventually, ASP file is sent back to browser as HTML file.

5. What can ASP do for a website?
Editing, changing and inserting any contents of website dynamically.
Responding user's request from HTML file.
Connecting database, sending data back to browser.
Increasing usability.
Increasing access speed rather than perl or CGI.
Secure source code, forbid end user checking source code from browser side.
Mitigate the network loading rate.

ASP is only running on the server side, client side does not need any script.

Building a dedicated internet server for DMT practice.

Building a dedicated internet server for DMT practice.
Intend to learn DMT efficiently and effectively, I decided to build a dedicated web server to test and host my webpage, learning DMT in practice. There is my equipment list:

Hardware:

Computer which be acting internet hosting role:
CPU: AMD 2.4Ghz
RAM: 2GB DDR 333
HDD: 2 x 40 GB with Raid-1 Backup
NIC: 100 Mb

Software:

Windows Server 2003 Small Business Edition Sp1
SQL Server 2005 Education
Microsoft Office 2003
IIS 6.0
Norton Anti-virus corporation edition

Network:
D-link 502T ADSL2+ Modem
Netgear 834 wireless Router
TPG ADSL2+ Broadband with static Public IP address (120 GB Plan)

Configuration Steps:

1. Fully installed Windows Server 2003 ,Sql server and other software.
2. Connect Computer to internet through ADSL2+ line.
3. Getting Static IP address (115.64.23.10) from modem's status display.
4. Config internal IP address for the computer as 10.1.1.10 in the NIC properties.
5. Allow this communication in firewall setting.
6. Update IIS from 5.1 to 6.0.
7. Start IIS service from management console.
8. Set default website as 127.0.0.1, run into browser, ensure IIS is working properly.
9. Put NIC's IP address(10.1.1.10) into IIS.
10. Config port forwarding and virtual service in Modem, link public IP to this server.
11. Note: Default port80 has been setting to the modem remote management, so set port8080 to the server.
12. Reboot modem
13. Set a directory named DMT under the C drive as home directory in IIS.
14. Test http://10.1.1.10:8080, OK!
15. Open FTP service, default directory DMT as well as Http.
16. Upload my learning plan, test pass!

Now, a basic ASP+MS Sql host platform is done. In future, I still need install php & mysql to support php extension.

First draft of my learning proposal

This is my first version learning proposal at DMT:

Check it out!

Wanna learn CSS? Let's see this.......

Grab the link into different browser and see it, the page is made up by CSS totally.

IE sucks, Firefox is OK, Chrome is wonderful that doris'eyes even can move.

Try this: Click here.

Kick off digital media technology today

Should be learnig something from the course. Guess that is ASP or PHP at the very first point.