网站建设

做网站手机做网站注意事项

发布时间:2019-09-24 来源:上海网站建设

 

目前做网站行业,手机做网站明显要比前几年需求量大了很多,在实际开发过程中,手机做网站与传统电脑做网站还是有一定区别的。如你习惯了使用开发电脑网站的模式去开发手机网站,会发现,平时在电脑端完全没有问题的功能、样式、布局,到移动端就不能正常使用了,这使得手机网站需要进行特殊处理,才能够保证移动端与电脑端都可以正常的使用,在开发手机网站的过程中,常见注意事项有以下几点:

一、所有容器均使用自适应宽高

由于手机屏幕尺寸的多样化,在不同尺寸的手机屏幕上浏览同一个网页,网站元素展示的大小也是不同的。随着屏幕尺寸的越小,高度展示比例,应以自适应的方式增加容易的高度,否则会盖住下面的元素,造成网站布局错乱。

二、网站元素之间布局应以百分号为单位

在电脑做网站中,不同元素之间定位以PX像素为主,这样布局多数用于网站整体居中宽,内部元素根据整体居中宽度进行像素定位,如margin、padding、postion等定位办法。这种方式在手机网站中使用是不合理的。如手机屏幕宽度只能试用与400PX的宽,那么当网站中的某一元素设定的宽度大于400PX的宽度时,就会产生滑动网页屏幕,超出手机屏幕的情况,而不是一屏显示。这种情况是特别不利于手机浏览的。

三、网站设置断点功能,自适应不同屏幕大小手机

传统网站CSS样式,都支持断点的功能,但在电脑端做网站中,基本不会使用该功能,因为大多网站都是居中显示,再者断点功能如运营不合理,极易出现网站布局混乱的现象。想使用断点功能布局网站,需对网站元素有深入的了解,找准需要做断点的地方,经过不同大小手机反复测试,调试没问题之后才能用于正常使用中。


四、学会使用网站Z大值与Z小值

网站Z大值与Z小值的设定,在移动做网站中是特别重要的,设置好Z大值,可以在不同屏幕大小的手机中,使网站可以100%全屏显示。Z大宽度的意思是,当设定网站Z大宽度为460PX的时候,网站其他元素如果超出这个宽度,则都按460PX为Z大宽度,自动调整网站尺寸,从而达到预期全屏的目的。

五、使用系统自带字体与自定义字体之间的选择

虽然现在电脑网站也可以选择使用自定义自定的功能,但是那也是支持一小部分浏览器,如使用人数Z多的IE浏览器,低于IE9的版本,是不支持自定义字体的。不过手机端的设备则不同,所有手机端浏览器均全面支持HTML5+CSS3的写法,这就让我们可以随心所欲根据需求去定义自己的网站字体。不过想让用户使用自己定义的网站字体浏览网站,用户需要首先download该字体,方可正常使用,这就影响了网站的打开速度,具体还需根据实际情况自行决定。

写到Z后:

进行移动端做网站的过程中,应多以手机浏览为主要目的,平时在电脑端使用的布局习惯应全部调整好,省去后期不必要的重复工作。如果布局才能更加适用手机用的使用习惯,这需要在网站制作阶段就提前做好规划。在手机网站底部增加固定导航,以及在右上角增加隐藏式主导航也是特别有必要的。