当前位置:  编程技术>WEB前端

网页美工制作规范

    来源: 互联网  发布时间:2014-09-06

    本文导语:  1,    允许全文检索的页面,为了使Internet 上的搜索引擎能够有效检索,在频道的首页的html的之间应该加入Keywords 和Description 元标记,制作页面是不要忘记添加客户网站的关键字。尤其是通用网址的页面,一定要加关键...

1,    允许全文检索的页面,为了使Internet 上的搜索引擎能够有效检索,在频道的首页的html的之间应该加入Keywords 和Description 元标记,制作页面是不要忘记添加客户网站的关键字。尤其是通用网址的页面,一定要加关键字~!这样便于推广~!
范例:



2,    制作网站时,遇到页面有统一的头部文件和尾部文件。一定要做成单一的top头文件和bottom尾文件,然后再嵌套在页面中。这样修改方便。嵌套代码:
1. (推荐使用)
2.(使用时修改蓝色部分即可)

3.   统一使用外挂式样式表~!相关代码:  
要注意a:link a:visited a:hover a:actived 的排列顺序要和原有的一致。
重定义的最先,伪类其次,自定义最后。
为了保证不同浏览器上字号保持一致,字号建议用点数pt和像素px来定义,pt一般使用中文宋体的9pt和11pt,px一般使用中文宋体12px 和14.7px 这是经过优化的字号,黑体字或者宋体字加粗时,一般选用11pt和14.7px 的字号比较合适。

4.一个网页要尽量避免用整个一张大表格
所有的内容都嵌套在这个大表格之内,因为浏览器在解释页面的元素时,是以表格为单位逐一显示,如果一张网页是嵌套在一个大表格之内,那么很可能造成的后果就是,当浏览者敲入网址,他要先面对一片空白很长时间,然后所有的网页内容同时出现。如果必须这样做,请使用 标记,以便能够使这个大表格分块显示。
表格的嵌套尽量控制在三层以内
5.Width 和height 的写法也有统一的规范,一般情况下只有一列的表格,width 写在 的标签内,只有一行的表格,height 写在  的标签内,多行多列的表格,width 和height 写在第一行或者第一列的  标签内。总之遵循一条原则:不出现多于一个的控制同一个单元格大小的height 和width, 保证任何一个width 和height 都是有效的,也就是你改动代码中任何一个width 和height 的数值,都应该在浏览器中看到变化。做到这一条不容易,需要较长时间的练习和思考。

◆布局:
1、    别轻易让文字居中和使用粗体或斜体字符。除了视感混乱之外,很多流览器不能很好地显示斜体字,也不能补偿由于字母倾斜引起的空白变化。
2、    不要在每一页使用风格不同的图标。
3、    在img行加alt标记。这样就会让使用基于文本的流览器的读者除了看到 [IMAGE] 以外还能看到别的一些东西,使用图形流览器的读者在图像未能成功载入之时也会看到一些东西,而你也能让自己的html文件相当整洁。
4、    不要让什么东西看起来象是一个按钮却不起按钮的作用。

◆网页色彩搭配的技巧  
1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将 色彩变淡或则加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。 
2.用两种色彩。先选定一种色彩,然后选择它的对比色(在photoshop里按ctrl+shift+I)。我的主页用蓝色和黄色就是这样确定的。整个页面色彩丰富但不花稍。 
3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。确定色彩的方法各人不同,我是在photoshop里按前景色方框,在跳出的拾色器窗中选择"自定义",然后在"色库"中选就可以了:) 
4.用黑色和一种彩色。比如大红的字体配黑色的边框感觉很"跳"。 
在网页配色中,忌讳的是: 
1.不要将所有颜色都用到,尽量控制在三种色彩以内。 
2.背景和前文的对比尽量要大,(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容 
◆ 闪烁让人头痛
  通过使用标识可以吸引访问者对你的主页特殊部分的注意,但这也让你的访问者头痛。如果你想使访问者再次光顾你的网站,就少用此方法。 
◆    动画点缀
网页上的动画最多只用一个
“空白万岁”
  注意留空白。不要用图像、文本和不必要的动画GIFs来充斥网页,即使有足够的空间,在设计时也应该避免使用。 

    
 
 
 
本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • web网页自动跳转方法:Html body onload自动跳转举例
  • linux浏览网页时怎样显示网页中的flash动画?
  • Python获取网页编码的方法及示例代码
  • 怎样把整张网页内容当作一副图形(只能作为图像,因为可能网页中有图)传给控制打印的Java程序?
  • HTML网页中的html body onload自动跳转方法介绍及自动跳转代码示例
  • 为什么我用netscape浏览时,网页不正常(主要是动态网页)碰到分类排序的就显示不了了
  • HTML网页的Meta Refresh自动跳转方法介绍及Meta Refresh自动跳转代码示例
  • [求助][排错]一段利用socket连接网页,并将网页内容拷贝下来的程序。。。[有一点问题]
  • 中文网页快速去重算法研究
  • 关于session(我停了一会儿没动网页,再在点击网页链接时,session丢失,然后点击IE的刷新,session又有了)这是怎么回事。
  • VPN虚拟局域网和本地局域网共存(连上vpn后正常打开网页)
  • C#实现将网页保存成图片的网页拍照功能
  • 基于python实现的网络爬虫功能:自动抓取网页介绍
  • 如何在red hat的网页浏览器中浏览使用ipv6协议的网页?
  • HTML网页中的javaScript自动跳转方法介绍及javaScript自动跳转代码示例
  • eidt.jsp对网页进行编辑,网页内容存放在数据库中,其中有些字段用textarea多行编辑框显示,保存提交数据库后,再次对它编辑,那些用多行
  • Python3通过request.urlopen实现Web网页图片下载
  • 各位高手请帮忙,如果我在框架网页中弹出一个新的窗口,在新窗口中执行一定的操作后,怎样让框架网页自动刷新?
  • 在样式表中,用submit提交信息到下一个网页,在下一个网页中如何知道该submit的name??谢谢了
  • ★★Linux服务器的网页响应发送给客户端的网页被修改,估计服务器中毒了,怎么办??
  • 网页下载文件期间如何防止用户对网页进行其他操作


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3