网站建设移动端和PC端的区别

作者：admin 浏览：添加时间：2019-11-14 21:13:43

移动站在域名方面有两种选择：如果已经有成型的PC端网站，如www.v-zz.com，那么移动端网站的域名最好就是m.v-zz.com；如果没有PC站，并且也不计划建设PC站，那么也可以直接使用主域名建设移动站。

在服务器方面要边择速度较快的机房，尤其是图片加载速度要快，因为在移动端阅读的用户更加喜欢浏览图片，并且忍受图片加载的时间要更短。如果网站打开速度过慢，甚至超过5s，那么用户打开率就会迅速下降。只有移动端网站的打开速度尽量保持在3s之内，用户才愿意在内容上花费一定时间。因此，移动端网站建设要尽量减少不必要的图片或者动画的使用，以保证网站打开速度。

建议在设计移动端网站的时候将图片加载设计成按需加载。实现移动端网页图片按需加载是什么意思呢？就是在可见区域内的图片就加裁，不在的就不加载，而使用默认图片。下面列出按需加载图片的方法，供大家参考。

步骤一：选取需要实现这种需求的容器中的所有图片，不在容器中的图片就不用管了。例如：

$('.container').find('img');

步骤二：如何判断图片是否到达可见区域呢？

一般我们会想到touchmove，这是错的，为什么呢？正常情况下，我们touchmove都是上划一下就松开，那么滚动也就一下。但是当我们上划很多时，由于“惯性”touchend以后，滚动条还会继续滚动，那么这一段的滚动距离就是不可控的了。

然后我们会想到scroll，这就对了，在这个容器中监听scroll事件就可以了。步骤三：什么时候可以认为图片到达可见区域？即图片本身距离顶部的高度≤可见区域本身的高度＋滚动的距离。

例如，滚动的距离为0，图片本身距离顶部的高度小于可见区域高度的图片就在视野内。

具体实现如下：

imgdelayload:function(){

var img=$('.pic-list').find('img')

src="";

windowheighscrolltop=$(window).height()+document.body.scrollTop;