1. 웹언어의 교과서 w3schools.com



- 사이트 오른쪽에서 레퍼런스 찾아서 확인하며 볼 수 있는 일종의 교과서적인 사이트.


- 왼쪽에는 크게 HTML and CSS, JavaScript, HTML Graphics, Server Side, Web Building, XML Tutorials의 메뉴가 있다.

- 아무 메뉴로나 들어가면 상단에는 HTML, CSS, JAVASCRIPT, SQL, PHP, BOOTSTRAP가 뜬다.


- 각 태그에 대한 상세설명 및 예가 있어 알기 쉽다.

- 각 태그상세에서 [ Try it your self ]라는 녹색글씨 버튼 누르면 직접 태그를 수정하여 우측창의 결과가 바뀌는 것도 확인할 수 있다.


- CSS 1,2,3로 들어간 뒤 상세로 들어가며 확인.





2. 마크업 유효성 검사를 해주는 validator.w3.org

- HTML을 만든 뒤, 이 사이트에서 URL을 넣고 Check를 누르면 마크업 유효성 검사를 해준다.






3. CSS SPRITE GENERATOR (http://csssprites.com/)


- CSS 스프라이트를 자동으로 구현해주는 사이트

- CSS 스프라이트 기법이란 용량이 작은 여러 개의 이미지 파일을 하나의 파일로 통합하여 웹페이지를 불러오는 속도를 향상시키는 기법

- CSS 스프라이트 기법은 이미지에 대한 http 요청을 줄여 성능을 개선해준다.

- 이미지 파일을 선택하여 업로드하면 사이트에서 자동으로 한 개의 통합 이미지를 만들어주고, CSS 구문을 만들어주는 사이트다.





4. 선택자별 지원 가능 브라우저 알아보기


http://caniuse.com/

css의 해당 선택자를 어느 브라우저까지 지원 가능한지 체크하는 사이트




Posted by netyhobby
,