200밀리초가 빨리 들리나요? 다음 페인트와의 상호 작용은 웹 사이트의 응답성을 높이는 데 도움이 될 수 있습니다.

메이는 포효와 함께 나갔다. 몇 달. Google 핵심 업데이트, 두 가지 새로운 Web Vitals 사용자 측정항목 및 WordPress 6.0!

5월 25일 Google은 광범위한 기반의 코어 업데이트 시작을 발표했습니다. 2022년 5월 핵심 업데이트는 2주 동안 지속될 것으로 예상됩니다. 사람들은 검색 결과 페이지의 변화를 보고했습니다. SERP에 변화가 있었습니까?

2022년 두 번째 주요 WordPress 릴리스인 WordPress 6.0도 출시되었습니다. 2022년 1월에 출시된 WordPress 5.9는 블록 편집기를 위한 전체 사이트 편집(FSE)을 도입했습니다. 워드프레스 6.0. 다시 한 번 블록 편집기 기능의 확장 및 개선에 초점을 맞춥니다. 고객의 모든 웹사이트가 WordPress 6.0으로 업데이트되었습니까?

모든 곳에서 업데이트! 내 웹사이트에 중요한 문제는 무엇입니까?

5월에 Google이 취한 가장 큰 움직임은 웹 바이탈 지표에 TTFB( Time to First Byte ) 및 INP( Interaction to Next Paint )를 추가한 것입니다. 새로운 측정항목을 추가하는 것은 "중요한 것에 집중하세요"라는 Google의 방식입니다.

이제 응답성을 측정할 수 있습니다. 그 모래알이 기어를 감속시키는 곳을 볼 수 있습니다. 이는 귀하와 귀하의 클라이언트 웹사이트 포트폴리오에 좋습니다.  

테슬라가 휘발유 자동차보다 빠른 이유다. 내연기관에서는 모든 부품이 다른 부품과 연결되어 마찰을 일으켜 속도를 잃습니다. 덜 움직이는 부품은 에너지가 바퀴로 간다는 것을 의미합니다.

Core Web Vitals가 성장하고 있습니다! pagespeed.web.dev가 방금 업그레이드되었으며 RUM 비율에는 이제 INP(Interaction to Next Paint) 및 TTFB(Time to First Byte)가 포함됩니다. 당신이 나에게 묻는다면 둘 다 훌륭한 선택입니다! 내 생각에 INP는 쉽게 조작할 수 있는 First Input Delay보다 반응성을 측정하는 훨씬 더 나은 방법입니다. 첫 번째 바이트까지의 시간은 성능 측정 기준보다 우선하므로 항상 더 중요해야 합니다. 응답 없음 = 페인트 없음, 상호 작용 없음 등!.

아르옌 카렐

INP(Next Paint)에 대한 상호 작용이란 무엇이며 왜 중요한가요?

Google Core Web Vitals 외에도 Google은 INP(Interaction to Next Paint) 및 TTFB(Time to First Byte)를 포함하여 점점 더 많은 사용자 중심 응답 측정항목을 측정하고 있습니다. 그러나 팀을 재정비하기 전에 Google은 다음과 같이 말합니다.

이러한 필드 측정항목은 현재 실험적이지만 이제 사용자가 사용해 볼 수 있습니다. 실험 측정항목은 변경되거나 사라질 수 있습니다.

Google.com

INP( Interaction to Next Paint )는 사용자가 페이지를 방문할 때 가장 긴 단일 상호작용 중 하나를 선택하여 페이지의 전체 상호작용 대기 시간을 나타내는 것을 목표로 하는 새로운 메트릭입니다. INP는 상호작용이 많은 페이지에 대한 상호작용 대기 시간의 98번째 백분위수입니다. 50개 미만의 상호작용이 있는 페이지의 경우 INP는 최악의 대기 시간을 갖는 상호작용입니다.

많은 UI 요소가 있습니다. KeyDown은 키를 눌렀을 때 발생합니다. KeyUp은 키를 놓을 때 발생합니다. DragOver, Drop, OnFocus 등이 있습니다. 각 상호 작용은 전가되고 처리되며 결과가 사용자에게 표시됩니다.

모든 작업 사이의 시간은 측정 할 수 있으며 클릭과 수신 사이의 긴 간격은 좋지 않은 사용자 경험을 추가할 수 있습니다 .

INP(Interaction to Next Paint)는 웹사이트 상호작용의 대기 시간을 측정합니다. 이러한 상호 작용의 몇 가지 예는 다음과 같습니다.

• 마우스 이벤트 – 버튼을 클릭하여 의류 품목의 색상을 변경하는 것과 같은 이벤트.
• 손가락으로 터치스크린에서 활성화되는 대화형 요소(아마도 지도에서).
• 모바일 또는 데스크톱 장치에서 키를 누르면 질문에 대한 답변이 표시됩니다.

귀하의 웹 사이트에는 많은 상호 작용이 있습니까? 전자 상거래 또는 eLearning 플랫폼을 실행하고 있습니까? 사용자가 마우스 이벤트를 기다리기를 원하지 않는다는 것을 알고 있기 때문에 INP는 매우 흥미진진합니다.

이제 어떤 상호작용이 속도를 늦추는지 볼 수 있으며 느린 응답 시간으로 인해 전환을 잃을 수 있는 부분을 볼 수 있습니다.

대기 시간, 성능 저하, 솔직히 말해서 오늘날의 고객 기대에 비해 기술이 구식인 관리형 WordPress 호스트로 인해 전자 상거래 사이트에서 손실을 보고 있는 비용은 얼마입니까?

로켓넷

다음 페인트 측정항목에 대한 Google의 상호작용을 어떻게 측정할 수 있습니까?

Next Paint에 대한 Google의 상호 작용을 측정하려면 PageSpeed ​​Insights로 이동하여 페이지의 INP를 측정하십시오. 기억하다. 전체 웹사이트가 아니라 해당 페이지를 측정하고 있습니다.

INP는 사용자가 웹 페이지에 남아 있을 때 측정 값이 변경된다는 점에서 CLS(누적 레이아웃 이동)와 유사합니다. 사용자가 페이지를 떠나면 측정이 이루어지며 전체 INP 값이 생성됩니다. 일부 페이지에는 다른 페이지보다 더 많은 상호작용이 있습니다. 작업을 선택하지 않으면 일부 페이지의 상호 작용이 발생하지 않을 수 있습니다.

지금 vitals에 합격했다고 해서 다음 달에 합격하는 것은 아닙니다. 핵심 웹 바이탈은 실험적이며 변화하고 있습니다. 정기적으로 확인하고 호기심을 유지하십시오!

반응형 웹사이트는 CSS의 유연한 블록 그 이상을 의미합니다.

Next Paint에 대한 상호 작용 측정은 이제 사용자의 손가락 아래에서 웹 사이트가 얼마나 반응하는지 측정할 수 있기 때문에 매우 흥미진진합니다. 반응형 웹사이트에서 메뉴가 햄버거로 축소되었을 때를 기억하십니까?

그리고 중요한 것은 모바일만이 아닙니다. 데스크톱 보기도 마찬가지로 중요합니다. 특히 사람들이 시간을 보내는 웹사이트에 대해 이야기하는 경우에는 더욱 그렇습니다.

다음 그림판에 대한 상호 작용은 페이지의 요소가 상호 작용에 응답하는 데 걸리는 시간을 측정하는 것을 의미합니다. 이제 사용자가 다른 색상을 선택하면 제품 이미지가 변경되는 데 걸리는 시간이나 답변이 화면에 표시되는 데 걸리는 시간을 확인할 수 있습니다. 여기의 속도는 많은 사용자에게 녹아웃이 될 수 있습니다. 기억하십시오 – 속도가 이깁니다.

각 상호 작용의 단계 사이의 대기 시간을 단축하면 웹 사이트가 진정으로 반응적입니다. 속도 문제가 해결되면 에이전시 고객의 비즈니스 경험을 향상시켜 실제로 중요한 부분에 집중할 수 있습니다.

웹사이트에서 속도는 매우 중요합니다. 잠재 고객을 유치하고 유지하기를 원하기 때문입니다. 그리고 당신은 그들이 친구들에게 말하기를 원합니다. 사람들이 귀하의 사이트에 머무르고 전환하지 못하게 하는 것은 열악한 웹사이트 경험입니다.

로켓넷

마이크로인터랙션은 괜찮은 웹사이트와 훌륭한 웹사이트의 차이입니다

상호 작용 대기 시간을 저장합니다. 상호 작용을 제거하십시오.

마이크로인터랙션은 사용자에게 무언가를 할 수 있다는 느낌을 주는 작은 것입니다. 더 이상 하찮고 경직된 참여자가 아니라 약간의 노력으로 움직이거나 말하거나 무언가를 변경할 수 있다는 느낌입니다. 사용자는 복잡해지지 않고 장난스럽게 참여합니다. 게이미피케이션 맞죠?

마이크로인터랙션은 우리의 온라인 경험에 큰 영향을 미치므로 욕조 청소를 위해 아기를 목욕물과 함께 버리지 마십시오.

점점 더 많은 브랜드가 고객과의 연결을 촉진하기 위해 노력하고 있습니다. 커뮤니케이션 채널에 많은 관심을 기울이고 있지만 고객에게 긍정적인 사용자 경험을 제공할 수 있는 미시적 순간을 활용하는 것도 마찬가지로 중요합니다.

사용성Geek.com

토크는 저렴합니다. 가장 빠른 WordPress 호스팅이 실제로 무엇을 의미하는지 로켓이 보여줍니다!

사이트 성능, 대행사의 시간 및 비용을 절약하시겠습니까? 예. Rocket Platform에는 유료 버전의 보안, 이미지 최적화, CDN 및 JS 콘텐츠 로더 플러그인이 필요하지 않은 기능이 내장되어 있습니다. 이는 귀하가 선호하는 새로운 플랫폼(이전에는 Managed WordPress Hosting으로 알려졌던 제품)에 내장된 기능입니다.

어디에서나 사용할 수 있는 가장 빠른 WordPress 호스팅인 Rocket.net으로 사이트를 마이그레이션하는 방법에 대해 이야기해 보겠습니다. 오늘 임무를 시작하십시오!