0

编辑：我意识到这可能是与位置相关的问题。但不知道如何编辑它，改成粘性的、绝对的、固定的伤害大于帮助。edit2：页面是主页，https ://credence.co.uk

我一直在为 Lighthouse 优化一个网站，一切都很好，但 CLS 很糟糕，几乎完全是由审计的一部分引起的：

灯塔报告：CLS 焦点

我不确定是什么原因造成的。我看到它首先加载，但它上面的画廊图像加载之后，这似乎导致它重新加载，从而导致 CLS？这可能是延迟加载的问题吗？或者可能是由于“从上而下”？

以下是相关部分的完整 HTML 代码：

<section id="" class="appseo-service-section position-relative">
  <div class="container">
    <div class="appseo-service-content">
      <div class="row justify-content-center">
        <div class="col-lg-4 wow fadeFromUp cefd3ad" data-wow-delay="00ms" data-wow-duration="1500ms">
          <div class="appseo-service-box position-relative">
            <div class="appseo-service-icon-text position-relative">
              <a href="https://credence.co.uk/background-screening-checks/">
                <div class="appseo-service-icon position-relative text-center"><i aria-hidden="true" class="fas fa-dice-d20 "></i></div>
              </a>
              <div class="appseo-service-text appseo-headline pera-content text-center">
                <h3><a href="https://credence.co.uk/background-screening-checks/">Background Screening Checks</a></h3>
                <p><a href="https://credence.co.uk/background-screening-checks/">UK & International Checks</a></p>
              </div>
            </div>
          </div>
        </div>
        <div class="col-lg-4 wow fadeFromUp 679b377" data-wow-delay="00ms" data-wow-duration="1500ms">
          <div class="appseo-service-box position-relative">
            <div class="appseo-service-icon-text position-relative">
              <a href="https://credence.co.uk/industry-specific-checks/">
                <div class="appseo-service-icon position-relative text-center"><i aria-hidden="true" class="appilo appilo-icon-paper-plane"></i></div>
              </a>
              <div class="appseo-service-text appseo-headline pera-content text-center">
                <h3><a href="https://credence.co.uk/industry-specific-checks/">Industry Specific Checks</a></h3>
                <p><a href="https://credence.co.uk/industry-specific-checks/">Airside, FCA, BS7858 & BPSS</a></p>
              </div>
            </div>
          </div>
        </div>
        <div class="col-lg-4 wow fadeFromUp 3a81a52" data-wow-delay="00ms" data-wow-duration="1500ms">
          <div class="appseo-service-box position-relative">
            <div class="appseo-service-icon-text position-relative">
              <a href="https://credence.co.uk/hr-services-solutions/">
                <div class="appseo-service-icon position-relative text-center"><i aria-hidden="true" class="fab fa-searchengin"></i></div>
              </a>
              <div class="appseo-service-text appseo-headline pera-content text-center">
                <h3><a href="https://credence.co.uk/hr-services-solutions/">HR Services & Solutions</a></h3>
                <p><a href="https://credence.co.uk/hr-services-solutions/">JobValidate & Exit Interviews</a></p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="appseo-service-vector" data-parallax='{"y" : 100, "rotateY":500}'>
    <img src="" alt>
  </div>
</section>

4

0 回答 0