400-609-4309

网页设计必备知识

网页设计必备知识

以下就是网页设计必备知识等等的介绍,希望为您带来帮助。

网页设计必备知识

(一)什么是主页

Internet快速发展,网民人数激增,能在网上拥有自己的主页是网民的心愿。在网络中有一种配置较高,24小时开机的计算机,之间连接在internet上的服务器。利用浏览器,通过internet可以直接查看硬盘(服务器)上的文件,这就是我们讲的网页。很多网页合起来就构成了主页。

(二)主页空间及免费服务

要做主页首先要在internet上找一个服务器空间放置主页。大的网站可以给你提供30M至100M的免费主页空间让你使用。因为是免费的,服务功能少一些。你要享受更好的服务,可以申请虚拟主机,但这是要收费的。

申请到主页空间后,会得到一个域名,就是你的主页地址,在浏览器地址栏输入这个网址就可以浏览你的主页了。如果网址名太长不好记,还可以申请一个新的域名。域名有免费和收费两种,免费的域名,注册一下就可以了;收费的域名要到指定的机构办理手续。国外域名可以自由申请,一个域名一年约十几元钱。

在internet上还有免费的计数器和聊天室,都可以用到你的网页中去。

(三)网页实际是文本文件

网页是用文本文件组成的,扩展名是htm或html。最初用html(超文本标记语言),现在扩展为有HTML、CSS、JAVAscript组成的DHRML,就是常说的“动态网页”。

网页是纯文本文件,可以用文本编辑软件来编辑,记事本是最简单的网页编辑工具了,但功能太简单。Ultraedit是具有很强功能的文本编辑软件,专为网页编辑提供了很强的功能。

(四)所见即所得的网页制作工具

用文本编辑软件做网页必须会HTML语言,所见即所得的网页制作工具,和WORD排版差不多,你只要将文本、图形摆到网页中,网页会自动生成HTML代码。

Frontpage是微软公司出品的网页制作工具,和WORD、IE结合得非常好,简单易用、易上手,是初学者比较好的选择,但兼容性差一些,制作的网页不支持Netscape等其他浏览器,对复杂的动态网页的设计能力有限。

Macromedia公司的Dreamweaver是相当优秀的网页制作工具,功能强大,操作方便,代码简洁,有强大的动态网页设计能力,与Fireworks、Flash等软件结合紧密,受到大多数专业网页设计者的青睐。

(五)网页的大小与传输速率

初学网页设计的人喜欢在网页上放很多漂亮的图片,看起来很舒服。但是图片多,会使网页的文件很大,浏览相当费时间。要尽量少用图片,必须用的话也要尽量想办法减小图片的体积。

(六)网页上常见的图形格式

JPEG和GIF是网页中使用比较多的两种图形文件格式。

JPEG格式文件的扩展名是JPG,是一种高压缩率的真彩色图形文件,可按需要调整其压缩质量和文件大小,是用得最多的一种静态图形文件格式。

GIF文件扩展名是GIF,是一种256色的动画文件格式,可以在网页中显示动画效果。GIF文件采用无损压缩技术,压缩后图形质量不会有丝毫变化,还可以使用透明背景。GIF文件要有专用工具软件制作,如Addbe公司的Imageread和Macromedia公司的Fireworks。

(七)gif动画的制作

gif move gear、Animagicgif也是小巧实用的gif动画制作工具。

(八)网页内容与网页设计

网页内容和网页外观像写文章一样,是形式和内容的统一。不要在网页中加入太多的华而不实的图片、效果,网页要尽量明快、简洁才好。

(九)上传网页

网页做好以后,就可以上传到申请好的服务器中,一般采用FTP上传网页(如Leap FTP、CuteFTP),也可以用浏览器上传网页。

用Dreamweaver、Frontpage提供的FTP功能也可以上传网页。

要注意的两个问题:

1、你的主页的第一个HTML文件必须是index.htm和index.html。这是你主页的大门。没有他,别人是无法访问你的网页的。

2、因服务器使用的操作系统不一样,所以网页文件名是区分大小写的。

网页设计必备基础技能

1、熟练掌握html/css代码

不管是否是做开发的,最基本的开发语言HTML/CSS 你是有必要掌握的,知道如何阅读、编辑并解决问题。然而根据设计师/开发者的实际工作情况,你所需要了解的程度、范畴甚至会更广一些。在任何情况下,你都应该清楚样式、色彩要如何通过代码来进行控制和调整,从长远来看,这些技能是极其有用的。

2、编辑图片

在任何设计领域都会和图片经常打交道,绝大多数甚至是需要整天编辑处理图片。从最基本的裁剪、调色和修补,你应该能够从容地修整图片,至少你应该了解如何能够尽可能好地对图片进行优化。

3、了解印刷

虽然大多数时候可能都在忙于数字化的设计,但是总会有一些设计是需要借助到印刷的。从名片到新闻稿,这些东西在设计之初就要为印刷做好准备。在这方面,最值得注意的还是不同媒体的分辨率和色彩的控制,避免万一你要的是深红色,结果印刷出来是暗红色!

4、书写标题

在进行网页设计的时候,正文部分可用假文(Lorem ipsum)来作为占位符,但是标题则不能如此。当你在进行概念设计的时候,标题是视觉和内容信息的粘合剂,它不能随便找句话放那儿。一个合理的标题文本可以清晰地告诉客户这个地方要多大的空间,有什么样的效果,它会给客户留下清晰而持久的印象。

5、熟悉各种设备

作为一个网页设计师,肯定要熟练地用各种数字设备来浏览网页。不同的系统、不同的设备在浏览网页这件事情上还是有差异的,所以你应当适时地离开自己最熟悉的电子设备,去尝试更多的数码设备,确保自己的网页能在任何情况下都可以流畅地浏览。

6、敢于手绘

也许你并不是美术专业出身,但是你需要敢于用草图来传递信息。讨论中不论有什么样的想象和构思,用手绘和草图来表现能够更清晰的阐述出来。请记住,线框图和大纲才能更好地传递信息。你无需成为手绘大师,不用字写的非常漂亮,但是你需要敢于这么做,自信地用手勾勒出这一切,与人分享。

7、使用通用框架

在创业阶段使用常见的网页设计框架并不是什么丢人的事情,实际上,除非你真的是特别专业而强大的开发者,最好还是使用通用的框架。使用通用的框架可以让别人也更好的使用你的网站和产品,如果你的网站需要最终交付给客户,那么从长远来看,用通用框架更好维护。

8、备份和打包

网站看起来是个完善的整体,但是实际并非如此,它同样是容易损坏且脆弱的。备份网站是一门必修课。你应当了解网站系统中哪些东西比较容易损坏,多久备份一次比较合理。即使你不明白其中的道理,至少要了解哪些需要保存,备份应该备份在什么地方。

此外,你应该了解如何将网站样式、设计相关、个性化、客户文件以及系统的关键性文件在哪里,以及如何打包它们。

9、了解趋势

简单来说,重要的不是对所有趋势如数家珍,但是你至少要深入了解至少三个流行趋势,能够说明白这些设计趋势在视觉上的特征,为什么要用它们,它们的运作原理是怎样的,你为什么喜欢或者不喜欢它们等等

10、解释设计理论

色彩、流程、平衡、比例、间距,这些常见的设计概念你都了解了嘛?当你在进行设计项目的时候,这些概念你都应当了解并运用起来。设计并不是单纯的好看,内在的概念也原理能告诉你为什么它这样才会漂亮。理解了它们,能自己解释它们,你才能创造出平衡的美感。

网页设计的一般流程

如果是基于商业型的网站,可大致分为七步:

一、购买空间和域名;

二、整理客户资料,要根据客户的要求来构建我们的网站;

三、初步设计页面效果,先设计几个主要的页面出来;

网页设计必备知识

四、根据客户的要求修改网站;

五、整体网站制作;

六、将做好的网站上传到网络空间;

七、后期维护及推广。

如果是基于个人的网站,可大致分为五步:

一、申请免费空间域名,因为是个人的网站,如果购买的话很不划算;

二、整理个人网站的资料,想好要做一个什么样的网站;

三、整体网站制作;

四、上传到网络空间;

五、后期维护及推广。

网页设计实用法则

一、纠结的时候,让自然为你做决定

遵循自然规律的设计总是因为贴近万物本源而受到更多人的宠爱,因此,当你举棋不定的时候,你可以选择将设计代入大自然定律中,让自然为你做出最好的决定。比如,现实和自然告诉我们,光源来自天空,在人们也已经习惯了这种由上至下光线来源的时候,设计师需要做的应该是能顺应用户视线的光线设计。

二、脱离色彩诱惑,能真正看清布局设计

色彩对人类视觉的冲击力能产生最大的效果;一个网页的用户体验是否合格,从色彩和布局上就能看出一二。但在色彩的“陪同”下,布局的好坏与否似乎就此被“矮化”。为了让设计师在设计时能更加清楚的审视网页布局,去色或是“灰度模式”的使用也许更有利于新手的布局设计工作。

没有了色彩“打扰”之后的网页布局一旦能够让自己满意,再按照色彩理论或是个性喜好添加和更改颜色。

三、设计感是“留”出来的!

大胆留白是设计概念中常常会提到的理论,但真正能根据理论具体落实的设计师却为数不多。可能是因为设计师胆儿不够大(PS:怕被客户喷死,“你是不是偷懒啊!怎么内容那么少!你到底有没有认真做设计啊!@#¥%……&*!”),另一种可能是没有在实际中领会到留白的美妙。

网页设计中的留白是为了在有限的容量中预留一些让其中元素呼吸的负空间,并不是一种所谓的“偷懒”行为。大片留白在国内市场中极有可能面对各种不满,但小范围的留白却能很有效的提高整个网页的档次。比如网页中图片与字句之间的间距,只要留出两倍及以上的间隙,整体都会展现出令人眼前一亮的简洁感。

四、试试把文字直接放在图片上

这种设计手法看起来很简单是不是?但要用这种方法设计出一鸣惊人的网站就有一定难度了。在应用过程中,为了不破坏网站的用户体验,有几点可以特别关注。

文字的颜色尽量使用白色,让网页看起来更大气;因此,网页背景图的色系选择以暗色为主;更细致的话可以再不同的分辨率下进行调试,保证在所有的情况下文字或主要内容都是易于辨识的。

五、关于字体,适合比新颖更重要

“坚定求新”是很多设计师的职业病,其实,在任何事件中,适合,比什么都重要!

在网页字体的应用中,形形色色的字体样式会让设计师不知如何是好,设计师也许会因此挑花了眼,也许会始终在常用的几种字体中互相转换。而关于字体的选择,设计师应该根据图片中的某些元素作为灵感,以此在网页中自然地形成隐形线索。

六、只有强弱并存才会获得对比

用强弱的对比展现重点突出是设计中强调内容最自然的方式。比如背景图的弱化,加上清晰的文字或图案,网页会因此营造出以后总别致的唯美效果。如果图片比较单调,也可以在背景和文字的中间添加一些透明度较高的线性几何成分,让页面丰富充实起来,也让整体不再单薄。

七、你需要一双善于发现的眼睛

身边的一切都可能随时为你带来灵感,千万别吝啬你的眼睛!

每一个细小的部分都有资格成为你的设计元素,你应该让它们产生一些小改变,它们就会让你的设计大提升。滤镜?几何?每一种效果都需要你的尝试。

八、桃红色&浅橙色!她们才是真正的百搭色

粉嫩的暖色系色彩一直会被误认为是很难用的颜色,当这类色彩被混杂在五颜六色的“调色盘”中的确够难搭配,那不妨尝试一下在单色背景中使用她们,无论是稍作点缀,还是设置为主色调,你都一定会发现其中的不张扬魅力。

九、导航是网页中最重要的设计

导航可以说是整个网站中最重要的设计,用户体验舒适与否很大的决定权源自于此。对导航设计的最佳评价应该是“召之即来,挥之即去”。幽灵按钮、汉堡图标和无线框纯文字设计都是好导航的常用设计手法。

不需要的时候,导航只是个小小的汉堡图标。

可以根据你的意愿让它随时消失。

九、减去页面之间的相同存在

相同的部分在网页设计中显得毫无意义,不仅让网页逻辑变得繁杂琐碎,更会让用户觉得反感。尤其在布局一致的情况下,内容的差异化尤为重要。这些差异化可以从很多方面表现出来,比如色彩、文字、风格等等。

总结:

以上是我们为正在努力加油的大家总结的网页UI设计法则,有可能你对上述内容已经听闻过许多,但其中的意义还需要在实践中渐渐摸索领悟。

12 12 分享:

相关课程

发表评论

登录后才能评论,请登录后发表评论...
提交评论

最新文章