분류 전체보기
Sonance
freenote
thinkbig
m.life
g.life
design
lateadopter
journey
discography
link
etc



theweedygarden 26th style

sonance.tistory.com



Sonance | free note | thinkbig | m.life | g.life | design | lateadopter | discography | journey | etc | contact | link


웹디자인


작년 11월에 썼던 글인데 슬슬 꺼내도 되지 않겠나 싶어서 꺼낸다.




사실 웹디자인을 해 본 적이 완전히 없다 하면 틀린 말이다. 10년도 전에 나도 개인홈페이지 가져보겠답시고 나모웹에디터로 열심히 웹페이지를 끄적끄적대었으니깐. 기억으로는 전체적인 스타일을 여섯번째까지였나 갈아치웠지만 결국 웹상의 내집마련이 가지는 형태가 게시판에서 블로그, 미니홈피 형태로 옮겨가는 추세에 따라 개인홈페이지의 필요성을 느끼지 못해서 그냥 접어버렸다. 그 이후로 간단한 프로필 페이지나 학교 과제용으로 몇 번 만들긴 했는데 뭘 더 깊은 걸 만들고자 하는 의지도 없고 배운 적도 없으니 그 견적이 어디 갈 데가 있나. 결국 웹디자인이라고 하기도 뭐한 그런 작업의 나날은 그냥 그렇게 끝이 났다.


사실 지금까지 내가 했던 디자인은 대부분 '그냥 보기 좋게 이것저것들을 적당히 나열해 놓는 일' 정도밖에 되지 않았다고 생각한다. 그나마 지금까지 만들어 왔던 것들 중에서 무언가 정보를 전달하고자 했던 이미지는 대진표 정도가 끝이고, 엔딩크레딧 등의 영상은 보여줄 수 있는 시간적 공간적 여유가 보다 많으니까 방법의 미숙함이 존재하지 그 이외의 것은 별 관계는 없다 싶다. 포스터 등은 그냥 보기 좋게, 멋지게, 간지나게 정도였을 뿐이지 그 작업물 자체가 보는 이로 하여금 
(긍정적인 의미로)마음 속으로부터 뭔가를 끓어오르게 하는 일 이외에는 별다른 기능이 없는 작업물이었다. 하지만 최근 웹디자인과 관련해서 개인적으로 몇가지 이야기가 있었고 관련해서 몇자 끄적여 본다.


웹디자인은 크게 보면 UI 디자인이라고 생각한다. 한정된 공간 안에, 혹은 너무 많은 공간을 차지하지 않는 선에서 사이트의 내용물들을 효과적으로 전달하고 그 사이트의 컨텐츠를 좀 더 편리하게 이용하는 데에 주안점을 둬야 한다. 특히나 무엇보다도 수많은 사람들이 열심히 써내려가는 텍스트가 주된 정보가 되는 커뮤니티 사이트의 경우에는 그러한 정보들이 화면의 대부분을 차지해야 하한다. 만약 다른 부분이 그 영역을 침해하여 행여나 다른 사람의 글을 읽는데, 내가 글을 쓰는데, 댓글을 달고 서로 소통하는 데 방해가 되어서는 아니 된다는 점이 웹디자인에서는 더욱 부각되는 점이다. 따라서 현재 운영되는 대부분의 커뮤니티들은 메뉴가 최상단에 가로로 배치되어 있고, 그마저도 간소화시키기 위해 메뉴를 카테고리별로 모아 드롭다운으로 한데 묶어 그나마 한정된 공간을 좀 더 효과적으로 활용함과 동시에 메뉴 자체의 직관성을 높이는 역할을 한다. 하지만 이 경우 게시물의 길이가 길어지거나 코멘트가 많이 달릴 경우 필연적으로 스크롤을 내릴 수밖에 없는데, 이 상태에서 다른 게시판으로 가고자 할 경우 다시 스크롤을 돌돌 올려야 하는 불편함이 발생한다. 간혹 이 문제를 내가 스크롤을 내리면 메뉴도 같이 따라 내려오는 식이나 메뉴가 내려오지 않더라도 클릭만 하면 페이지 가장 최하단, 혹은 최상단으로 한번에 이동하는 버튼이 내려온다든가 하는 방식으로 해결이 가능하지만 그만큼 구현해야 할 것이 많아져서 번거롭다는 말이 된다.

더불어 각 요소들이 얼마나 알맞은 비율로 한 화면에 들어오는가 하는 것도 중요하다. 2000년대 초반에, 많은 사이트들이 이른바 '대문'이라는 것을 가지고 있었을 때(조금만 더 어린 사람들은 이 대문이라는 것이 뭔지도 모를 것이다) 그 대문 하단에 항상 붙는 말이 있었다. '이 사이트는 0000 * 000 해상도에 최적화 되어 있습니다.' 여기에 특정 브라우저가 더 달라붙는 경우도 있었는데. 어쨌거나 이 말인 즉슨 만약 당신이 이 해상도 환경이 아니라면 이 페이지를 보는 데 어느 정도의 제약을 안을 수도 있다는 일종의 경고 표시이기도 하며 
그만큼 웹페이지를 개발하는 시점에서 페이지가 어떻게 한눈에 효과적이고 예쁘게 들어올까 하는 것도 고려를 했다는 의미가 되는 것이다. 최근에는 그런 말이 직접적으로 붙는 경우는 드물긴 한데 그래도 전체적으로 4:3 비율에 맞추어 페이지 내용이 들어오도록 한 경우가 많다. 하지만 요즘 4:3비율 모니터 쓰는 사람이 있을까? 기관에서 업무용, 교육용 목적으로 대량으로 들여온 모니터의 경우가 아니면 점점 더 와이드 사이즈를 외치는 이 시대에서 4:3 비율보다는 16:9, 16:10 모니터를 사용하는 것이 그나마 좀 더 보편적일 것이다. 그런 해상도 환경에서는 포털 사이트든 어디든 들어가면 양쪽이 텅텅 비어서 나오고 지금 이 블로그도 양쪽이 허연 공백으로 가득 차 있다. 해상도에 맞게 화면을 재구성하여 어느 해상도에서 보아도 각각 알맞은 비율의 화면구성을 만들어 낼 수 있으면 좋을텐데 과연 그런 방법이 있을까? 배우지도 연구해보지도 않아서 잘 모르겠다.



제대로 해 본 적도 없고 아는 것도 없는 상태에서 막상 웹디자인에 대한 주제로 뭘 해야 하나 생각을 떠올려만 보아도 이렇게 많은 내용이 나오는데 아무래도 경험 없는 나로서는 웹디자인이라는 영역이 굉장히 큰 산이 아닌가 싶다. 사실 기회도 없긴 하지만. 웹디자인은 역시 웹개발자에게 맡기는 것이 가장 좋을 것 같다. 나는 웹개발자도 그렇다고 다자이너는 더더욱 아니니깐.

Sonance
0TRACKBACK, 5REPLIES
T.T
  2015.01.29 11:51 | link | edit or delete | write reply 
근데 영어좀 썼다고 뭐이리 댓글 차단이 되냐??
url을 전혀 쓸 수가 없잖아 이거ㅠㅠㅠ
T.T
  2015.01.29 14:39 | link | edit or delete | write reply 
10년사이에 참 많이 변했지??
나 고등학생때만해도 1280x1024에 맞춰놓고 1024x768에 가이드라인 쳐놓고 버튼 우겨넣고 옆에 서브메뉴 우겨넣고 테이블 짜던 때가 엊그제같은데..ㅎㅎㅎ

포털이 해상도에 맞게 늘었다 줄었다 할 수 없는건 아무래도 트래픽(...)도 트래픽이지만 최소 모니터 사이즈에 들어가있어야되기땜시 포털사이트들은 타 회사 사이트들에 비해 간소화되어있는건 어쩔 수 없음... 많은 인원을 수용해야하는만큼 디자인 트렌드에따라 변하기 시작하면 그것만큼 번거로운게 또 없어서... (예전에 로그인창 좌우 바뀌었다고 불편해하던 사람들도 태반이었음)
뭐 그래도 네이버는 하위메뉴로 들어가는 순간부터 '우리는 최고의 포털임~'이라고 디자인부터가 자랑자랑이라 굉장히 본받을게 많은 사이트긴 해 ㅠㅠ
포털은 아니지만 사람들을 많이 수용해야하는 사이트들의 형태는 대체적으로 이런 형태가 대부분-
www.loud.kr/real_index.r.php
www.gettyimagesbank.com/
www.customellow.com/shop/main.jsp

네번째단락에서 너가 고민하고 있는건 '반응형 웹', '적응형 웹'이라고 불리우고 있는걸로 알고있으
반응형 웹은 말그대로 요소들의 크기와 위치랑 컨텐츠의 개수가 그 해상도에 맞게 반응해서 변한다는것이고..
dribble.com 같이 카드형태가 해상도에 따라서 숫자가 줄어들기도.. 크기가 작아지기도 하고

적응형 웹은 모바일(1080x1920, 640, 1080 등등)/태블릿용/웹용 이렇게 여러개의 사이즈를 정해서 그에 맞게 최적화 시키는것인데..
어떻게 구동하는건지 파고들다보면 한도 끝도 없으니 아 그냥 이런게 있구나~ 정도로 생각하면 마음 편하고 ㅋㅋ
(CSS 예제가 있긴 하던데 댓글로는 url을 입력할 수가 없넹;;)

최근에 기업홍보용 회사 홈페이지들은 카드형태 반응형 웹이나 풀스크린 사진/영상 스크롤링/패럴럭스 스크롤링 디자인 형태가 유행처럼 우후죽순 생겨나고있지...(개인적으론 보기엔 예쁘긴한데 좀 불편한..ㅋㅋㅋ)


그리고 웹디자인이라는 영역이 예전에 비해 계속 확대되고 있는 상태라 이쪽 업계 관계자가 아닌이상 뭔가 너무 포괄적이고 어려울수밖에 없음.
그리고 회사홈페이지 하나 만드는데에는 상상도 못할 인원들이 달려들기 때문에 (기획자, 디자이너, 퍼블리셔, 개발자들만해도 몇명이여..) 개인이 그런식으로 만드는건 사실상 불가능이라고 할 수도 있지;;
(참고로 웹디자이너랑 웹개발자는 다른 영역이라네. 개발자가 디자인을 하지는 않아 ㅋㅋ)

물론 포트폴리오 사이트들중 패럴럭스 스크롤링 형태로 본인의 작업물을 시원시원하게 보여주는 경우는 꽤 있더라.. (하지만 갯수 세어보면 페이지수가 적기도 하고 컨텐츠는 대부분 이미지들이라 회사 홈페이지랑은 아주 많은 차이가 있지)

결론은 모니터와 핸드폰의 변화만큼 이미 웹이랑 모바일 디자인쪽은 지인짜 빠르게 변하고 있다는거.. ㄷㄷㄷ

* 신입 나부랭이는 아직 잘 모르는 세계지만 디자이너들은 갈팡질팡 힘들다고는 함..ㅠㅠ
* 사진과 영상의 중요도가 계속 up up
  2015.01.29 17:41 신고 | link | edit or delete  
와 안만들고 그냥 이런걸 생각해야 하지 않을까? 정도로 쓴 글인데 엄청 장문의 댓글이 달렸네요... 역시 나의 멘토 언제나 감사합니다.

'모니터와 핸드폰의 변화만큼 이미 웹이랑 모바일 디자인쪽은 지인짜 빠르게 변하고 있다는거' 이 말은 업계사람 아니라도 정말 공감. 요즘엔 다들 보는 눈이 높아지니까 더 한 듯.
  2015.01.29 22:21 신고 | link | edit or delete | write reply 
개추
  2015.02.02 15:48 신고 | link | edit or delete  
개추는 디시에서...
name
password
homesite
*1  *···  *45  *46  *47  *48  *49  *50  *51  *52  *53  *···  *420 
I love...