HTML/CSS 강의 1일차 : 웹접근성, 비주얼스튜디오 툴, 마크업 언어

2021. 12. 22. 17:54저는 HTML으로 디자인 합니다

 

 

웹 페이지를 제작 할 때 고려해야 할 것은 웹 접근성을 고려해야 하며 예를 들어 컬러로 버튼을 구별하면 안되고 명도대비로 구분해야하는 규칙들.. 하지만 이런 웹 접근성이 잘 안되어있는 홈페이지들이 많기 때문에 웹 표준을 고려하여 웹 페이지를 제작해야한다.

 

Html5 outline 이라는 크롬 확장프로그램이 있는데 이걸로 웹 표준성을 확인 할 수 있음

 

반응형 홈페이지와 적응형 홈페이지

 

파일 이름시 html은 확장자 (.html) css파일은 확장자 (.css) 으로 파일 이름 짓기

 

 

 

비주얼스튜디오 툴에서 유용한 플러그인 : 라이브서버

ㄴ이게 있어야 바로바로 마크업이 적용되는것이 보임 

 

 

 

 

 

마크업이란? 문서에 여러가지 요소를 넣을 때 스타일 지정하거나 사용자 인터랙션(상호작용)을 적용하기 위해 의미를 부여해 주는 것

마크업은 항상 짝끼리 다님! <짝></짝> 이렇게 마지막은 슬래쉬

 

 

문단 : <P>

이미지 : <img>

표 : <table>

목록 : <ul> <li> ..

 

 

css 태그는 마크업된거 가져와서 스타일 입힘, 세미콜론 꼭 붙여야됨! ex) p{ color : blue; }

 

컬러 : color : blue;(또는 6자리 헥사코드)

폰트 사이즈 : font-size : 12px;

폰트 : font-family : "notosans"

 

등등..

 

 

 

css는 3가지 방법이 있는데 1. 인라인, 2. 내부시트, 3. 외부시트가 있으며 이 순서는 먼저 적용되는 순서임, 주로 실무에서는 외부시트로 관리함. 외부 시트로 적용할시

 

<link rel="stylesheet" href="./style.css">

 

href는 파일 위치 [./] 현재폴더 [../] 상위폴더