👩🏻‍💻 개발 범위 파악하는 법

✅ 마크업 과정

1️⃣ 전체적인 디자인을 훑어본다.

• 대략적인 큰 레이아웃을 구상한다.
• 메인 컴포넌트를 분석한다.
• 반복되는 컴포넌트를 구분한다.

2️⃣ 가변적인 요소가 들어가는 항목을 확인한다.

예시

• 이미지가 가변일 때 no img 처리는 어떻게 해야할까?
• 이미지 비율이 다를 때 어떤 기준으로 크롭 해야할까?
• 텍스트가 가변일 때 몇 줄까지 노출 해야할까?
• 값이 없을 때 어떻게 노출 해야할까?(예:별점)

3️⃣ 기획/디자인 측에서 요청한 인터렉션이 있는지 확인한다.

• 마크업에는 따로 정답이 없습니다.
• 같은 화면이라도 마크업 하는 방식인 개개인별로 다릅니다.
• 다뤄보지 않은 레이아웃을 대한 고민이 있을 경우 벤치마킹할 사이트의 코드를 훑어 보는것도 좋습니다. 국내: 네이버 / 해외: 구글