PS入门教程:关于网页设计和网站策划

2015-04-22 19:20 167 1 收藏

下面是PS入门教程:关于网页设计和网站策划,希望大家能够喜欢,还有文章的底部会给出一整套photoshop基础的教程的url,想学习photoshop的朋友千万不要走开。

【 tulaoshi.com - PS 】

下面我们就网页设计这个领域做一些专门介绍,这些内容按照原计划应该包含在本书中,由于篇幅所限不得不取消。不过没关系,我们会继续制作相应的教程继续供大家学习。Photoshop和Illustrator都可以制作网页设计稿,但我个人觉得Photoshop在这方面更出色一些,主要是因为图层样式较为丰富,可以很容易地制作出各种流行的效果。因此我都是用它进行网页设计。但是如果需要制作徽标或一些插画风格的人物,就需要Illustrator去完成。而同样的工作让Photoshop去完成就较为吃力。就好比让使刀的选手参加剑术比赛一样,吃力却不讨好。如果网页设计稿是以插画风格为主,如当下流行的一些韩国风格的手绘人物、风景等,那就需要大量使用Illustrator进行绘制。将绘制的结果输入到Photoshop中进行页面整体规划。

在初学阶段,都倾向于使用Photoshop进行设计和图片切割,然后直接输出为html的网页文件,可以直接在浏览器中查看。这种方法的优势很明显,那就是简单易行,不需要你具备网页基础知识就可以完成网页制作。但缺点也很明显,页面结构单一死板,缺乏灵活性,修改时往往牵一发而动全身。对其中一个小部分修改也要整体重新输出一次。因此只适合用来制作单页的,基本不再需要修改的网页。一些单页的设计稿,如海报等,本来就没有多少内容,将来也没有什么机会修改,就可以采取这种方式直接搞定。

在熟练阶段,不再以html的形式,而只是单纯输出各个图片,然后在网页制作软件中,利用网页元素进行重组。在我们教程网站上GoLive基础视频教程中的方法就属于此类。所谓网页元素就是表格、背景、浮动层、CSS样式等。通过这种方式制作出来的网页,就具备灵活的布局,方便修改。并且可以很好地与数据库及编程人员进行工作交接,由他们完成网页中与数据库和脚本相关联的动态部分。

在大师阶段,就不再以Photoshop进行布局设计,完全使用网页制作软件,以网页元素来构建所需要的页面。我们的教程网站就是按照这种方式在GoLive中建立的。这种网页及网站的风格一般都较为简明,专注于内容的传播,没有过多的装饰。此时大家应该是具备非常丰富的网页制作经验,且具备良好的网站策划能力,能判断在整个页面中,哪个栏目重要哪个次要,并在布局上适当分配,较好地引导浏览者。到了这个阶段,就基本与Photoshop无关了,只有在遇到一些需要处理或需要制作的图片时才偶尔使用。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)

在我们的后续教程体系中,关于网页设计制作的内容就是按照上述的三个阶段进行。一开始并不涉及其他软件,重点讲述Photoshop的使用。虽然名为初学,却是通往更高阶段的必经之路。而在以后Photoshop的比重就会下降,逐渐淡出,重点转向讲述网页制作软件的使用以及整体的策划思维。这样大家就能同时具备平面设计和网站策划两种能力,虽然实际上它们分属不同领域。因为我本人就是以上这样一个过程,所以希望倾我所学将这些经验告诉大家。

感谢大家的坚持,到这里基础教程部分全部完成了。如果是从头到尾看完的读者,你们现在已经具备了非常全面的能力了。今后请尽可能地帮助遇到问题的初学者,不要因为他们的问题过于简单而不加理会。知识要分享才有价值。

马上开始你们自己的大师之路吧!祝大家一切顺利!我们后会有期!

阅读了本教程的人还看了:

photoshop自学入门全套基础教程

ps教程新手入门抠图大全

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)

来源:https://www.tulaoshi.com/n/20150422/168421.html

延伸阅读
标签: Web开发
在网页制作中,有许多的术语,例如:CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识,而在你学习这篇入门教程之前,请确定你已经具有了一定的HTML基础。下面我们就开始一步一步使用DIV+CSS进行网页布局设计吧。 所有的设计第一步就是构思,构思好了,一般来说还需要用PhotoShop或FireWorks(以下简...
标签: Web开发
CSS入门教程:网页首字下沉 :first-letter 版本:CSS2 兼容性:IE5.5+ 语法: Selector : first-letter { sRules } 说明: 设置对象内的第一个字符的样式。 此伪对象仅作用于块对象。内联要素要使用该属性,必须先设定对象的 height 或 width 属性,或者设定 position 属性为 absolute ,或者设定 display 属性为 block 。 在此伪...
标签: PS PS基础 PS抠图
PS入门教程6-1:像素亮度 在学习本章节内容之前,请务必掌握入门教程第一章中的色彩基础知识。 通过色彩基础知识的学习我们知道每个象素都有相应的亮度,这个亮度和色相是没有关系的,同样的亮度既可以是红色也可以是绿色,就如同黑白(灰度)电视机中的图像一样,单凭一个灰度并不能确定是红色还是绿色。 所以,像素的亮度和色相是无...
标签: PS基础 PS抠图
:“新手应该怎样做学习Photoshop”?为了帮助解决这个困惑,将更多的PS爱好者领进门,特整理编辑了《新手学习Photoshop入门教程》(原书由赵鹏编写)。本入门教程注重基础知识,辅以经典实例,是新手学习Photoshop很好的参考资料。        1201我们先来明确几个概念。 首先,要记住路径是...
标签: PS PS基础 PS抠图
在最初的版本中开发者就加入了一种称为“滤镜”的功能,所谓滤镜就是允许其他人利用Photoshop的图像处理内核来快速制作指定的效果。比如我们可以使用工具 依据鼠标轨迹模糊图像,但如果要将整个图像均匀地模糊则显得很困难。这样就有人开发了执行模糊功能的滤镜,这个滤镜可以使图像均匀地被模糊。需要注意的是,模糊功能并不是这个滤镜产生...

经验教程

298

收藏

42
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部