CN104915207A - 制作网页图标方法及其*** - Google Patents

Abstract

本发明提出了一种制作网页图标方法及其***，本发明将图标转化为字体格式；再将转化为字体格式的图标嵌入网页的界面中。本发明将图标转化成字体格式嵌入到网页的界面中，可以减少网页加载时http请求的次数，从而提升了网页的界面加载速度。

Description

制作网页图标方法及其***

技术领域

本发明涉及一种制作网页的方法，尤其是关于制作网页图标的方法。

背景技术

随着互联网的发展，互联网产品的快速增长。为了使直接的互联网产品能更简洁明了、亮丽直观些，网页的图形界面就显得尤为重要，并且界面的加载的速度直接影响用户的使用体验。

目前的做法是，如果一个网页的界面中有多个图标，多少个图标就多少张图片，然后把图片加载到指定位置。此方法，每张图片在加载到界面中都会发一个http请求，如果图片比较多，在一定程度上影响界面的加载性能。另外，如果显示图片的大小需要做更改的话又会影响图片的质量。

有多少个图片就有多少次http的请求，这样占用资源，影响加载速度。如果图片需要放大或者缩小比例又会影响图片显示的质量，影响视觉效果。

发明内容

本发明需解决的技术问题是提供一种能提升页面加载速度的制作网页图标方法。

为解决上述的技术问题，本发明设计了一种制作网页图标方法，包括包括以下步骤：步骤1：将图标转化为字体格式；步骤2：将转化为字体格式的图标嵌入网页的界面中。

作为本发明进一步改进，还包括创建一文件夹的步骤；将图标转化为字体格式后再存放在该文件夹中。

作为本发明进一步改进，将转化后的图标均命名。

作为本发明进一步改进，在网页的界面中需要显示图标的位置定义一个唯一的ID名称，再设置该ID名称的样式值，在样式值中用content属性来对应要显示图标的名称，从而使图标嵌入网页的界面中。

作为本发明进一步改进，通过设置ID名称的样式值的字体大小来实现缩放图标的大小。

本发明还提供一种制作网页图标的***，其包括:转化模块，用于将图标转化为字体格式；嵌入模块，用于将转化为字体格式的图标嵌入网页的界面中。

作为本发明进一步改进，制作网页图标的***还包括：保存模块，用于保存转化为字体格式的图标于一文件夹中。

作为本发明进一步改进，制作网页图标的***还包括：命名模块，为各转化为字体格式的图标命名。

作为本发明进一步改进，制作网页图标的***还包括：设置模块，设置在网页的界面中需要显示图标的位置的样式值，在样式值中用content属性来对应要显示图标的名称。

本发明将图标转化成字体格式嵌入到网页的界面中，可以减少网页加载时http请求的次数，从而提升了网页的界面加载速度。

具体实施方式

为了使本领域相关技术人员更好地理解本发明的技术方案，下面将结合本发明实施方式，对本发明实施方式中的技术方案进行清楚、完整地描述，显然，所描述的实施方式仅仅是本发明一部分实施方式，而不是全部的实施方式。

本发明提供一种制作网页图标方法，将单独的图标转化成字体格式嵌入到网页的界面中，从而可以减少http请求的次数，提升了网页的加载速度。

在网页的界面中，存在很多图标，本发明制作界面时，将各个图标转化为字体格式在界面中显示出来。

本发明具体的操作方法包括以下步骤：

将单独的各个图标均转化为字体格式，再创建一文件夹，将转化为字体格式后的图标存放在该文件夹中。在本发明实施过程中，还将文件夹命名为*.ttf；并且，还将存放在*.ttf文件夹中的各个图标一一命名，比如：某个图标命名后的名称为\e618。

当将各个图标转化为字体格式后，再将转化为字体格式的图标嵌入网页的界面中。具体的实现方式是：在网页的界面中需要显示图标的位置定义一个唯一的ID名称，比如定义一个“headerPost”的ID名称，再设置该ID名称的样式值，在“headerPost”的样式值中用content属性来对应要显示图标的名称，即：content:“\e618”，这样指定名称为“\e618”的图标在ID名称为“headerPost”的界面位置中显示出来，即实现使图标嵌入网页的界面中。

为了使图标需要放大或者缩小而又不影响图片的显示质量，本发明通过设置ID名称的样式值的字体大小来实现缩放图标的大小，像设置字体大小一样，无论怎样缩放都不会影响图片的显示质量。如果还要改变图标的图像颜色，可以直接设置样式值的颜色属性值。

本发明还提供了一种制作网页图标的***，将单独的图标转化成字体格式嵌入到网页的界面中。本发明制作网页图标的***包括转化模块、嵌入模块、保存模块、命名模块和设置模块。

转化模块用于将图标转化为字体格式，然后通过嵌入模块将转化为字体格式的图标嵌入网页的界面中。在本发明实施例中，在将图标转化为字体格式后，还通过保存模块将转化为字体格式的图标保存于一*.ttf文件夹中，再由命名模块为各转化为字体格式的图标一一命名。在将图标嵌入界面中时，通过设置模块设置在网页的界面中需要显示图标的位置的样式值，在样式值中用content属性来对应要显示图标的名称，这样指定图标在界面需要显示的位置中显示出来，即实现使图标嵌入网页的界面中。

以上仅表达了本发明的一种实施方式，其描述较为具体和详细，但并不能因此而理解为对本发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干变形和改进，这些都属于本发明的保护范围。因此，本发明专利的保护范围应以所附权利要求为准。

Claims (9)

1.一种制作网页图标方法，其特征在于，包括以下步骤：

步骤1：将图标转化为字体格式；

步骤2：将转化为字体格式的图标嵌入网页的界面中。

2.根据权利要求1所述的制作网页图标方法，其特征在于，还包括创建一文件夹的步骤；将图标转化为字体格式后再存放在该文件夹中。

3.根据权利要求2所述的制作网页图标方法，其特征在于，将转化后的图标均命名。

4.根据权利要求3所述的制作网页图标方法，其特征在于，在网页的界面中需要显示图标的位置定义一个唯一的ID名称，再设置该ID名称的样式值，在样式值中用content属性来对应要显示图标的名称，从而使图标嵌入网页的界面中。

5.根据权利要求4所述的制作网页图标方法，其特征在于，通过设置ID名称的样式值的字体大小来实现缩放图标的大小。

6.一种制作网页图标的***，其特征在于，包括:

转化模块，用于将图标转化为字体格式；

嵌入模块，用于将转化为字体格式的图标嵌入网页的界面中。

7.根据权利要求6所述的制作网页图标的***，其特征在于，还包括：

保存模块，用于保存转化为字体格式的图标于一文件夹中。

8.根据权利要求7所述的制作网页图标的***，其特征在于，还包括：

命名模块，为各转化为字体格式的图标命名。

9.根据权利要求8所述的制作网页图标的***，其特征在于，还包括：

设置模块，设置在网页的界面中需要显示图标的位置的样式值，在样式值中用content属性来对应要显示图标的名称。