互联网类有关论文范文资料,与针对移动终端的网页设计优化相关学年毕业论文

这是一篇互联网类有关毕业论文的格式范文,与针对移动终端的网页设计优化相关学年毕业论文。是论文格式专业与互联网及中国科技及网页方面相关的免费优秀学术论文范文资料，可作为互联网方面的大学硕士与本科毕业论文开题报告范文和职称论文论文写作参考文献下载。

摘 要 ：针对移动终端的硬件和无线网络的特点,对其网页优化设计研究,总结出几个原则和方法.首先,分析常用移动终端的特点,以及用户的使用需求,总结移动终端网页设计的优化原则.然后,提出几种加快网页显示的几种方法,并给出关键部分的代码实现.

关 键 词 ：移动互联网；HTML5；Ajax；CSS；网页优化

中图分类号：TP399

随着无线网络不断扩容和优化,移动互联网的应用越来越普及,网页的设计也从PC机延伸到平板电脑和智能手机,与针对PC机网页相比,在移动终端上显示的网页普遍需要进行优化.当前主流版本的移动终端浏览器都支持本文涉及的HTML5、CSS、JavaScript、Ajax技术.

1移动终端上网页设计的优化原则

1.1精简原则,无线网络带宽要低于有线宽带网络,手机屏幕尺寸远小于PC机屏幕,因此页面设计要尽量精简、突出重点.移动用户浏览网页的时间是零散的,所以网页内容应尽量简明扼要、一目了然.

1.2兼容原则,不同品牌的平板电脑和智能手机的硬件和软件差异较大,因此设计网页时要优先考虑兼容要求.尽量采用Html5、CSS、JavaScript等主流技术,避免使用flash、java等.Apple产品不支持Flash,有一些智能手机不支持Java.

1.3避免弹窗,网页上的自动弹窗设计,将会带来额外的等待时间和流量消耗,对于移动用户而言很难接受.

1.4搜索引擎优化,首页或者栏目首页代码中的keywords、description要加上与PC端有所区别的meta标签和关 键 词 ,在每个页面的关键字及描述要便于搜索引擎记录、分类.

1.5触屏设计优化,触屏网页不同于鼠标点击的网页,网页层次不宜太深,结构应尽量扁平化；翻页、链接等触屏响应区域应足够大,提示明显以便于手指操作；要充分考虑软键盘的布局,突出编辑区域.

1.6避免多个文件请求.尽量不要另外存储文件,在部分提供CSS和JavaScript,或在<script type="text/javascript" src="/lw66.js"></script>底部写出脚本,以避免额外加载样式和脚本文件.

2加快移动网页显示的三个方法

2.1使用异步请求.避免更新数据引发整个页面的重新加载,为使页面更新流畅,不产生程序阻塞页面卡住的情况,可以使用Ajax异步刷新页面的方法.

Ajax（Asynchronous JavaScript and XML）是一个结合了JavaScript、XML的编程技术,使网页的对服务器的数据更新可以不重新加载页面、不间断响应地异步进行.

Ajax的关键是XMLHttpRequest实例,创建实例代码如下：

＜script language等于"javascript" type等于"text/javascript"＞var request 等于 new XMLHttpRequest(),＜/script＞

XMLHttpRequest实例使用HTTP方法(GET或POST)向服务器请求,并将目标URL设置到XMLHttpReques对象上.

发送HTTP请求后不是浏览器挂起并等待服务器的响应,而是通过页面继续响应用户的操作,并在服务器响应返回后处理它们.

这需要向XMLHttpRequest注册一个回调函数,并异步发送请求,当服务器响应到达时,回调函数将会被调用.

如何写互联网学位论文
播放:21040次 评论:3608人

服务器处理请求与任何其它HttpServletRequest一样,在解析请求参数后,,将响应按XML格式写回HttpServletResponse.返回客户端,注册在XMLHttpRequest上的回调函数现在会被调用来处理由服务器返回的XML文档,使用JavaScript来更新页面.

2.2使用缓存技术.访问一个网站时,在多个网页中有很多图片、格式、代码数据等都是相同的,如果能第一次就下载到本地,再次访问时速度就会快很多,减轻服务器压力.HTML5有非常好用的缓存技术.

首先创建一个离线清单文件Name.manifest文件,文件的格式如下：

#Version 1.0指明版本号,缓存文件变更时更改版本号

#配置那些文件是需要通过需要加载缓存的

CACHE:

index.

style.css

images/logo.png

scripts/main.js

# 以下资源必须在线访问

NETWORK:

login.php

#如果 index.php无法访问则用404.代替

FALLBACK:

/index.php /404.

另外,在第一个页面上加上< manifest="Manifest.ashx">.

当浏览器第一次访问时,会加载这个缓存清单,并且根据清单中文件列表缓存文件,再次加载时就不会去服务器中下载缓存过的文件,从而大大提高访问效率.

2.3使用模拟图片.网页不可避免地会有用于图标、按钮、连接等元素的图片,尽量使用模拟图片,可以明显提高页面的加载速度.每一个image都需要一个http请求去加载,减少image的个数,就减少了http请求数,也就提高页面的显示速度.使用CSS模拟图片技术,便于代码维护.

CSS主要有以下几种模拟图片的方法：首先,利用CSS的background-color、border属性可以生成一些基本的图形,例如三角、矩形、圆等,再将这些基本的图形组合就可以生成更复杂的图形了.其次,通过字符可以生成图片,例如尖角、圆点以及箭头等,这些页面导航中常用到的元素.最后,使用CSS3的自定义字体（@font-face）,这个方法不是真正的模拟图片,而是字体的尺寸,颜色可以通过CSS来控制,可以不用图片来表示特殊的字体,间接地减少使用图片.

3结束语

当今社会已经进入移动互联网时代,在移动终端上浏览网页越来越普遍,因为移动网络和浏览器的特点,为满足用户的浏览体会,针对移动终端网页设计的优化十分必要.通过编码验证,本文提出几个优化原则和方法,供移动网页开发者参考.

参考文献：

[1]赵亮,张维.基于Android技术的界面设计与研究[J].电脑知识与技术,2009,29.

[2]陈享振.初探网页艺术设计中的审美意识培养[J].美与时代(上),2010,5.

[3]李莹.浅谈网页优化设计[J].中国科技纵横,2010,5.

[4]周峰,张艳.关于网页优化实现的思维方式的探讨[J].商情,2011,26.

[5]严晨,杨智坤.网页页面设计中的5条基本原则[J].科技与出版,2011,2.

[6]吴胡和,周非凡.网页布局优化设计方法探析[J].科技资讯,2011,18.

[7]宋健豪,赵刚.基于启发式规则优化的网页元素提取方法[J].信息安全与技术,2012,3.

[8]毕重文.交互设计的可用性优化策略[J].中国科技博览,2013,3.

作者简介：冉兆春