手机界面排版和传统网页排版有什么不同

在工具上，手机版网页和电脑版网页没有什么区别，可以根据自己的喜好。我是喜欢用Dreamweaver的，而且Dreamweaver cs6有个多屏预览的功能，可以很方便的预览手机、平板、PC端的效果。不过Dreamweaver 挺大的，还有很多比较快比较好的编辑器，比如EditPlus，这还是看个人的习惯和喜好了。推荐一个编辑器sublime text，我自己觉得超好用。在代码方面的话：首先得加上这样的一行。设置宽度、高度、是否能够缩放。然后，主要是要考虑适配。比较好的是做到自适应。这个可以搜一下，我记得月光博客里面就有篇很详细的。其次，可以用@media only screen and(min-device-width : 320px) and(max-device-width : 480px){ }来对不同像素的屏幕写不同的样式。可以看下知乎的登录页面，用的就是@media。再然后要考虑的是用户体验。简单的拿个链接来说，在PC端因为有鼠标，很容易点到。可是手机端就不一样，就几个字的链接很难点到，所以就要扩大点的面积。这就是为什么会出现电脑版的网页和手机版网页。其实做手机版的网页有个好处就是可以大量的使用HTML5和CSS3，这样能做出很多效果。对于这些的话，看附件里面的学习方法有帮助的

1-网页排版：设计工具的选择、网页美感的培养、拒绝网页平淡、网页内容要有目的性、文字的字体与颜色的选择、页面适当留白、图文信息搭配等；2-网页制作：注意页面的结构、不要刻意堆积网站代码（尽量做到精短、简介明了）、需站在用户体验度进行制作！

1、手机网站的类型不同。　　手机网站一般分为两种类型即：wap网站和APP网站。wap网站无需安装客户端软件即可访问，而APP网站需要安装客户端才可以访问。目前较为流行手机网站一般常指wap网站。　　2、手机网站和电脑网站的分辨显示率不同。　　手机网站和电脑网站之间最大区别就分辨显示率不同，电脑屏幕尺寸要比手机屏幕尺寸大的多，所以在网站界面设计上就会不一样，手机网站版面相对要窄一点，字体尺寸一般会使用大一点。　　3、风格特点不同。　　PC网站和手机网站风格有“详”与“简”的区别。PC网站展现的是企业全面详细的信息，它的特点就是面面俱到；而手机网站是居于电话、短信、定位、分享、留言等基本功能的网站，它只展现企业的核心信息，针对性和目的性强，传输数据量小，访问速度快。手机版是PC网站的简约版，具备画面清晰、板块简约、排版整齐、视觉冲击力强等优势。　　4、登录方式不同。　　访问PC网站需要通过输入网址或者通过搜索引擎来进行访问；而手机WAP网站的访问方式更新颖、更方便，访问手机网站可通过拍摄二维码直接登录访问，省去了手动输入网址的麻烦。　　5、显示终端不同。　　PC网站只适合电脑页面浏览，不适合手机页面的浏览，PC网站在手机上展示，就会不可避免地出现比例不协调，排版不整齐、错位、变形、甚至出现乱码的现象。而手机网站是针对手机屏幕和手机分辨率的大小而定制的网站，文字和图片的显示比例都适合手机页面浏览。　　手机网站和电脑网站的共同之处：　　手机网站其实是电脑PC网站的简化版，手机网站调用的是电脑PC网站的数据库，把PC电脑网站主要内容提取出来，然后做个简单的网站展示给客户使用。