웹 프론트엔드 및 HTML 의미론적 이해

1. 웹 프론트엔드란?

WEB 프론트엔드는 웹페이지 디자인부터 제작까지 개발되는데, 작업이 정교해지면서 누군가는 웹페이지까지 아트워크 제작까지 완료해야 하므로 WEB 프론트엔드 개발이라는 용어가 등장합니다. WEB 프론트엔드 개발은 주로 HTML, CSS, JavaScript 기술을 사용하여 아티스트가 제공한 아트워크를 웹 페이지로 변환합니다. 동시에 SEO와 배경 데이터도 고려해야 합니다. WEB 프론트엔드는 아티스트, 백엔드, 사용자를 연결하는 중간 플랫폼에 해당합니다.

2. HTML 의미론이란 무엇입니까?

　1.) 기본적으로 제목(H1~H6), 목록(li), 강조(strong em) 등 여러 주요 태그를 중심으로 회전합니다.

　2.) 에 따르면 콘텐츠의 구조화(콘텐츠 의미론), 적절한 태그(코드 의미론) 선택을 통해 개발자는 보다 우아한 코드를 더 쉽게 읽고 작성할 수 있으며, 브라우저 크롤러와 컴퓨터는 이를 잘 구문 분석할 수 있습니다.

3. 왜 의미론인가?

　1.) CSS 없이 페이지에 좋은 콘텐츠 구조와 코드 구조를 나타내기 위해: 알몸으로 실행할 때 보기 좋게 하기 위해

　2.) 사용자 경험: 제목 등 , alt는 명사를 설명하거나 사진 정보를 설명하는 데 사용되며 레이블 태그의 유연한 사용

　3.) SEO에 도움이 됨: 검색 엔진과의 원활한 통신을 구축하여 크롤러가 보다 효과적인 정보를 크롤링하도록 돕습니다. 태그를 사용하여 각 키워드의 맥락과 가중치를 결정합니다.

4.) 다른 장치(예: 스크린 리더, 시각 장애인 리더, 모바일 장치)를 편리하게 분석하여 웹 페이지를 의미 있는 방식으로 렌더링합니다. 🎜> 5.) 팀 개발 및 유지 관리가 더 쉽고 의미 체계가 더 읽기 쉽습니다. W3C 표준을 따르는 팀은 모두 이 표준을 따르므로 차별화가 줄어듭니다.

4. HTML 코드 작성 시 주의할 점은 무엇인가요?

　1.) 의미상 비의미적인 태그인 div 및span을 최대한 적게 사용하세요.

　2.) 의미가 명확하지 않은 경우 div 또는 p를 사용할 수 있을 때 p를 사용하세요. p에는 기본적으로 위쪽 및 아래쪽 간격이 있습니다. 이는 특수 터미널과의 호환성에 유리합니다.

　3.) b, 글꼴, u 등과 같은 순수 스타일 태그를 사용하지 말고 대신 CSS 설정을 사용하세요. .

4.) 강조해야 할 텍스트는 Strong 또는 em 태그에 포함될 수 있습니다(브라우저 기본 스타일, CSS로 지정할 수 있으면 필요하지 않음). Strong의 기본 스타일은 굵게(b 사용 안 함), em은 기울임꼴(i 제외)

5.) 표를 사용할 때 제목에는 캡션을, 표 머리글에는 thead를, 주요 부분에는 tbody를 사용합니다. 꼬리를 위한 tfoot. 테이블 헤더는 일반 셀과 구별되어야 합니다. 테이블 헤더는 th, 셀은 td를 사용하세요.

　6.) 양식 필드는 fieldset 태그로 감싸야 하며, legend 태그를 사용해야 합니다.

7.) 각 입력 라벨에 해당하는 설명 텍스트는 라벨 태그를 사용해야 하며, 입력에 대한 id 속성을 설정하고 라벨 태그에 for=someld를 설정하여 설명 텍스트는 해당 입력과 연결됩니다.