【北京建站公司】手机网站设计开发服务

手机网站设计与开发越来越被大多数企业所采纳,为了适应人们对于手机网站浏览的需求,结合企业自身移动端推广策略,企业手机网站与微信公众号相结合是很多企业所采取的有效方式。以北京地区企业为例,几乎每个企业都会建设自己的手机网站,用于企业的宣传推广与业务订单的产生,基本都产生了比较好的效果...

手机网站设计与开发越来越被大多数企业所采纳,为了适应人们对于手机网站浏览的需求,结合企业自身移动端推广策略,企业手机网站与微信公众号相结合是很多企业所采取的有效方式。以北京地区企业为例,几乎每个企业都会建设自己的手机网站,用于企业的宣传推广与业务订单的产生,基本都产生了比较好的效果。北京建站公司很多,基本上也都能够进行相应的建站工作,但由于实力、经验等各方面的不同,也会在开发效率和服务商有所差异,因此,考察各北京建站公司的实际情况对于甄选手机网站设计开发供应商时显得尤为重要!本文以建站行为例,阐述北京建站公司是如何提供手机网站设计开发服务的。

手机网站策划

1. 手机网站策划

1)市场分析

  • 相关行业的市场是怎样的,市场有什么样的特点,是否能够在互联网上开展公司业务;
  • 市场主要竞争者分析,竞争对手上网情况及其网站策划、功能作用;
  • 公司自身条件分析、公司概况、市场优势,可以利用网站提升哪些竞争力。

2)建站目的

  • 建立网站是为了树立企业形象,宣传产品,进行电子商务,还是建立行业性网站?是企业的基本需要还是市场开拓的延伸?
  • 整合公司资源,确定网站功能。根据公司的需要和计划,确定手机网站的功能类型。企业型网站、应用型网站、商业型网站(行业型网站)、电子商务型网站;企业网站又分为企业形象型、产品宣传型、网上营销型、客户服务型、电子商务型等;
  • 根据手机网站功能,确定网站应达到的目的作用;
  • 手机网站后期的扩展性与移植性。

3)技术方案

  • 采用自建服务器,还是租用云主机或虚拟主机;
  • 选择操作系统,用Windows还是Linux,分析投入成本、功能、开发、稳定性和安全性等;
  • 网站安全性措施,防黑、防病毒方案;
  • 选择什么样的动态程序及相应数据库。如程序ASP、JSP、PHP;数据库SQL、ACCESS、ORACLE等。

4)网站内容

  • 确定手机网站的导航,是放在顶部还是放在底部,展现形式如何;
  • 根据网站的目的及内容确定网站整合功能,如FLASH引导页、会员系统、网上购物系统、在线支付、问卷调查系统、在线支付、信息搜索查询系统、流量统计系统等;
  • 确定手机网站每个频道或栏目的内容,如公司简介、服务内容、成功案例等;
  • 确定网站内容的实现方式,如产品中心使用动态程序数据库还是静态页面,营销网络是采用列表方式还是地图展示等;
  • 确定各个模块或页面之间的跳转逻辑关系,如何让浏览用户不至于“迷航”在手机网站之中。

手机网站设计

2. 手机网站设计

在手机网站整体策划完成之后,就可以进入到手机网站设计阶段了。在用PS进行手机网站设计之前,最好是先制作手机网站的原型图,及根据策划的内容与要求,先用线框图的形式表现出来,以确定手机网站结构、页面、页面内容和各网页页面之间的跳转关系。如果想了解原型图的内容,可以查看文章《北京建站的原型图是什么意思?[北京企业建站]》的内容。

原型图制作完成并讨论、修改和定稿之后,进入到手机网站设计阶段。对于手机网站设计的相关流程、内容等,设计连已经有很多篇文章进行过介绍,如果想了解详细内容,可以参看《[手机建站]手机网站设计规格、《[手机建站]手机网站设计规范》、《[手机建站] 手机网站设计要求》、《手机网站设计尺寸[网站设计]》、《手机网站设计指南[网站设计制作]》、《什么是最好的手机网站设计[手机网页设计]》以及《手机网站设计中怎样留住用户[北京网站设计]》,这些内容基本涵盖了手机网站设计的方方面面,可以起到全面的参考作用。

设计网站开发

3. 手机网站开发

手机网站开发与PC网站开发的流程以及采用的语言相仿,只不过需要注意手机网站本身建设的特殊性。

首先是H5的网页制作语言应用。H5语言可以说是专门针对移动端网站开发应运而生的,可以很好地结合手机的特点,实现浏览、效果以及简易的手机功能互动,例如一键拨号打电话功能。评价一家北京建站公司对于手机网站开发是否有足够的能力,考察其H5的使用熟练度是一项重要的指标。建站行为大量用户定制化H5游戏的制作,对于H5的掌握已经非常熟练,因此高质量地开发手机网站是完全没有问题的。如果您还对H5本身还不是很了解,可以阅读《H5页面是什么意思[手机网站制作]》和《比较H5页面移动开发框架类型[H5页面工具]》,能够初步了解H5的具体含义;

其次是与微信结合的紧密性。如果单纯的手机网站,对于企业的推广及业务起到的功效不会太明显,通常只有与微信公众号相结合,并有一定的运营团队进行运营后,才能够达到预期的效果。通过微信浏览手机网站已经成为用户常态,那么,微信的分享等功能是必须要制作的。另一方面,将手机网站的不同页面与公众号的操作按钮做链接,有时可以将手机网站的机构更加清晰化,也利用用户的操作。至于如何与微信公众号结合得更好,需要根据您的建站目的及推广策略相关,不同的目的、策略所需要在技术方面解决方案上进行体现。

设计网站测试

4. 手机网站测试

手机网站代码开发完成后,上线前要进行测试工作,测试工作根据网站的规模、功能的不同而不同,具体情况如下:

1)测试流程

进行正式测试之前,应先确定如何开展测试,不可盲目的测试。一般网站的测试,应按以下流程来进行:

  • 使用站长工具将将网站中的错误链接找出来;
  • 测试的顺序为:自顶向下、从左到右;
  • 查看页面title是否正确。(不只首页,所有页面都要查看);
  • LOGO图片是否正确显示;
  • LOGO下的一级栏目、二级栏目的链接是否正确;
  • 首页登录、注册的功能是否实现;(如果有该功能的情况下);
  • LOGO下的一级栏目、二级栏目的链接是否正确;
  • 首页其他内容、链接以及图片的显示、链接等的正确性;
  • 进入一级栏目或二级栏目的列表页,测试内容、链接、图片、样式等的显示、功能正确性;
  • 查看详细页面的内容是否存在乱码、页面样式是否统一;
  • 站内搜索(各个页面都要查看)功能是否实现(如果有该功能的情况下);
  • 前后台交互的部分,数据传递是否正确;
  • 默认按钮要支持Enter及选操作,即按Enter后自动执行默认按钮对应操作。

2)UI测试

  • 各个页面的样式风格是否统一;
  • 各个页面的大小是否一致;同样的LOGO图片在各个页面中显示是否大小一致;页面及图片是否居中显示;
  • 各个页面的title是否正确;
  • 栏目名称、文章内容等处的文字是否正确,有无错别字或乱码;同一级别的字体、大小、颜色是否统一;
  • 提示、警告或错误说明应清楚易懂,用词准确,摒弃模棱两可的字眼;
  • 切换窗口大小,将窗口缩小后,页面是否按比例缩小或出现滚动条;各个页面缩小的风格是否一致,文字是否窜行;
  • 父窗体或主窗体的中心位置应该在对角线焦点附近;子窗体位置应该在主窗体的左上角或正中;多个子窗体弹出时应该依次向右下方偏移,以显示出窗体标题为宜;
  • 按钮大小基本相近,忌用太长的名称,免得占用过多的界面位置;避免空旷的界面上放置很大的按钮;按钮的样式风格要统一;按钮之间的间距要一致;
  • 页面颜色是否统一;前景与背景色搭配合理协调,反差不宜太大,最好少用深色或刺目的颜色;
  • 若有滚动信息或图片,将鼠标放置其上,查看滚动信息或图片是否停止;
  • 导航处是否按相应的栏目级别显示;导航文字是否在同一行显示;
  • 所有的图片是否都被正确装载,在不同的浏览器、分辨率下图片是否能正确显示(包括位置、大小);
  • 文章列表页,左侧的栏目是否与一级、二级栏目的名称、顺序一致;
  • 调整分辨率验证页面格式是否错位现象;
  • 鼠标移动到Flash焦点上特效是否实现,移出焦点特效是否消失;
  • 文字颜色与页面配色协调,不使用与背景色相近的颜色;
  • 每个非首页静态页面含图片字节不超过300K,全尺寸banner第一个场景控制在200k以内二个场景在300K,三个场景在400K以此类推;
  • 同一界面上的控件数最好不要超过10个,多于10个时可以考虑使用分页界面显示;
  • 超过一屏的内容,在底部应有go top按钮;
  • 超过三屏的内容,应在头部设提纲,直接链接到文内锚点;
  • 首页,各栏目一级页面之间互链,各栏目一级和本栏目二级页面之间互链;
  • 导航的文字要简明扼要,字数限制在一行以内;
  • 报表显示时应考虑数据显示宽度的自适应或自动换行;
  • 所有有数据展现的界面(如统计、查询、编辑录入、打印预览、打印等),必须使测试数据的记录数超过一屏/一页,以验证满屏/页时其窗体是否有横向、纵向滚动条或换页打(L)印,界面显示是否正常;
  • 如有多个系统展现同一数据源时,应保证其一致性;
  • 对于报表中的所有字段值都应该有明确的定义,对于无意义的字段值,不应该显示空,应显示“--”或“/”,表示该字段值无意义;
  • 对统计的数据应按用户习惯进行分类、排序;
  • 界面内容更新后系统应提供刷新功能;
  • 用户在退出系统后重新登陆时应考虑是否需要自动返回到上次退出系统时的界面;
  • 在多个业务功能组成的一个业务流程中,如果各个功能之间的执行顺序有一定的制约条件,应通过界面提示用户;
  • 用户提示信息应具有一定的指导性,在应用程序正在进行关键业务的处理时,应考虑在前台界面提示用户应用程序正在进行的处理,以及相应的处理过程,在处理结束后再提示用户处理完毕;
  • 在某些数据输入界面,如果要求输入的数据符合某项规则,应在输入界面提供相应的规则描述;当输入数据不符合规则时应提示用户是否继续;
  • 在对任何配置信息修改后,都应该在用户退出该界面时提示用户保存(如果用户没有主动保存的情况下);
  • 在对某些查询功能进行测试时,应考虑查询条件的设置的合理性以及查询结果的互补性。如某些后台处理时间不应该作为查询条件;
  • 界面测试时,应考虑某一界面上按钮先后使用的顺序问题,以免用户对此产生迷惑。例如只能在查询成功后显示执行按钮;
  • 在某些对数据进行处理的操作界面,应考虑用户可能对数据进行处理的频繁程度和工作量,考虑是否可以进行批量操作;
  • 界面测试时应验证所有窗体中的对象状态是否正常,是否符合相关的业务规则需要;
  • 应验证各种对象访问方法(Tab 健、鼠标移动和快捷键)是否可正常使用,并且在一个激活界面中快捷键无重复;
  • 界面测试不光要考虑合理的键盘输入,还应考虑是否可以通过鼠标拷贝粘贴输入;
  • 对于统计查询功能的查询结果应验证其是否只能通过界面上的查询或刷新按键人工触发,应避免其他形式的触发;
  • 对界面上的任何对象进行拖拉,然后进行查询、打印,应保证查询打印结果不变;
  • 确保数据精度显示的统一:如单价0元,应显示为0.00元;
  • 确保时间及日期显示格式的统一;
  • 确保相同含义属性/字段名的统一;
  • 对所有可能产生的提示信息界面内容和位置进行验证,确保所有的提示信息界面应居中。

3)链接测试

  • 页面是否有无法连接的内容;图片是否能正确显示,有无冗余图片,代码是否规范,页面是否存死链接;
  • 图片上是否有无用的链接;点击图片上的链接是否跳转到正确的页面;
  • 首页点击LOGO下的一级栏目或二级栏目名称,是否可进入相应的栏目;
  • 点击首页或列表页的文章标题的链接,是否可进入相应的文章的详细页面;
  • 点击首页栏目名称后的【更多】链接,是否正确跳转到相应页面;
  • 文章列表页,左侧的栏目的链接,是否可正确跳转到相应的栏目页面;
  • 导航链接的页面是否正确;是否可按栏目级别跳转到相应的页面;
  • 顶部导航、底部导航通常采取在本页打开。

4)搜索测试

  • 搜索按钮功能是否实现;
  • 输入网站中存在的信息,能否正确搜索出结果;
  • 输入键盘中所有特殊字符,是否报错;特别关注:_ ? ’ . • \  / -- ;特殊字符;
  • 系统是否支持键盘回车键、Tab键;
  • 搜索出的结果页面是否与其他页面风格一致;
  • 在输入域输入空格,点击搜索系统是否报错;
  • 本站内搜索输入域中不输入任何内容,是否搜索出的是全部信息或者给予提示信息;
  • 精确查询还是模糊查询,如果是模糊查询输入:中%国。查询结果是不是都包含中国两个字的信息;
  • 焦点放置搜索框中,搜索框内容是否被清空;
  • 搜索输入域是否实现回车键监听事件。

5)表单测试

  • 注册、登录功能是否实现(如果有该功能的话);
  • 提交、清空按钮功能是否实现;
  • 修改表单与注册页面数据项是否相同,修改表单是否对重名做验证;
  • 提交的数据是否能正确保存到后台数据库中(后台数据库中的数据应与前台录入内容完全一致,数据不会丢失或被改变);
  • 表单提交,删除,修改后是否有提示信息;提示、警告、或错误说明应该清楚、明了、恰当;
  • 浏览器的前进、后退、刷新按钮,是否会造成数据重现或页面报错;
  • 提交表单是否支持回车键和Tab键;Tab键的顺序与控件排列顺序要一致,目前流行总体从上倒下,同时行间从左到右的方式;
  • 下拉列表功能是否实现和数据是否完整(例如:省份和市区下拉列表数据是否互动)。

6)输入域测试

  • 对于手机、邮箱、证件号等的输入是否有长度及类型的控制;
  • 输入中文、英文、数字、特殊字符(特别注意单引号和反斜杠)及这四类的混合输入,是否会报错;
  • 输入空格、空格+数据、数据+空格,是否报错;
  • 输入html语言的<head>,是否能正确显示;
  • 输入全角、半角的英文、数字、特殊字符等,是否报错;
  • 是否有必填项的控制;不输入必填项,是否有友好提示信息;
  • 输入超长字段,页面是否被撑开;
  • 分别输入大于、等于、小于数据表规定字段长度的数据,是否报错;
  • 输入非数据表中规定的数据类型的字符,是否有友好提示信息;
  • 在文本框中输入回车键,显示时是否回车换行;
  • 非法的输入或操作应有足够的提示说明。

7)分页测试

  • 当没有数据时,首页、上一页、下一页、尾页标签全部置灰;
  • 在首页时,“首页”“上一页”标签置灰;在尾页时,“下一页”“尾页”标签置灰;在中间页时,四个标签均可点击,且跳转正确;
  • 翻页后,列表中的数据是否扔按照指定的顺序进行了排序;
  • 各个分页标签是否在同一水平线上;
  • 各个页面的分页标签样式是否一致;
  • 分页的总页数及当前页数显示是否正确;
  • 是否能正确跳转到指定的页数;
  • 在分页处输入非数字的字符(英文、特殊字符等),输入0或超出总页数的数字,是否有友好提示信息;
  • 是否支持回车键的监听。

8)交互性数据测试

  • 前台的数据操作是否对后台产生相应正确的影响;
  • 可实现前后台数据的交互(如:在线咨询,能否实现数据的交互实时更新);数据传递是否正确;前后台大数据量信息传递数据是否丢失(如500个字符);多用户交流时用户信息控制是否严谨;
  • 用户的权限,是否随着授权而变化;
  • 数据未审核时,前台应不显示;审核通过后,前台应可显示该条数据。

以上列出了测试过程中常见的部分,对于手机网站而言,与微信的交互性测试也是需要的,根据具体的功能列出“手机网站-微信交互功能测试列表”来逐一测试,保证与微信凭条的互动是成功的!

5. 手机网站上线

进行了以上从手机网站策划、设计、开发和测试的全阶段之后,您或您企业的手机网站基本上满足上线要求了!在上线前还有一项重要的工作是,将网站的内容维护到管理后台(CMS)中,例如案例数据、文章数据、产品数据等等,并能够在网站页面上能够很好地显示,这样才能够使手机网站是一个完整的整体,即可上线了!

以上阐述了手机网站设计开发的全过程,要很好地完成一个手机网站项目还是要有很多工作要做的!如果您仍有疑问,可随时拨打建站行-北京建站公司,电话:010-56257625,作为一家靠谱的北京建站公司,我们愿竭诚为您服务,协助您实现目标与价值!