DDODDO LAB

브레이크포인트 1024 / 768 구조 실전 적용 가이드공공기관 고도화 프로젝트를 들어가면가장 먼저 마주치는 혼란이 있다.“브레이크포인트가 제각각이다.” 어떤 페이지는 1200,어떤 곳은 1024,어떤 파일은 768,심지어 min/max가 섞여 있다. 이 상태에서 작업을 시작하면프로젝트 중반부터 유지보수가 무너진다.고도화의 핵심은 통일이다. 1. 왜 공공기관은 1024 / 768이 많은가?대부분 구조는 이렇게 되어 있다.PC 기준: 1024px 이상태블릿: 768px ~ 1023px모바일: 768px 이하이유는 단순하다.과거 PC 해상도 기준이 1024 중심행정 업무는 PC 사용 비율 높음접근성 인증 기준 대응내부 행정망 해상도 환경 고려즉, 모바일 퍼스트라기보다PC 안정성 중심 구조다. 2. 브..

공공기관 웹사이트가 PC First 구조로 설계되는 이유 분석. 접근성, 인증, 레거시 유지보수 관점에서 반응형 전략 정리. 왜 공공기관 사이트는 아직도 PC First일까?최근 프로젝트를 진행하며여러 공공기관 사이트의 CSS 구조를 분석해봤습니다. 의외로 많은 사이트가Mobile First가 아닌 PC First 구조로 되어 있었습니다. 왜일까요? 단순히 “구식이라서”는 아닙니다. 1. 인증 및 보안 모듈이 PC 환경 기준공공기관은공동인증서행정 시스템 연계내부 업무 시스템등이 PC 환경 기준으로 설계되어 있습니다. 즉,주 사용 환경이 여전히 데스크톱 중심입니다. 그래서 기본 CSS가 PC 레이아웃이고,모바일은 보조 레이어로 처리합니다. 2. 접근성 검사 기준이 PC 화면 중심웹 접근성 인증 과정에서..

min-width와 max-width 미디어쿼리 차이점 정리. Mobile First vs PC First 전략 비교와 퍼블리셔 실무 적용 기준 설명. 정리. Mobile First vs PC First 전략 비교와 퍼블리셔 실무 적용 기준 설명. min-width와 max-width, 아직도 헷갈리나요? 반응형 작업을 하다 보면반드시 마주치는 선택지가 있습니다. CSS@media (min-width: 768px) 또는 CSS@media (max-width: 768px) 둘 다 맞는 방법입니다.하지만 설계 기준은 완전히 다릅니다. 기본 개념 차이min-width → Mobile First 방식작은 화면을 기본으로 두고점점 확장합니다.CSS/* 기본: 모바일 */@media (min-width:..