코드공부방

HTML 구글 스타일가이드 자세히보기 #intro HTML 마크업에도 스타일가이드가 있을까? 당연히 존재한다. HTML 마크업 작업도 여러 작업자가 협업하여 진행하는 경우가 발생하기 때문에 일관된 스타일로 코드를 유지하기 위해서는 CSS와 마찬가지로 작성 규칙이 필요하다. 사실 CSS와 비교하면 HTML마크업에는 많은 규칙이 필요하진 않는다. 지금 머릿속에 어떤 규칙들이 있을지 떠올려봐도 떠오르는 것이라고는 들여쓰기, 따옴표, 뭐 어떤 태그의 사용 정도? (애초에 HTML코드를 작성하는 방식(?)이 다양하지도 않다) 그래서 구글 HTML 스타일 가이드에는 어떤 내용들이 있는지 자세히 보았다. GOOGLE CSS 스타일 가이드와 마찬가지로 구글에서 제공하는 공식 스타일가이드 문서를 참고하였고, 최대한 해당..

CSS 구글 스타일가이드 자세히보기 #3 CSS 메타 규칙 3. CSS 메타(meta) 규칙 3.1 섹션 주석 섹션 주석을 작성하여 섹션을 그룹화 한다. 섹션 간 주석과 줄 바꿈으로 구분한다. /* Header */ #adw-header {...} /* Footer */ #adw-footer {...} /* Gallery */ .adw-gallery {...} 마치며 일관성을 유지한다. 기존 코드를 수정하는 경우 적어도 몇 분 동안 주변의 코드를 보고 작성 스타일을 결정한다. 추가한 코드가 주위 기존 코드와 다르게 보이지 않게 작성한다. 스타일가이드를 사용하는 요점은 공통된 코딩 어휘를 갖는 것이다. GOOGLE의 CSS 스타일 가이드를 자세히 살펴보고, 정리해봤는데 크게 특이하거나 놀라운점은 없었다. ..

CSS 구글 스타일가이드 자세히보기 #2 2. CSS 작성 규칙 2.1 선언(속성) 순서 알파벳 순서대로 속성을 선언한다. vendor-prefix 선언은 알파벳 선언순서를 무시한다. 단, 접두어가 붙지 않는 속성을 가장 마지막에 선언한다. .sample { background-color:#000; border:1px solid #eee; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; color:#222; text-align:center; } CSS 속성순서를 알파벳순으로 한다니 놀라웠다. 네이버 코딩컨벤션의 경우 Style의 쓰임새나 중요도에 따른 선언순서를 가져가기에 나도 그것을 따라가고 있었다. (display > ove..