wordpress自定义文章类型插件(在网站建设中避免“浪费”的CSS)WordPress功能 / WordPress中的自定义CSS样式功能介绍...

wufei123 发布于 2024-06-12 阅读(7)

网页设计师似乎一直在努力优化其创作在短期内,这将有利于性能从长远来看,它也可以简化维护通常,这意味着优化图像,通过内容分发网络(CDN)实现页面缓存和提供文件这些都是有效的措施但是,没有引起足够重视的一项内容是网站CSS的潜在膨胀。

虽然您可以缩小样式表或通过CDN提供样式表,但可以做更多的事情具体来说,删除那些没有被使用的样式,并格式化仍然有用的样式最好从构建过程的一开始就完成但是,也有可能减轻现有网站的负担让我们看一下所涉及的挑战,以及一些可以使网站速度更快的工具和技术。

处理内置于主题和框架中的膨胀过去,网站本质上是从头开始构建的这是一个很棒的方法,因为设计师可以只包含所需的样式和脚本如果谨慎进行,此过程可能会导致网站的优化当然,有许多原因导致我们许多人放弃了这种做法就时间和预算限制而言,这根本没有效率。

因此,现代网站通常建立在预建产品之上那可能是CSS框架,例如Bootstrap或精心设计的WordPress主题在某些情况下,CMS主题甚至可能包含框架这些产品是一刀切的通过包含您可能需要的所有内容,它可以使开发更快。

不幸的是,不能说它们对性能的影响那么,怎样才能改善这种情况呢?尽可能使用基于组件或轻量级的框架从理论上讲,既有可能在避免膨胀的同时获得框架的优势这可以通过使用基于组件的程序包来实现,这些程序包使您可以加载特定功能,而忽略其他功能。

前面提到的Bootstrap确实允许这种类型的定制另一个替代方法是Tailwind CSS,它提供了基本样式,并假定您将在它们之上进行构建如果您正在寻找一个很好的起点,而不是更成品,那么这可能是个合适的选择。

使用框架没有错但是,请寻找以下之一:a)让您选择要加载的组件;b)提供可以轻松自定义的准系统样式表无论哪种方式,您的项目都将从减少的负载中受益CMS主题怎么办?诸如商业主题之类的模板产品可能会很棘手,因为它们经常包含大量样式–无论您是否需要它们。

一个特定的主题可能会组织得井井有条,以至于可以很容易地减少不需要的样式表甚至可能有一个主题选项面板,使您可以单击几下但是,这很可能是例外而不是普遍的避免主题臃肿的最佳方法是创建自己的主题例如,WordPress入门主题将提供一些您可以自定义的准系统CSS。

这有助于确保样式表更简洁,并至少消除与CMS相关的少量开销整理现有样式表可以通过以下两种方式之一来改变我们对现有网站的关注,整理和重构CSS:手动检查样式启动您最喜欢的代码编辑器并打开网站的样式表始终是一个不错的起点。

是的,这可能是一个乏味的经历但这也是照顾低挂水果的有效方法不必仔细检查CSS的每一行取而代之的是,该想法是找到您未使用或效率不高的所有项目例如,假设您运行的WordPress网站具有一些自定义样式以覆盖插件的样式。

如果您不再使用该特定插件怎么办?在这种情况下,可以轻松删除样式或者,也许您偶尔会使用一些样式,例如在寒假期间可能有必要将这些样式移动到单独的文件中,并仅在需要时调用它们然后是一些CSS选择器,它们写得不太好。

也许他们有许多不再需要的浏览器前缀或不必要的重复属性这是清理的成熟区域如果您的网站设计已有两年之久,您可能会惊讶于可以找到多少多余的样式。

使用自动化工具有很多工具可以扫描您的网站(或网站的至少一部分)并使用未使用的CSS列表进行报告我们测试了其中一些工具,如果您有兴趣尝试这些工具中的一种或多种,下面是我们推荐的自动化工具:JitBitPurgeCSS

PurifyCSSUnused CSS自动化工具和手动审核的结合可能是最好的做法两者都可以使您对潜在的性能优化有更全面的了解您可能不会捕获所有单个项目,但仍有机会产生可衡量的影响您可以在测试之前和之后使用GTmetrix之类的工具进行一些操作以查看结果。

说到CSS:不要浪费样式表可以大到令人惊讶,尤其是在使用现成的CSS框架时从网站建设一开始就应该注意这一点通过减少样式表的无用部分,您将优化网站的性能,加快加载速度如果您的网站已经上线,那么您仍然可以采取一些积极的步骤。

查看CSS,查找要简化或删除的项目利用众多自动工具之一查找您可能错过的部分最重要的是,将CSS缩减为基本要素并不是一件易事,但是仍然值得您花费时间和精力。

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

河南中青旅行社综合资讯 奇遇综合资讯 盛世蓟州综合资讯 综合资讯 游戏百科综合资讯 新闻31000