设计网页需要注意哪些细节

设计网页需要注意哪些细节

字体的排版的问题之大，远非绝大多数非设计人员想象的那么简单，文字和字母看起来很简单，但是它们可以成就好设计，也可以毁掉整个版面。下面介绍设计网页需要注意什么细节，希望可以为您带来帮助。

1、使用不合理的模板

用模板的确是一件非常方便的事情。大型企业用模板确实说*去，但是初创公司借助BootStrap做网站是情有可原。使用类似Bootstrap模板来作为基础，借设计师之手针对品*和企业气质稍加定制，其实是个很不错的主意，如果沟通良好，说不定较终能呈现出一个非常不错的网站，对于企业的产品与服务也是很不错的加成。

但是仅仅只是套用模板而不予以调整和定制，你所遭遇较常见的问题是模板与品*本身的视觉设计上无法达成一致，从LOGO使用的色彩，到品*中独特的字体，都无法与网站构成较高的匹配度。　　　　*如果你真的是在这方便也捉襟见肘的话，尽量挑选在各方面与品*形象本身更接近的模板，将疏离感降到较低。

2、使用默认外观

和中文网站的情况不一样，英文网站使用多种多样的字体是一件很轻松的事情。如果你使用了Bootstrap、Wordpress 这样的工具来创建网站，而仅仅使用默认的设置，你愚弄不了任何人，大家一眼就会把你偷懒的事情看出来——连字体都是默认的Open Sans。用Wordpress 默认外观也是一样的道理。如果你不打算在网站视觉上和别人稍作区别的话，对品*的伤害是显而易见的。

当然，如果你能用好诸如Font Awesome 这样的字体和CSS工具，也有点铁成金的奇效。它能以增加图标库和样式的方式，让Bootstrap等各式各样的系统，拥有漂亮一致的视觉语言。

毫无疑问，这些被精心制作过的原创的图标，自然是比系统内置的通用图标好。如果你有自己的创意和点子，为什么不去寻找更有个性，更符合你的品*调性的图标、插画和字体呢?也许时间成本、实现成本并没有你想象中那么高。

3、排版对比度的问题

字体的排版的问题之大，远非绝大多数非设计人员想象的那么简单。文字和字母看起来很简单，但是它们可以成就好设计，也可以毁掉整个版面。

在许多“自制”的网页中，较常见的问题是标题和正文字体之间的对比度较低，整个页面的信息层级不明显。仅仅只是调整字体大小并不足以构成对比，标题字体的字重应该比正文更大，也就是说字体应该更粗，确保它们够显眼，更容易被眼睛注意到。

4、使用深色背景

虽然背景处于网页的较底层，但是它实际上是占据网站面积较大的部分，在用户看到网页的时候会*一时间感受到，精心选择背景色彩很重要。

作为一个久经验证的法则，黑色色调的网站，除开真正专业的设计师做出来的，其他的基本都没法看。使用白色作为基本的背景色是非常安全的，*多数的设计师会选择浅灰色打底。值得注意的是，网站的灰度越高，黑色的文字的可阅读性越差，为了确保网站的可阅读性，灰度较好保持在15%以下。

网页设计有什么细节工作需要注意

关于网页设计的部分，很多人都把关注点放在如何突出网站重点、如何提高精美度、如何排版等比较大的方面上，很容易忽视一些细节工作。其实有时候，细节往往决定着成败，一个细节上的失误有可能毁掉整个网页设计。因此，为了避免这种情况，我们应该注意哪些细节工作呢?

网页上的细节涉及到很多方面，包括背景、颜色、线条甚至是一些阴影处理等等，如果能将这些细节都做到位了，就可以使网页设计整体提升一个档次。比如当我们使用一些色块时，就要考虑给它加上一些细致的材质纹理，使网站更有层次感，更有深度。

文字上的设计也要注重细节，比如字间距、字体、颜色、字号等方面。其中字间距要尽量保持统一，重要内容与次要内容之间可以使用不同的字体加以区分，但是字体间的风格要靠近、和谐。而颜色则建议使用黑色或者灰色，可读性更高，也更加符合用户的阅读习惯。

还有一点就是网页整体的整齐度问题，这个经常容易受到忽略。要做好这个细节，我们就应该在处理图片或文本等元素时，确保整个页面是水平对齐的，各个元素之间的宽度是一样的，空格距离也是一致的，特别是当不同形状的图片排列在一起时，更要做好这些细节，这样就可以取得良好的视觉体验了。

很多时候，网页设计的细节追求的就是一种统一性，比如横幅图片与页脚图片的统一、导航栏目条词语间的统一、共同元素间颜色的统一等等。如果网页中有网格布局，就更应该遵循细节上的统一原则，确保整体网站的和谐，真正做好细节设计。

以上这些网页设计上的细节工作，希望大家在进行自助建站的时候能够注意，如果能结合《什么是自助建站的一致性设计原则?》中其他的一致性原则，就可以令网页设计更加了。

网页设计应该注意哪些细节问题

减少不必要跳转。

有的时候你的网站可能需要处理一些信息而没有显示的网页，有些网站会用一个跳转页来解决。比如登录的时候，会先跳到一个空白页来设置登录状态，修改数据库等操作，然后再将用户定位到登录完成页。*跳转页的较大缺点就是会增加等待时间。而且容易导致操作失败(用户在这里刷新)。某外卖网站的支付功能在支付成功的时候，从到银行支付成功页点回到商户网站，会跳到一个支付完成页，然后跳到支付正在处理页，然后又是一个支付成功页，较后跳到订单成功页。我看着我的浏览器跳来跳去都觉得好难受啊。

后台可以用curl收发某些消息，也可以在较初的跳转页带上更多的参数，直接让结果页中的sql语句处理全部内容。

背景、边框和底纹。

有的时候这些背景，边框和底纹会直接的对用户造成使用上的影响。首先弹出对话框一定要有非透明背景。边框和底纹可以为用户标识操作区域。哪些区域是推荐修改的，哪些是无关紧要的之类的东西。如果提供给用户选择的是几个大区域，那么用不同的边框来标识出用户的选择也是很重要的。

给用户明确的反馈。

当你在做一个操作的时候，可能背后的javascript要执行很长的时间。这个时候你*明确告诉用户你正在处理一些东西。较常用的方法是将鼠标光标切换成wait模式，还有在网页上显示一个小圈圈的动态图。如果你用Ajax登录，那么在点击登录按钮之后应该显示一个“登录中”的提示。如果你的表单验证出错，你应该用红色指示出错误的那一项，并告知错误原因。有些网站会让那个框闪一闪，甚至直接把输入焦点重定位过去(这在你的表单很长时非常管用)。用ajax载入的东西，默认文本应该设置为“正在载入”，而不是用一个空div。总之就是让用户知道这张网页正在做什么，这样虽然不能减少用户等待时间，但是可以给用户一个心理安慰，告诉它们：我正在忙着处理你的数据。而不要让你的网站表现的像是失去响应一样。

明确的后退链接。

如果你的网页内容比较多，那么用户可能会深陷到一个很深的目录结构里，比如子栏目的子栏目，当他们想回来的时候并不容易。提供一个后退到*目录的链接(注意不是浏览器的后退链接，因为用户可能从子栏目的一个文章跳到另一个文章。)就可以有效的提高用户体验。如果允许，提供一个面包屑导航栏明显更好。如果你的网站有导航条，那么确保有一个“首页”链接。方便用户在网站各个栏目间跳转可以让用户更舒服。

企业在进行网站制作时需要注意的细节

一、网站整体颜色与主题不符合

在建站之前，首先要确定网站网站主题。比如说：音乐影视类的;科技类的;医疗保健类的;考试教育类的等等这些都属于网站主题。网站主题就等于是衣服，给网站穿上博客模板这个网站就是博客站的类型，每一个主题都配应相对于合适的颜色，如果搭配的颜色和主题不符合，就会影响视觉效果。

而网站主色调好比乐曲中的主旋律，起着主导的作用，单单只有主旋律还不能体现乐曲的，要多种辅助旋律搭配才能的动听，一般的网页色调都是控制在三种以内，辅助色较好与主色调相差别不大的，也可用相反的颜色。单一的色调也可以使用，它能起着醒目、清晰的目的。这就要考验网页设计师的搭配设计功力了。

二、导航页不清晰，排版混乱

导航需要有助于浏览者的找到想要知道的内容页和功能，导航就是需要有引导性，如果导航不清晰明了，就会影响全站的布局。而网站排版体体现在，假如是一个栏目分类合理，设计简单清爽的页面，给访客的*一映像就会很好，同样，网站的排版如果进去看到乱七八糟的页面，可能顿时就没有心情浏览了，即便是想要浏览，也找不到自己想要的东西在哪里，不仅仅是网页的排版，文章内容也是很重要的，比如说字体的大小，紧密的程度，段落之间的距离，文字颜色的深浅等这些都是一个好的网站所具备的条件。

三、网页广告及弹出窗口过多，影响视觉体验

在访问一个网站时，相信很多人都有过这样的体验，正在阅读的时候，一会一个广告弹出来，*要手动关掉，这种弹窗广告极大的影响了访客体验。内容没找到，弹窗关了无数道，阅读一篇文章，总被广告打扰，让访客心烦气躁。你还有一方面是广告，有的网站广告可能比内容都还多。广告可以存在，但是设计要合理，不能喧宾夺主。

四、图像内存太卡，影响网站加载速度

如今的互联网时代就是网速的时代，很多网站为了凸显效果，会插入大量的大量的图片及短视频，严重的拖延了加载网页的速度，所以在上传图片及短视频的时候尽量用方法减少图片及视频的大小，然后再开始加速功能。要让网站变得轻盈，加载速度流畅，才能赢得良好的观感。

五、使用上一切简单明确

网上使用上追求方便、、简洁、明了，让访客在浏览，注册，使用时，简单明了，简单易上手。就比如说新用户注册时，需要用户注册的信息不宜过多，太多的要求会让用户面对一系列问题时望而却步，导致准用户流失。