网页设计注意哪些问题
用户的眼睛喜欢有秩序的设计，如头部包含导航和LOGO，特定内容使用lightbox，三列分栏，页脚。它有助于在内心组织重要的信息，并引导用户注意在你想让他注意的地方。下面介绍网页设计注意哪些问题，希望对您有所帮助。
1.没有内容层次
用户的眼睛喜欢有秩序的设计，如头部包含导航和LOGO，特定内容使用lightbox，三列分栏，页脚。它有助于在内心组织重要的信息，并引导用户注意在你想让他注意的地方。在传统艺术中，新手们被教导色彩价值和线性透视三原则和其他艺术指导。在网页设计中，没有特别奉行的准则，但以直观的方式组织你的内容是一条很好的经验规则。也是多年培养的用户习惯。最终习惯就是最终用户。当然一成不变不是我们所鼓励的。
2.太多的色彩
背景一种颜色，内容文本一种颜色，链接一种颜色，页头和lightbox一种颜色，图案和页脚各一种颜色。这很好，因为它帮助区分了有用的内容。但是，多重渐变几种鲜艳的色彩和大量有鲜明对比的色调及饱和度，会破坏你网站的层次和空白概念。尝试限制自己只用一种鲜艳的色调(如蓝色)，再搭配反相的单色(白灰黑)以获得一个漂亮的搭配。这里强调下豆瓣的配色。也是我喜欢的颜色搭配。
3.太多的字体
一般一个简单的网页设计，一般字体不超过3种。多则乱没有足够的空白
空白可以说是设计中最重要的一部分。它有助于防止用户在浏览网站时变得疲惫，它可以在内容中划出距离，而且它本身也看上去不错。空白不是必须用白色的，而是，它仅仅是为其他设计元素提供间隔和缓冲的空间不考虑用户的分辨率
4.分辨率
你的屏幕分辨率有2560像素，这非常好。但很多人还在屏幕上用1024像素的分率，有些还在用640*480或800*600。虽然这种分辨率的显示器正在减少，但采用更小的分辨率的手机设备也来了。现在的网页设计宽度标准是960像素，虽然没有照顾到每一种分辨率，但在主流分辨率上可以呈现的最好。假如你希望面对大量的手机用户，最好考虑一个手机版设计。
5.对比的问题
你考虑过阅读黑底白字和白底黑字的不同吗?你有没有试过阅读一下白底灰字?有些方式之所以比其他的更好，其原因就是这是一种眼睛感知到对比的方式。如果你很难舒服的阅读文字，考虑一下改变字体大小或方式。成为一个大师级网页设计师的秘诀：对比，对比，对比。
同一件事情做的不够多，或做的太多(过犹不及多重导航非常好，如一个在页头一个在页脚。在页脚加一个”返回顶部”的按钮也很好。但是，太多指向同一目标的途径会降低可用性。让你的奶奶用下你的网站，如果她搞不定，想想哪些东西让初次访问的用户拒绝使用这个网站。
6.不一致
一致性是网页设计的关键。它是把网页设计组织在一起的方式，可以创造一种紧密结合的感觉。在网站页面互相链接的情况下，它可以帮助用户把所有页面都联系在一起。如果你在整个网站持续改变字体大小和色彩，用户很快会觉得不知所措。
7.贫乏的尺寸大小
标准做法是h1的文字大于h2的文字，头部文字大于段落文字。尽量保持一致的尺寸，因为它有助于一致性(第8条)和内容层次(第4条)。保持文字的可读性，但不要太大，让字体的大小表现信息的重要性。还有，10像素以下的尺寸对大量阅读的人来说太小了。
8.没有足够的文字间距
与空白有关，文字间距有两个部分，一个是字距(这个不能用CSS直接调整，可以通过一些高级技术解决)，关系到字母之间的空白。一个是行距，可以用CSS直接调整，关系到两行文字之间的距离。这些有助于区分行与段落，使用户更容易阅读文字。
网页制作中需要注意的问题
一、网页设计稿中特殊字体的处理
网页浏览者在看网页时使用自己电脑上的字库来显示字体的，如果在制作网页时用了特殊的字体，必须保证浏览网页的用户的电脑上也有这样的字库才能看到相同的效果，如果用户的电脑上没有所定义的字体，那么它会自动用系统默认字体来显示，一般中文的默认字体都是宋体。
特殊字体只能做成图片。
CSS中常用的字体包括：宋体、黑体、微软雅黑、Arial、verdana、serif。
二、切图时应该保存成那种图片格式
1)JPG不适用于所含颜色很少、具有大块颜色相近的区域或亮度差异十分明显的较简单的图片。对于写实的摄影图片或是颜色层次非常丰富的图像采用JPG的图片格式保存一般能达到最佳的压缩效果。根据经验，在页面中使用的商品图片、采用人像或者实物素材制作的广告banner等图像更适合采用JPG的图片格式保存。
2)对于需要高保真的较复杂的图像，PNG虽然能无损压缩，但图片文件较大，不适合应用在Web页面上。图像上颜色较少，并且主要以纯色或者平滑的渐变色进行填充。或者具备较大亮度差异以及强烈对比的简单图像适合使用PNG格式进行存储。
3)PNG8支持1为布尔透明通道，所谓布尔透明值得是要么完全透明要么完全不透明。而PNG24则支持8为的Alpha通道透明，也就是说可以存储从完全透明到完全不透明一共256个层级的透明度。
4)对于小图标或小动画，可以保存成gif格式。
三、制作中需要注意的问题——z-index属性
1、z-index属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面
2、该属性设置一个定位元素沿z轴的位置，z轴定义为垂直延伸到显示区的轴。如果为正数，则离用户更近，为负数则表示离用户更远。
四、兼容问题的技巧
1)写DTD声明
2)为网页样式引入CSS重置代码，重置各浏览器默认属性值。
3)同时为一个元素写float和margin-left或margin-right时，同时设置display：inline，为解决IE6双边距问题。
4)给元素设置高度后，同时设置overflow：hedden，避免在IE6中高度继续扩展的问题
5)对于文本，在使用margin-left、padding-left、margin-top、padding-top之前有限考虑是否可用text-indent和line-height代替，因为计算尺寸的代价相对来说要大些。
网页制作中需要注意哪些问题
1、XHTML和CSS文件注释
文件注释必不可少，但是要适可而止。注释太多回增大文件的大小，受带宽影响，用户在浏览网页时增加了等待时间，造成不好的用户体验。网站在上线前先要在测试服务器上进行测试，测试好没问题后，将相关的CSS文件、JavaScript文件先删除注释，然后进行压缩。这些文件的压缩可以利用下载相关工具实现，也可以使用在线压缩工具实现。
2、清除浮动的方法
1)在结尾出加空div标签clear:both
2)在父级div顶一overflow：hidden
3)在父级div顶一味蕾：after和zoom
3、CSS文档流
网页元素按照XHTML结构自上而下，从左向右一行一行得布局，叫做CSS文档流。
4、label标签中得for属性
当用户选择label标签时，浏览器回自动将焦点转到和标签相关的表单元素上。
5、zoom:1的作用
一般是为了解决IE6下样式不兼容的问题。
HasLayout是IE渲染引擎的一个内部组成部分。在IE中，一个元素要么自己对自身的内容进行计算大小和组织，要么依赖于父元素来计算尺寸和组织内容。为了调节这两个不同的概念，渲染引擎采用了HasLayout的属性，属性值可以为true或false。当一个元素的HasLayout属性值为true时，我们说这个元素有一个布局(layout)。
大部分的IE显示错误，都可以通过激发元素的HasLayout属性来修正。可以通过设置一些CSS属性来激发元素的HasLayout属性，使其“拥有布局”。在IE 6中就可以通过zoom：1来激发元素的HasLayout。
6、CSS Sprites技术利弊
利：减少对服务器的请求数量，进而加快页面加载速度。
弊：1)测算每个背景单元的精确位置，很繁琐。
2)如果页面背景有少许改动，一般就要改合并的图片。
7、word-spacing
修改字间距。简单地说，课室是任何非空白字符组成地串，并由某种空白符包围。所以象形文字是无法指定字间隔地。除非字之间有空格。因此，这个属性主要是针对英文单词地，要使其对中文起作用，需要在中文之间加空格。肯恩那个设计者认为两词之间没空格就是一个词。
8、display:inline-block;的使用方法
在桌导航条的时候，一般会用到ul-li结构，大多数时候我们是把li设置为浮动，让其并排显示在同一行。但是如果当行中li的数目不确定，并且又需要导航中的文字在页面中居中显示时，用这种方法就不太方便了，因为每次修改当行中li的数目量或文字时都需要调整ul或者第一个li标签的padding或者margin属性值。
还有一种方法就是设置li为“display：inline-block;”这样就可以达到同样的效果，而且无论有几个li标签或者li中的文字如何变化，只要设置ul中的text-align属性的值为center就可以实现ul中的所有文字水平居中显示。
IE6、IE7块级元素不识别inline-block，对于行内元素不存在兼容问题。可以用*display：inline;*zoom：1来代替。
移动端网页设计常见问题和技巧
1、针对移动端网站进行单独优化
移动端网站建设不同于PC端，因此我们就进行网站设计就需要保持导航的使用，并且在设计按钮就不要在拘泥于PC端一些设计经验，我们就需要通过专业移动端技术让移动网站建设或者是移动网站保持跟PC端的体验完全不同，优化好移动端网站更加注重移动端的用户体验。
2、移动按钮友好易用性
在移动端网站优化技巧中，对于移动网站按钮和滑屏的设置就需要简单实用，放置在主要和显眼位置，这样很容易让用户主动触发。但是，前提不能妨碍正常的页面。
3、搜索框居于重要位置
网站搜索功能对于移动网站来说是一项重要的功能，移动端页面优化就需要保持和留住搜索功能，并且这种功能需要居于重要位置。例如许多用户都倾向于使用搜索功能来商品的查找。因此，我们还是要把搜索功能放置到页面顶部。
4、移动端页面优化保持完整性
我们在浏览商城网站中，最让人无语莫过于图片问题，在PC端很容易实现图片的放大和缩小。但是，在移动端就变得十分困难，因此，在移动端优化中就需要把文字和图片以及页面宽度保持合理的配置，让用户很容易获得移动端网站内容信息。
5、高清晰的优质素材
一句话就是移动端对于素材要求很高，针对移动端页面优化就需要通过高清晰的素材拉开与竞争对手的差距。
6、灵活的交互设计
移动端最注重手触问题，再设计网站就需要切合手触设置合理的按钮，保持这种交互性对于用户的需求。
7、方便PC端和移动端之间的切换
对于很多用户来说，习惯于PC端之间的浏览和用户，因此我们在设置和优化移动端页面就需要注重移动端和PC端切换保持正常的进行，让用户在PC端和移动端畅通无阻的浏览和购买。
移动端优化并不是强迫用户适应我们的网站，而是根据用户行为来提升用户体验，并且这种优化移动端页面还需要控制分栏数目，通过CSS来控制页面宽度和位置，图片缩放等，良好的用户体验，再加上高清晰的产品图和添加放大功能，通过这种细节的调整，让用户浏览起来更方便。
