用户名称: 用户密码:
网站建设快速入口 | 宏蓝主页 | 加入收藏

广州网站建设|网站制作公司|网页设计论坛--广州宏蓝科技公司官方论坛网站建设专栏网站建设专题网页设计中HTML常范的五个错误
    
 
网页设计中HTML常范的五个错误
发起人:macroblue  回复数:0  浏览数:4879  最后更新:2011/7/27 1:13:28 by macroblue
分享到: 微信 更多

选择查看  帖子排序:
macroblue 发表于 2011/7/27 1:13:28
网页设计中HTML常范的五个错误
1.网页背景色的设置 <div class=spctrl></div>  犯错机率:很大 <div class=spctrl></div>  普遍性:较广 <div class=spctrl></div>  犯错可能性:懒/不知道 <div class=spctrl></div>  2.Align center(自动居中)的滥用 <div class=spctrl></div>  犯错机率:非常大 <div class=spctrl></div>  普遍性:非常广 <div class=spctrl></div>  犯错可能性:以为方便/以为好用 <div class=spctrl></div>  3.重复使用实现相同功能的代码、或杂七杂八的乱套代码 <div class=spctrl></div>  犯错机率:非常普遍 <div class=spctrl></div>  普遍性:非常普遍 <div class=spctrl></div>  犯错可能性:复杂多样 <div class=spctrl></div>  4.表格不正确嵌套 <div class=spctrl></div>  犯错机率:一般 <div class=spctrl></div>  普遍性:普遍 <div class=spctrl></div>  犯错可能性:对这个不了解 <div class=spctrl></div>  5.写代码缩进的时候,不是使用Tab而是使用空格 <div class=spctrl></div>  犯错机率:一般 <div class=spctrl></div>  普遍性:较少 <div class=spctrl></div>  犯错可能性:不知道Tab更好用 <div class=spctrl></div>  使用空格有二大坏处:1、缩进速度慢、修改速度慢。2、增大网页体积,会影响速度。 <div class=spctrl></div>  十个最重要的网站制作技巧复杂的网站设计总是很花时间,高级效果为设计增色不少,但如果用的不对,只会影响用户对重点内容的关注。高级效果可能正好是一项好的设计的冲击力所在,但即便如此,也还是需要一些更简单的效果与其配合。 <div class=spctrl></div>  简单的效果和技巧是建造当今设计的基石。比方说,如果你都不知道如何正确选择颜色和文字效果,灿烂的星光效果又能有什么用? 本着"Less is more"的理念,我们为你精选了十个简单好用的设计技巧,它们能大大提升你设计的专业性和感染力。 <div class=spctrl></div>  基础先行。 学会走之前要先学会爬,让我们从最基础的简单有效的网站设计的概念开始。

1. 增加对比

  很可惜,添加额外的对比是最被忽视和弃用的技巧之一。 <div class=spctrl></div>  Joost de Valk 采用了细的高对比度边线,让访客能更容易区分页面的不同区域。在上图中放大了的部分,你可以看到,大多数时候这种对比只是一条1像素的高亮线挨着1像素的暗线。 <div class=spctrl></div>  不过,这个页面上的“More”和“Go”按钮与周围的对比度太小,即使你刻意在找也很容易被忽略掉。 <div class=spctrl></div>  WordPress 为页面中最受欢迎的链接 “Download(下载)” 使用了对比色。 这种红色在冷灰色调的页面中自己跳了出来。但这红色在明度方面有所收敛,避免了影响页面整体效果。 <div class=spctrl></div>  如果你对于该不该使用对比犹豫不决,就把这一决定过程当做是化妆。你要做的不是让人们大吼“看呐,对比色!”,你需要的是自然而然的吸引他们注意页面中重要的内容,高亮出已经存在的重点。

2. 渐变

  技术的发展为所有想使用渐变的人提供了各种创造渐变的工具。但渐变真的很好么? <div class=spctrl></div>  Media Temple 网站的每一个页面都使用了渐变,不过其渐变使用的节制和精妙才是设计成功的关键。logo,大标题,按钮和背景都有细微的或者镜像的渐变,以强调内容。最复杂的渐变用在了那些简单的120像素宽的按钮(子页面中的“ACTIVATE”和“LEARN MORE”)上,因为它们是需要访客注意的重点。 <div class=spctrl></div>  Commission Junction的渐变运用远没有Media Temple的细致,而且采用了过于丰富的渐变类型: <div class=spctrl></div>  从黑色到灰色的水平线性渐变,位于页面顶部 页眉处的绿色径向渐变 登陆框背景的“CJ” 标志上方模糊的斜向渐变 输入框背景中淡淡的垂直线性渐变 导航条背景的垂直渐变 Webinar广告中明亮的线性渐变 另一个垂直线性减弱,用在了大标题处 这种设计有点冒险,大部分渐变式有用的,但还是存在一些问题。最突出的一点是,设计丧失了一致性。同选择可辨性强的色彩组合一样的道理,设计师也需要为每个项目选择合适的渐变组合。 <div class=spctrl></div>  例如,大的水平渐变(1)引导眼睛横向注视页面。这本没有什么问题,但就在此渐变的正下方又出现了把视线吸引到中心的径向渐变(2)和把视线引导到右下角的斜向渐变(3)。这会给访客造成困扰,起伏变化的视觉流(visual flow)也削弱了可读性。 <div class=spctrl></div>  使用渐变时,保证好的视觉流很重要:请保守而精致地使用渐变。最重要的一点,仅当对整体设计有帮助时才使用渐变。

3. 色彩

  合理使用颜色很有挑战性。在挑选完美的色彩组合和为各种色调找到合适位置的过程中,时间哗啦啦地就流走了。 <div class=spctrl></div>  Realmac Software 大胆地在404页面采用了全色系渐变。这样做有以下原因:首先,Realmac已经将页面背景设成了中性灰色,更重要的是,页面其余部分没有明显的色彩的,除了蓝色的文字链接和一些零星的毫无冲击力的色彩。 <div class=spctrl></div>  全谱色彩渐变完美地吸引了人们的注意。它保持了简单性,有着灰色的配合,也不会让眼睛感到不适。但在一项设计中采用四种或五种以上的颜色通常都显得太过了。除非你非常确信你的设计需要那么多颜色,还是采用简单的四色组合比较好。 <div class=spctrl></div>  当你在设计中克制而明智地使用色彩时,吸引访客对重要项目的注意力就变得相当容易。在 Interspire的 “About Us(关于我们)” 页面中,访客的注意力被迅速吸引到页面顶部LOGO那红色的一点上,然后是标题,然后是页面右边的LOGO照片。 <div class=spctrl></div>

  在字体上花点功夫。字体的艺术博大精深,远远超出我们大部分人的想象。字体中超出x高度部分(ascenders )和边位(side bearings)处的创作空间巨大,你可以在此处添加一些有趣的细节。不过还是运用接下来的一些技巧更重要。

本文摘自:网站制作_百度百科:http://baike.baidu.com/view/10410.htm


客服热线:020-85562980 客服邮箱:service@macroblue.net
联系地址:广州中山大道89号国家软件产业基地天河软件园华景园区12-S05
版权所有 © 2003-2011    网站建设宏蓝科技Macroblue.NET