Posts by Category

• CSS 17
• HTML5 11
• 웹표준 5
• 접근성 3
• HTML 3
• Git 2
• 웹폰트 2
• BEM 1
• stash 1
• React 1
• study 1
• SVG 1
• lang 1
• 폰트경량화 1
• CDN 1
• Intellij 1
• Sass 1
• 초기화 1
• 브라우저 1
• 렌더링 1

CSS

[CSS] CSS 초기화 (Reset.css)

CSS 초기화

[CSS] Intellij를 이용한 Sass auto compile

Intellij를 이용해 Sass 를 자동 컴파일 하기

[CSS] 윈도우 OS 폰트 깨짐 이슈

윈도우 운영체제에서 폰트가 깨져보이는 현상에 대해

[CSS] 상대적인 단위, rem

상대적인 단위 rem에 대해 알아봅시다

[CSS] 작업 Style Guide

My Sass Style Guide

[CSS] 나눔시리즈 경량화 웹폰트와 CDN

나눔시리즈 폰트로 웹폰트 경량화 진행하기

[CSS] CSS z-index

CSS z-index Property

[CSS] CSS 적용 우선순위 계산

CSS 적용 우선순위 계산하기

[React] Media query Orientation, Media query로 가로세로 방향이 체크가 가능할까?

Media query Orientation

[CSS] 웹 폰트와 최적화

webfont 웹 폰트?

[CSS] :(single colon)과 ::(double colon)의 차이

:(single colon)과 ::(double colon)의 차이

[CSS] CSS 적용 우선순위

CSS 적용 우선순위

[Style] 작업 스타일가이드

작업 스타일가이드

[Sass] Sass와 SCSS의 차이

Sass와 SCSS의 차이에 관해

[HTML5] 한국형 웹 콘텐츠 접근성 가이드(KWCAG) 2.1

한국형 웹 콘텐츠 접근성 가이드 2.1

[CSS] Webfont에 대해 알아보자

webfont 웹폰트?

[CSS] BEM 방법론

BEM 방법론에 대해 알아보자

Back to Top ↑

HTML5

[HTML5] Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply to Mobile 번역하기

Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply to Mobile 모바일 접근성: WCAG 2.0 및 기타 W3C / WAI 지침을 모바일에 적용하는 방법

[HTML5] fieldset tag 와 legend tag

form 구성요소 fieldset와 legend tag

[HTML5] input 태그 name 값에 대해

개발자와 협업해서 진행해야하는 부분이 많다보니 각자 값을 어떻게 작성해서 보여주어야하나 의문이 들 때가 있습니다. 특히 form 태그안에 사용되는 input 태그가 그러했습니다.

[HTML5] 웹표준에 맞게 table 구성하기

table 태그를 사용하는 것을 좋아하진 않지만, 필요한 부분에서는 사용 해야 할 때가 있습니다. 그때마다 웹표준에 맞게 표를 작성해야하는데 헷갈릴 때가 많아 정리해두려합니다. 참고로 이 내용은 웹 저작자를 위한 W3C의 HTML5 기술 표준 명세서를 바탕으로 작성한 것입니다.

[HTML5] Semantic Element Article 과 Section

HTML5에서 가장 중요한 것은 무엇일까요? 개인적으로 Semantic Element를 적재적소에 맞게 사용하는 것이라 생각합니다. 사실 Semantic 이라는 의미 자체가 의미론적이라 그 경계가 모호합니다. W3C에서도 무조건 사용하면 안된다 라고 이야기 하지 않고, 예시를 들어...

[HTML5] 웹표준을 준수하는법! HTML5 Style Guide 3

지난번 포스팅에 이은 HTML5 Style Guide 마지막 포스팅입니다.

[HTML5] 웹표준을 준수하는법! HTML5 Style Guide 2

지난번 포스팅에 이은 HTML5 Style Guide 두번째 포스팅입니다.

[HTML5] 웹표준을 준수하는법! HTML5 Style Guide 1

작성자의 ~카더라 보다는 직접 원문을 보고 해석해서 보고 싶었기에 저는 이 부분을 직접 번역해 보기로 결심했습니다. W3CSchool의 내용 중에서 오늘은 HTML5 전체 구성에 대한 대략적인 HTML5 Style Guide을 살펴보도록 하겠습니다. 내용이 꽤 많아서 두번정도 나누...

[HTML5] HTML5 란?

HTML5

[HTML5] 한국형 웹 콘텐츠 접근성 가이드(KWCAG) 2.1

한국형 웹 콘텐츠 접근성 가이드 2.1

[HTML5] H1 태그는 몇번 사용할 수 있을까?

H1 태그는 몇번 사용할 수 있을까?

Back to Top ↑

웹표준

[HTML5] 웹표준에 맞게 table 구성하기

table 태그를 사용하는 것을 좋아하진 않지만, 필요한 부분에서는 사용 해야 할 때가 있습니다. 그때마다 웹표준에 맞게 표를 작성해야하는데 헷갈릴 때가 많아 정리해두려합니다. 참고로 이 내용은 웹 저작자를 위한 W3C의 HTML5 기술 표준 명세서를 바탕으로 작성한 것입니다.

[HTML5] Semantic Element Article 과 Section

HTML5에서 가장 중요한 것은 무엇일까요? 개인적으로 Semantic Element를 적재적소에 맞게 사용하는 것이라 생각합니다. 사실 Semantic 이라는 의미 자체가 의미론적이라 그 경계가 모호합니다. W3C에서도 무조건 사용하면 안된다 라고 이야기 하지 않고, 예시를 들어...

[HTML5] 웹표준을 준수하는법! HTML5 Style Guide 3

지난번 포스팅에 이은 HTML5 Style Guide 마지막 포스팅입니다.

[HTML5] 웹표준을 준수하는법! HTML5 Style Guide 2

지난번 포스팅에 이은 HTML5 Style Guide 두번째 포스팅입니다.

[HTML5] 웹표준을 준수하는법! HTML5 Style Guide 1

작성자의 ~카더라 보다는 직접 원문을 보고 해석해서 보고 싶었기에 저는 이 부분을 직접 번역해 보기로 결심했습니다. W3CSchool의 내용 중에서 오늘은 HTML5 전체 구성에 대한 대략적인 HTML5 Style Guide을 살펴보도록 하겠습니다. 내용이 꽤 많아서 두번정도 나누...

Back to Top ↑

접근성

[HTML5] Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply to Mobile 번역하기

Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply to Mobile 모바일 접근성: WCAG 2.0 및 기타 W3C / WAI 지침을 모바일에 적용하는 방법

[HTML] 웹접근성을 위한 기본 언어 명시하기

기본 언어 명시하기

[HTML5] 한국형 웹 콘텐츠 접근성 가이드(KWCAG) 2.1

한국형 웹 콘텐츠 접근성 가이드 2.1

Back to Top ↑

HTML

[HTML] head 태그 내부에 사용하는 meta 태그에 대해

meta tag (메타 태그)

[HTML] 웹접근성을 위한 기본 언어 명시하기

기본 언어 명시하기

[HTML] 로고나 아이콘에 SVG를 사용해야하는 이유

로고나 아이콘에 왜 SVG를 사용해야할까?

Back to Top ↑

Git

[Git] Git stash에 대해 알아보자

Git stash에 대해 알아보자

[Git] Git remove 변경하기(원격 저장소 URL 변경하기)

Git remove 변경하기(원격 저장소 URL 변경하기)

Back to Top ↑

웹폰트

[CSS] 윈도우 OS 폰트 깨짐 이슈

윈도우 운영체제에서 폰트가 깨져보이는 현상에 대해

[CSS] 나눔시리즈 경량화 웹폰트와 CDN

나눔시리즈 폰트로 웹폰트 경량화 진행하기

Back to Top ↑

BEM

[CSS] BEM 방법론

BEM 방법론에 대해 알아보자

Back to Top ↑

stash

[Git] Git stash에 대해 알아보자

Git stash에 대해 알아보자

Back to Top ↑

React

[React] Smart Component vs Dumb Component

Smart Component vs Dumb Component

Back to Top ↑

study

[React] Smart Component vs Dumb Component

Smart Component vs Dumb Component

Back to Top ↑

SVG

[HTML] 로고나 아이콘에 SVG를 사용해야하는 이유

로고나 아이콘에 왜 SVG를 사용해야할까?

Back to Top ↑

lang

[HTML] 웹접근성을 위한 기본 언어 명시하기

기본 언어 명시하기

Back to Top ↑

폰트경량화

[CSS] 나눔시리즈 경량화 웹폰트와 CDN

나눔시리즈 폰트로 웹폰트 경량화 진행하기

Back to Top ↑

CDN

[CSS] 나눔시리즈 경량화 웹폰트와 CDN

나눔시리즈 폰트로 웹폰트 경량화 진행하기

Back to Top ↑

Intellij

[CSS] Intellij를 이용한 Sass auto compile

Intellij를 이용해 Sass 를 자동 컴파일 하기

Back to Top ↑

Sass

[CSS] Intellij를 이용한 Sass auto compile

Intellij를 이용해 Sass 를 자동 컴파일 하기

Back to Top ↑

초기화

[CSS] CSS 초기화 (Reset.css)

CSS 초기화

Back to Top ↑

브라우저

브라우저 렌더링 성능 최적화

브라우저 렌더링 과정 바이트-> 문자 -> 토큰 -> 노드 -> 객체모델 HTML 마크업은 DOM으로 변환, CSS 마크업은 CSSOM 으로 변환됩니다.

Back to Top ↑

렌더링

브라우저 렌더링 성능 최적화

브라우저 렌더링 과정 바이트-> 문자 -> 토큰 -> 노드 -> 객체모델 HTML 마크업은 DOM으로 변환, CSS 마크업은 CSSOM 으로 변환됩니다.

Back to Top ↑