해보면 어렵지도 않을거에요 ^^

아하하;; html, css 표준화에 대한 얘기가 나오면 빠지지 않고 등장하는 국희누나 -ㅂ-;
충분히 그 볼벤소리 하고도 남을거라고 사료 됨;;

볼멘 소리가 아니라~
이제 다들 슬슬 알때가 되지 않았나 싶어서 -_-;
코딩하느라 정신없다 얌 ㅎㅎ

몇몇 사람들은 눈에 박히도록 봤을걸..? ^^;;
열혈코딩!! -_->

성질이 급해서 그런지
얼른 세상사람들이 다 표준에 가까워 지지 않으면 성질날 것 같어 ㅎㅎ

난 그거 직업병으로 보이는데;; 아하하;; >_<;;;

저도 이미 사용하고 있습니다만. 실제로 작업하는 사람들은 상당한 반감을 가지길래
푸념 늘어논것 뿐 입니다..
나니님에게 태클거는것은 아니에요 ^^

뭐.. 사람들마다 생각이 같을 순 없으니까요.. 생각하는게 나쁘다고 할 순 없겠죠 ^ ^

물론입니다.  하지만 특별한 요소를 나타내는것 말고는 머리가 터질 정도는 아닙니다.
그리고 곧 7.0이 공개되지 않습니까?  ^^;;

몇년안에는,,,  어쩔수 없이 테이블을 버려야 할 때가 올텐데.. 그 때에 과감히 돌아설수 있느냐가 문제일겁니다.

이미 외국에서는 테이블 버린지가 꽤 됬으니까요.  한창 여기저기서 웹표준 컨퍼런스가 전세계에서 벌어지고 있구요.

아직은 몇몇 주요 웹사이트들도 테이블을 지향하고 있는건 사실입니다.  마소가 가장큰 예겠네요. ^^;;;

http://css.macple.com/forum/showthread.php?t=120
참고 되길..

북마크를 찾아바야겠지만 일단 간단한거 하나...
http://www.mentalbloc.net/reference/css.html

아.. 링크 게시물을 읽어보고.. 많은 도움이 되었습니다..
제가 생각의 폭이 너무 좁았네요...

'div 보더 보기' 기능이 나와야할 듯.... :)

볼벤 (덜덜덜...)

그리고,

실례라고 칠려다가 실예로 바꿨는데 실례가 맞는 말이었군요 -_-.....
<- 자학한다;;

어떻게 하는거죠... ;;

제가 웹 페이지 제작에 손 뗀지 좀 돼서 드림위버가 없네요 ^^;
강좌 긁어왔습니다.
드림위버 레이어를 테이블로 변환

 

이번시간은 레이어를 테이블로 변환하는 방법에 대해서 알아 보도록 할꼐요.
레이어는 익스플로러와 넷스케이프에서 서로 다른 좌표값을 가지게 된답니다..
따라서 위치가 서로 맞지 않거나 하는 오류가 나타남으로 인해 레이어를 테이블로 변환을 하는경우가 있는데요,, 이번강좌에서는 그것에 대해 알아보도록 하겠습니다.

또 레이어는 정확하게.. 위치등을 표현할때.. 잘 맞지 않는경우가 있답니다. 그래서,, 레이어를 테이블로 전환하여,,, 정확한 위치값등을 표현할수가 있는데요..

먼저,, 적당한 레이어를 세개정도 그립니다.

오브젝트 도구메뉴에서 를 선택하면 레이어를 그릴수 있다고 했죠?..

자 그리고 나서,, Modify->Convert->Layer To Table를 차례로 선택을 합니다.

그리고 나면,, 다음과 같은 세부 설정창이 나오게 되는데요

이곳에서,, 격자를 표시한다든가,, 레이어 패널을 보이게 한다던가 빈공간에 대한 설정들을 할수가 있게 된답니다.

이곳에서는 원하시는 옵션을 주면되구요,, 각각의 요어들을 한번 살펴 보도록 하죠

Table Layout 입니다.

Most Accurate : 레이어와 레이어 사이에 공백이 있는경우 셀을만들어 같은 위치로 오게 해주는 기능입니다.

Smallest : 체크한 수치를 입력할때 입력한 수치보다 작은공백이 있을경우 공백을 지워 줍니다.

Use Transparent GIFs : 테이블의 맨 마지막줄에 1픽셀의 투명 gif 이미지를 삽입하여 테이블의 모양을 유지 시켜 줍니다.

Center on Page : 레이어에서 바뀐 테이블을 가운대로 정렬시켜준다

Layout Tools 입니다.

Prevent Layer Overlaps : 레이어가 겹쳐지지 않게 설정합니다.

Show Layers Panel : 레이어로 변환할때 작업문서에 레이어 패널을 오픈 합니다.

Show Grid : 눈금 격자를 보여줍니다.

Snap To Grid : 격자내에..스냅기능을 적용합니다.

메뉴에 대한 쓰임새를 잘 파악해서,, 하나씩 해 보시길 바랍니다.

다음강좌로 가보시죠,,,.


강좌 출처
http://www.starthomepage.com/custom/dw/dw.jsp

이렇게 메뉴를 이용하는 것 말고도, 드림위버에는 레이아웃 툴 박스가 있던 것으로 기억해요...
그 박스를 이용해서 더 간편하게 할 수 도 있던 것 같네요 ^^;

div에 적용될 css3를 드림위버 다음 버전에서 위지윅으로 지원하면 더 편리하겠네요~^^

웹에디터같은 경우는 div 더 간편하게 만들거에요.
그렇게 한 뒤 에디트하면 (..)

아직은 손으로 하는게 더 편할껄..
div를 제대로 지원하는 위지윅에디터가 있었는지 잘 모르겠당..
golive같은건 css쪽은 굉장히 좋은 쪽으로 발전 한 것 같던데..

아, 그리고 전에 누나 가르쳐준, em 관련 블로그 그 사이트 안 열리고 호스팅 지원하는 그 곳으로 빠져나가드라? -_-a;
em이랑 pt랑 크기 개념이 안 서서 봐야하는데. ;ㅁ;

그리고 em 쓰고 td에 글자는 0.75em보다 더 작게 보이던데;; 왜 그런 것인지;ㅁ;
css에 body, td, span 다 지정해줬는데 말이시;;

http://www.reeddesign.co.uk/test/points-pixels.html
여기가 원본이니까 여기서 봐..^^;
전에 갈챠줬던 데는... 호스팅인가 도메인이 지금 문제해결중이라 시간이 조금 걸릴꺼야

http://kukie.net/index.php/2005/06/02/46/
이런거 봐도 되고..

0.75em을 body와 td에 적용 했으면
body안에 있는 애덜은 다 0.75em으로 보이고 (h1 등은 아니겠지)
body안에서 td안에 있는 애덜은 body에서 0.75em (75%)의 기본 폰트로 보인후 td에서 한번더 0.75em(75%)이 적용되기 때문에 body>td는 0.75em의 0.75em.즉 75%폰트를 다시한번 75% 로 보여주게 되니 더 작게 보이게 돼..

body안의 td에서
body에서의 0.75em과 같은 크기의 글꼴로 보이고 싶다면
body에서는 0.75em, td에서는 1em을 지정해줘야 겠지.
원래는 body에서 지정해 주면 td에서 종속되게 나타나야 하는데 MSIE 그렇지 않아.. 그러니 이상한 브러우저지 -_-;

와우 좋아요. 더 없을까요.

그 반대도 적용됩니다.

css 레이아웃에서는 되는 것이 테이블에서는 불가능하거나 매우 힘든 경우도 있습니다.
발상의 전환이 필요합니다.

또한 테이블에서 row col 개념을 배울 때만큼의 노력을, css 레이아웃에서도 해야 함을 잊어선 안됩니다 ^^

p.s
'메리트가 없어 보인다' 는, 그만큼 알려고 하지 않아서 입니다. 이건 단언할 수 있습니다. css 에는 무수히 많은 속성이 있으며, 그 메리트는 알면 알수록 드러납니다. 국내 자료가 별로 없어서 그렇지, 영어만 잘 해석할 수 있다면 외국 사이트들을 돌아다녀 보세요. 소스 보고 이런 것도 가능한건가 싶은 것들이 많답니다.

padding 문제는 dtd 를 제대로 선언해주면 익스가 standard mode 로 작동하므로 별로 문제가 없습니다.
도리어 문제라면 구 버전의 브라우저가 더 문제입니다.

개발자들 상당수가 quirks vs standard 모드의 차이점을 알지 못합니다. 저도 불과 몇 개월 전까지는 무슨 차이가
있는지도 몰랐습니다. ^^;

물론 모르는 건 아닙니다.
그 가치를 충분히 이해하기 때문에
위험요소를 감수하고 대형 사이트에 작업중 인겁니다.
(어떤 사람들은 나보고 미쳤다고까지 합니다.)

그만큼 알려고 하지 않는다는 단언은 삼가해 주시기 바랍니다.
저역시 무수한 영어사이트 사전 뒤져 가면서 공부하고 있는중이라 CSS 공부하고 있습니다만
뭐 물론 제가 잘몰라서 그러는경우도 있을수있겠지만

제가 메리트가 없다는 얘기는
5~6년간 HTML 전문 코더로 생활했던 사람들에게는 갑자기 원래 표준이 이것이니 또 효용성이있으니 ;
테이블로 레이아웃잡지말고 CSS + DIV 으로 시도해보자라는 생각들지.... 이런면에 메리트가 없어 보인다는 얘기입니다.

국내 웹에이전시 업계에서는 HTML 의 재사용성이나 CSS의 자유로운 유동성따위는 생각하지않는게 일반적입니다.
관리적인 측면도 마찬가지지요.
국내 대형 포탈이라도 만들면 모르겠지요.

일반적인 사이트를 만드는 에이전시의 측면에서는 적어도 저위의 온갖 장점은 희석되기 마련입니다.
짧은 프로젝트 기간 재교육의 기회조차 없는 환경에서
새로운 시도는 전혀 메리트가 없지 않을까요 ^^


yser (yser) 님 말씀대로 발상의 전환이 필요합니다. 그말씀에는 충분히 공감합니다.

기분이 상하게 하는 발언이었다면 죄송합니다 ^^;

지금 이쪽으로 넘어 올려고 하는 분들도 과연 이게 맞는 길인가 의심하며 오는 경우가 많은 것 같습니다.
저도 줄곧 그래 왔었고, 불과 3, 4년 전에는 이런 논의조차 없었습니다.
그러나 속세를 떠나 있다가 왔더니 아주 활발하게 얘기가 나오더군요.
그래서 국내서도 가능성이 있겠구나 하고 생각이 들었고, 드디어
튜토리얼 문서를 만들 필요가 생겼구나 하고 느껴서 초안을 잡아 놓았습니다.
뒤따라오는 분들이 똑같은 삽질을 안하게 하기 위해....
바퀴를 다시 만들 필요가 없듯이, 안해도 될 삽질을 또 할 필요는 없으니까요.

저도 아직 미숙하지만 서로간에 공개하고 토론하여 발전하는 긍정적인 방향으로
나아갔으면 하는 바람이 있는데, 이러한 글들이 계속해서 올라온다는 것이 무척
흐뭇합니다. 그리고, 제가 장담하는데 듀트님이 가시는 길은 절대로 잘못 되지 않았습니다.
주변에서 미쳤다고 하더라도 미친듯이 나아가십시오. 그것이 곧 1, 2 년 뒤에는 듀트님의
스킬과 능력으로서 대접받게 될 것입니다. 국내 웹도 변하고 있습니다. 바닥까지 떨어진
상태에서 더이상 떨어질 데가 없습니다. 이젠 위로 올라갈 시점에, 표준에 대한 관심을
가지고 비록 힘들더라도 그것을 연구하는 사람에게 내일의 길은 열려 있습니다.

미쳤다고 하는 사람들도 언젠간 곧 이 길을 따라오던지 아니면 도태되어 사라질 것입니다.
그러니 당장은 뭔가 좀 허전하고 불안해도, 지금 배우고 계신 길에 신뢰를 갖고 나아가세요.
저도 그러한 분들을 도울 수 있도록 강좌를 써야 하겠습니다. 오래도록 미루어 왔네요.
대한민국에 의식 있는 개발자들이 더욱 많아졌으면 합니다. ^_^

기분나쁘지는 않습니다 ^^

저는 이미 이쪽에 발을 담궈 버렸기 때문에 ;;(조금이나마);;;
그냥 이런경우도 있구나라고 생각만해주시면 ^^


그나저나 홈페이지에 배울게 너무 많던데요 :)
앞으로 자주뵙겠습니다^^

영어..네요 허허 -_-;
div 가 표준에서 벗어난다는 내용인가요 =ㅁ=?

약간은 여담입니다만,
대부분 이 쪽에서 종사하는 사람들이 느끼고 있는게 사실 - 더 이상 나아질 게 없다는 등 - 이죠.
이제 더 이상 나아질 게 없는 웹이라면 요즘처럼 커뮤니케이션이 활발하게 이루어지고 있는
웹표준화가 하나의 발전하기 위한 전화점이 되었으면 좋겠다는 생각입니다. : )

(그리고 표준화조차도 이상하게 표현을 해대서 많은 hack이 있는 msie도 이제 휴식기간을 가졌으면 좋겠네요..)

msie를 싫어하진 않지만 문제점은 이미 많은 곳에서 지적이 되고 있어서
7.0에서는 과연 얼마나 표준화에 가까워졌는지, png 이미지 버그는 얼마나 진정이 됐는지 사뭇 기대됩니다.

전적으로 동감합니다.
대부분의 사용자가 사용하는 IE 가
7.0을 통해서라도 좀 표준에 가까워지기를 바랄뿐입니다.