网页导航栏制作

网页制作与photoshop
• 四个常用技巧 • 1、使用形状图层创建形状
• 2、善于运用图层样式中渐变叠加的图层混合模式
• 3、12像素以下的文字使用锐利（Crisp）的显示方式。 这样文字看上去会更加清晰。 • 4、黑白线条组成的凹陷分隔线
2 .用Dreamweaver制作
• • • •
插入导航条 插入鼠标经过图像 布局-----Spry菜单栏 用”层”制作
Logo设计原则
2.logo必须在缩放到任何尺寸时都能看起来清晰可阅
3. 巧妙运用颜色
选用色轮中相近的颜色 不要选用太过亮眼，使眼睛不舒服的颜色 Logo必须在黑白、灰度模式和两色的情况下也好看 单选用一种颜色也是个不错的主意
Logo设计原则
4. 设计风格与品牌匹配
5.文字排版十分重要
避开最常用的字体 确保缩小时字体易辨认，特别是手写体 使用同一种字体最理想，避免两种以上字体同时使用 推荐自定义字体。字体越是独创，品牌越是突出
• 文字型LOGO设计的三十种小技巧总结
• Logo在线制作http://logo.chinaz.com
• 国外40个创意有趣的字型Logo收集 • 33个创意和漂亮的logo设计 • 60个最新创意logo设计 • 国外30个优秀的logo的设计思维分析
Logo设计原则
1 初期草图是设计logo的重要开始步骤
二 导航栏制作
Content:
1. 用photoshop制作
2. 用Dreamweaver制作
3. Javascript特效
4. 其他软件制作
1 .用photoshop制作
1.新建,绘制矩形
2.应用图层样式,渐变叠加颜色: #949494 到 #d2d2d2 ;投影：#b1b1b1 ; 3.添加一些文字，颜色#383838 ,并应用投影效果,参数为正常,白色,80%,90度,1 00 4.添加边框.新建一个层,画2条白色的1px的竖线,图层模式柔光不透明度20% 再建一个层,绘一条#808080 竖线在白线之间,混合模式正常,35%
2 Mac风格的导航菜单
3 使用图标来达到视觉吸引效果
4 垂直的导航菜单
5 手工绘画风格的使用
其他创意导航栏欣赏
• 导航菜单设计赏析 • http://www.chinaz.com/Design/CoolSite/03231095412010.html • 三十个效果非常棒的水平导航菜单欣赏 • http://www.chinaz.com/Design/Pages/031510VO2010.html • 50个高质量的PhotoShop导航菜单教程 • http://www.chinaz.com/Design/Pages/0203105T92010.html
Logo设计原则
6. 简单明了 logo越简单，越容易辨识和记住
7.文字排版十分重要
避开最常用的字体 确保缩小时字体易辨认，特别是手写体 பைடு நூலகம்用同一种字体最理想，避免两种以上字体同时使用 推荐自定义字体。字体越是独创，品牌越是突出
Logo设计原则
8 慎用特殊效果
9 参考作品不是抄袭
10 常见logo的标准尺寸有110×38(像素) ，88×31(像素)等几种
3 .用Javascript特效
• 跳动的菜单 • 选项卡式导航 • 超酷仿GOOGLE首页导航菜单效果
4 .用其他软件制作
• 闪客精灵
• 123 flash menu • SWFText
3 .Logo制作
collections
作品欣赏 设计原则 制作工具
Logo作品欣赏
•
25个出色的使用叶子的logo设计
Logo设计工具
• Photoshop • Coreldraw • Illustrator
•
设计logo需要的是美学修养、文化内涵和丰富的想象力. 软件只不过是一个实现工具而已.
实验内容
• 欣赏优秀作品 • 为你的网站设计导航栏和logo
第五章
网页导航栏
网 页 设 计 与 制 作
苗红意 Email:seagirl@zjnu.cn QQ:83570686
一 创意导航栏欣赏
collections
1 “对话式”的导航菜单
2 Mac风格的导航菜单
3 使用图标来达到视觉吸引效果 4 垂直的导航菜单
5 手工绘画风格的使用
1 “对话式”的导航菜单