본문 바로가기

Internet World

[Internet] 다음 모바일 사이트 요즘 다음의 노력이 많이 눈에 보입니다. 아이폰 어플에서 부터 시작해서 CI도 바꾸고 여러가지고 혁신에 힘쓰는 것 같은데요. 네이번 검색만 쓰다가 오랜만에 들어가본 다음검색에서 다음 모바일 사이트의 변화를 볼 수 있었습니다. 이번에는 특히 검색 부분의 좋은 점을 볼 수 있었는데요. 특정 장소를 입력하여 검색했을 경우에는 이런 결과가 나타납니다. 일단, 바로가기와 장소에 대한 설명이 나오고 여러가지 맞춤내용이 나옵니다. 무엇보다 눈에 띄는 것은 장소카테고리에 전화걸기와 지도보기 버튼이 있다는 것입니다. 전화걸기 버튼은 href 에 tel: 을 이용하여 바로 전화를 걸수 있게 버튼을 만들어 놓았습니다. 아주 휼륭합니다. 그리고 지도보기 버튼을 누르게 되면 선택한 곳의 주변 지도를 볼 수 있습니다. 모바일폰으.. 더보기
[HTML5] HTML5 로 만든 사파리 Welcom 동영상 사파리4를 인스톨하고 처음 실해했을 때 나오는 Welcome 영상입니다. HTML5로 만들어 졌다고 하는데요. http://www.apple.com/safari/welcome/ 사파리4를 설치해야 보실 수 있습니다. 더보기
[HTML] DTD DOCTYPE 과 HTML5 HTML 문서의 표준을 지정하기 위해 선언해주어야 하는 DTD DOCTYPE 그것이 무엇일까요? DTD 는 Document Type Definition 문서의 타입을 정의하는 것 입니다. 보통 독타입에는 몇가지가 있는데요. Strict - W3C가 의도했던 문서 타입 (엄격한 규격) Strict 타입은 W3C가 스타일시트 사용을 장려하기 위해 단계적으로 사라질 표현(presentation)에 관한 태그와 속성을 배제한 문서 타입입니다. 제작자는 가능하다면 strict 타입을 사용해야 한다는데요. Transitional - 기존에 만들어진 문서들과의 호환성을 위해서 만들어짐 (과도적인 규격) 과거의 모든 문서들을 Strict DTD에 맞게 바꾸려면 엄청난 변화가 필요하므로 그 중간 단계로 Transitio.. 더보기
다음 한메일 리뉴얼 다음 한메일이 갑자기 바뀌었습니다. 제가 몰랐는지도 모르겠지만 바뀐다는 이야기도 안하고 갑자기 바뀌었네요. 아무튼 요즘 다음의 변화하려는 노력을 보면 참 열심히 하고 있다는 것이 조금은 보이네요. 일단 메일 및 사용자화면의 디자인이 바뀌었는데요 일전에 네이버에서 바뀌었는데 그런 비슷한 스타일로 바뀌었습니다. 메일의 기본화면은 비슷하긴 한데, 상단의 여러가지 서비스 메뉴들이 열거되어 있습니다. 메일을 비롯하여 주소록, 쪽지 캘린더, 가계부 이렇게 있는데요. 아무튼 이번보다 디자인이 좀 더 예뻐진 것 같습니다. CI를 바꾸면서 다음의 전체적인 이미지가 약간은 변하는 것 같네요. 메일함으로 메일을 관리할 수 있는 것은 동일하구요. 마우스를 올렸을 때 more 라는 버튼이 나옵니다. more를 누르면 각 개별 .. 더보기
[컴퓨터 팁] 많은파일 파일명의 일괄변경 ren 요즘에는 윈도우가 아주 잘 나와서 도스는 별로 쓰지 않지만 도스가 아주 유용하게 쓰일 때가 있습니다. 파일의 이름을 한번 바꾸는 등의 일괄처리를 할 때 같은 경우에는 아주 유용하게 쓰입니다. 파일명 텍스트 추출 윈도우의 실행에서 cmd 를 입력하겨 커맨드 모드로 들어갑니다. 그러면 다음과 같은 창이 하나 뜹니다. 이것이 우리가 그 옛날에 자주 사용하는 도스? 깜빡이는 커서가 인상적입니다. 일단은 본인이 추출하고 하는 폴더로 접근해야 합니다. 여기서는 C드라이브에 있는 test 란 폴더안의 파일 리스트를 추출해 보기로 합시다. 그럼 그 폴더로 접근해야 합니다. dir 명령어 사용하기 그런다음에는 dir 명령어를 사용하여 이 폴더 내의 파일의 리스트를 text 파일로 저장해 보겠습니다. 일단 dir 이라는 .. 더보기
[HTML/CSS] 늘어나는 박스 만들기 HTML과 CSS를 이용하여 늘어나는 박스를 만들어 보았습니다. 원리를 간단히 설명 드리자면, 최대로 늘어나고자 하는 크기의 큰 이미지를 만들고 div 앨리먼트를 여러겹으로 겹쳐서 늘어나는 부분의 둥근 모서리가 들어나게 하는 방식 입니다. 말로 아무리 설명해봐야 이해가 잘 안되지요. 그렇다면 직접 한번 볼까요? 여기에 내용이 들어갑니다. 이렇게 두겹으로 마크업을 해주면 두 방향으로 늘어나는 것을 해결 할 수 있습니다. 예를 들어 "좌우" 나 "상하" 같은 두방향 말입니다. padding 을 이용하여 안에 있는 앨리먼트를 약간 밀어내어 모서리의 둥근 배경이 보이게 하는 방식입니다. div.box_v {width:400px; background:url(box_v.gif) no-repeat left top; .. 더보기
[jQuery] jQuery를 이용한 동적이 사이드메뉴 (동적메뉴) jQuery를 사용하여 동적 메뉴를 만들어보았습니다. 나라디자인의 포스트를 참고하여 약간의 수정을 통해 제작하였습니다. 상위메뉴를 클릭하면 하위메뉴가 미끄러져 나옵니다. 이런 간단한 애니메이션이 제공되니 이제는 꼭 플래시를 사용하지 않아도 될 것 같다는 생각이 드네요. 아직은 완벽하지 않지만 사용하면서 약간 수정을 해준다면 정말 유용하게 쓰일 수 있을것 같네요. 더보기
[jQuery] jQuery를 이용한 레이어 팝업 jQuery를 이용하여 레이어 팝업을 작업해 보았습니다. 접근성에는 약간 안맞는 것 같지만 여러모로 쓸모는 많은 것 같습니다. 뜨는 창을 position:absolute; 와 left:50%; top:50%; 를 이용하여 가운데 배치하였고 jQuery를 이용하여 앨리먼트의 높이와 넓이를 가져와서 컨텐츠의 크기가 어떻게 되어도 항상 가운데에 위치하게 작업하였습니다. 다만 안쪽에 들어오는 컨텐츠에 width 값을 고정을 준다면 더 안정적으로 돌아갈 것 같습니다. jQuery의 fadeIn() 과 fadeOut() 을 이용하여 좀더 예쁘게 꾸며보았습니다. 더보기
[Javascript] location 객체에 대한 생각 location 객체는 현재 문서의 URL과 관련된 정보를 가지고 있습니다. location 객체는 window 객체의 하위 객체지만 window 객첵를 생략하고 사용할 수 있습니다. 혹시 프레임을 사용된 경우에는 최상위 프레임 문서의 URL만 참조할 수 있고, 하위 프레임의 문서들은 Frames 객체를 이용합니다. 기본형태는 이렇습니다. location.속성 혹은 메소드 location.속성 = 지정값; location 객체의 속성 속성 설명 href 페이지의 URL 전체 정보를 반환합니다. URL을 지정하여 페이지를 이동할 수도 있습니다. protocol : (콜론)을 포함하는 http 나 ftp 등의 프로토콜 정보를 반환합니다. hostname 호스트의 이름과 포트번호를 반환합니다. pathname.. 더보기
[jQuery] CDN : Contents Delivery Network for jQuery (제이쿼리 코드 서버) - 라이브러리를 불러와 사용하는 법 jQuery는 정말 좋은 라이브러리 같습니다. 위의 그림에서 볼 수 있듯이 작은 용랼으로 CSS3를 준수하고 크로스브라우징을 거의 완벽하게 구현해줍니다. CSS 스타일링을 비롯해 약간의 애니메이션까지 구현할 수 있으니 정말 금상첨화 입니다. 일단 이러한 jQuery를 사용하기 위에서는 문서상단에 이 라이브러리를 불러와야 하는데요. 물론 파일을 받아서 자신이 사용하고자 하는 서버에 올려 사용할 수도 있지만. CDN(Contents Delivery Network)이란게 있더라구요. 그래서 오늘은 jQuery CDN Host 에 대해 알아볼까 합니다. 1. jQuery CDN http://code.jquery.com/jquery-1.4.2.min.js (Minified version) http://code.j.. 더보기

반응형