网页制作实战项目五:根据网页效果图制作网页

了解网页制作全过程,能够根据网页效果图PSD源文件,切图并制作出网页。

【时间要求】 2 学时( 45 分钟× 2=90 分钟)

【上机内容】 能够根据网页效果图制作网页

1、设计人员根据用户需求制作页面效果图,源文件一般为PSD格式文件,可以保存为JPG格式图片。

2、如用户满意,则根据需要使用PS切片工具切出所需图片,否则返回第一步。

3、网页设计师根据页面效果图,利用所提供素材制作页面。

【上机目的】

1、 了解网页制作全过程,能够根据网页效果图制作出网页。

2、掌握DIV+CSS布局的方法和技巧

3、掌握PS切图技巧

【上机重点】

1 、PS切图技巧

2、DIV+CSS布局的方法和技巧

【上机难点】

如何根据效果图,切图并制作网页。

注意:

网页制作中,特别是效果图的制作可以使用多种工具,如:

Photoshop:图像处理、编辑、通道、图层、路径综合运用;图像色彩的校正;各种特效滤镜的使用;特效字的制作;图像输出与优化等,灵活运用图层风格,流体变形及褪底和蒙板,制作出千变万化的图像特效

CorelDraw:通过CorelDRAW9的全方面的设计及网页功能融合到现有的设计方案中,制作矢量的插图、设计及图像,出色地设计公司标志、简报、彩页、手册、产品包装、标识、网页及其它。

Illustrator:图形绘制、包装、宣传页的制作,让你更加方便地进行LOGO及CI设计

请在规定时间内制作出以下网页:

《web开发技术》实训项目六

页面效果图PSD源文件及切图下载:网页制作实战项目五:根据网页效果图制作网页PSD源文件及已切分的图片.zip

同学们应好好学习设计师设计的PSD源文件,图片已经帮大家切割好了,如果想自己练习切图的话,可以在PSD源文件里使用切片工具自己切割,同时思考为什么要这样切图!!用到的文字可以去PSD源文件里面复制。

参考案例:设计师网页效果图    最终网页浏览

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/1870.html

(15)
江山如画的头像江山如画管理团队
上一篇 2018年5月3日 下午9:06
下一篇 2018年5月8日 下午12:18

99%的人还看了以下文章

  • Table布局 VS Div+CSS布局,选哪个?

    Table布局 和 Div+CSS布局的争论,过了7-8年了,今天看到一篇文章《为什么我们不建议用Table布局》,又想发表下自己的见解,供初学网页制作的新手参考。 《为什么我们不建议用Table布局》节选: Table要比其它html标记占更多的字节。 (延迟下载时间,占用服务器更多的流量资源。) Tablle会阻挡浏览器渲染引擎的渲染顺序。 (会延迟页面…

    2018年12月21日
    5.2K0
  • 赞!UI设计师必须学习的3个色彩理论

    彩搭配在设计中很重要!不同的配色方案呈现出不同的效果,搞定配色!请学习最好的配色教程 色彩模式  1、RGB色彩模式。通过光的三原色相加混合产生的。显示器的所有色彩都是通过红色、绿色、蓝色这三原色混合来显示的。 2、CMYK 色彩模式。是指墨水或颜料的三原色加上黑色这四种颜色,混合后出现的色彩。CMYK是打印机等印刷设备使用的色彩模型。 3、索引色…

    2022年8月10日 网页设计
    3.6K0
  • 设计师必收藏的22个设计素材网站

    设计素材,是设计师创意的利剑。中国网页设计对素材门户网站进行整理,给广大设计师推荐国内最好的22个设计素材网站

    2020年2月23日 网页设计
    17.8K0
  • web开发技术项目评分标准

    是否符合网站建设规范(10分) 包括文件名、目录、代码、选择器命名、有无适当的注释等。 主题突出(10分) 全站围绕一个主题及其周边内容进行建设,不存在和主题不相关的其他信息。 内容丰富、完整,工作量饱满(20分) 内容健康、积极向上,具有可读性、艺术性。设计思路清晰,明确表达设计意图。网站页面数量要求包含至少一个主页和四个或以上的二级页面、三级页面。每页页…

    网页设计 2018年6月1日
    7.8K0
  • 设计师提升作品精致度的4个方法!

    提升作品精致度的方式:1、选择背景要高清、尽量选简不选繁;2、中、英文字要使用相对应的字体,提升整体层次感;3,善于使用图形化的元素,但是要注意尽量不要太复杂,否则会影响整体视觉感受;4、合理的留白,但是要避免盲目过度的留白;

    2023年1月24日 网页设计
    9.2K0
  • web前端开发学习路线

    如果你是新手,准备学习web前端开发的话,一定要想想为什么要学习它?性趣、爱好、获得一份相关工作…… 定位好自己,持之以恒,然后是多学、多思、多练、多交流、多总结,发现自己的问题,然后克服。在状态不好的情况下,要及时调整,多向大牛请教,那样往往能让自己成长的快,切勿急躁。 初学web前端开发可以看一些入门视频教程,之后可以买一些书,做一些小项目,要学会分析自…

    2018年1月18日
    8.5K0

发表回复

登录后才能评论