웹사이트를 제작하거나 유지보수할 때 유용하게 활용할 수 있는 참고 사이트들을 정리했습니다.
웹디자이너, 퍼블리셔, 개발자 모두에게 실무에 도움이 되는 필수 도구와 리소스입니다.
1. UI 프레임워크 & 디자인 리소스
- Bootstrap – 반응형 웹 개발에 유용한 HTML, CSS, JS UI 프레임워크
- Tailwind CSS – 유틸리티 퍼스트 기반 최신 CSS 프레임워크
- Font Awesome – 웹폰트 기반 아이콘 및 로고 라이브러리
- Google Fonts – 웹에서 자유롭게 사용할 수 있는 폰트 제공
- Figma Community – 디자이너들이 공유하는 UI 템플릿과 컴포넌트 리소스
2. HTML/CSS/JS 개발 지원 도구
- Emmet – 코드 자동완성을 지원하는 HTML 마크업 플러그인
- Can I Use – 브라우저별 HTML5, CSS3 속성 지원 여부 확인
- CSS 3.0 Maker – CSS3 속성 시각화 및 코드 자동 생성
- ColorZilla – 웹페이지에서 색상 추출 및 팔레트 도구
- MDN Web Docs – HTML, CSS, JavaScript 등 웹 기술의 공식 문서 및 튜토리얼
- CodePen – HTML/CSS/JS 실험 및 공유에 특화된 웹 개발 샌드박스
3. 코드 편집 도구
- EditPlus – FTP 지원, 다국어 인코딩, 웹코딩에 특화된 윈도우용 에디터
- Visual Studio Code – 확장성이 뛰어난 무료 오픈소스 코드 편집기, 다양한 웹 개발 환경 지원
4. 웹 표준 & 유효성 검사
- World Wide Web Consortium (W3C) – 웹 표준을 정의하는 국제 웹 기술 표준화 기구
- W3C Markup Validation Service – HTML, XHTML 마크업 유효성 검사
- W3C 마크업 검증 서비스 (KLDP 한글) – 한글 기반 마크업 유효성 검사
5. 웹 접근성 & 웹 가이드라인
- 웹접근성 연구소 – 장애인 접근성 개선을 위한 가이드와 자료 제공
- NULI (네이버 널리) – 네이버 웹 표준 및 웹 접근성 가이드라인, 실무 코드 예시 포함
6. JavaScript 라이브러리
웹사이트 제작 시 위 자료들을 참고하면 퍼블리싱 속도와 품질 모두 향상될 수 있습니다.
특히 유효성 검사, 웹접근성, 브라우저 호환성은 필수적으로 점검해야 할 요소입니다.
