将图片类文件转换为网页文件的方法和装置制造方法
【专利摘要】本发明提出一种将图片类文件转换为网页文件的方法，包括以下步骤：获取图片类文件；对图片类文件进行分离以获取图片类文件的多个图层；分别获取多个图层中的图片层和文字图片层；根据图片层和文字图片层分别生成文字层和背景图片层；根据文字层、背景图片层和网页布局框架生成网页文件。本发明自动将图片转换成网页文件，避免重复工作，节省了人工操作，提高了效率。本发明还公开了一种将图片类文件转换为网页文件的装置。
【专利说明】将图片类文件转换为网页文件的方法和装置
【技术领域】
[0001] 本发明涉及计算机【技术领域】，特别涉及一种将图片类文件转换为网页文件的方法 和装置。
【背景技术】
[0002] 随着互联网的蓬勃发展，网页成为了一种在互联网中常见的传播载体。网页包含 了丰富的信息，同时需要合理的组织和设计，从而产生良好的用户体验，吸引用户。由于一 些例如公司促销活动页面、招聘页面等需求，常常可以看见有各种的单页网页。因此，有大 量的设计师和工程师从事于网页的制作工作。
[0003] -般情况下，网页的产生需要视觉设计师和研发工程师合作完成。首先，视觉设计 师绘制网页设计稿，由前端工程师用HTML页面进行还原，以便于维护和在互联网上进行传 播。只要熟悉HTML和CSS，可以很轻松高效率地对图片进行重构，做成网页。分离文字图 层，复制文字到重构页面上，调整格式等工作是前端工程师工作量的很大一部分。但是当前 端工程师在用HTML编写布局，用CSS调节样式时，无形中重复了设计师的工作。一般视觉 设计师Photoshop的视觉稿是用各图层来表现的，而HTML页面是用各Dom元素来实现的， 但是目前并没有二者间自动转换的方法。并且，工程师人工重构也可能没有准确还原设计 师的设计意图。
【发明内容】
[0004] 本发明旨在至少解决现有技术中存在的技术问题之一。为此，本发明的一个目的 在于提出一种将图片类文件转换为网页文件的方法，自动将图片转换成网页文件，避免重 复工作，节省了人工操作，提高了效率。
[0005] 本发明的第二个目的在于提出一种将图片类文件转换为网页文件的装置。
[0006] 为达到上述目的，本发明第一方面的实施例提出了一种将图片类文件转换为网页 文件的方法，包括以下步骤：获取图片类文件；对所述图片类文件进行分离以获取所述图 片类文件的多个图层；分别获取所述多个图层中的图片层和文字图片层；根据所述图片层 和文字图片层分别生成文字层和背景图片层；根据所述文字层、背景图片层和网页布局框 架生成网页文件。
[0007] 根据本发明实施例的将图片类文件转换为网页文件的方法通过对图片类文件进 行图文分离，将分离的文字层、背景图片层和网页布局框架组合，将页面设计图接输出为网 页文件，将人工操作用用程序实现，实现了页面的自动化重构。避免重复工作，减少工作量， 提高工作效率，并且设计页面直接输出网页，可以让设计师很好地把握视觉还原。
[0008] 在本发明的一个实施例中，所述根据图片层和文字图片层分别生成文字层和背景 图片层具体包括：将图片层分别放入背景图片集合；对文字图片层中的文字进行分析以获 取所述文字图片层中文字的属性信息；根据所述文字的属性信息判断所述文字图片层是否 为阅读文字图片层；如果判断不为所述阅读文字图片层，则将所述文字图片层放入所述背 景图片集合；如果判断为所述阅读文字图片层，则将所述文字图片层放入所述文字图片集 合；分别根据所述文字图片集合和背景图片集合生成文字层和背景图片层。
[0009] 在本发明的一个实施例中，所述属性信息为无抗锯齿属性，当所述文字图层中的 文字的属性为无抗锯齿属性时，则所述文字图层为所述阅读文字图片层。
[0010] 在本发明的一个实施例中，还包括：根据所述网页文件的尺寸需求对所述背景图 片层进行切割。
[0011] 在本发明的一个实施例中，还包括：当所述背景图片的大小大于预设阈值时，将所 述背景图片分割为多个图片块以提高浏览速度。
[0012] 在本发明的一个实施例中，所述分别根据所述文字图片集合和背景图片集合生成 文字层和背景图片层具体包括：分别在所述网页布局框架中建立背景图片容器和文字容 器，其中，所述背景图片容器和文字容器相互叠合；对所述文字图片集合中的文字图片层中 的文字进行识别以生成文字集合；将所述文字集合和背景图片集合分别添加至所述文字容 器和背景图片容器中以生成所述文字层和背景图片层。
[0013] 在本发明的一个实施例中，还包括：记录所述文字图片集合中的文字图片层中的 文字的位置信息，并根据所述位置信息将所述文字集合添加至所述文字容器中。
[0014] 在本发明的一个实施例中，还包括：记录所述文字图片集合中的文字图片层中的 文字的性质特征信息，并根据所述性质特征信息将所述文字集合添加至所述文字容器中。
[0015] 在本发明的一个实施例中，所述图片类文件为PSD格式。
[0016] 本发明第一方面的实施例提出了一种将图片类文件转换为网页文件的装置，包括 分离模块、分析模块和生成模块。分离模块用于对图片类文件进行分离以获取所述图片类 文件的多个图层；分析模块用于分别获取所述多个图层中的图片层和文字图片层；生成模 块用于根据所述图片层和文字图片层分别生成文字层和背景图片层，并根据所述文字层、 背景图片层和网页布局框架生成网页文件。
[0017] 根据本发明实施例的将图片类文件转换为网页文件的装置通过对图片类文件进 行图文分离，将分离的文字层、背景图片层和网页布局框架组合，将页面设计图接输出为网 页文件，将人工操作用用程序实现，实现了页面的自动化重构。避免重复工作，减少工作量， 提高工作效率，并且设计页面直接输出网页，可以让设计师很好地把握视觉还原。
[0018] 在本发明的一个实施例中，所述生成模块具体包括分析子模块、管理子模块和生 成子模块。其中，分析子模块用于对文字图片层中的文字进行分析以获取所述文字图片层 中文字的属性信息；管理子模块用于将图片层分别放入背景图片集合，并在根据所述文字 的属性信息判断所述文字图片层为阅读文字图片层时将所述文字图片层放入所述背景图 片集合，并在根据所述文字的属性信息判断所述文字图片层不为阅读文字图片层时，将所 述文字图片层放入所述文字图片集合；生成子模块用于分别根据所述文字图片集合和背景 图片集合生成文字层和背景图片层。
[0019] 在本发明的一个实施例中，所述属性信息为无抗锯齿属性，当所述文字图层中的 文字的属性为无抗锯齿属性时，则所述文字图层为所述阅读文字图片层。
[0020] 在本发明的一个实施例中，还包括：切割模块用于根据所述网页文件的尺寸需求 对所述背景图片层进行切割。
[0021] 在本发明的一个实施例中，还包括：分割模块用于当所述背景图片的大小大于预 设阈值时，将所述背景图片分割为多个图片块以提高浏览速度。
[0022] 在本发明的一个实施例中，所述生成子模块分别在所述网页布局框架中建立背景 图片容器和文字容器，其中，所述背景图片容器和文字容器相互叠合，并对所述文字图片集 合中的文字图片层中的文字进行识别以生成文字集合，以及将所述文字集合和背景图片集 合分别添加至所述文字容器和背景图片容器中以生成所述文字层和背景图片层。
[0023] 在本发明的一个实施例中，所述生成子模块还用于记录所述文字图片集合中的文 字图片层中的文字的位置信息，并根据所述位置信息将所述文字集合添加至所述文字容器 中。
[0024] 在本发明的一个实施例中，所述生成子模块还用于记录所述文字图片集合中的文 字图片层中的文字的性质特征信息，并根据所述性质特征信息将所述文字集合添加至所述 文字容器中。
[0025] 在本发明的一个实施例中，所述图片类文件为PSD格式。
[0026] 本发明的附加方面和优点将在下面的描述中部分给出，部分将从下面的描述中变 得明显，或通过本发明的实践了解到。
【专利附图】
【附图说明】
[0027] 本发明的上述和/或附加的方面和优点从结合下面附图对实施例的描述中将变 得明显和容易理解，其中 ：
[0028] 图1是根据本发明实施例的将图片类文件转换为网页文件的方法的流程图；
[0029] 图2a是根据本发明实施例的本发明生成网页文件的界面示意图；
[0030] 图2b是根据本发明实施例的本发明输出网页的目录结构示意图；和
[0031] 图3是根据本发明实施例的将图片类文件转换为网页文件的装置的结构示意图。
【具体实施方式】
[0032] 下面详细描述本发明的实施例，所述实施例的示例在附图中示出，其中自始至终 相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附 图描述的实施例是示例性的，仅用于解释本发明，而不能理解为对本发明的限制。
[0033] 下面参考图1描述根据本发明实施例的将图片类文件转换为网页文件的方法，包 括以下步骤：
[0034] 步骤S110 :获取图片类文件。
[0035] 步骤S120 :对图片类文件进行分离以获取图片类文件的多个图层。
[0036] 步骤S130 :分别获取多个图层中的图片层和文字图片层。
[0037] 步骤S140 :根据图片层和文字图片层分别生成文字层和背景图片层。
[0038] 其中，根据图片层和文字图片层分别生成文字层和背景图片层具体包括：
[0039] 步骤S141 :将图片层分别放入背景图片集合。
[0040] 步骤S142 :对文字图片层中的文字进行分析以获取文字图片层中文字的属性信 肩、。
[0041] 在本发明的一个实施例中，属性信息为无抗锯齿属性，当文字图层中的文字的属 性为无抗锯齿属性时，则文字图层为阅读文字图片层。
[0042] 步骤S143 :根据文字的属性信息判断文字图片层是否为阅读文字图片层。
[0043] 步骤S144:如果判断不为阅读文字图片层，则将文字图片层放入背景图片集合。
[0044] 步骤S145 :如果判断为阅读文字图片层，则将文字图片层放入文字图片集合。 [0045] 步骤S146 :分别根据文字图片集合和背景图片集合生成文字层和背景图片层。
[0046] 其中，分别根据文字图片集合和背景图片集合生成文字层和背景图片层具体包 括：
[0047] 步骤S146_l :分别在网页布局框架中建立背景图片容器和文字容器，
[0048] 其中，背景图片容器和文字容器相互叠合。
[0049] 步骤S146_2 :对文字图片集合中的文字图片层中的文字进行识别以生成文字集 合。
[0050] 步骤S146_3 :将文字集合和背景图片集合分别添加至文字容器和背景图片容器 中以生成文字层和背景图片层。
[0051] 在本发明的一个实施例中，还包括：记录文字图片集合中的文字图片层中的文字 的位置信息，并根据位置信息将文字集合添加至文字容器中。
[0052] 在本发明的一个实施例中，还包括：记录文字图片集合中的文字图片层中的文字 的性质特征信息，并根据性质特征信息将文字集合添加至文字容器中。在本发明的实施例 中，文字的特质特质信息例如为文字大小、行高、字体、对齐方式、下划线、粗体、颜色等信 肩、。
[0053] 步骤S150 :根据文字层、背景图片层和网页布局框架生成网页文件。
[0054] 在本发明的一个实施例中，还包括：根据网页文件的尺寸需求对背景图片层进行 切割。
[0055] 还包括：当背景图片的大小大于预设阈值时，将背景图片分割为多个图片块以提 高浏览速度。
[0056] 下面以根据本发明实施例实现的系统本发明为例对本发明进行详细说明，可以理 解的是，本发明仅出于示例目的，本发明实施例不限于此。
[0057] 本发明为Photoshop插件，用脚本语言实现。图2a为本发明生成网页文件的界面 示意图。为按照如下步骤，可以利用本发明将页面设计视觉稿直接输出为包括CSS样式文 件、图片资源文件和HTML文件，效果如图2b所示。
[0058] 本发明获取图片文件。其中，图片类文件为PSD格式。
[0059] 本发明对图片类文件进行分离以获取图片类文件的多个图层。本发明执行图文分 离，分别获取多个图层中的图片层和包含文字的文字图片层。根据获取多个图层中的图片 层和文字图片层，生成文字图片集合和背景图片集合。
[0060] 具体地，设属性信息为无抗锯齿属性。本发明遍历所有的图层，将图片层分别放入 背景图片集合。对于文字层，找到所有抗锯齿属性设置为"无"的文字图层，将其移动到并 且移动文字图片集合中；将其它文字层放入背景图片集合。
[0061] 例如，将图片中使用特殊字体或者效果的文本称为装饰性文本。在网页中，装饰性 文本一般用图片进行展示。一般使用系统自带字体且无抗锯齿效果的文本称为内容性文 本，此类文本一般直接出现在网页代码中，便于动态显示以及后台进行修改。因此通过无 抗锯齿属性将装饰性文本和内容性文本进行分离，分别放入背景图片集合和文字图片集合 中。文字的性质特征信息包括如下划线、文字字体颜色、大小、是否加粗，文字的行高、对齐 方式等。在本发明，将带有下划线的文字判断为超链接进行标记。
[0062] 此外，如果硬件配置低、文件体积大、图层数目大，由于遍历所有图层可能需要耗 费大量的时间，因此，可以选中所有文字图层并移动至图层树顶层，从而只需遍历顶层即可 分离，从而提高图文分离效率。可以理解的是，本分离方法仅出于示例目的，本发明的实施 例不限于此。
[0063] 根据文字图片集合和背景图片集合生成文字层和背景图片层。具体地，分别在网 页布局框架中建立相互叠合的背景图片容器和文字容器，识别文字图片集合中的文字图片 层中的文字，生成文字集合。将文字集合和背景图片集合分别添加至文字容器和背景图片 容器中以生成文字层和背景图片层。此外，记录所述文字图片集合中的文字图片层中的文 字的位置信息和/或性质特征信息，并根据所述位置信息和/或性质特征信息将所述文字 集合添加至所述文字容器中。
[0064] 本发明将文字层进行隐藏，拷贝到新副本中，然后合并所有图层。本发明根据网页 文件的尺寸需求对背景图片层进行切割。如图2所示，可以在3中根据网页文件的尺寸需 求指定图片分割的大小。本发明按照设置切割页面，并输出到指定文件夹中。其中，如果宽 度设置为0,则为全屏宽度。当所述背景图片的大小大于预设阈值时，将所述背景图片分割 为多个图片块以提高浏览速度。
[0065] 本发明进行图片切割的同时收集图片的相关信息，在切割图片后，生成执行代码， 收集文字层的信息并生成响应代码，并输出至指定目录中。如图2b所示为某图片生成的网 页文件，其中css目录存放网页的风格样式信息，img目录存放背景图片，index.html为网 页首页。
[0066] 根据本发明实施例的将图片类文件转换为网页文件的方法筛选出图层中的文本 图层，将背景图片图层进行切割输出图片文件，最后根据文字层、背景图片层和网页布局框 架生成网页文件，将耗时的人工操作用脚本自动化实现，可以帮助工程师高效率切图并且 自动编码重构。减少了工作量，提高工作效率。同时，由设计页面直接输出网页，可以让设 计师很好地把握视觉还原。
[0067] 下面参考图3描述根据本发明实施例的将图片类文件转换为网页文件的装置 100,包括分离模块110、分析模块120和生成模块130。其中，
[0068] 分离模块110用于对图片类文件进行分离以获取图片类文件的多个图层；
[0069] 分析模块120用于分别获取多个图层中的图片层和文字图片层；
[0070] 生成模块130用于根据图片层和文字图片层分别生成文字层和背景图片层，并根 据文字层、背景图片层和网页布局框架生成网页文件。
[0071] 在本发明的一个实施例中，图片类文件为PSD格式。
[0072] 生成模块130具体包括分析子模块131、管理子模块132和生成子模块133。其 中，分析子模块131用于对文字图片层中的文字进行分析以获取文字图片层中文字的属性 信息；管理子模块132用于将图片层分别放入背景图片集合，并在根据文字的属性信息判 断文字图片层为阅读文字图片层时将文字图片层放入背景图片集合，并在根据文字的属性 信息判断文字图片层不为阅读文字图片层时，将文字图片层放入文字图片集合；生成子模 块133用于分别根据文字图片集合和背景图片集合生成文字层和背景图片层。
[0073] 其中，属性信息为无抗锯齿属性，当文字图层中的文字的属性为无抗锯齿属性时， 则文字图层为阅读文字图片层。
[0074] 在本发明的一个实施例中，生成子模块133分别在网页布局框架中建立背景图片 容器和文字容器，其中，背景图片容器和文字容器相互叠合，并对文字图片集合中的文字图 片层中的文字进行识别以生成文字集合，以及将文字集合和背景图片集合分别添加至文字 容器和背景图片容器中以生成文字层和背景图片层。
[0075] 此外，生成子模块133还用于记录文字图片集合中的文字图片层中的文字的位置 信息，并根据位置信息将文字集合添加至文字容器中。
[0076] 生成子模块133还用于记录文字图片集合中的文字图片层中的文字的性质特征 信息，并根据性质特征信息将文字集合添加至文字容器中。
[0077] 在本发明的一个实施例中，根据本发明实施例的将图片类文件转换为网页文件的 装置100还包括：切割模块140用于根据网页文件的尺寸需求对背景图片层进行切割。
[0078] 在本发明的一个实施例中，根据本发明实施例的将图片类文件转换为网页文件的 装置100还包括：分割模块150用于当背景图片的大小大于预设阈值时，将背景图片分割为 多个图片块以提高浏览速度。
[0079] 下面以根据本发明实施例实现的系统本发明为例对本发明进行详细说明，可以理 解的是，本发明仅出于示例目的，本发明实施例不限于此。
[0080] 本发明为Photoshop插件，用脚本语言实现。图2a为本发明生成网页文件的界面 示意图。为按照如下步骤，可以利用本发明将页面设计视觉稿直接输出为包括CSS样式文 件、图片资源文件和HTML文件，效果如图2b所示。
[0081] 分析模块120获取图片文件。其中，图片类文件为PSD格式。
[0082] 分离模块110对图片类文件进行分离以获取图片类文件的多个图层。生成模块 130执行图文分离，分别获取多个图层中的图片层和包含文字的文字图片层。生成模块130 根据获取多个图层中的图片层和文字图片层，生成文字图片集合和背景图片集合。
[0083] 具体地，设属性信息为无抗锯齿属性。分析子模块131用于对文字图片层中的文 字进行分析以获取文字图片层中文字的属性信。管理子模块132遍历所有的图层，将图片 层分别放入背景图片集合。对于文字层，管理子模块132找到所有抗锯齿属性设置为"无" 的文字图层，将其移动到并且移动文字图片集合中；管理子模块132将其它文字层放入背 景图片集合。
[0084] 例如，将图片中使用特殊字体或者效果的文本称为装饰性文本。在网页中，装饰性 文本一般用图片进行展示。一般使用系统自带字体且无抗锯齿效果的文本称为内容性文 本，此类文本一般直接出现在网页代码中，便于动态显示以及后台进行修改。因此管理子模 块132通过无抗锯齿属性将装饰性文本和内容性文本进行分离，分别放入背景图片集合和 文字图片集合中。文字的性质
[0085] 特征信息包括如下划线、文字字体颜色、大小、是否加粗，文字的行高、对齐方式 等。在本发明，将带有下划线的文字判断为超链接进行标记。
[0086] 此外，如果硬件配置低、文件体积大、图层数目大，由于遍历所有图层可能需要耗 费大量的时间，因此，可以选中所有文字图层并移动至图层树顶层，从而只需遍历顶层即可 分离，从而提高图文分离效率。可以理解的是，本分离方法仅出于示例目的，本发明的实施 例不限于此。
[0087] 生成子模块133根据文字图片集合和背景图片集合生成文字层和背景图片层。具 体地，生成子模块133分别在网页布局框架中建立相互叠合的背景图片容器和文字容器， 生成子模块133识别文字图片集合中的文字图片层中的文字，生成文字集合。生成子模块 133将文字集合和背景图片集合分别添加至文字容器和背景图片容器中以生成文字层和背 景图片层。此外，生成子模块133记录所述文字图片集合中的文字图片层中的文字的位置 信息和/或性质特征信息，并根据所述位置信息和/或性质特征信息将所述文字集合添加 至所述文字容器中。
[0088] 本发明将文字层进行隐藏，拷贝到新副本中，然后合并所有图层。切割模块根据网 页文件的尺寸需求对背景图片层进行切割。如图2所示，可以在3中根据网页文件的尺寸 需求指定图片分割的大小。本发明按照设置切割页面，并输出到指定文件夹中。其中，如果 宽度设置为〇,则为全屏宽度。当所述背景图片的大小大于预设阈值时，分割模块将所述背 景图片分割为多个图片块以提高浏览速度。
[0089] 在切割模块进行图片切割的同时，生成模块130收集图片的相关信息，在切割图 片后，生成模块130生成执行代码，收集文字层的信息并生成响应代码，并输出至指定目录 中。如图2b所示为某图片生成的网页文件，其中css目录存放网页的风格样式信息，img目 录存放背景图片，index, html为网页首页。
[0090] 根据本发明实施例的将图片类文件转换为网页文件的装置筛选出图层中的文本 图层，将背景图片图层进行切割输出图片文件，最后根据文字层、背景图片层和网页布局框 架生成网页文件，将耗时的人工操作用脚本自动化实现，可以帮助工程师高效率切图并且 自动编码重构。减少了工作量，提高工作效率。同时，由设计页面直接输出网页，可以让设 计师很好地把握视觉还原。
[0091] 在本说明书的描述中，参考术语"一个实施例"、"一些实施例"、"示例"、"具体示 例"、或"一些示例"等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特 点包含于本发明的至少一个实施例或示例中。在本说明书中，对上述术语的示意性表述不 一定指的是相同的实施例或示例。而且，描述的具体特征、结构、材料或者特点可以在任何 的一个或多个实施例或示例中以合适的方式结合。
[〇〇92] 尽管已经示出和描述了本发明的实施例，对于本领域的普通技术人员而言，可以 理解在不脱离本发明的原理和精神的情况下可以对这些实施例进行多种变化、修改、替换 和变型，本发明的范围由所附权利要求及其等同限定。
【权利要求】
1. 一种将图片类文件转换为网页文件的方法，其特征在于，包括以下步骤： 获取图片类文件； 对所述图片类文件进行分离以获取所述图片类文件的多个图层； 分别获取所述多个图层中的图片层和文字图片层； 根据所述图片层和文字图片层分别生成文字层和背景图片层；以及 根据所述文字层、背景图片层和网页布局框架生成网页文件。
2. 如权利要求1所述的将图片类文件转换为网页文件的方法，其特征在于，所述根据 图片层和文字图片层分别生成文字层和背景图片层具体包括： 将图片层分别放入背景图片集合； 对文字图片层中的文字进行分析以获取所述文字图片层中文字的属性信息； 根据所述文字的属性信息判断所述文字图片层是否为阅读文字图片层； 如果判断不为所述阅读文字图片层，则将所述文字图片层放入所述背景图片集合； 如果判断为所述阅读文字图片层，则将所述文字图片层放入所述文字图片集合；以及 分别根据所述文字图片集合和背景图片集合生成文字层和背景图片层。
3. 如权利要求2所述的将图片类文件转换为网页文件的方法，其特征在于，所述属性 信息为无抗锯齿属性，当所述文字图层中的文字的属性为无抗锯齿属性时，则所述文字图 层为所述阅读文字图片层。
4. 如权利要求1-3任一项所述的将图片类文件转换为网页文件的方法，其特征在于， 还包括： 根据所述网页文件的尺寸需求对所述背景图片层进行切割。
5. 如权利要求1-3任一项所述的将图片类文件转换为网页文件的方法，其特征在于， 还包括： 当所述背景图片的大小大于预设阈值时，将所述背景图片分割为多个图片块以提高浏 览速度。
6. 如权利要求3所述的将图片类文件转换为网页文件的方法，其特征在于，所述分别 根据所述文字图片集合和背景图片集合生成文字层和背景图片层具体包括： 分别在所述网页布局框架中建立背景图片容器和文字容器，其中，所述背景图片容器 和文字容器相互叠合； 对所述文字图片集合中的文字图片层中的文字进行识别以生成文字集合；以及 将所述文字集合和背景图片集合分别添加至所述文字容器和背景图片容器中以生成 所述文字层和背景图片层。
7. 如权利要求6所述的将图片类文件转换为网页文件的方法，其特征在于，还包括： 记录所述文字图片集合中的文字图片层中的文字的位置信息，并根据所述位置信息将 所述文字集合添加至所述文字容器中。
8. 如权利要求6所述的将图片类文件转换为网页文件的方法，其特征在于，还包括： 记录所述文字图片集合中的文字图片层中的文字的性质特征信息，并根据所述性质特 征信息将所述文字集合添加至所述文字容器中。
9. 如权利要求1-8任一项所述的将图片类文件转换为网页文件的方法，其特征在于， 所述图片类文件为PSD格式。
10. -种将图片类文件转换为网页文件的装置，其特征在于，包括： 分离模块，用于对图片类文件进行分离以获取所述图片类文件的多个图层； 分析模块，用于分别获取所述多个图层中的图片层和文字图片层；以及 生成模块，用于根据所述图片层和文字图片层分别生成文字层和背景图片层，并根据 所述文字层、背景图片层和网页布局框架生成网页文件。
11. 如权利要求10所述的将图片类文件转换为网页文件的装置，其特征在于，所述生 成模块具体包括： 分析子模块，用于对文字图片层中的文字进行分析以获取所述文字图片层中文字的属 性信息； 管理子模块，用于将图片层分别放入背景图片集合，并在根据所述文字的属性信息判 断所述文字图片层为阅读文字图片层时将所述文字图片层放入所述背景图片集合，并在根 据所述文字的属性信息判断所述文字图片层不为阅读文字图片层时，将所述文字图片层放 入所述文字图片集合；以及 生成子模块，用于分别根据所述文字图片集合和背景图片集合生成文字层和背景图片 层。
12. 如权利要求11所述的将图片类文件转换为网页文件的装置，其特征在于，所述属 性信息为无抗锯齿属性，当所述文字图层中的文字的属性为无抗锯齿属性时，则所述文字 图层为所述阅读文字图片层。
13. 如权利要求10-12任一项所述的将图片类文件转换为网页文件的装置，其特征在 于，还包括： 切割模块，用于根据所述网页文件的尺寸需求对所述背景图片层进行切割。
14. 如权利要求10-12任一项所述的将图片类文件转换为网页文件的装置，其特征在 于，还包括： 分割模块，用于当所述背景图片的大小大于预设阈值时，将所述背景图片分割为多个 图片块以提高浏览速度。
15. 如权利要求11所述的将图片类文件转换为网页文件的装置，其特征在于，所述生 成子模块分别在所述网页布局框架中建立背景图片容器和文字容器，其中，所述背景图片 容器和文字容器相互叠合，并对所述文字图片集合中的文字图片层中的文字进行识别以生 成文字集合，以及将所述文字集合和背景图片集合分别添加至所述文字容器和背景图片容 器中以生成所述文字层和背景图片层。
16. 如权利要求15所述的将图片类文件转换为网页文件的装置，其特征在于，所述生 成子模块，还用于记录所述文字图片集合中的文字图片层中的文字的位置信息，并根据所 述位置信息将所述文字集合添加至所述文字容器中。
17. 如权利要求15所述的将图片类文件转换为网页文件的装置，其特征在于，所述生 成子模块，还用于记录所述文字图片集合中的文字图片层中的文字的性质特征信息，并根 据所述性质特征信息将所述文字集合添加至所述文字容器中。
18. 如权利要求10-17任一项所述的将图片类文件转换为网页文件的装置，其特征在 于，所述图片类文件为PSD格式。
【文档编号】G06F17/30GK104063380SQ201310086450
【公开日】2014年9月24日 申请日期:2013年3月18日 优先权日:2013年3月18日
【发明者】陈咏聪 申请人:北京百度网讯科技有限公司