카테고리 보관물: Web Standards

blog theme를 바꿔보았습니다.

워드 프레스로 갈아타고 나서 스킨 작업은 처음 해봤습니다. 갈아 탈 당시에 기존에 사용하던 테마를 그대로 가져오는 작업은 하긴 했지만 제가 한 디자인도 아니었고(맘에 들어 오랬동안 사용하기는 했습니다만) 옮기는 작업은 별로 안 어려워서 뭔가 해냈다 이런 느낌은 없었거든요..

이번에는 이미지도 좀 넣고 직접 디자인도 해가면서 처음부터 만들자고 시작했는데 역시 뜻대로 안되네요. 하다 말긴 했지만 일단 변경합니다. 다른서 비스와 디테일에 관한 부분들은 좀더 만져 줘야겠죠…

오랜만에 작업을 해보니 어려움이 많더 라구요. IE6에서는 확인조차 못 해봤는데 많이 깨질것이라 생각합니다. 작업 할때부터 ‘아 이럼 깨지겠다’ 하는것 들이 꽤많았거든요.. Rounded corner도 지원되지않고 말이죠… 그래도 오랜만에 포토샵을 만져보고 그래보니 재미있네요. CSSplayground 에도 도전해 봐야 겠습니다.

참 이번에는 보더의 모서리를 둥글게 만들어주는 CSS3 속성을 많이 사용해 봤습니다. 이미 많은 좋은글들이 있고, 좀 늦은감이 있지만 Rounded corner사용기에 대해서도 조만간 글을 써볼까합니다.

이번의 슬로건은 닥치고 웹 표준 입니다. 슬로건이 좀 그렇긴 하지만 “앞,뒤 가리지말고 웹 표준이 아닌 닥치고 웹 표준이나 라고 얘기 할 수 있는 사회를 만들어가는 데 도움이 되고자 내가 조금이라도 노력하자” 라는 얘기는 지금 지어 냈습니다. 그냥 재미있어 보여서 한거에요. 캬캬캬

요즘 사는게 별로고 그래서 분위기 전환을 해보려고 했는데 어찌될지 지켜봐야겠네요. 그나저나 이빨 잘 닦으시고, 6개월에한번은 치과에가서 검진받으세요. 그게 싸게 먹혀요 ㅎㅎ 지금 교정때문에 구멍 뚫느라 한 마취가 풀려서 죽겠네요. 끗

Opera desktop browser에서 검색엔진 만들기

제가 Opera software를 다니면서 생활에 가장 큰 변화가 생긴것은 주 브라우저가 Opera로 바뀌 었다는겁니다. 사실 Opera software를 다니면서 사용하게 된것도 크지만, 때마침 주로 사용하던 Firefox가 좀 무거워진 느낌을 받았기 때문입니다.(그냥 개인적인 생각입니다.^^; 민감하게 반응하지 마시길; )

그런데 쓰다보니 Opera Desktop Browser에는 좋은 기능들이 꽤 있는것 같더라구요. 그중에서 제가 제일 잘쓰는 기술은 검색엔진 만들기 입니다.
주소창에 예약어 + 검색할 string 이렇게 쓰는것이죠. 예를들어 구글에서 “deute”를 검색하고 싶다면 주소창에 “g deute” 라고 입력하면 그냥 구글에서 검색이 되는것입니다.

주소창에서 예약어를 이용하여 구글에서 deute를 검색하는 스크린샷

다음과 같이 구글 검색 결과 페이지로 이동이 되며 제가 입력한 deute로 검색이 되는것을 알수있습니다.
검색결과

Opera Desktop Browser 10.10을 설치하면 다음과 같은 예약어가 기본적으로 구성되어 있습니다.(google, ask, yahoo!, amazon.com, Wikipedia, Ebay.com, Shopping, 방문목록에서 검색, 페이지에서 찾기)
도구-환경설정-검색탭:검색엔진관리

그러나 사실 저중에 제가 쓰는건 google이랑 Wikipedia 정도밖에 없는데요. 우리나라 실정에 안맞기는 합니다. 그래서 저는 몇가지 예약어를 추가를 하지요. 그 방법에 대해서 알아봅시다.

먼저 네이버 통합검색을 “n”을 예약어로 지정하여 추가를 해봅시다.

  1. 일단 네이버 메인 페이지로갑니다.
  2. 그리고 검색 input에 마우스 오른쪽 클릭을 합니다.
  3. 메뉴에서 검색엔진 만들기를 누릅니다.
    naver 검색 추가
  4. 예약어를 설정합니다.
    네이버 검색 엔진 만들기 예약어 설정 화면

이렇게 하면 주소창을이용해서 간편하게 네이버를 검색할수있습니다. 다음도 같은 방법으로 이용 할 수 있겠죠. 그래서 제가 주로 쓰는 검색들을 하나하나 다추가 해놓으면 정말 편리 하지요. 제가 추가해둔 검색들은 다음과 같습니다.

  • 네이버 통합검색 (예약어:n)
  • 다음 통합검색 (예약어:d)
  • CDK forum 검색어검색 (예약어:sm)
  • CDK forum 유저검색 (예약어:smp)
  • 구글 언어도구 영어에서 한국어로 (예약어:tre)
  • 구글 언어도구 한국어에서 영어로 (예약어:trk)
  • 기타 회사에서 사용하는 인트라넷등등등

이 정도면 편하게 검색이 가능해 지더라구요. 물론 옆의 검색탭에도 모두 추가가 됩니다.

또 한가지 특징은 검색 당시의 각종 옵션도같이 지정이 가능하다는겁니다. 예를 들어 저는 구글 번역을 많이 쓰는데요. 영어에서 한국어로 한국어에서 영어로 해볼때가 많은데 이것을 하단의 옵션만 변경해서 따로 저장하면 tre,trk 처럼 구분해서 사용을 할 수 있게 됩니다.

검색어를 만들어주는 방식은 form을 input 과 submit 이 있으면 가능한데요… 제가 즐겨쓰는 다음의 영어사전은 검색 엔진을 만들수 없더라구요.. 그래서 분석을 해봤더니. form에 action이 없어서 검색 쿼리를 보낼수 없게 되어 있었습니다. form 태그는 action 속성을 필수적으로 구성해야 합니다. 그런 지침이 있기 때문에 각종 어플리케이션을 만들때는 값이 적절함을 가정하고 기능을 만드는것이겠죠.
암튼 얘기로 돌아와서 물론 수동으로 쿼리를 만들면 검색엔진을 만들수 있습니다만 쉬운방법은아니죠.

웹 페이지를 만들때 이 페이지가  어떤 환경에서 사용 될지 모든 환경을 미리 알수는 없습니다. 그렇기 때문에 웹 표준을 준수하고 웹 접근성을 준수해서 웹 페이지를 만드는것이 그만큼 중요합니다.  이에 대한 얘기는 웹 접근성 지침에도 물론 있습니다.

암튼 다음 영어사전 만드시는분들 수정좀 해주세요 >_<

검색 용도로의 오페라 좀 쓸만하죠? 다들 오페라로 즐거운 검색생활 하시길 바랄께요 잇힝

회원가입 하기 왜 이리 힘든가요

제가 요즘 여러사이트를 둘러볼 일이 많은편인데요. 둘러보니 그동안 많은 웹사이트가 웹2.0이다 Ajax 다해서 많은 발전을 하고 있는것같아요. 많은 클라이언트 기반 웹 기술들이 사용자를 위한 발전을하고 있고 실제로 많은 사이트들이 사용성 이나 편의성이 많이 좋아진것같아제가 요즘 여러사이트를 둘러볼 일이 많은편인데요. 둘러보니 그동안 많은 웹사이트가 웹2.0이다 Ajax 다해서 많은 발전을 하고 있는것같아요. 많은 클라이언트 기반 웹 기술들이 사용자를 위한 발전을하고 있고 실제로 많은 사이트들이 사용성 이나 편의성이 많이 좋아진것같아

하지만 기술의 발전에 비해 내용의 발전은 아직 많지 않은것 같아요. 꼭 필요할 것 같지 않은 요소들이 남발이 된다던가 그냥 고민 없이 해오던대로 페이지를 구성한다던가 하는일들이 무식한 제가 보기에는 많이보이는것 같아서요 혹시 이글을 보시고 현답을 주실분이 있다면 좋을것 같네요.

각종 사이트를 원할하게 사용하려면 거의 대부분이 회원 가입을 하고 로그인을 한뒤 사이트를 이용하게 되는데 회원가입 하는게 쉬운일이 아니죠. 보통 회원가입시 받는 정보들을 살펴보면 이름, 주민등록번호, 닉네임, 아이디, 주소, 전화번호, 휴대전화번호 등등 완전 호구 조사가 따로 없어요. 주민등록번호 입력은 그중 제일 이해 안가지만 뭐 다들 고집을 하니 넘어가도록 하고 그다음으로 이해안가는 항목이 하나 있다면, 주소를 입력받는건데요. 이 정보가 왜필요한지모르겠어요 쇼핑몰 같은경우 주소가 필요 할수도 있겠지만, 다른 경우에는 별로 안필요할것 같은데요 경품을 줄때이용 할수도 있을거라 생각해봐도 보통 경품 보내줄때는 주소 정보를 수동으로 관리하고 수집하더라구요 입력하는 사람도 정말 귀찮은 일이 아닐수없는데요. 게다가 대부분 우편번호까지 입력해야하니 정말 귀찮아요. 이용할때도 없고 입력하기도 귀찮은 이 항목이 왜 회원가입 항목에 있는질 모르겠어요.
주소 입력에 서울시 중구 신당동 떡볶이 로 입력해 본적은 없으십니까?
대부분 위와 같이 입력해 보신적 없나요?

또 하나 걸고 넘어져 보면, 대부분 회원가입시에 메일주소를 입력받는데요. 많은 사이트들이 많이 사용되는 메일의 도메인을 미리 리스트업해놓고 그중에 선택하던가 직접 입력하던가 할수 있게 하는데요. 돌려 쓰는건지 퍼와서 사용하는건지는 모르겠으나 도메인이 상당히 오래되어서 서비스 되지않는 도메인이 있는경우도 보이더라구요. 개인적인 생각 으로는 그냥 메엘주소를 도메인 포함해서 입력하는게 더 편하다고 생각 하는데 이건 뭐 개인차가 있을것 같네요.

메일 도메인 리스트

회원 가입시에 저같으면 정말 최소의 정보만 받을것 같은데 사이트마다 나름의 이유가 있겠죠?

제가 초천재님과 아이폰을 사러 대리점에 갔을때 개인정보를 여기저기 뿌리는것에 동의 하라고 안하면 아이폰을 가입할수 없다고 하던 고속터미널의 모 대리점이 생각이 나는데요 설마 사이트도 그런건 아니겠죠?

경력이 개쩌는 개발자, 퍼블리셔를 에게하는 초보의 부탁

웹 바닥에서 굴러 먹은게 9년이나 되었지만, 실제로 웹 사이트를 만드는 일은 얼마 하지 않았기 때문에, 어느 분야던지 프로훼쇼날 하지 않다고 개인적으로 생각하고 있는데요.

그냥 살다보니 슈퍼 울트라 초 특급 경력 개발자, 퍼블리셔분들도 실수를 조금씩 하시는것 같아 때때로 마음이 아픕니다. 그래서 많은 선배님, 스승님 등등 분들께 몇 가지 부탁을 드립니다.

HTML 태그를 쓰실때는 좀 닫아주세요… “너네들이 내가 실수했는지 얼마만에 알아 채는지 볼라고 그런거야” 이런 말씀 하지 마시고 HTML 태그는 잘 열고 잘 닫아주세요. 인생은 뒷처리가 중요한거랍니다. 똥 싸러가서 다싸고 뒤처리 안하면 좀 드러워져요.

HTML 4.01에서는 일부 태그는 안닫아도 된다고 하시는 분들 정확한 DTD 를 사용하시던가 그래도 그냥 닫아주시면 마음이 편안해요.. 역시 똥싸고 뒷 처리가 중요 하니까요..

또 태그 닫는 순서 좀 지켜주세요. 똥쌀때 바지벗고 팬티 내려 싼 다음 바지입고 팬티 입는거아니잖아요.. 상식적인건데 왜들 그러세요.. 바지입고 비데하는거 아니잖아요… 좀 순서를 지켜주세요~ 어렵지않구요. 해치지 않아요.~

즐거운 배변하시고, 즐거운 마크업생활하세요~

CSS Playground.net

역시나 웹 표준 지인들과 술을 먹다가 CSS Zengarden에 대한 얘기가 나왔고, 우리도 이런게 있으면 좋겠다고 얘기했었어요.

그 담날부터 바로 만들기 시작했는데  3년이 지나고 나서야 그나마 좀 볼 수 있는 상태가 되었네요. 그 간에 만드는 도중에 황송하게도 일몰님이 디자인을 주시기도 하셨고, 여러분들이 격려를 해주시기도 했습니다.원래 기획시에 CSS Quiz도 하려는 계획이 있었는데 이건 이미 정찬명님께서  진행하고 계시네요:)

CSS 놀이터는 기본적으로는 CSS의 위대함을 알리는것이 목적입니다. 세상은 계속 창조적인 디자인이 나오고 있습니다. 웹 표준이 창조적인 디자인과 잘 어울린다는것을 알리는데 조금이나마 도움이 되었으면 하는 바램입니다.

또한 많은 디자이너가  웹 표준을 어려워 하는데, 디자인을 해보면서 또한 CSS를 다뤄보면서 CSS와 친숙해지는 진정한 웹 디자이너가 되는데 도움이 되는 계기가 되었으면 하는 바램도 있습니다.

공개된지 얼마 되지않았는데 벌써 4분이 자신의 창작물을 제출해 주셨습니다. 하나하나 고민을 거듭한 CSS 코드가 돋보이는 작품입니다. 조만간 작은 이벤트를 진행해볼까 합니다.

많은 분이 CSS 의 위대함과 즐거움을 CSS 놀이터에서 느끼실 수 있으면 좋겠습니다. 좋은서비스가 되도록 저도 노력하겠습니다.

CSS 놀이터Css Design korea의 서비스로 귀속 하겠습니다.(운영자맘 캬캬캬)