CN105740377A - 网页模板制作的可视化方法以及网页可视化制作装置 - Google Patents

网页模板制作的可视化方法以及网页可视化制作装置 Download PDF

Info

Publication number
CN105740377A
CN105740377A CN201610056014.4A CN201610056014A CN105740377A CN 105740377 A CN105740377 A CN 105740377A CN 201610056014 A CN201610056014 A CN 201610056014A CN 105740377 A CN105740377 A CN 105740377A
Authority
CN
China
Prior art keywords
template
page layout
webpage
sublayer
web page
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN201610056014.4A
Other languages
English (en)
Inventor
张元达
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Mainone Zhida Technology Co Ltd
Original Assignee
Beijing Mainone Zhida Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Mainone Zhida Technology Co Ltd filed Critical Beijing Mainone Zhida Technology Co Ltd
Priority to CN201610056014.4A priority Critical patent/CN105740377A/zh
Publication of CN105740377A publication Critical patent/CN105740377A/zh
Pending legal-status Critical Current

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking

Landscapes

  • Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Data Mining & Analysis (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Information Transfer Between Computers (AREA)
  • Document Processing Apparatus (AREA)

Abstract

本发明涉及一种网页模板制作的可视化方法,根据网页内容设置至少两个网页子层,向每个所述网页子层加入与该子层对应的至少一个网页布局模板,并对所述网页布局模板的属性设置至少一个样式属性标签;向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素,并对所述模板内容元素的属性设置至少一个元素属性标签;将所述样式属性标签与元素属性标签封装到与其相对应的网页子层内。本发明通过设计师设计系列模板供用户选择,同时用户选择该模板后前台仍可以实现模板内容的自定义,包括模板中布局,模板元素的选择及各种样式的调整,使用户通过简单的操作就可以制做出内容丰富的样式效果。

Description

网页模板制作的可视化方法以及网页可视化制作装置
技术领域
本发明涉及互联网技术,特别是涉及一种网页模板制作的可视化方法以及网页可视化制作装置。
背景技术
目前,互联网在城市中已经普及,大部分乡镇和行政村也都已经接通了互联网。互联网基础设施的完善大大促进了互联网的普及和应用。互联网已经渗透到人们生活的各个领域。
网页风格每年都有新变化和新的流行趋势,传统的模板建站的一般流程是设计师设计好一些页面后用户选择使用,由于用户不懂样式控制所以用户的网站风格大体相同,无法满足用户个性化的要求,导致用户的网页风格大体相同,而且每次改版都会耗费大量的人力。
发明内容
本发明的目的是提供一种网页模板制作的可视化方法以及网页可视化制作装置,实现网页风格个性化、使用更方便、功能多、模板平台更加开放。
本发明的目的是通过以下技术方案来实现:
一种网页模板制作的可视化方法,包括:
根据网页内容设置至少两个网页子层。
向每个所述网页子层加入与该子层对应的至少一个网页布局模板,并对所述网页布局模板的属性设置至少一个样式属性标签。
向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素,并对所述模板内容元素的属性设置至少一个元素属性标签。
将所述样式属性标签与元素属性标签封装到与其相对应的网页子层内。
进一步的,所述向每个所述网页子层加入与该子层对应的至少一个网页布局模板包括:从网页布局模板库调取所述网页布局模板库存储的网页布局模板并加入对应的网页子层;和/或,从数据接口获取外部数据源输入的网页布局模板并加入对应的网页子层。
进一步的,所述对所述网页布局模板的属性设置至少一个样式属性标签包括:在所述网页布局模板所在的网页子层的预封装的样式属性标签中选择所述至少一个样式属性标签;对所述网页布局模板设置选择的所述至少一个样式属性标签。
进一步的,所述向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素包括:从网页内容元素库调取所述网页内容元素库存储的模板内容元素并加入对应的网页布局模板;和/或,从数据接口获取外部数据源输入的模板内容元素并加入对应的网页布局模板。
进一步的,所述对所述模板内容元素的属性设置至少一个元素属性标签包括:在所述模板内容元素所在的网页布局模板的预封装的元素属性标签中选择所述至少一个元素属性标签;对所述网页布局模板设置选择的所述至少一个元素属性标签。
进一步的,所述将所述样式属性标签与元素属性标签封装到与其相对应的网页子层内包括:将所述网页布局模板及其相对应的样式属性标签与模板内容元素及其相对应的元素属性标签均封装到所述网页子层中;封装所述至少两个的网页子层,获取所述网页。
一种网页可视化制作装置,包括:
分层模块,用于根据网页内容设置至少两个网页子层。
布局模板添加模块,用于向每个所述网页子层加入与该子层对应的至少一个网页布局模板,并对所述网页布局模板的属性设置至少一个样式属性标签。
模板元素添加模块,用于向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素,并对所述模板内容元素的属性设置至少一个元素属性标签。
封装模块,用于将每一个所述网页子层的网页布局模板与模板内容元素及与其相对应的属性标签均封装在对应的网页子层中,并封装所述至少两个的网页子层,获取所述网页。
进一步的,所述装置还包括:网页布局模板库、网页内容元素库、数据接口;所述网页布局模板库用于存储预设的网页布局模板;所述网页内容元素库用于存储预设的模板内容元素;所述数据接口与外部数据源相连,用于获取外部数据源的数据。
进一步的,所述布局模板添加模块具体用于从网页布局模板库调取所述网页布局模板库存储的网页布局模板并加入对应的网页子层,和/或,从数据接口获取外部数据源输入的网页内容元素并加入对应的网页子层;为所述网页布局模板选择所述至少一个样式属性标签,对所述网页布局模板设置选择的所述至少一个样式属性标签。
进一步的,所述模板元素添加模块具体用于从网页内容元素库调取所述网页内容元素库存储的模板内容元素并加入对应的网页布局模板内,和/或,从数据接口获取外部数据源输入的模板内容元素并加入对应的网页布局模板内;为所述模板内容元素选择所述至少一个元素属性标签,对所述模板内容元素设置选择的所述至少一个元素属性标签。
本发明具有以下有益效果:
1、设计师设计系列模板供用户选择,同时用户选择该模板后前台仍可以实现模板内容的自定义,包括模板中布局,模板的选择及各种样式的调整,使用户通过简单的操作就可以制作出内容丰富的样式效果。
2、可以由设计师动态增加模块,无需开发人员进行二次开发。
3、所有模块的HTML内容及样式都可以自定义,通过修改样式属性最大程度实现模板显示差异化,其它同类产品一般样式是固定的只能动态更换颜色。
附图说明
图1是本发明实施例所述一种网页模板制作的可视化方法的方法流程图;
图2是本发明实施例所述一种网页可视化制作装置的方框原理图。
具体实施方式
如图1所示,本发明实施例所述的一种网页模板制作的可视化方法,包括:
1、根据网页内容设置至少两个网页子层;
2、向每个所述网页子层加入与该子层对应的至少一个网页布局模板,并对所述网页布局模板的属性设置至少一个样式属性标签;
3、向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素,并对所述模板内容元素的属性设置至少一个元素属性标签;
4、将所述样式属性标签与元素属性标签封装到与其相对应的网页子层内。
步骤1:根据网页内容设置至少两个网页子层:
在本步骤中,根据网页的内容确定网页子层的个数,生成相应个数的网页子层。一个较佳实施方式为,对于常见的网页,根据其网页内容,将网页子层设置为三个,具体地,为该网页设置底网页子层、中间网页子层和顶网页子层。
步骤2:向每个所述网页子层加入与该子层对应的至少一个网页布局模板,并对所述网页布局模板的属性设置至少一个样式属性标签:
可以从以下两种渠道获取需要加入的网页布局模板,具体地,可以从以下两种渠道中的任何一种获取全部的网页布局模板,也可以从其中一种渠道获取部分网页布局模板,从另一种渠道获取其它的网页布局模板。获取网页内容元素的两种渠道为:从网页布局模板库调取所述网页布局模板库存储的网页布局模板并加入对应的网页子层;和/或,从数据接口获取外部数据源输入的网页布局模板并加入对应的网页子层。
具体地,仍以步骤1中的网页为例,向底网页子层加入至少一个背景布局模板,向中间网页子层加入至少一个主要信息布局模板,向顶网页子层加入至少一个用户交互布局模板。其中,背景布局模板、主要信息布局模板和用户交互布局模板可以从网页布局模板库调取,也可以从数据接口获取,或者结合使用页内容元素库和数据接口,获取上述内容元素。
对背景布局模板、主要信息布局模板和用户交互布局模板选择模板的结构,单框模板或者多框模板,内边距、外边距、边框颜色、框与框之间的比例、边框样式、底框颜色、显示数据条数、显示标题截字、显示简介截字、是否有图片、是否标题、是否有简介、是否有价格、是否有日期等样式属性标签。
工程师只需要添加新模板,并为该新模板的属性添加样式属性标签,供用户选择。
步骤3:向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素,并对所述模板内容元素的属性设置至少一个元素属性标签:
可以从以下两种渠道获取需要加入的模板内容元素,具体地,可以从以下两种渠道中的任何一种获取全部的模板内容元素,也可以从其中一种渠道获取部分模板内容元素,从另一种渠道获取其它的模板内容元素。获取模板内容元素的两种渠道为:所述向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素包括:从网页内容元素库调取所述网页内容元素库存储的模板内容元素并加入对应的网页布局模板;和/或,从数据接口获取外部数据源输入的模板内容元素并加入对应的网页布局模板。
具体地,仍以步骤2中的网页为例,向背景布局模板内加入一个背景元素,并选择该背景元素的颜色、图片样式、图片格式、截图范围等元素属性标签;向主要信息布局模板内加入相对应的信息内容元素,包括文字、图片、视频等,并选择显示字体、字体型号、颜色、图片格式、图片大小等元素属性标签;向用户交互布局模板内加入文字链接、图片链接、相关联链接等,并输入链接的地址。其中,背景布局模板、主要信息布局模板和用户交互布局模板可以从网页布局模板库调取,也可以从数据接口获取,或者结合使用页内容元素库和数据接口,获取上述内容元素。
步骤4:将所述样式属性标签与元素属性标签封装到与其相对应的网页子层内。
将每一个所述网页子层的网页布局模板与模板内容元素及与其相对应的属性标签均封装在对应的网页子层中,并封装所述至少两个的网页子层,获取所述网页。
如图2所示,一种网页可视化制作装置,包括:
分层模块5,用于根据网页内容设置至少两个网页子层。一个较佳实施方式为,对于常见的网页,根据其网页内容,将网页子层设置为三个,具体地,为该网页设置底网页子层、中间网页子层和顶网页子层。
布局模板添加模块6,所述布局模板添加模块具体用于从网页布局模板库调取所述网页布局模板库存储的网页布局模板并加入对应的网页子层,和/或,从数据接口获取外部数据源输入的网页内容元素并加入对应的网页子层;为所述网页布局模板选择所述至少一个样式属性标签,对所述网页布局模板设置选择的所述至少一个样式属性标签。
模板元素添加模块7,所述模板元素添加模块具体用于从网页内容元素库调取所述网页内容元素库存储的模板内容元素并加入对应的网页布局模板的模板元素内,和/或,从数据接口获取外部数据源输入的模板内容元素并加入对应的网页布局模板的模板元素内;为所述模板内容元素选择所述至少一个元素属性标签,对所述模板内容元素设置选择的所述至少一个元素属性标签。
封装模块8,用于将每一个所述网页子层的网页布局模板与模板内容元素及与其相对应的属性标签均封装在对应的网页子层中,并封装所述至少两个的网页子层,获取所述网页。
网页布局模板库9,所述网页布局模板库用于存储预设的网页布局模板。
网页内容元素库10,所述网页内容元素库用于存储预设的模板内容元素。
数据接口11,所述数据接口与外部数据源相连,用于获取外部数据源的数据。
本发明不局限于上述最佳实施方式,任何人在本发明的启示下都可得出其他各种形式的产品,但不论在其形状或结构上作任何变化,凡是具有与本申请相同或相近似的技术方案,均落在本发明的保护范围之内。

Claims (10)

1.一种网页模板制作的可视化方法,根据网页内容设置至少两个网页子层,其特征在于:
向每个所述网页子层加入与该子层对应的至少一个网页布局模板,并对所述网页布局模板的属性设置至少一个样式属性标签;
向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素,并对所述模板内容元素的属性设置至少一个元素属性标签;
将所述样式属性标签与元素属性标签封装到与其相对应的网页子层内。
2.根据权利要求1所述的方法,其特征在于,所述向每个所述网页子层加入与该子层对应的至少一个网页布局模板包括:
从网页布局模板库调取所述网页布局模板库存储的网页布局模板并加入对应的网页子层;
和/或,从数据接口获取外部数据源输入的网页布局模板并加入对应的网页子层。
3.根据权利要求1所述的方法,其特征在于,所述对所述网页布局模板的属性设置至少一个样式属性标签包括:
在所述网页布局模板所在的网页子层的预封装的样式属性标签中选择所述至少一个样式属性标签;
对所述网页布局模板设置选择的所述至少一个样式属性标签。
4.根据权利要求1所述的方法,其特征在于,所述向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素包括:
从网页内容元素库调取所述网页内容元素库存储的模板内容元素并加入对应的网页布局模板;
和/或,从数据接口获取外部数据源输入的模板内容元素并加入对应的网页布局模板。
5.根据权利要求1所述的方法,其特征在于,所述对所述模板内容元素的属性设置至少一个元素属性标签包括:
在所述模板内容元素所在的网页布局模板的预封装的元素属性标签中选择所述至少一个元素属性标签;
对所述网页布局模板设置选择的所述至少一个元素属性标签。
6.根据权利要求1所述的方法,其特征在于,所述将所述样式属性标签与元素属性标签封装到与其相对应的网页子层内包括:
将所述网页布局模板及其相对应的样式属性标签与模板内容元素及其相对应的元素属性标签均封装到所述网页子层中;
封装所述至少两个的网页子层,获取所述网页。
7.一种网页可视化制作装置,其特征在于,包括:
分层模块,用于根据网页内容设置至少两个网页子层;
布局模板添加模块,用于向每个所述网页子层加入与该子层对应的至少一个网页布局模板,并对所述网页布局模板的属性设置至少一个样式属性标签;
模板元素添加模块,用于向每个所述网页布局模板的模板元素内加入与该模板元素相对应的模板内容元素,并对所述模板内容元素的属性设置至少一个元素属性标签;
封装模块,用于将每一个所述网页子层的网页布局模板与模板内容元素及与其相对应的属性标签均封装在对应的网页子层中,并封装所述至少两个的网页子层,获取所述网页。
8.根据权利要求7所述的网页可视化制作装置,其特征在于:
所述装置还包括:网页布局模板库、网页内容元素库、数据接口;所述网页布局模板库用于存储预设的网页布局模板;所述网页内容元素库用于存储预设的模板内容元素;所述数据接口与外部数据源相连,用于获取外部数据源的数据。
9.根据权利要求7所述的网页可视化制作装置,其特征在于:
所述布局模板添加模块具体用于从网页布局模板库调取所述网页布局模板库存储的网页布局模板并加入对应的网页子层,和/或,从数据接口获取外部数据源输入的网页内容元素并加入对应的网页子层;
为所述网页布局模板选择所述至少一个样式属性标签,对所述网页布局模板设置选择的所述至少一个样式属性标签。
10.根据权利要求7所述的网页可视化制作装置,其特征在于:
所述模板元素添加模块具体用于从网页内容元素库调取所述网页内容元素库存储的模板内容元素并加入对应的网页布局模板内,和/或,从数据接口获取外部数据源输入的模板内容元素并加入对应的网页布局模板内;
为所述模板内容元素选择所述至少一个元素属性标签,对所述模板内容元素设置选择的所述至少一个元素属性标签。
CN201610056014.4A 2016-01-27 2016-01-27 网页模板制作的可视化方法以及网页可视化制作装置 Pending CN105740377A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610056014.4A CN105740377A (zh) 2016-01-27 2016-01-27 网页模板制作的可视化方法以及网页可视化制作装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610056014.4A CN105740377A (zh) 2016-01-27 2016-01-27 网页模板制作的可视化方法以及网页可视化制作装置

Publications (1)

Publication Number Publication Date
CN105740377A true CN105740377A (zh) 2016-07-06

Family

ID=56246713

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610056014.4A Pending CN105740377A (zh) 2016-01-27 2016-01-27 网页模板制作的可视化方法以及网页可视化制作装置

Country Status (1)

Country Link
CN (1) CN105740377A (zh)

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107247587A (zh) * 2017-05-26 2017-10-13 上海斐讯数据通信技术有限公司 一种网页模板生成方法及装置
US9871911B1 (en) * 2016-09-30 2018-01-16 Microsoft Technology Licensing, Llc Visualizations for interactions with external computing logic
CN108681454A (zh) * 2018-05-23 2018-10-19 成都淞幸科技有限责任公司 一种网页可视化构件开发方法
CN109241473A (zh) * 2017-07-10 2019-01-18 北京搜狗科技发展有限公司 一种页面生成方法、装置和设备
CN109445780A (zh) * 2018-09-19 2019-03-08 平安科技(深圳)有限公司 一种样式编辑方法及设备
CN110427587A (zh) * 2019-07-30 2019-11-08 广州怡禄电讯科技有限公司 一种基于网络系统自定义表单的实现方法
CN110780960A (zh) * 2019-09-29 2020-02-11 中至数据集团股份有限公司 一种网页制作方法、系统、可读存储介质及服务器

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101807209A (zh) * 2010-04-14 2010-08-18 深圳市同洲电子股份有限公司 网页制作的方法和系统,客户端、服务端
CN103631865A (zh) * 2013-11-01 2014-03-12 北京奇虎科技有限公司 网页生成方法及设备
US20140129924A1 (en) * 2012-11-06 2014-05-08 Open Text S.A. System and method for creation of templates
CN103853735A (zh) * 2012-11-29 2014-06-11 怡丰联合(北京)科技有限责任公司 Html模板可视化制作、编辑方法及系统
US20150205809A1 (en) * 2014-01-17 2015-07-23 Pagefair Limited Image Obfuscation

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101807209A (zh) * 2010-04-14 2010-08-18 深圳市同洲电子股份有限公司 网页制作的方法和系统,客户端、服务端
US20140129924A1 (en) * 2012-11-06 2014-05-08 Open Text S.A. System and method for creation of templates
CN103853735A (zh) * 2012-11-29 2014-06-11 怡丰联合(北京)科技有限责任公司 Html模板可视化制作、编辑方法及系统
CN103631865A (zh) * 2013-11-01 2014-03-12 北京奇虎科技有限公司 网页生成方法及设备
US20150205809A1 (en) * 2014-01-17 2015-07-23 Pagefair Limited Image Obfuscation

Cited By (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9871911B1 (en) * 2016-09-30 2018-01-16 Microsoft Technology Licensing, Llc Visualizations for interactions with external computing logic
CN107247587A (zh) * 2017-05-26 2017-10-13 上海斐讯数据通信技术有限公司 一种网页模板生成方法及装置
CN107247587B (zh) * 2017-05-26 2020-02-21 上海斐讯数据通信技术有限公司 一种网页模板生成方法及装置
CN109241473A (zh) * 2017-07-10 2019-01-18 北京搜狗科技发展有限公司 一种页面生成方法、装置和设备
CN108681454A (zh) * 2018-05-23 2018-10-19 成都淞幸科技有限责任公司 一种网页可视化构件开发方法
CN109445780A (zh) * 2018-09-19 2019-03-08 平安科技(深圳)有限公司 一种样式编辑方法及设备
CN110427587A (zh) * 2019-07-30 2019-11-08 广州怡禄电讯科技有限公司 一种基于网络系统自定义表单的实现方法
CN110780960A (zh) * 2019-09-29 2020-02-11 中至数据集团股份有限公司 一种网页制作方法、系统、可读存储介质及服务器
CN110780960B (zh) * 2019-09-29 2024-01-26 中至数据集团股份有限公司 一种网页制作方法、系统、可读存储介质及服务器

Similar Documents

Publication Publication Date Title
CN105740377A (zh) 网页模板制作的可视化方法以及网页可视化制作装置
CN103631865B (zh) 网页生成方法及设备
CN103365855B (zh) 生成网页的方法及服务器
CN103744674B (zh) 生成html程序代码的方法和装置
CN109308729B (zh) 图片合成处理方法、装置及系统
CN107451296A (zh) 一种基于组件的网站模块化渲染方法
US8783553B2 (en) Method and system for mass production of variable shaped products
CN104599144A (zh) 生成商品详情页面的方法和装置
CN106484408A (zh) 一种基于html5的节点关系图显示方法及系统
CN104516867A (zh) 一种表格重排方法和系统
CN105094930A (zh) 一种定位图片系统及方法
CN112015509A (zh) 数据可视化大屏的构建方法、电子设备及存储介质
CN103440239B (zh) 一种基于功能区域识别的网页切分方法及装置
CN103258015A (zh) 一种基于xml动态生成问卷的方法
CN103279345B (zh) 一种对页面元素进行锁定的方法及装置
US20170090723A1 (en) Widgets in digital dashboards
CN110008450A (zh) 图片的生成方法、装置、设备和介质
CN106708506A (zh) 一种从视觉上优化Android应用启动速度的方法及装置
CN104679453A (zh) 一种信息录入、储存及排版打印的通用系统及方法
CN107391656A (zh) 基于蒙版的web表单设计方法
CN112927314B (zh) 一种图像数据处理方法、装置以及计算机设备
CN103970890B (zh) 一种实时网页数据的生成方法及装置
CN107506431A (zh) 由xml文件生成html文件的方法、存储介质及终端
CN104715054A (zh) 将Silverlight内容转换成HTML网页内容的方法
CN104424174A (zh) 文档处理系统和文档处理方法

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
CB02 Change of applicant information

Inventor after: Zhang Yuanda

Inventor after: Wu Xia

Inventor after: Li Jingru

Inventor before: Zhang Yuanda

COR Change of bibliographic data
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20160706