Thursday, May 1, 2008
On Hold Message Marketing
Here is a sample Greeting for one of our Skype In.
Download
Wednesday, April 30, 2008
Web Production Guideline
- Header
- Footer
- Left
- Right
- Center
- entry tags,
- catalog tags,
- menu,
- drawings,
- info blocks,
- info boxes,
- ...
All the parameter used in the layout are pre-designed or configured prior to the production started (step 1). Those parameter of configuration should not be touched during step 6 of production content fill. Since we have never established this rule before, we will pay more attention in following this guideline.
As a reminder, let me list the 9 steps of website order fulfillment (production) process:
2. create menu (site map structure)
3. match the site color style
4. create baseline repository,
5. each staff check out their designated pages
6. content fill:
7. check in
8. QA
9. publish (release)
The content fill are executed with multi-staff in parallel
- match the info box color
- modify the info block placement, size, layout
- match/place the entry tags
- header/footer
Design Guideline
web design style and format
- reference: e.g. http://www.webstyleguide.com/
Text formatting
- reference: http://www.e-agency.com
1. do not make a long text descriptive block;
2. do not only use bullet/number itemize approach; and
3. mix the text,
4. insert (processed) picture,
5. itemize the contents,
6. use mulit-column when possible,
7. balance the white space.
8. double and triple check the alignment.
Text font, points, and etc.
1. small points give you elegance but only on the white background
- reference: http://www.e-agency.com
2. consistent font throughout the entire site/page
3. font/point/color/underline change only on the special words, for example: heading, quote, and title
4. always underline the hyperlink
5. use single line spacing.
6. 10 points on the light background seems to be the most common choice.
7. same indentation through out
8. build all common practice into css, and obtain prior approval for over writing the default css style
Text contrasting on the background
1. do not use dark on dark,
2. use white lettering on the darker background,
3. use black lettering on the lighter background.
Tables background and borders
- usage: itemized packages or plans
- reference: http://www.zinfi.com/
1. use some off-prime or grey background color
2. use gradient or stronger hue on the title cell
3. use 1 pt white or very light color border, do not stress the outline
4. clear MORE button to the next level page
Organization
1. divide the content to no more than 3-5 parts at each level
2. navigation links should be 10-12 links at each level
3. hyperlink as much as we can
4. access entrance should be everywhere, such as login/registration, chat, product and service menu
Product and service menu page
1. summarize in tabular format
2. more buttons to each category
3. replicate this information in different places and in different shape and format
Gallery page
1. balancing the levels of pages i.e. minimize the number of clicks (levels) v.s the size and number of thumbnails
2. easy and attractive navigation structure
3. quick and easy access to the detail information
To Choose a (set of) Color Scheme for the website
colorpicker http://quick-html-color-picker.allgraphicstools-com.qarchive.org/_download2.html The color value will be converted to RGB and HTML format.
The colorpicker is an executable, you can create a shortcut to place it on the start command menu, or leave the executable on the desktop.
When edit our own site, we like to pick a set of matching colors, here is how we do it:
theme picker http://www.yafla.com/dforbes/yaflaColor/ColorRGBHSL.aspx?
The guideline for picking the right color:
- to use the above suggested tools
- to apply gradient on the tag, not the mouse over one (vey low appearance frequency)
- to use different color tone (saturation) on the neighboring tags
9 Sitepoint great books on webdesing
http://rapidshare.com/files/66092901/9_site_point_e-books.rar
The Photoshop Anthology: 101 Web Design Tips, Tricks & Techniques
The Art & Science Of CSS
Build Your Own Web Site The Right Way Using HTML & CSS
The Principles of Beautiful Web Design
The CSS Anthology: 101 Essential Tips, Tricks & Hacks, 2nd Edition
The Flash Anthology: Cool Effects & Practical ActionScript
Build Your Own AJAX Web Applications
Firefox Secrets
Simply JavaScript
Tuesday, April 29, 2008
Navigation Menu
http://subi2xezequiel.blogspot.com/2008/02/sothink-dhtml-menu-v-8.html
After installation and replaced the DHTMLMenu.dll on the C:\Program Files\SourceTec\Sothink DHTML Menu 8
Bring up the application and click on top menu bar - Sothink tab, choose the menu you like, then the program will bring you to the sothink Free Download page
Download DHTML menu builder --- Sothink DHTML Menu, to create JavaScript cross browser menu, pop-up navigation menus in clicks!
Go click on the following:
Please download version 8.5 directly.
Dreamweaver Spry Menu
This tutorial was post originally on ZeForce.com
Another Tutorial Part 1 Part 2 Part 3