웹사이트 경량화, 구형 하드웨어에서도 쾌적하게!

by DD
1개월 전
조회수 10

Smolweb을 활용하여 웹사이트를 단순화하고, 구형 하드웨어 및 웹 브라우저 호환성을 개선함

CSS 및 HTML 검증 도구를 사용하여 웹 표준 준수 및 성능 향상을 시도함

Smolweb validator의 부정확한 제안에 대한 주의와, 다크 모드(Dark Mode) CSS 규칙 관련 논의가 진행됨

SCSS 사용을 통해 CSS 변수 미지원 환경에서도 웹사이트를 정상적으로 작동하도록 함

Smolweb validator의 한계점

커뮤니티에서는 Smolweb validator가 SVG 제거, 다크 모드 CSS 규칙 삭제, 메타 charset 태그 누락 등 부정확한 제안을 할 수 있다는 점을 지적했다. 특히, validator가 인식하지 못하는 CSS 속성을 사용하면 F 등급을 부여하는 문제점이 언급되었다. 이러한 문제점 때문에, Smolweb validator를 참고하되, 맹신하지 않고 Netsurf와 같은 구형 브라우저에서 직접 테스트하는 것이 권장된다.

CSS 최적화 및 SCSS 도입

게시자는 CSS를 최적화하고, SCSS를 도입하여 CSS 변수를 지원하지 않는 브라우저에서도 웹사이트가 정상적으로 작동하도록 했다. SCSS 컴파일(Compile)을 통해 CSS 변수 의존성을 제거하고, 웹사이트의 호환성을 높였다. 또한, W3C HTML 및 CSS validator를 사용하여 웹 표준을 준수하고, 웹사이트의 유효성을 검증했다.

다크 모드(Dark Mode) 구현 방식 논의

다크 모드(Dark Mode) 구현 방식에 대한 논의가 이루어졌다. 미디어 쿼리(Media Query)를 이용한 다크 모드 구현 방식 대신, 커스텀 프로퍼티(Custom Properties)와 `light-dark` 함수를 사용하여 코드를 간소화할 수 있다는 의견이 제시되었다. 이를 통해 다크 모드 관련 CSS 코드를 줄이고, 유지보수성을 향상시킬 수 있다.

웹사이트 유효성 검증의 중요성

게시자는 W3C HTML 및 CSS validator를 사용하여 웹사이트의 유효성을 검증하는 과정을 강조했다. HTML Tidy를 사용하여 마크업 문제를 해결하고, wget을 통해 내부 링크를 검사하는 등, 웹사이트의 품질을 높이기 위한 노력을 기울였다. 이러한 검증 과정을 통해 웹 표준을 준수하고, 사용자 경험을 개선할 수 있다.

Smolwebifying my site