制作网页图标方法及其系统技术方案

技术编号:12074606 阅读:57 留言:0更新日期:2015-09-18 10:25
本发明专利技术提出了一种制作网页图标方法及其系统,本发明专利技术将图标转化为字体格式;再将转化为字体格式的图标嵌入网页的界面中。本发明专利技术将图标转化成字体格式嵌入到网页的界面中,可以减少网页加载时http请求的次数,从而提升了网页的界面加载速度。

【技术实现步骤摘要】

本专利技术涉及一种制作网页的方法,尤其是关于制作网页图标的方法。
技术介绍
随着互联网的发展,互联网产品的快速增长。为了使直接的互联网产品能更简洁明了、亮丽直观些,网页的图形界面就显得尤为重要,并且界面的加载的速度直接影响用户的使用体验。目前的做法是,如果一个网页的界面中有多个图标,多少个图标就多少张图片,然后把图片加载到指定位置。此方法,每张图片在加载到界面中都会发一个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属性来对应要显示图标的名称,这样指定图标在界面需要显示的位置中显示出来,即实现使图标嵌入网页的界面中。以上仅表达了本专利技术的一种实施方式,其描述较为具体和详细,但并不能因此而理解为对本专利技术专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本专利技术构思的前提下,还可以做出若干变形和改进,这些都属于本专利技术的保护范围。因此,本专利技术专利的保护范围应以所附权利要求为准。本文档来自技高网...

【技术保护点】
一种制作网页图标方法,其特征在于,包括以下步骤:步骤1:将图标转化为字体格式;步骤2:将转化为字体格式的图标嵌入网页的界面中。

【技术特征摘要】
1.一种制作网页图标方法,其特征在于,包括以下步骤:
步骤1:将图标转化为字体格式;
步骤2:将转化为字体格式的图标嵌入网页的界面中。
2.根据权利要求1所述的制作网页图标方法,其特征在于,还包括创
建一文件夹的步骤;将图标转化为字体格式后再存放在该文件夹中。
3.根据权利要求2所述的制作网页图标方法,其特征在于,将转化后
的图标均命名。
4.根据权利要求3所述的制作网页图标方法,其特征在于,在网页的
界面中需要显示图标的位置定义一个唯一的ID名称,再设置该ID名称的
样式值,在样式值中用content属性来对应要显示图标的名称,从而使图标
嵌入网页的界面中。
5.根据权利要求4所述的制作网页图标方法,其特征在...

【专利技术属性】
技术研发人员:唐芬芬
申请(专利权)人:上海斐讯数据通信技术有限公司
类型:发明
国别省市:上海;31

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1