手机网页设计和制作

1、如何制作手机版网站

随着智能手机的普及，手机网站的使用率和重要性也日益彰显，2015年最新数据显示，目前在所有的网站中,同时具有PC及移动端的网站占了52%,首次超过了纯PC端网站的43%,下面给我们就说一下手机网站的一般制作流程，它包含七个方面的知识，让你避免走一些制作手机网页的弯路。阅读完成以下知识点，你就能对手机网页的制作和设计有大概的了解，然后有针对性地学相应知识。
1.手机网页的标记语言
WML ：
因为WML大部分针对早期和低端的手机，现在已经逐步被其他的技术取代了，现在学习手机网页设计制作完全可以忽略WML。
XHTML：
未来智能手机的市场份额会越来越大，考虑到这点，现在进行手机网页设计制作时，我们会用到更加熟悉的标记语言Xhtml。现在大部分智能手机的浏览器都能正确处理Xhtml，它会识别两种类型的Html。
①Xhtml：基础的，和桌面浏览器相同的Xhtml
②Xhtml-MP：针对智能手机的Xhtml
这两种类型的不同之处，Xhtml-MP包含比较少的要素和相对宽松的限制，能适合手机平台的渲染，现在很多手机网页设计制作直接用Xhtml，也没什么大问题。
2.手机类型
手机市场上既有非常高端的iPhone手机和谷歌的Android手机，也有诺基亚一些单色点阵显示的低端机。这些低端机在浏览手机网页时有很多的限制，如屏幕分辨率、渲染Xhtml的性能等，因此如果你的手机网页是针对这部分用户，最好还是用WML。
另一方面，类似于iPhone和Nexus One这种高端智能机，拥有可以和桌面浏览器相媲美的渲染网页的性能。对这部分用户而言，良好的用户体验是很重要的，受限于手机的传输速度，如果直接用一般的电脑上浏览的网页来代替手机网页，对手机网页的目标客户来说，并非明智之举
3.手机网页的目标群体
任何网站设计网页时都应该明白自己的目标群体，以便向他们传输最合适的信息。这点在进行手机网页设计制作时更为重要。因为你不仅要知道你的目标群体，还要知道他们浏览手机网页时的情景。浏览传统的网站，访客会坐在桌上，有着大分辨率的屏幕。手机网页的访客则有可能是在排队、等交车、坐在地铁等。
手机网页的目标群体，谷歌的开发者将看手机网页人群分为三大类，这对我们进行手
机网页的设计和制作，很有参考意义。
4.根据具体需要提供网站内容
一个很常见的误区是很多网页开发者认为只需要简单的设置，就可以将一个传统的网页变成可以适应手机浏览的网页，他们认为只需要在CSS样式表将media=”screen”变成media=”handheld”就能使网页神奇般地适用于手机。这是错误的想法。
虽然针对手机用户变更网页的CSS可以过滤一部分的内容，或者一些cms网页也提供了相应的转换插件。但这些方案并不完善。
W3c定义了“一个网站”的概念，意思是手机网页不一定要提供和传统网站完全一样的内容和设计，而是要根据手机的性能、带宽等方面的不同提供一些差异化服务。
根据这个定义，一些传统网页的内容和功能不能在手机上实现是很合理的。不同手机
能处理的内容和功能也都是不一样的。所以也可以根据这些手机进行相应的网页制作。
5.选择域名
为手机网页选择什么域名取决于你的目标群体是如何进入网站的。这里有三种域名可
供选择：
A：为手机网页使用独立域名
B:为手机网页使用子域名
C：为手机网页注册mobi的顶级域名
D：判断客户端，并自动显示对应内容
6.为手机网页验证标记语言
电脑的网页浏览器对错误比较宽容，一些html标记的忘记书写或者没有正确嵌套在电脑浏览器都会正确显示，当然容错率高意味着消耗更高的cpu和内存。
手机浏览器的性能还无法和电脑相提并论，所以手机浏览器对手机网页的错误要严格一些。所以在设计和制作手机网页时，你必须不断进行检查、验证和纠错。验证手机网页和验证一般传统的网页没什么区别，如果你使用Xhtml编写，可以使用相同的工具。W3C验证器可以验证一些简单的错误，当然这里有一个更适合验证手机网页的版本。
7.为手机网页不断测试
当通过了手机网页的验证之后，就要针对几种不同的手机进行各种测试了。用电脑的
浏览器虽然可以进行模拟测试，但是并不完善。这种方式通过的手机网页不能适用于某些手机。
有些手机文件尺寸的限制可能会很小，所以你制作的手机网页在这些设备上甚至无法显示。另外浏览器支持的文件类型也会不同，支持的图像格式也会不同。测试时候手机网页当然不可能拥有所有手机，所以制作网页时可以使用一些替代手段。

2、手机网页怎么制作？

随着智能手机越来越普遍，单纯依靠PC端远远满足不了用户需求。特别是企业如何在移动端牢牢把握住用户就可以在公司盈利和业务方面获得飞速增长。然而，移动网站建设就变得越来越重要。搭建移动网站满足公司业务需求，从而获得移动端流量，就变得迫在眉睫。

手机网站制作分为2种语法：

第一种是采用WML编写适合于按键的传统手机的WAP网站，

第二种是采用时下比较流行的HTML5编写前台。

而如今随着中国的移动互联网发展和智能触屏手机的普及，WAP网站已经逐渐退出历史舞台。并在程序或者主机上写好判断规则，如果是PC版的浏览器就访问PC版的网址，是手机浏览器就访问手机站。针对不同的群体访问不同的页面，有利于提高网站转化率。

WAP是无线应用协议的缩写，一种实现移动电话与互联网结合的应用协议标准。wap网站也就是我们通常说的手机站。 

（2）html5是W3C制定的超文本标记语言（html)的第五次修改，通过html5制作的网站可以灵活运行于PC，平板，手机等各种媒体。 

（3）wap网站只能运行于手机端，多以文字图片为主，无特效和逻辑功能；html5的新特性可以让网站运行各种媒介（PC、平板、手机），并可以根据媒介的不同响应调节网站结构，与js/css3，可以构造出炫酷的特效效果。

3、如何在手机上制作自己的网页

1、在手机上打开百度H5这个网页制作软件，选择新建一个页面就会出现这样的背景，手机网页可以在这里进行制作。

2、直接使用模板来进行制作，从软件的模板库中选择一个模板作为手机网页的模板。

3、也可以根据自己的需求对手机页面中的各个模块进行修改，选择这个手机页面上的元素，就可以在右面的编辑框中进行各种修改。

4、可以更改这个元素的图形，直接从自己的手机当中选择一幅图片来替换原来手机模板当中的图片。

5、还可以更改手机网页当中的文字格式，而修改这个文字的链接，在点击文字的时候可以跳转到其它的网页。

6、手机网页当中特定元素的修改，比对电话组件的修改，可以直接在右边的编辑框当中修改电话号码。

7、通过上述步骤制作完手机网页后，选择预览一下就可以在手机上看见自己网页的制作效果了。

4、怎么制作网站的手机版

做手机网站的方法一下几种

1、模板站，下载手机网站模板，然后将内容和PC站点通用，这样移动设备访问网站时就会自动转入到手机站的模板。

你也可以解析一个m开头的域名作为手机站的域名，有利于搜索引擎抓取。

2、自适应网站，这种网站不需要另做手机站，因为网站的自适应，会根据你使用的设备分辨率来调整网页的排版和内容显示。

3、H5快速建站，现在有很多服务商支持H5快速建立手机网站，只需要你把内容上传，这些服务商就会将这个网站做出来，比较方便快捷，缺点就是免费的都有广告，而且不支持使用自己网站的域名。

4、用代码写出来的手机站，这种网站就是属于静态网站，所有的内容都是通过代码写进去的，想要更改内容比较麻烦。优点就是一步到位，想要什么效果都能达到。

5、手机直达页，这种可以说是一个网站，也可以说是一个网页，这种手机站比较适合推广使用，将所有企业的推送产品放在这个页面上，然后完美的展示出来，用户点击之后可以进入购买页面或者直接进入咨询页面，可以更有效的提高转化效果。

5、如何做好手机网页设计

随着互联网科技的发展以及人们生活方式的改变，手机网站逐渐赶上PC网站，成为企业宣传推广以及用户阅读的的主要平台，因此也有越来越多的企业开始制作手机网站。不过，手机网页设计必须遵循移动端的设计原则，而不是盲目沿用电脑网站的设计规律，毕竟两者还是有很大区别的。

首先，移动端网页设计都需要考虑网络的问题。虽然现在的网络普及程度高，但是大部分用户还是利用手机流量来上网的，因此对手机网页的访问加载速度要求较高。如果用户在流量网页时遇到页面迟滞、视觉错位、信息不全等问题，用户体验就会大打折扣，因此要求网页内容尽量简洁明了，同时展现精准、有用、易用的菜单栏。

还有，因为手机端屏幕大小不一，如果想要保证所有人正常访问页面，维持内容的可读性，那么就需要我们在进行相关设计的时候，尽量控制文本的间距、颜色，着重突出页面的重点内容，让用户更容易看到自己想看到的内容,另外，一般手机中的电话、短信、推送等信息是无处不在的，用户在浏览网站时，注意力很容易就被这些弹出来的信息所吸引，因此网页的图标设计一定要高效，让用户在短时间内就知道网页的导航信息是什么、主要内容是什么，节省用户时间的同时，还为网站争取了成交的机会。

手机网站布局设计方法

1、手机网站的单页

手机网站建设的单页这个是存在于很多企业网站的内容，单页优化有着一定的好处，首先网站的单页是用HTML书写，并且完全静态化，这个是符合搜索引擎的，有利于优化，对搜索引擎友好。

这种页面的布局往往需要的是大气，简洁，直入主题。一般可以用来介绍公司以及公司的主要核心内容。

2、首页布局

手机网站建设的首页是一个网站的核心部分，浏览者首先看到的就是首页，然后才会看到内页，才会了解你的公司，只有首页有吸引力，才能留住浏览者浏览你网站的内容，那么首页的布局就很重要了。

首页需要突出网站的核心，展示公司的优势，尽显企业的特色，而且需要有主次之分，上下之分，因为浏览者的习惯是从上而下，从左而右浏览的。

3、内容页布局

手机网站建设的内容页就是网站的内容详细展示页面了，有的网站建设者没有太多注意的问题，手机网站建设者认为内容页根本不重要或是不是很重要，只要在后台把文章内容上传上去让其显示就可以了。

其实一些大网站的权重流量都是靠这些内容页撑起来的，我们每天更新文章显示的一个界面，这个页面的一个好的内容页能够给网站带来某一特定词的排名。

4、列表页布局

手机网站建设的列表页分为图片列表和文章列表页。图片列表页一般展示的是公司的案例或产品，一般图文布局展示就可以了。文章列表页展示的是公司的新闻或行业动态之类的文章，一般是新闻标题显示布局就可以了。

6、手机网页如何制作。。

低版本的dreamweaver有没有这个功能我不清楚。但是在dreamweaver cs6中，你可以点新建-流体网格布局然后如图所示。

7、这种手机网页是怎样制作的？

网站移动端制作原理：

1、域名解析一个m.xxx.com，绑定到服务器上；

2、m.xxx.com放PC端的网站程序，数据库直接连接PC数据库；

3、移动模板对应PC模板，程序文件和pc一样。只是数据库是共用一个；

4、在PC页面上面设置移动跳转判断，网上有PHP跳转代码；

5、你可以参考开源程序制作移动端，比如dedecms，帝国cms制作移动端，如果感觉比较麻烦了，那就直接把PC页面重写，页面直接修改成响应式！

现在做网站手机站必须要做，手机上搜索越来越多。电脑站手机打开浏览网页，体验非常不好。目前手机网站制作有3种方法：

1、独立域名手机站

这种手机站对优化排名比较好，也可以自己设计手机模板，专门买个空间放手机站程序，域名解析二级域名。　

2、自适应网站

这种网站体验比较少，会根据屏幕大小，自动显示不同的页面布局。手机和电脑站用的一个模板。一个域名，对优化体验非常好。

3、二级目录手机站

这种比较常用的一种，电脑站域名后面加/wap，或者/m 。通过跳转代码，手机打开电脑站网址，自动进入手机站。内容和PC是同步的，管理也比较方法。

8、手机html网页和电脑上的html网页在制作上有什么区别

1.导航设计

手机端页面导航应当包括用户必要的内容，删除屏幕上不必要的链接，假如链接的详细页面内容不是用户想要的，用户不会点击，也就没必要设置。其中建立导航功能键的时候，其中以回到首页、回到上一页这两个最为重要。

2.网站名称或logo的设计

手机网页的顶部没有标题栏或地址栏，相应地，也就没有网站标题和图标。所以设计页面的时候应该让用户知道，他们现在所浏览的网站名称或logo，这对塑造品牌也很重要。 

3.页面排版

从用户角度来说，他们希望阅读所有的内容，所以我们进行内容呈现，只是用隔断、重组、引语、线条或其他视觉方案来让这些内容更容易访问，使这些板块显得更都雅。

4.利用手机的天生优势

手机有着许多传统电脑所没有的优势，其中最大的优势就是移动力，因此手机版网页应该要特别发挥这些特性，让手机网页具有一般网页更多的优势。如：

移动定位：大部分的智能设备都有导航、定位的机制，可以让客户主动找到企业的位置。

移动联系：如果用使用的是移动电话，可以立即发话;或者直接跳转到通讯工具在线聊天;

邻近地点：如果企业有很多据点，请告诉用户，在他附近有哪一些地点是便于他能够抵达的。

9、怎么制作网站的手机版？

可以去下载pageadmin建站系统或者wp系统来做，推荐pageamdin，这个支持pc和手机共享数据，或者你做成响应式网站就可以了。

10、怎么制作手机网页 如何制作一个手机html页面

这个还用说，其实道理和PC端网站是一样的道理。因为现在用户慢慢转向移动端，所以拥有一个移动网站也是很必要的。

其实自助建站自己做网站都是不成问题了，不管你懂不懂代码，都可以做的。

首先，注册一个凡科帐号，这是开始建站的第一步

第二，登录帐号后，会有建站、互动、微传单三块，一个帐号都可以用，你选择“网站建设”这一块；

第三，进入后台之后，选择自己喜欢的手机网站模板。

第四,就可以开始设计自己的网站，排版、栏目、文字、图片等设计。第五，无论是否完全做好，先保存，再退出。第六，网站做好后，可以为网站添加需要的功能，拖拽就可以实现添加。