飞鱼 ^_^ 浆抱罗斯‘s blog

这里是一个非专业交互设计师-飞鱼-的博客。飞鱼的生活就像吃一盘螺丝, 你得努力吸才能品尝到快乐^_^

1 Nov 2009

乱翻乱教 – 时尚导航设计 – 傻瓜版教程

2009年11月1日 19:59 pm - 乱翻乱教 - 教程

时尚网站头部设计small

时尚导航设计 – 傻瓜版教程

作者：飞鱼
制作工具：Photoshop cs3
最近给一个朋友的一个教育类的网站做了个设计稿，后来因为公司开始忙了，就只弄了个设计稿，就这么停掉了，说来也惭愧，人懒啊~，不过也不吝啬，整理了一下这个头部的制作过程放出来分享给大家。希望有所收获
最近yupoo，发神经了，然后又被花花教导了一下，把图片放在MT上了。 = =

最终效果

时尚网站头部设计_000

步骤1 准备工作

首先当然是新建文件啦，尺寸为 1150*1000，
时尚网站头部设计_001_1
按ctrl+R调出标尺。设置标尺的单位为“像素”(在标尺上右键)，然后在左边的标尺上拖动，拉出参考线
分别拉一条参考线在100px，和1050px
飞鱼：我比较喜欢950px的布局，两边各留100px的留白。
时尚网站头部设计_001_2
拉好参考线的效果图如下：
时尚网站头部设计_001_3

步骤2 制作顶部导航

通常一个网站的头部包括一个顶部的导航，显示欢迎，登录，帮助等信息。
新建一个图层(topline)，使用矩形工具，在顶部，画一个颜色为#e9e9e9 的矩形，高度为25像素左右。(可以根据自己喜好调整)
时尚网站头部设计_002_1

Pages: 1 2 3 4 5 6

哟？不错哎订阅飞鱼的RSS Feeds 回去慢慢看^_^

您可能还对这些日志感兴趣

该文章已经被摸了738次。共有 10 条评论

1. Anonymous 2009年11月6日 at 15:25₪

学习

回复
2. seri 2009年11月10日 at 20:40₪

学习了，嘿嘿 =v= 最近忙的好充实啊

回复
3. 葉子 2009年11月25日 at 19:22₪

图片直接服务器上了？？？我的相册最近不知道发什么疯，很多图片看不见了

回复
飞鱼 Reply:
November 26th, 2009 at 11:25
yupoo 快挂掉了 = = 太少人付钱给yupoo了，还有就是 yupoo经常挂掉····
囧死了。

回复
4. 小豪 2009年12月7日 at 14:44₪

看完了。。消化下。。

回复
飞鱼 Reply:
December 7th, 2009 at 15:39
hoho~· 这个教程也做得我泪流满面

回复
小豪 Reply:
December 11th, 2009 at 9:29
不过挺好的

回复
5. 弃儿 2009年12月12日 at 7:59₪

大叔，你那个文章内的分页是什么插件呀？

回复
飞鱼 Reply:
December 12th, 2009 at 11:12
不是插件的說·~~ 添加文章的時候點more 然後吧more改成 nextpage 就可以了

回复
弃儿 Reply:
December 12th, 2009 at 18:39
噢~这么YD

回复