08 / 모션 / 직접 만든 예시
글자가 차례로 등장 · Stagger
글자가 차례로 나타나도록 문자나 단어를 나누고 각 애니메이션의 시작 시간을 조금씩 늦추는 기법
이렇게 말해보세요
[헤드라인]을 단어별 split text로 나누고 90ms 간격의 stagger로 아래에서 12px 올라오며 나타나게 해줘. 스크린리더에는 원문을 한 번만 읽히고 모션 감소 시 즉시 표시해줘.
왜 이 용어인가요
한꺼번에 나타나는 제목과 순서대로 읽히는 제목의 차이를 짧게 전달합니다. 애니메이션의 간격과 이동량까지 지정해 과한 효과를 줄입니다.
숫자와 시간은 이 예시의 선택입니다. 모든 사이트에 권장되는 표준값은 아닙니다.
용어 참고 문서 ↗