Blog
반응형 테이블
반응형 웹디자인에서 가변폭 콘텐츠는 필수이지만 가독성 문제가 항상 발생한다. 반응형 이미지나 반응형 동영상도 화면폭이 좁아지면 내용을 알아보기 힘들어 지지만 표의 경우에는 구조를 파악할 수 없게되어 이해가 더 힘들어진다. 이차원 데이터를 다루다보니 컬럼이 많을 경우에는 글자가 세로 한줄로 정렬되는 등 이해하기 쉬운 형식을 유지하기가 쉽지 않다. 이러한 문제점을 해결하기 위한 다양한 방법들이 이미 나와있다. 가장 대표적인 반응형 표는 표의 헤더를 CSS에서 새로 정의해서 선형화된 표를 보기 쉽게 하는 방법이다. 하지만 이 방법은 C …
dev | 2013-03-09 | Comments (7)
HTTP 헤더값과 POST 데이터 변조 애드온
보통 HTTP 헤더값을 추가하거나 POST 값을 전송하거나 둘 중의 하나만 하는데 둘 다 하는 경우를 이번에 처음 겪어봤다. 더군다나 POST 데이터를 보내는 곳이 웹페이지가 아니라 단말기여서 테스트하기가 애매했다. 이 두가지를 다 지원하면서 입력하기 편하고 이왕이면 모양도 이쁜 플러그인을 찾느라 몇가지 설치해보며 테스트 해 봤다. 전제조건은 1) HTTP 헤더 값 추가와 POST 값 전송을 둘 다 할 수 있고, 2) 입력 UI가 값마다 필드가 나눠져 있지 않고 붙여넣기로 한번에 여러개의 값을 입력할 수 있고, 3) 실제 랜더링된 …
dev | 2013-02-25 | Comments (1)
하드 포맷 후 나오는 타임머신 안내
맥오에스에서 새하드를 넣고 디스크 유틸리티로 포맷을 하면 하드를 타임머신 백업용으로 사용할 것이냐고 물어본다. 사실 엄밀히 보면 크게 상관이 없는 두 기능인데 이렇게 사용자를 연결시켜주는 것을 보니 내심 얄밉기도 하지만 대단하다는 생각이 든다. 이런 아이디어와 의사결정은 어떠한 과정을 거쳐서 내려지는지 정말 궁금하다.
software | 2013-01-31 | Comments (0)
의심가는 접속에 대한 접근 차단
페이스북 비밀번호를 그냥 영어단어로 해놔서 계정이 뚫렸는데 다행히 페이스북에서 계정을 바로 막아버려서 피해는 거의(전혀?)없었다. 페이스북에서 이상징후를 바로 파악해서 계정을 막아버렸다. 새벽에 이런 메일이 왔었다. 물론 나는 자고 있었다. 아침에 페이스북에 로그인해보니 계정을 막았단다. 보스턴에서 접속을 시도했다는데 새벽 한시정도에 한국에서 핸드폰으로 사용한 사용자가 순식간에 보스턴까지가서 로그인 할 수는 없기 때문에 이상징후라고 판단한 것 같다. 당연히 모르겠다고 선택했다. 비밀번호 다시 입력하란다. 비밀번호 …
web | 2013-01-28 | Comments (0)
맥오에스 메뉴바 아이콘 재설정 방법
언제부턴가 슬립모드에서 깨어날 때 느려지면서 SystemUiServer라는 프로세스가 CPU 자원을 다 소비하기 시작했다. 검색을 해보니 메뉴바의 아이콘이 문제여서 그렇다는 사람이 좀 있고 타임머신이나 와이파이 아이콘을 안나타나게 하면 증상이 나아진다는 얘기가 있었다. 타임머신 아이콘은 원래 안나오게 했었고 와이파이 아이콘을 없애려니 설정을 건드려도 반응이 없고 아이콘에 계속 나왔다. 얼마전부터 외부 모니터를 연결했을때 디스플레이 옵션 아이콘이 나오지 않았는데 메뉴바 쪽에 뭔가 문제가 있었나보다. 메뉴바 재설정하는 방법은 간단하 …
life | 2013-01-21 | Comments (1)
클라이언트측 HTML 랜더링과 서버측 HTML 랜더링
강규영님의 "웹사이트 랜더링, 클라이언트에서 하나 서버에서 하나?"와 홍민희님의 "Re: 웹사이트 랜더링, 클라이언트에서 하나 서버에서 하나?"를 보고 많은 생각이 들었다. 요즘들어 계속 고민해 오던 일이기도 하다. 웹기술의 범위가 점차 확대되면서 기존의 다른 플랫폼의 방법론들이 웹으로 들어오면서 발생되는 현상으로 생각된다. 각각의 장단점은 이미 강규영님과 홍민희님이 잘 설명해 주셨고 전적으로 동의한다. 점진적 향상은 반드시 필요하고 플랫폼 기능 활용은 진리다. 우리 회사도 현재 이런 분위기에 영향을 받고 있다. 서버는 API만 …
dev | 2013-01-18 | Comments (1)
PPK의 IE 지원 여부 설문조사 결과
PPK가 개발자들을 대상으로 다양한 버전의 IE 지원 정책에 대한 설문조사 결과를 공개했다. 간단히 결과를 살펴봤다. IE6은 10%정도, IE7은 56%정도가 아직 테스트를 하고 있다고 한다. 우리나라와 조금 다른 양상은 클라이언트가 IE6이나 IE7 지원을 원하면 40% 이상이 어느정도의 추가 요금을 부과한다는 것이다. 우리나라는 워낙 기술에 대한 비용에 인색해서 납득 시키기 힘든 행태이기는 하다. 사실 브라우저 지원 정도는 사용자 통계를 보고 결정해야 하는데 통계가 없거나 믿을만한 통계가 아닌 경우가 많다. 웹킷만 테스트하 …
dev | 2013-01-09 | Comments (1)
CSS 속성 한줄로 쓰기와 여러줄로 나눠 쓰기
CSS 속성을 한줄로 쓰는게 좋을지 여러줄로 나눠서 쓰는게 좋을지는 오래된 떡밥이다. 나는 CSS를 처음 시작할 때부터 여러줄로 나눠 써오는 방법을 사용해왔고 당연하다고 생각하고 있었는데 어느순간부터 한줄로 쓰는 방법이 등장하더니 요즘은 거의 한줄로 쓰는 방법이 대세인 것 같다. 어떤 방식인지 코드를 일단 보자. #location .map { position: relative; } #location .map img { max-width: 100%; } #location .map .btn { position: absolute …
dev | 2012-12-08 | Comments (14)
유투브 동영상 다운받는 애드온
유투브 동영상을 볼때 인터넷이 느려서 계속 버퍼링이 되는 경우가 있다. HD 영상을 볼 때에 특히 심하게 나타날 수 있다. 이런 동영상을 아주 쉽게 미리 다운받아서 버퍼링 없이 볼 수 있게 해주는 애드온이 있다. 패스티스트튜브(FastestTube)라는 애드온인데 이 애드온을 설치하면 유투브 동영상 아래에 다운로드 버튼이 나온다. 발표자료를 만들 때 일일이 링크를 하지 않고 직접 발표자료 안에 파일을 넣는데에도 쓸 수 있어서 아주 유용하다. 물론 저작권에는 주의해야 한다. 파이어폭스, 오페라, 사파리, 크롬, 인터넷 익스플로러 …
software | 2012-11-26 | Comments (2)
HTML4와 HTML5의 요소와 속성 차이
이 글은 오래된 정보를 포함하고 있습니다. HTML4와 HTML5의 차이점을 참고하세요. HTML5 태그의 활용에 대해서 정리를 해달라는 요청이 있어서 W3C의 초안 문서인 HTML5 differences from HTML4에서 요소와 속성을 중심으로 정리를 해 보았다. 실전 HTML5 가이드를 만들때에도 같은 작업을 했었는데 그 이후로 많이 변경된 것 같다. 좀 급하게 작업을 해서 오역이나 오류가 있을 수도 있고 시간이 지나면서 변경될 수 있는 부분도 많다. 그냥 현재 이런 상황이구나하는 정도만 참조하면 좋을 것 같다. W …
dev | 2012-11-11 | Comments (1)