界面定制技术讲解－photoshop切图技术
一，基本概念
1，切图，是一种网页制作技术，他是将美工效果图转换为页面效果图的重要技术。Fireworks也提供了切图技术，Flash则直接提供了网页格式输出技术（不需要切图）。
2，切片，是切图的直接结果，切图实际上就将图切分为一系列的切片
二，切图操作过程
1，切图工具图标的识别
2，切图基本操作
1）基本操作有两个：划分切片和编辑切片
划分切片，是使用切片工具，在原图上进行切分的操作。
编辑切片，是对切分好的切片进行编辑的操作，编辑包括对切片的名称、尺寸等的修改等等
下面我们看一下这两个操作
2）基本操作
如果想移动某个切片，可以使用“切片选择工具”选择某个切片，并用鼠标进行拖动，也可以使用实现，另外如果想精确的细微移动，则可以使用实现
如果想将某个切片存为某个图片输出，可以使用“切片选择工具”选择某个切片，然后选择“文件”菜单，并选择“存储为Web所用格式(W)...”，然后在弹出的界面中...
3，切图技巧
1）一张图，可以有多种切分方式，如下：
既然存在n多种切图方式，那么是不是哪种方式都可以满足要求？
答案：不是的。
一般对页面的要求是，当页面大小发生变化时，页面的各部分可以相对自由地伸缩，而不会使页面发生错乱或变形等问题。
我们切分好的图是要输出为Html格式的网页文件的，然后通过网页编辑器，将该页面进行加工，做成符合要求（例如可以根据内容多少，自由伸缩等）的模板页面。这其中，切图的方式直接影响着模板页面是否能够满足实际的要求。
我们来看一个例子：
2）切图技巧主要有几下几点
属性均匀的区域适合分为一个切片，均匀主要是指颜色和形状都没有变化，或者在X或在Y方向上没有变化。
属性渐变的区域适合分为一个切片，渐变有两种表现形式
颜色渐变
形状渐变
根据原图的内容布局，确定整体的切分策略，即切分要有分块的思想，要在想象中将整个布局看成是一个两个table，然后在具体到每个table，去考虑里面应该如何切。
下面通过几个图例来说明
三，切图的Html格式输出
切图完成，就可以输出为Html格式的页面了。
在“文件”菜单中，选择“存储为Web所用格式(W)...”，在弹出的页面中直接选择“存储”，然后在弹出的界面中，填入文件名，保存类型选择“HTML 和图像(*.html)”，设置为“默认设置”即可，切片选择“所有切片”。然后点击“保存”按钮就可以了。
后面的事情，就是编辑输出的Html页面了。
界面定制技术讲解－sitemesh技术的应用
一，基本概念
1，Sitemesh是一种页面装饰技术，它通过过滤器(filter)来拦截页面访问，并根据被访问页面的URL找到合适的装饰模板，然后提取被访问页面的内容，放到装饰模板中合适的位置，最终将装饰后的页面发送给客户端。
2，在sitemesh中，页面分为两种：装饰模板和普通页面。
1）装饰模板，是指用于修饰其它页面的页面。
2）普通页面，一般指各种应用页面。
3，接下来，我们通过一个简单的例子来说明一下sitemesh修饰网页的基本原理。
二，模板修饰网页的原理
通过Sitemesh的注册机制，告诉Sitemesh，当访问该路径时使用XXX模板（假定使用前面那个模板）来修饰被访问页面。
当用户在左边导航栏点击“戏说长城”（ /ShowGreatWall.do）时，右边的“戏说长城”页面将会被指定的模板修饰
总结上面过程，Sitemesh修饰网页的基本原理，可以通过下面来说明：
三，Sitemesh的配置与使用
1）WEB-INF/web.xml中加入filter定义与sitemesh的taglib定义
sitemesh
com.opensymphony.module.sitemesh.filter.PageFilter
sitemesh
/*
sitemesh-decorator
/WEB-INF/sitemesh-decorator.tld
sitemesh-page
/WEB-INF/sitemesh-page.tld
2）创建WEB-INF/decorators.xml，在该文件中配置有哪些模板，以及每个模板具体修饰哪些URL，另外也可以配置哪些URL不需要模板控制
decorators.xml的一个例子如下：
/Login*
/*
/showinfo.jsp*
/myModule/GreatWallDetailAction.do*
3）我们看一个修饰模板的例子
Hello World
4）我们看一个被修饰的页面的例子：
Hello World
Decorated page goes here.
5）我们看一下装饰模板中可以使用的Sitemesh标签
*
取出被装饰页面的head标签中的内容。
*
取出被装饰页面的body标签中的内容。
*
取出被装饰页面的title标签中的内容。
default为默认值
*
取出被装饰页面相关标签的属性值。
Html标签的属性
Body标签的属性
Meta标签的属性（注意如果其content值中包含“>或
将被装饰页面构造为一个对象，可以在装饰页面的JSP中直接引用。
6）看一个在装饰模板中使用标签的例子
从meta中获取变量company的名称：
下面是被修饰页面的body中的内容：
7）看一下相应的在被修饰页面中的代码：
我的sitemesh
function count(){return 10;}
这是一个被修饰页面
四，总结
1，Sitemesh最为重要的就是做用于修饰的模板，并在decorators.xml中配置这些模板用于修饰哪些页面。因此使用Sitemesh的主要过程就是：做装饰模板，然后在decorators.xml中配置URL Pattern
2，分析整个工程，看哪些页面需要抽象成模板，例如二级页面、三级页面、弹出窗口等等可能都需要做成相应的模板，一般来说，一个大型的OA系统，模板不会超过8个。