'잡지식스토리'에 해당되는 글 161건

  1. 2013.10.11 [포토샵]Paint Bucket Tool(페인트 버켓 툴)로 채색하기
  2. 2013.10.10 [HTML]meta http-equiv 태그, 웹문서 초기 정보 설정하기
  3. 2013.10.09 [포토샵]Color Range, 특정 색상의 선택 영역 선택하기
  4. 2013.10.08 [ArtRage]아트레이지 맛보기
  5. 2013.10.06 [포토샵]선택영역 모양변형하기(모양변경/둥글게/테두리)
  6. 2013.10.05 [HTML]meta name태그, 웹문서의 정보를 나타내기
  7. 2013.10.03 [포토샵]선택된 영역을 일정 비율로 줄이기
  8. 2013.09.30 [HTML]link태그, 각 웹문서끼리 연결하여 관계 나타내기
  9. 2013.09.29 [HTML]base태그, 기준이 되는 URL 절대경로 지정하기
  10. 2013.09.28 [와콤 뱀부]와콤 뱀부 BAMBOO DOCK 프로그램 설정 방법
  11. 2013.09.27 [HTML]title태그, 웹페이지에 웹문서 제목 입력하기
  12. 2013.09.26 [포토샵]선택 영역 경계를 부드럽게 처리하기
  13. 2013.09.26 [와콤뱀부CTL-470]드디어 접수했다..!! 써 보니까 좋네..!!
  14. 2013.09.25 [HTML]HTML 요소들의 집합, HTML웹문서의 기본구조..!!
  15. 2013.09.25 [아이폰 천지인 키보드 설정]애플이 적용했으니까 대박..!!
  16. 2013.09.24 [포토샵]스캔 받은 여러 사진을 자동으로 잘라 정렬하기
  17. 2013.09.23 HTML의 기본구조, 요소(Element)/태그와 요소내용
  18. 2013.09.22 [포토샵]자르기 툴을 사용하여 이미지 잘라내기
  19. 2013.09.20 [저작권표시]CCL과 Copyrightⓒ.All Rights Reserved
  20. 2013.09.19 [포토샵]이미지 선택 영역을 다른 이미지 창으로 복사하기
  21. 2013.09.18 [포토샵]이동 툴로 선택한 이미지 영역 이동 및 복사하기
  22. 2013.09.17 [웹문서]웹문서 공부 시작합니다.
  23. 2013.09.16 [좋은글]다른 누군가가 너에게 정답을 강요하지만,,,
  24. 2013.09.15 [포토샵]마술봉 툴로 한번에 영역 선택하기
  25. 2013.09.14 [포토샵]올가미 툴을 이용하여 영역 선택하기
  26. 2013.09.13 [심야전용 시내버스]뚜벅이도 서러운데, 버스까지 끊겼네!
  27. 2013.09.12 [비점오염]생각하지 못했던 수질 오염의 근원
  28. 2013.09.10 [포토샵]사각 선택 툴 / 원형 선택 툴 사용하기
  29. 2013.09.09 [포토샵]이미지 확대/축소 보기와 이미지 위치 이동
  30. 2013.09.08 [지하철 취객소란]이용승객 간 불편사항 1위, 취객소란..!!
포토샵 공부2013. 10. 11. 23:53
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번에는 포토샵에서 페인트 버켓 툴을 사용하는 방법에 대해서 정리해 보겠습니다.

 

페인트 버켓 툴(Paint Bucket Tool)은...

마우스로 클릭하는 영역의 색상을 가지는 영역을 별도로 영역을 선택하는 과정없이 한번에 채색하는 툴입니다.

 

다음 이미지들을 보면서 자세하게 알아보겠습니다.

 

과정 1 > 툴박스의 Gradient Tool 아이콘의 옵션 메뉴 중에서 Paint Bucket Tool(페인트 버켓 툴)을 선택합니다.

 

 

과정 2 > 원하는 색상을 선택한 후에 채색을 원하는 영역에 마우스 포인터를 가져갑니다.

마우스 포인터가 페이트 통 모양으로 바뀐 것을 확인하고 클릭하면 채색이 됩니다.

클릭하는 포인트의 색상을 가지고 있는 영역이 한번에 채색된 것을 확인할 수 있습니다.

 

 

과정 3 > 같은 방법으로 다른 영역도 채색을 진행합니다.

 

이렇게 페인트 버켓 툴(Paint Bucket Tool)을 사용하면 쉽게 채색 작업을 할 수 있습니다.

단, 영역 경계가 확실히 구분되어 있어야 한다는 것을 주의해야 하겠습니다.

 

 

< 옵션바 설정 >

Foreground

드롭다운 메뉴를 통해서 설정에 따라 전경색(Foreground)를 채색할지 패턴(Pattern)을 채색할지 선택합니다.

 

Mode

드롭다운 메뉴를 통해서 알 수 있겠지만, 채색 색상에 대한 상세 설정리스트을 확인할 수 있습니다.

 

Opacity

투명도를 설정할 수 있습니다.

 

Tolerance

채색 작업을 할 때, 비슷한 색상을 허용하는 범위를 설정할 수 있습니다.

 

Continuous

체크하면 클릭한 영역만 채색이 이루어집니다.

체크 해제를 하면 전체 이미지에서 해당 색상을 가진 모든 영역에 채색 작업이 이루어집니다.

 

 

음.. 이렇게 하여 페인트 버켓 툴(Paint Bucket Tool) 사용방법에 대해서 간략하게 정리해 보았습니다.

크게 어려운 부분은 없으니, 직접 해 보면 쉽게 이해할 수 있습니다.

 

이번 포스팅은 이정도에서 마무리 하겠습니다.

지금까지 잡지식 스토리의 촉끼남이였으며, 앞으로도 유용한 포토샵 공부거리로 포스팅은 계속되겠습니다.

 

 

 

Posted by DaumTistory
웹문서 공부2013. 10. 10. 21:27
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번에는 웹문서에 초기 정보를 설정하는 meta http-equiv 태그에 대해서 정리해 보겠습니다.

 

일단 html 소스 작성 문서를 먼저 보겠습니다. 

3행부터 11행까지 <head>..</head>태그 안에서 meta http-equiv 태그가 사용된 것을 확인할 수 있습니다.

 

meta http-equiv 태그 소스입력 형식


<meta http-equiv="속성" content="지정한 속성에 대한 속성값">


 

 

meta http-equiv 태그에 사용되는 속성들


content-language

웹문서에 사용되는 언어를 지정합니다.

content-type

웹문서의 형식설정 및 문자 인코딩 방법을 설정합니다.

default-style

웹문서에 적용되는 여러가지 stylesheet 중에서 기본이 되는 style을 지정합니다.

refresh

웹문서를 일정 시간 후에 '새로고침' 하거나 '지정된URL'로 이동시킵니다. 


위 HTML소스 문서와 비교하면서 보시면 쉽게 이해할 수 있습니다.

 

 

자.. 다음은 작성한 웹문서를 브라우저를 통해서 열면 어떻게 나타나는지 알아보겠습니다.

처음에는 본문 내용만 나타납니다.

그러다가 meta http-equiv="refresh" 속성때문에 3초 후에 지정한 웹페이지로 이동된 것을 확인할 수 있습니다.

 

 

지금까지 웹문서의 초기 정보를 설정해 주는 meta http-equiv 태그에 대해서 가볍게 정리해 보았습니다.

이해가 잘 안되시는 분들은 직접 소스문서를 작성하여 확인해 보면, 단번에 이해되실 겁니다.

왜냐구요..?? 웹문서의 '웹'자도 모르는 저도 직접해 보니까, 단번에 이해가 되었으니까요..^^;;

아무튼 이렇게 해서 이번 정리는 이쯤에서 마치는 것으로 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였습니다. 다음에도 유용한 웹문서 공부거리로 다시 찾아 오겠습니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 10. 9. 23:11
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번에는 포토샵에서 특정 색상의 선택 영역을 선택하는 또다른 방법에 대해서 정리해 보겠습니다.

기본적으로 마술봉 툴(Magic Wand Tool)을 사용하여 해당 색상을 가지고 있는 영역을 지정할 수 있는 방법이 있습니다만, 특정 색상이 넓게 분포되어 있을 경우에는 Color Range 설정을 통해서 쉽게 영역을 지정할 수 있습니다.

 

자, 그럼 이미지를 통해서 쉽게 설명해 보겠습니다. 

 

과정 1 > 해당 이미지 파일을 불러온 상태에서 [Select]-[Color Range] 경로를 선택합니다.

 

 

과정 2 > Color Range 설정창이 열립니다.

마우스 포인트가 스포이드 모양으로 바뀌면 선택하고 싶은 색상 영역을 클릭하여 선택합니다.

흑백으로 된 미리보기 이미지에서 흰색으로 보이는 부분이 선택되는 영역입니다.

Select 설정 

Sampled Colors(기본설정)는 스포이드모양 마우스 포인트로 클릭하는 영역의 색상 영역이 지정됩니다.

드롭메뉴를 통해서 이미 설정되어 있는 색상이나 음영 영역을 선택할 수 있습니다.

 

Fuzziness 설정

유사 색상 선택 범위를 설정합니다. 값이 높을수록 선택되는 범위가 넓어집니다.

저는 200으로 설정했습니다.

 

스포이드 아이콘

선택영역을 추가(스포이드모양에 +표시)하거나 제거(스포이드모양에 -표시)할 수 있습니다.

 

Invert 설정

선택 영역이 반전되어 표시되는 설정입니다.

 

Selection Preview 설정

선택 영역을 쉽게 구분 및 선택하기 위해서 실제 이미지에 다양한 미리보기 효과를 추가시키는 설정입니다.

 

 

과정 3> OK를 클릭하여 선택된 영역을 확인합니다.

 

 

과정 4 > 선택된 영역을 수정합니다.

저는 [Filter]-[Brush Strokes]-[Ink Outlines] 필터를 적용해 보았습니다.

 

 

과정 5 > Ink Outlines  필터창을 설정합니다.

우측에 보면 다른 필터를 적용시킬 수도 있습니다.

 

 

 과정 6 > OK를 클릭하여 필터가 제대로 적용되었는지 확인하고, [Ctrl + D]를 동시에 눌러 작업을 완료합니다. 

 

 

--- 요  약 ---


Color Range 설정을 통해서 해당 이미지에서 특정 색상 영역을 쉽게 지정할 수 있습니다.


 

이렇게 요약을 하면서 이번 포토샵 공부거리 정리를 마치도록 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음에도 유용한 포토샵 공부거리로 다시 돌아오겠습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 10. 8. 01:51
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번에는 "ArtRage(아트레이지)" 이미지 작업 프로그램에 대해서 알아보겠습니다.

ArtRage(아트레이지).. 이미지 작업 프로그램...이라고 하기 보다는 그림그리기 프로그램이라고 표현하는게 더 이해하기 쉬울 것 같습니다.

포토샵 같은 프로그램은 기존의 이미지를 수정한다는 개념이지만, 아트레이지는 그림을 새롭게 그린다는 개념으로 이해하시면 쉬울 것 같습니다.

제가 아직 ArtRage를 마스터하지 못한 관계로, 가볍게 맛보기만 보여드려야 할 것 같습니다.

 

그럼 일단 다음 캡쳐이미지를 보면서 가볍게 기능 설명을 해보겠습니다.

 

ArtRage(아트레이지)프로그램을 실행합니다.

일단 기본적으로 그림을 그릴 페이지를 설정할 수 있는 기능이 있습니다.

메뉴 항목 중에서 New... 를 통해서 설정이 가능하며, 배경 페이지에 따라서 여러 가지 느낌을 표현할 수 있습니다.

 

 

 

ArtRage(아트레이지)의 기본 작업창입니다.

중앙에 그림을 그릴수 있는 영역이 있고, 주위로 여러 가지 기능을 사용할 수 있게 되어 있습니다.

여러 가지 그리기 도구를 선택할 수 있으며, 상세 설정도 할 수 있습니다.

레이어 설정 기능도 있어서 그리기 작업을 편하게 해 줍니다.

 

 

 

제공하고 있는 그리기 도구들을 가지고 선긋기 작업을 해 보았습니다.

붓, 스프레이, 크레파스, 색모래 뿌리기, 롤러, 튜브로 짜기, 파스텔, 매직 등의 그리기 도구가 있음을 알 수 있습니다.

 

 

 

스탠실 기능이 있습니다.

하단 중앙의  "Stencil" 이라는 아이콘 항목을 클릭하면 여러 가지 스텐실 목록을 확인할 수 있습니다.

저는 영문 스텐실을 선택하여 "love"라는 이미지를 만들어 보았습니다.

 

이렇게 하여 ArtRage(아트레이지)의 주요 기능들을 맛보기로 가볍게 살펴보았습니다.

윈도우7 운영체제에서 기본으로 제공해 주는 그림판만 사용하다가 이 프로그램을 사용하여 보니, 그림그리기 작업에 날개를 단 것 같은 느낌을 받을수 있었습니다.

그림그리기 프로그램의 "갑"이라고 할 수 있겠네요.

아... 그래서 그런지 무료로 구할 수 있는 프로그램은 아닌 것 같습니다. 이 점 참고하시기 바랍니다.

(저는 뱀부 테블릿 패드를 구매하니까 번들로 들어 있었습니다.^^;;)

 

 

이렇게 정리를 하면서 이번 포스팅은 마무리 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음에도 유용한 잡지식으로 다시 돌아오겠습니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 10. 6. 10:00
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번 포토샵 공부거리는 선택한 영역의 모양을 변형시키는 방법에 대해서 정리해 보겠습니다.

 

일단 캡쳐이미지를 통해서 하나씩 설명해 보겠습니다.

 

과정 1> 일단 이미지를 하나 불러오고 수정을 원하는 영역을 선택합니다.

 

 

과정 2> [Select]-[Transform Selection] 경로를 선택합니다.

 선택한 영역에 작은 사각점들이 생겨서 선택 영역을 변할 수 있게 됩니다.

 

 

과정 3 > 선택 영역 근처로 마우스 포인트를 가져가면 포인트 모양이 바뀌면서 선택 영역을 회전시킬 수 있습니다.

Ctrl 키를 누르고 마우스를 조작하면 작은 사각점들을 이동시킬 수 있습니다.

 

 

과정 4 > 선택한 영역을 둥글게 설정하기 위해서는 [Select]-[Modify]-[Smooth...]경로를 선택합니다.

 

 

과정 5 > 선택한 영역을 테두리로 사용하고자 한다면, [Select]-[Modify]-[Border...]경로를 클릭합니다.

 

 

경로 6 > 테두리 모양으로 변형된 선택 영역을 채색하여 작업 결과를 확인합니다.

채색 단추키는 [Shift + F5] 또는 [Alt + Delete] 입니다.

작업 완료 단축키는 [Ctrl + D]입니다.

 

이렇게 하여 포토샵에서 작업을 위해서 선택한 선택 영역의 모양을 변형시키고, 둥글게 하고, 테두리로 사용하게 하는 방법에 대해서 정리해 보았습니다.

실제로 따라해 보면 쉽게 이해할 수 있을거라 판단됩니다.

 

--- 요  약 ---


선택 영역 모양 변경 : [Select]-[Transform Selection] 경로

선택 영역을 둥글게 변경 : [Select]-[Modify]-[Smooth...] 경로

선택 영역을 테두리로 변경 : [Select]-[Modify]-[Border...] 경로


 

위와 같이 이번 포스팅의 요점을 정리하면서 이번 포스팅을 마무리 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음 포스팅에서는 더욱 유용한 포토샵 공부거리로 다시 찾아오겠습니다.

 

 

 

Posted by DaumTistory
웹문서 공부2013. 10. 5. 13:05
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번에는  meta name태그에 대해서 알아보겠습니다.

 

일단 meta name태그는 웹문서의 정보를 나타내는 태그로, 일반적으로 <head>...</head>태그 안에서 사용됩니다.

meta neme태그의 성값을 지정하고 웹문서의 정보를 나타내야 하는데, 이것은 cotent속성을 사용해서 나타냅니다.

name태그로 사용할 수 있는 속성값에는 아래와 같은 것들이 있습니다.

application-name : web어플리케이션 용으로 만들어진 문서의 경우, 어플리케이션 이름을 나타냅니다.

auther : 웹문서의 저자를 나타냅니다

description : 웹문서의 기본 설명을 나타냅니다.

content속성의 속성값에 입력한 글이 검색 엔진의 검색 결과로 나타납니다.

generator : 웹문서를 작성하는데 사용한 프로그램의 이름을 나타냅니다.

keywords : 웹문서와 관련된 키워드를 지정합니다.

viewport : 스마트폰으로 웹문서를 열었을 때, 보이는 폭을 설정합니다.

 

기본적인 정리는 위와 같습니다.

그럼 이제, 예제를 통해서 조금더 감을 잡아보겠습니다. 

위의 HTML소스 문서를 보면, <head>태그 안에서 meta name태그가 사용된 것을 확인할 수 있습니다.

<meta name="속성값" content="name태그 속성값의 웹문서 정보"> 형식으로 태그가 사용되었습니다.

그럼 이제, 웹브라우저로 어떻게 나타나는지 확인을 해 보겠습니다.

body태그 안의 본문 내용만 나타난 것을 알 수 있습니다.

head태그 안에서 사용된 태그이기 때문에 브라우저에서는 특별하게 표시되는 것은 없지만, 해당 웹문서의 기본 정보를 나타내는 태그이기 때문에 유용하게 사용될 수 있다고 판단됩니다.

 

--- 요  약 ---


<head>

<meta name="속성값' content="name태그 속성값의 웹문서 정보">

</head>

HTML소스를 위와 같이 작성하여 해당 웹문서의 정보를 나타낼 수 있습니다.


 

위와 같이 요약을 하면서, 이번 포스팅은 마무리 하도록 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음에는 더욱 유용한 웹문서 공부거리로 다시 돌아오겠습니다.^^;;

 

 

 

Posted by DaumTistory
포토샵 공부2013. 10. 3. 16:44
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번 포토샵 공부거리는 선택 영역을 일정 비율로 축소시키는 방법에 대해서 정리해 보겠습니다.

 

방법은 아주 쉽습니다.

메뉴바의 [Select]-[Modify]-[Contract...] 기능을 이용해서 선택한 영역을 일정 비율로 축소시킬 수 있습니다.

다음 이미지를 통해서 자세히 알아보겠습니다.

 

과정 1 > 일단 이미지 하나를 불러 오고, 수정하고 싶은 영역을 선택합니다.

수정 영역을 선택하는 여러 가지 방법들에 대해서는 이전 포스팅들을 참고하면 되겠습니다.

 

 

과정 2 > 메뉴바의 [Select]-[Modify]-[Contract...] 경로를 선택하면 "Contract Selection" 설정 창이 나타납니다.

설정 창에 입력한 수치만큼 일정 비율류 선택 영역이 축소됩니다. 

 

 

과정 3 > 축소된 선택 영역을 확인하기 위해서 원하는 색상으로 채색을 합니다.

색상을 채우는 방법에는 [Edit]-[Fill]경로 또는 [Shift + F5] 키보드 단축키, 또는 [Alt + Delete] 키보드 단축키를 통해서 채색할 수 있습니다.

채색이 완료되면 [Ctrl + D] 키보드 단축키를 눌러 선택 영역을 해제 하고, 작업을 완료합니다.

 

채색된 영역을 확인해 보면, 초기에 선택했던 영역에서 일정 비율로 축소된 영역에 채색 작업이 실행되었음을 알 수 있습니다.

 

--- 요  약 ---

선택된 영역을 일정한 비율로 축소시키기 위해서는 메뉴바의 [Select]-[Modify]-[Contract...]기능을 사용한다.

 

위와 같이 요약을 하면서 이번 포토샵 공부거리 포스팅은 마무리 짓도록 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음에도 유용한 포토샵 공부거리로 다시 돌아오겠습니다.

 

 

 

Posted by DaumTistory
웹문서 공부2013. 9. 30. 21:45
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번에는 HTML의 link 태그에 대해서 정리해 보도록 하겠습니다.

 

--- <link>태그 ---

해당 웹페이지가 다른 웹페이지와 연결되어 있을 때, 어떤 관계로 연결되는지 나타내는 태그.

<head>...</head>태그 안에서 정의해야 하며, 연결되는 웹페이지의 URL은 href 속성으로 나타내고, rel속성을 사용하여 연결되는 웹페이지가 어떤 관계로 연결되는지 정의한다.

 

일단 기본적인 정리는 위와 같습니다.

그럼 HTML소스 문서와 브라우저 실행 페이지를 통해서 어떤 내용인지 알아보겠습니다.

 

<!doctype html>
<html lang="ko">
 <head>
  <meta charset="UTF-8">
  <title>link태그 알아보기</title>
   <link rel="stylesheet" href="style.css" type="text/css">
   <link rel="prev" href="page0.html">
   <link rel="next" href="page2.html">
   <link rel="help" href="help.html">
 </head>
 <body>
    <p>link태그를 통해서 서로 연결된 웹페이지의 관계를 나타냅니다.</p>
 </body>
</html>

 

HTML소스 문서입니다. <head>...</head>태그 안에서 <link rel="..." href="...">형식으로 정의하였습니다.

처음에 말했던 것 처럼, rel 속성을 통해서 각 웹페이지와의 관계를 나타내고 있습니다.

link태그의 rel속성에 사용하는 키워드는 이미 지정되어 있는데,

alternate(대체페이지) / auther(저자) / help(도움말) / icon(아이콘) / license(저작권) / prev(이전페이지) / next(다음페이지) / prefetch(프리패치) / search(검색페이지) / stylesheet(스타일시트 파일) / tag(태그 적용페이지)

가 그것입니다.

위에서는 stylesheet 키워드로 CSS 파일을 불러 왔고, 이전페이지 / 다음페이지 / 도움말페이지를 설정하였습니다.

자.. 그럼 브라우저를 통해서 어떻게 표시되는지 확인해 보겠습니다.

 

웹페이지 제목과 본문내용만 표시되는 것을 알 수 있습니다.

당연합니다. link태그는 head태그 안에서 정의되기 때문입니다.

브라우저를 통해서 실행되는 웹페이지는 body태그 내용만 표시만 됩니다.

그래도 태그를 확인하려면, '소스보기' 기능을 통해서 어떻게 정의되었는지 확인할 수 있습니다.

그리고 '오페라' 브라우저를 통해서 link태그가 사용된 것을 눈으로 확인할 수 있는 기능이 있다고 하는데, 사실인지는 모르겠습니다.

(어쨌든 저는 '익스플로어'로 실행시켰기 때문에 안보인다는 거~~)

 

음.. 여기 저기 뒤져보니까, link태그나 rel속성에 대해서 제대로 정리를 하려면 내용이 끝이 없을 것 같다는 생각을 해서 일단 기본적인 내용만 정리하였습니다.

어차피 웹문서 공부를 하려면 필요한 내용들이니, 나중에 하나씩 하나씩 정리할 수 있도록 하겠습니다.

그러면서 일단 이번 포스팅은 이정도에서 마치는 것으로 하겠습니다.^^;;

 

지금까지 잡지식스토리의 촉끼남이였으며, 다음에는 더 유익한 웹문서 공부거리를 가지고 올 수 있도록 하겠습니다.

 

 

 

Posted by DaumTistory
웹문서 공부2013. 9. 29. 17:40
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번 '웹문서 공부' 주제는 <base>태그에 대한 것입니다.

 

<base>태그는 해당 웹페이지의 기준이 되는 URL을 절대경로 지정하는 태그입니다.

<base>태그는 <head>...</head>태그 안에서 지정하는데, 페이지 당 1개의 URL만 설정할 수 있습니다.

 

이 <base>태그를 이해하기 위해서는 절대경로와 상대경로가 먼저 무엇인지를 알고 있어야 합니다.

일단 절대경로와 상대경로의 개념부터 정리해 보겠습니다. '네이버 지식백과'에서 참조하였습니다.

 

절대경로....

인터넷 자원 주소와 경로를 완전하게 표시한 인터넷 주소.

예를 들어 " http://www.welcome365. tistory.com /category /진짜잡지식" 과 같이 서비스, 호스트, 파일 경로를 나타내는 완전한 URL주소를 말한다.(네이버 지식백과)

 

 

상대 경로...

파일 시스템에서 현재 작업 디렉터리로 부터 찾아갈 파일에 이르는 모든 디렉터리 목록으로 표시된 경로.

예를 들어 '진짜잡지식'카테고리에서 '웹문서 공부'카테고리 경로를 상대 경로로 나타내면, " ../웹문서 공부 " 라고 표현할 수 있다.(네이버 지식백과)

다시 말해, 기준이 되는 경로에서 대상이 되는 경로를 표시하는 방법입니다.

 

이해를 돕기 위해서 일단 HTML문서를 작성하고, 브라우저로 확인을 해 보겠습니다.

 

<!doctype html>
<html lang="ko">
 <head>
  <meta charset="UTF-8">
  <title>base태그 알아보기</title>
   <base href="http://welcome365.tistory.com" target="_blank">
 </head>
 <body>
    <p>잡지식스토리에는 <a href="/category/웹문서%20공부" target="_blank">웹문서 공부</a> 카테고리가 있습니다.</p>
 </body>
</html>

 

 

 

위에서 HTML 소스문서를 보면 알 수 있듯이, <base>태그를 사용해서 제 블로그의 절대경로URL을 지정하였고, 본문 내용에서 '웹문서 공부'카테고리 링크 주소는 상대경로URL로 지정해 준 것을 확인할 수 있습니다.

그리고 이 HTML 소스문서를 웹브라우저로 실행해 보면, 본문 내용에서 '웹문서 공부' 단어가 링크 설정되어 있는 것을 알 수 있고, 이 링크를 통해서 '웹문서 공부'카테고리 페이지가 열리는 것을 확인할 수 있습니다.

 

쉽게 정리해서 말하자면, <base>태그로 해당 웹페이지에서 기준이 되는 URL주소를 절대경로로 한번만 지정해 주면, 그 웹페이지에서 연결되는 다른 웹페이지 경로는 상대경로URL로 간단하게 지정해도 된다는 말입니다.

이것은 해당 웹페이지에서 연결되는 링크페이지를 하나씩하나씩 일일이 절대경로를 지정해야 하는 번거러움을 없앨 수 있다는 장점이 있습니다.

 

--- 요 약 ---

<head>태그 안에서 <base>태그를 사용하여 기준 절대경로URL을 설정해 주면, 해당 웹페이지와 연결되는 링크 주소는 상대경로로 간소화하여 설정할 수 있다.

 

보기에는 복잡해 보이지만, 직접 해보면 무슨 말인지 쉽게 이해할 수 있을거라 생각됩니다.

이렇게 하여 이번 <base>태그 정리는 마무리 짓도록 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 28. 22:32
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

촉끼남이 이번에 와콤 뱀부 CTL-470 태블릿패드를 하나 장만했습니다.

CTL-470을 컴퓨터에 연결하고 'BAMBOO DOCK'이라는 설정 프로그램을 설치했습니다.

사용 설명서도 없이 기능 설정을 하려고 하니, 무슨 말인지 하나도 모르겠습니다.

(해당프로그램의 [?]매뉴얼은 CTL-470 하위모델이 아닌 CTH-470 상위모델을 기준으로 설명하고 있습니다.)

이것 저것 설정을 하면서 한 1시간정도를 해매다 보니, 각 설정이 어떤 기능을 하는지 알게 되었습니다.

동시에 '다른 사용자들도 이 부분에서 시간 낭비를 하겠구나..' 라는 생각을 하면서, 

와콤 뱀부 CTL-470 사용자들을 위한 BAMBOO DOCK 사용 매뉴얼 포스팅 작업을 들어갑니다.

 

자.. 그럼.. 시작해 보겠습니다.

 

바탕화면이나 시작메뉴의  Bamboo Dock 아이콘을 클릭하면 실행되는 Bamboo Dock 설정프로그램이 샐행됩니다.

'열기'를 클릭하여 숨겨져 있는 Bamboo Dock의 기능을 보이게 합니다.

 

 

 

(아래 이미지)왼쪽의 아이콘들은 Bamboo Dock을 통해서 바로가기 실행이 가능한 아이콘들입니다.

'설정마크(톱니모양 아이콘)'을 클릭하면 설정창이 나오는데, '바로가기 추가'를 통해서 관련 응용프로그램을 바로 실행할 수 있게 설정이 가능합니다.

또한, '+'아이콘을 클릭하면 Bamboo에서 제공하는 관련 프로그램들을 다운로드/설치 할 수 있습니다.

 

 

'페이지별 아이콘'을 조절하여 바로가기 아이콘이 보여지는 개수를 설정할 수 있습니다.

 

 

 

'내 태블릿' 설정을 클릭하면 'Bamboo 사용자 설정' 창이 실행됩니다.

'타블렛' 탭에서는 타블렛 방향을 설정할 수 있습니다.

제가 오른손잡이인 관계로 처음에는 '오른손사용자용'으로 사용하였으나, 나중에는 '왼손사용자용'으로 설정을 바꿔 사용하고 있습니다.

이유는, CTH-470 상위모델 태블릿 패드에는 '익스프레스 키'라고 하는 패드 버튼을 사용할 수 있게 되어 있으나, CTL-470 하위모델에는 이 버튼 자체가 없습니다.

그런데, 사용해 보신 분들은 아시겠지만, 오른손으로 펜을 사용하다 보면 패드의 우측에 패드 여백이 살짝 부족한 것 같다라는 느낌이 드실겁니다.(펜을 오른손으로 움켜쥐고 사용하기 때문에 패드 우측 끝에서 사용이 부자연스러움.)

그래서 저는 아예 설정을 '왼손사용자용'으로 설정하여 오른쪽 패드 영역을 넉넉하게 이용하고 있습니다.

흠.. 말로 설명하기 힘든 부분이네요.. CTL-470 하위모델 '오른손자용자용' 설정을 사용하는 사용자분들은 '왼손사용자용' 설정으로 사용해보세요. 무슨 말인지 한번에 이해되실거라 생각됩니다.

 

 

 

다음은 '펜'탭에 대한 설명입니다.

개인적으로 이번 포스팅의 핵심은 지금부터라고 생각됩니다. 저도 여기서 해매었기 때문입니다.

펜 버튼 : 태블릿 펜에 있는 펜버튼을 설정하는 옵션입니다. 

태블릿펜에는 버튼이 위/아래 2개가 있으며, 옵션을 클릭하면 드롭다운 메뉴가 보입니다.

자세한 설명은 잠시 후에 아래쪽에서 이미지를 보면서 설명하겠습니다.

 

펜촉의 감촉 : 태블릿패드가 펜을 감지하는 정도를 설정하는 옵션입니다.

글을 쓸 때 사용하는 연필에 비유하여 설명을 하자면, '하드'쪽은 '샤프'로 글씨를 쓰는 느낌이 들고, '부드럽게'쪽은 '4B 연필'로 글씨를 쓰는 느낌이 듭니다.

 

죄표검출 모드 : 태블릿 패드가 인식하는 모니터 화면의 크기와 태블릿펜 사용방법을 설정하는 옵션입니다.

펜모드에서는 태블릿 패드가 모니터 화면 전체를 인식하는지 화면 일부를 인식하는지에 대한 설정을 합니다.

마우스 모드에서는 모니터 화면크기과 상관없이 마우스를 사용하는 것처럼 설정하는 옵션입니다.

마우스 모드는 일반적인 마우스랑 사용법이 똑같은 펜모양 마우스라고 생각하면 이해하기 쉽습니다.

(마우스를 높이 들고 이동시키면 모니터 화면에서는 마우스 포인트가 이동되지 않는 기능)

자세한 설명은 잠시 후에 아래쪽에서 이미지를 보면서 설명하겠습니다.

 

소리 : 태블릿펜과 패드가 접촉할 때 소리가 나는지 안 나는지 설정하는 옵션입니다.

   개인적으로 소리가 깔끔하니 듣기 좋습니다.

 

더블클릭 거리 : 클릭하였을 때 범위를 설정하는 옵션입니다.

 

 

 

다음은 '펜 버튼'에 대한 설명입니다.

드롭다운 메뉴를 클릭하면 드롭다운 메뉴가 나타나는데, 하나씩 살펴보겠습니다.

클릭 - 버튼을 누르면 클릭 동작이 실행됩니다.

   추가 드롭다운 메뉴에서 [오른쪽 버튼 / 중간 버튼 / 더블 클릭 / 클릭 잠금 ]등의 설정을 지정할 수 있습니다.

키스트로크 - 미리 저장해 놓은 문자, 숫자, 기능키, 변경키 등을 버튼 하나로 사용하는 설정입니다.

클릭하면 설정 창이 실행됩니다.

Shift, Alt, Ctrl 키.. - 기능명 그대로 특수키를 설정하는 옵션입니다.

   설정 후에 해당 버튼을 클릭하면 해당 특수키를 누른 것과 같은 효과를 얻을 수 있습니다.

패닝/스크롤 - 일반 마우스의 '휠'기능을 수행하는 설정입니다.

  해당 버튼을 누르고, 펜을 위 또는 아래로 패드에 긁으면 기능이 작동합니다.

애플리케이션 변환 - 해당 버튼을 누르면 미리 설정한 프로그램이 실행됩니다.

열기/실행 - 해당 버튼을 누르면 미리 설정한 파일이 열리거나 실행됩니다.

일정한 압력감지 - 해당 버튼을 누르고 그림을 그리면 마우스로 그린 것 같이 선 두께가 일정하게 그려집니다.

펜↔마우스 모드 변환 - 펜 모드와 마우스 모드가 변환됩니다.

  마우스 모드로 변환되면, 펜 모드에서 설정한 화면 인식 설정이 마우스 모드로 변환됩니다.

지우개 - 해당 버튼을 누르고 펜으로 패드를 긁으면 지우개 효과가 실행됩니다.

타블렛PC - 태블릿패드를 이용할 수 있는 프로그램(드롭메뉴에서 지정해야 함)이 실행됩니다.

사용불가 - 해당 버튼 사용 기능을 설정하지 않는 기능입니다.

표준설정 - 매뉴얼을 통해서 알아보니, 표준설정으로 전환되는 기능인데, 제 컴터에서는 작동을 안하네요.

 

 

 

다음은 좌표검출 모드의 '펜 모드'에 대한 설명입니다.

'매핑'을 클릭하면 상세설정 창이 나타납니다.

설정창 오른쪽에 모니터와 패드 매칭 이미지을 통해서 무슨내용인지 알 수 있습니다.

표시에리어 - 패드가 인식하는 화면 영역을 설정합니다.

[ 전화면 / 모니터 / 일부영역 ] 으로 설정을 변경할 수 있으며, '일부영역'의 '설정'을 통해서 모니터화면 인식 영역을 설정할 수 있습니다.

타블렛 조작영역 - 사용하는 태블릿패드 영역 크기를 설정합니다.

  태블릿 패드의 사용영역을 설정하는 옵션인데, 굳이 필요한 기능 같지는 않습니다.

 

 

 

다음은 좌표검출 모드의 '마우스 모드'에 대한 설명입니다.

'상세 설정...'기능을 클릭하면, 태블릿펜의 마우스 포인트 속도를 설정할 수 있습니다.

마우스 가속 - 펜이나 마우스를 빠르게 이동시키면 천천이 이동시킬 때 보다 더 많이 이동되는 것을 볼 수 있습니다.

 그 정도를 설정하는 옵션입니다. 옵션 설정 값에 따라 실제 사용시에 체감이 크게 달라집니다.

마우스 속도 - 말 그대로 마우스 포인트 이동 속도를 설정하는 기능입니다. 

 

 

아~~ CTL-470 와콤 뱀부 태블릿패드의 Bamboo Dock프로그램 설정에 대한 핵심만 이야기하고 싶었는데, 주저리주저리 떠들다 보니까 내용이 지저분해 진 것 같습니다.

그래도 해당 포스팅을 한번 보고 설정을 변경한다면, 설정 시간을 단축시킬 수 있을거라 생각합니다.^^;;

 

 

이것으로 이번 포스팅은 마무리 짓도록 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음에는 더욱 유용한 잡지식으로 컴백하겠습니다.

 

 

 

Posted by DaumTistory
웹문서 공부2013. 9. 27. 03:07
   

 

반갑습니다. 잡지식스토리의 촉기남입니다.

이번 포스팅에서는 HTML문서의 <title>태그에 대해서 정리해 보도록 하겠습니다.

 

<title>태그는 웹페이지의 제목을 지정해 주는 태그입니다.

 

이 웹페이지의 제목은 다음의 영역에 노출됩니다.

(1) 웹브라우저의 제목표시줄이나 탭표시줄에 웹문서의 제목으로 표시됩니다.

(2) 즐겨찾기 목록에 추가될 때, 표시되는 제목입니다.

(3) 포털사이트에서 검색했을 때, 검색 결과 목록에 보여지는 제목입니다.

 

그럼 이제 예시를 들어 HTML문서를 작성해 보고, 웹브라우저로 확인을 해 보겠습니다.

< HTML 문서 작성 >

<!doctype html>
<html lang="ko">
 <head>
  <meta charset="UTF-8">
  <title>Title 태그 알아보기</title>
 </head>
 <body>
  <p>title태그는 웹페이지의 제목을 나타냅니다.</p>
 </body>
</html>

 

 

아래 이미지를 보면 각 행에 대한 내용을 쉽게 이해할 수 있습니다.

 

 

< 웹브라우저 실행 및 확인 > 

웹브라우저로 실행해 보면, title태그의 내용이 웹페이지의 '탭 표시줄'에 표시되는 것을 확인할 수 있습니다.

 

 

이것으로 우리는 <title>태그의 기능을 알아보고, 그 개념을 자세하게 정리해 보았습니다.

위 HTML 작성 문서에 나타난 태그들을 모두 정리하는 것이 맞지만, 한번에 정리하기에는 부담스러운 부분이 있어서 하나씩 하나씩..!! 정리하는 것으로 하겠습니다.

 

아.. 누누이 알려드립니다만, 저는 웹문서의 '웹'자도 모르는 놈입니다.

해당 카테고리의 포스팅은 저혼자 공부해서 정리하는 것이므로, 잘못된 부분이 있으면 댓글로 알려주시기 바랍니다.

 

지금까지 잡지식스토리의 촉끼남이였으며, 다음 포스팅에서 더 유익한 공부거리로 다시 찾아오겠습니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 26. 02:38
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

 

이번에는 선택한 영역의 경계를 부드럽게 처리하는 방법에 대해서 정리해 보겠습니다.

 

이미지의 일부 영역을 선택하여 수정 작업을 하다보면 선택 영역의 경계가 부드럽게 처리되지 않아서 엉뚱한 결과물이 나올 때가 있습니다.

이럴 때는 메뉴바의 [Select]-[Feather] 기능을 이용하여 경계선 부분을 부드럽게 처리해주면 됩니다.

 

 

다음 캡쳐 이미지를 보면서 자세하게 설명해 보겠습니다.

 

과정 1 > 영역선택 툴을 선택하고 이미지 수정 영역을 드래그하여 선택합니다.

 

 

과정 2 > 메뉴바의 [Select]-[Feather] 경로를 클릭합니다.

 'Feather Selction' 설정 창을 나타나면, 수치를 입력하여 부드럽게 처리하는 정도를 설정합니다.

확실한 결과물을 보기 위해서 120 pixels으로 설정했습니다.

설정 값이 높을수록 부드럽게 처리하는 영역이 넓어집니다.

 

 

과정 3 > 'Feather' 효과가 어떻게 나타나는지 확인해 보겠습니다.

 메뉴바의 [Image]-[Adjustments]-[Desaturate] 경로를 선택합니다.

Desaturate기능은 채도를 없애서 이미지를 흑백으로 바꿔주는 기능을 합니다.

 

 

과정 4 > 택된 부분의 색상이 흑백으로 바뀌었는지 확인합니다.

그리고 선택 영역의 경계부분이 부드럽게 흑백으로 수정되었는지 확인합니다.

 

 

과정 5 > 이미지가 제대로 수정되었는지 확인하고, 키보드의 [컨트롤 + D키] 를 동시에 눌러서 작업을 완료합니다.

 

 

< 요점 정리 >

1. 경계 부분을 부드럽게 처리하는 방법은 메뉴바의 [Select]-[Feather] 기능을 사용한다.

2. 이미지를 흑백으로 수정하는 방법은 메뉴바의 [Image]-[Adjustments]-[Desaturate] 기능을 사용한다.

 

 

자.. 지금까지 이미지의 선택 영역 경계를 부드럽게 처리하는 방법에 대해서 알아보았습니다.

처음에는 '저런건 어떻게 하나??' 하고 감탄만 했었는데, 막상 하는 방법을 알고 해보니까, 정말 쉽네요..^^;;

'역시 포토샵이야~'라는 생각을 다시금 하게 만듭니다.

 

아무튼, 지금까지 잡지식스토리의 촉끼남이였으며, 다음 시간에는 더 유용한 포토샵 공부거리로 컴백하겠습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 26. 01:17
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

 

드디어.. 드디어.. 촉끼남이 꿈에도 그리던 와콤 뱀부 태블릿 패드를 드디어 접수했습니다.

요즘 포토샵 공부를 하다 보니, '태블릿 패드로 그림이나 글씨를 쓰면 좋겠다'라는 생각을 하게 되어서 알아봤더니,

와콤이라고 하는 회사에 뱀부라고 하는 태블릿패드가 명성이 좋다는 정보를 얻었습니다.

마음은 깔끔하게 CTH-470으로 하고 싶었지만, 주머니 사정이 안좋은 관계로 CTL-470으로 장만하기로 했습니다.

그것도 주머니 사정이 안좋은 관계로 '네이버 중고**'카페를 통해서 저렴하게 구하기로 했습니다.

그래서 처음에 마음을 먹었을 때, 한번에 구입하지 못하고 계속 알아만 보다가, 중고**에 좋은 매물이 올라온 것을 보고 이제서야 구할 수 있었습니다.

판매자가 취미로 그림 그릴려고 샀다가 바쁜 직장생활에 치여서 못 그리게 되니까 싸게 판다고 했습니다.

상태도 좋았고, 저렴하게 구할수 있어서 나름대로 기다리기를 잘했다라고 생각했습니다.

아무튼 이렇게 해서 어렵사리 이 녀석을 제 손에 넣게 되었습니다.

 

자.. 그럼 이제 와콤 뱀부 CTL-470 태블릿 패드의 개봉기에 대해서 이야기해 보겠습니다.

음.. 중고로 사기는 했어도 박스채로 넘겨 받았기 때문에, 또, 나름대로 어렵게 구한 제품이기 때문에 개봉기 아닌 개봉기를 적어 보겠다고 마음 먹었습니다.

 

박스를 열고 제일 먼저 인증샷을 찍었습니다. 보호싸개 안에 있었지만, 사진 한번 찍어보겠다고 벗기고 찍었습니다.

오른쪽은 연결하고 나서 찍은 사진 입니다.

뱀부 태블릿 패드 뒷면 색상이 형광색인데, 책상에 반사되어서 뭔가 있어 보입니다.

하지만 실제로는 아무것도 없다는 거~~ ^^;;

 

 

제품 박스에 들어있는 설치CD를 통해서 'BAMBOO DOCK'라는 태블릿 패드 설정 프로그램을 설치했습니다.  

 

 

설정 프로그램 실행화면입니다. UI가 깔끔하니 좋습니다. 

 

 

설정을 마치고, 포토샵으로 글씨를 써 보았습니다.

이미지에 나와 있는대로, 마우스로 글씨를 쓰는 것보다는 편하기는 하지만, 모니터를 보고 글씨를 써야 하기 때문에 어색하기도 하고, 이쁘게 써지지도 않습니다.

뭐.. 손에 익숙해 지면 금방 이쁘게 쓸 수 있다고 생각하기 때문에 일단은 만족스러운 것으로 정리하겠습니다.

 

이제 이 뱀부 녀석으로 포토샵 공부를 더 열심히 해야 하겠습니다.

마우스가 편하기는 하겠지만, 뱀부가 필요한 작업도 있기 때문에 적절히 사용한다면 작업 능률이 오를 것 같습니다.

 

아무튼, 이렇게 해서 '와콤 뱀부 CTL-470 태블릿 패드'에 대한 개봉기를 간략하게 포스팅 해 보았습니다.

다음 포스팅에서는 태블릿패드 설정 프로그램인 'BAMBOO DOCK'의 설정 방법에 대해서 알아보도록 하겠습니다.

그럼 이정도에서 마치겠습니다. 지금까지 잡지식스토리의 촉끼남이였습니다. 그럼, 휘리릭~~

 

 

 

Posted by DaumTistory
웹문서 공부2013. 9. 25. 09:00
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

 

전에도 말씀드렸다시피, '웹문서 공부'는 대중없이 그냥 손에 잡히는대로 포스팅 하기로 했습니다.

이번에는 저번 포스팅에서 설명했던 요소들이 모여서 하나의 HTML웹문서를 구성하는 기본 구조에 대해서 정리해 보겠습니다.

 

여기 저기 알아보니까, HTML문서는 요소들이 합쳐져서 이루어져 있는데, 이 요소들 사이에도 상위요소가 있고 하위요소가 있고 해서,

결과적으로 계층이 있고, 구조가 있다고 합니다.

그래서 그 구조를 '트리구조'라 하고 상속이 어쩌고 저쩌고 하면서 중요하다고 하는데, 솔직한 이야기로 촉끼남한테는 무슨 말인지도 잘 모르겠고, 간단하게 개념 정리를 하는 쪽으로 진행하겠습니다.

 

일단 기본적으로 EditPlus라는 프로그램을 이용해서 정리를 해 보겠습니다.

이것도 솔직히 어떤 프로그램인지는 잘 모르겠으나, 인터넷에 검색을 하다보니, 이 프로그램으로 수정/편집 작업을 하길래 촉끼남도 써 보는 것으로 했습니다. 일단 행마다 번호가 있어서 쓰기 편하다고 판단됩니다.

프로그램은 '네이버 자료실'에서 30일 쉐어웨어로 등록되어 있으니, 알아서 설치하시면 되겠습니다.

 

그럼 이제 개념 정리 들어갑니다.

 

1, 15 -- <html>태그 / HTML 웹문서임을 정의하는 요소입니다. 시작태그와 종료태그로 나타냅니다.

2, 4   -- <head>태그 / 웹문서의 기본 정보를 정의하는 요소입니다. 시작태그와 종료태그로 나타냅니다.

3      -- <title>태그 / <head>태그의 하위요소입니다. <title>태그 이 외에 다른 하위요소들도 있습니다.

웹문서의 제목을 정의하는 요소로, 실제 웹페이지 제목영역에 요소내용이 표시됩니다.

아래 이미지를 보면 웹페이지 제목이'잡지식스토리'로 표시되는 것을 확인 할 수 있습니다.

5, 14 -- <body>태그 / 웹페이지의 본문을 나타내는 요소입니다. 실제로 웹페이지에 표시되는 부분입니다.

6,7,8,9,10,11,12,13 - <h1>태그. <ul>태그, <li>태그, <p>태그 / <body>태그의 하위요소들입니다.

여러 가지 하위요소가 있으며, 일단 이번 포스팅은 기본구조만 정리하는 단계이므로, 앞으로 하나씩 정리하는 쪽으로 진행하겠습니다.

 

 

위와 같이 HTML문서를 작성하고, 웹브러우져로 보기를 하면 일반적으로 보이는 웹페이지가 보입니다.

웹브라우져는 윈도우 운영체제에서 기본 설치되는 '인터넷 익스플로어'를 포함하여 '오페라''사파리''파이어폭스''크롬'등 다양한 브라우져가 있으므로, 적당한 프로그램을 선택하면 되겠습니다.

 

아무튼, 위와 작이 작성한 HTML문서를 웹브라우져를 통해서 보면 다음과 같이 표시됩니다.

 

이정도로 해서, HTML웹문서의 기본구조에 대해서 알아보는 '웹문서 공부 정리'를 마치도록 하겠습니다.

앞서 말했다시피, 이번 포스팅은 웹문서의 기본구조를 알아보고 개념만 잡는 단계이기 때문에, 자세한 내용은 차차 정리하는 것으로 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음 포스팅에서는 더욱 유익한 웹문서 공부거리로 돌아도록 하겠습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 25. 07:00
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

 

촉끼남은 아이폰4S를 사용하고 있습니다.

생각해 보니,아이폰4S가 출시된지도 언 2년이 다 되어 가고 있습니다. 국내 출시가 2011년 11월이였으니까요.

그때는 스티브 잡스의 생애 마지막 유작이니 어쩌니 하면서 4S가 대박이였던 시절이였습니다.

아무튼 시간이 흘러 이제 아이폰5S와 5C가 출시되었다는 이야기가 들리니, 시간이 참으로 빠른 것 같습니다.

 

아..!! 참참참..!! 이게 중요한게 아니군요.^^;;

하고 싶은 이야기는 지금부터 입니다.

촉끼남은 현재 아이폰을 쓰고 있고, 이번에 IOS7으로 업그레이드를 하였습니다.

IOS7의 새로운 UI와 기능들에 놀라움을 금치 못하면서 여러 기능들을 보다가 놀라운 것을 하나 보게 됩니다.

바로, 키보드를 '천지인'키패드로 설정할 수 있다는 것이였습니다.

'애플'이라는 회사는 '혁신'의 대명사로 불리기도 하지만, 어떤 때에는 '고집'의 대명사로 표현되기도 합니다.

(음.. 조금 좋게 이야기하면 '소신'이라고 표현하고 싶군요.^^;;)

그런 애플이 이번 업그레이드에서 천지인 키패드를 적용한 것입니다.

 

이것은 개인적으로 완전 대박감이라고 생각합니다..!!

삼성의 '천지인'키패드나 엘지의 '나랏글'키패드, 스카이의 '스카이'키패드(지금은 '베가'키패드)에 익숙해져 있던 국내 핸드폰 사용자들에게 아이폰의 쿼티 키패드는 정말 불편한 키패드였습니다.

하지만, 아이폰은 쿼티 키패드 밖에 없어서, 혁신을 몸소 느끼려면 다소 불편하더라도 그냥 써야 했습니다.

그런데, 이번 'IOS7'에서 천지인 키패드를 지원한다니.... 그것도 스마트폰 시장의 라이벌인 삼성의 천지인 키패드를....

 

캬~~ 드디어 애플이 혁신적인 기술 개발에서 더 나아가 진정 사용자들을 위한 편의성을 생각하기 시작했다는 사실에 '역시 애플이야~~'라는 생각을 하게 됩니다.

전 세계의 아이폰 유저를 기준으로 봤을 때, 국내 아이폰 유저수는 그렇게 많지 않을 것입니다.

그런데도 국내 유저들을 위한 편의성 기능을 제공한다는 것은 기가 막힌 것입니다.

아무튼 간에 IOS7에서는 천지인 키패드를 사용할 수 있게 되어서 기분이 좋습니다.

 

서론이 길었습니다. 그럼 이제 천지인 키패드를 설정하는 방법에 대해서 알아보겠습니다.

 

위 이미지를 보고 순서대로 터치하여 소프트웨어 키보드 레이아웃을 '10키'로 설정하면, 천지인 키패드로 글을 쓸 수 있습니다.

 

 

설정 변경 후에 문자를 작성하는 캡쳐 이미지입니다.

 

 

아이폰에서 천지인 키패드를 사용할 수 있다는 사실에 '오오오~ 좋아~ 좋아~' 라고는 했지만, 솔직히 이제는 쿼티 키보드에 적응이 되어 버려서 촉끼남은 맛만 살짝 보고 다시 쿼티를 쓰고 있습니다.

아직 천지인 키패드가 편한 분들은 설정을 바꾸어 사용하시면 되겠습니다.

 

솔직히 이번 포스팅은 'IOS7업그레이드 후, 천지인 키패드 설정 방법'이 핵심이 되어야 하는데, 주저리주저리 이야기 하다보니, 애플이 혁신이다, 고집이다, 소신이다, 이런 것들에 치중하게 된 것 같습니다.

촉끼남이 아이폰을 사용하고는 있지만, 아이폰이나 애플사나 스티브 잡스와는 아무런 관련이 없다는 것을 알려드리며, 이번 포스팅은 이 정도에서 마무리 짓도록 하겠습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음 포스팅에서는 더욱 유익한 잡지식으로 돌아올 것을 전해 드립니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 24. 00:38
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

 

이번에는 스캔 받은 여러 사진들을 자동으로 잘라서 각각의 이미지 창으로 정렬하기에 대해서 정리해 보겠습니다.

일반적으로 여러 장의 사진들을 한번에 스캔할 때에 사진을 정렬 한다고는 하지만, 쉽지 않습니다.

그러면, 포토샵으로 각각의 이미지를 자르기 툴로 일일히 작업을 해야 합니다만,

여기..!! 포토샵에 이런 작업을 한번에 해주는 기가 막힌 기능이 있습니다..!!

 

자..!! 그럼 정리 들어갑니다..!!

 

과정 1 > 일단 여러 장의 사진을 한번에 스캔 받은 이미지를 불러옵니다.

메뉴바의 [File]-[Automate]-[Crop and Straighten Potos] 경로를 선택합니다.

 

 

과정 2 > 스캔한 사진들이 자동으로 잘라져 각각의 이미지 창으로 나타나는 것을 확인합니다.(진짜~~ 대박..!!)

각각의 이미지 창에는 '~copy'라는 이미지 제목을 가지게 됩니다.

 

 

과정 3 > 겹쳐져 있는 이미지 창들을 작업하기 좋게 정렬합니다.

메뉴바의 [Window]-[Arrange]-[Tile Horizontally]경로를 선택합니다.

[Arrange]의 선택 항목에 따라 정렬하는 방법이 달라지므로, 편한 수정방법을 선택합니다.

 

 

과정 4 > 수정 작업을 하기 좋게 정렬된 이미지 창들을 확인합니다. 

 

 

어떻습니까..?? 진짜.. 대박이지 않습니까..??

와~~ 저는 이런 기가 막힌 기능들을 보고 깜짝깜짝 놀라고 있습니다.

 

아무튼, 이번에는 스캔 받은 여러 장의 사진들을 자동으로 잘라서 각각의 이미창으로 보기좋게 정렬하는 방법에 대해서 정리해 보았습니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음에도 유용한 포토샵 공부거리로 다시 돌아오도록 하겠습니다.

 

 

 

Posted by DaumTistory
웹문서 공부2013. 9. 23. 03:02
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

 

저번 포스팅에서 '웹문서 공부'카테고리에 대해서 촉끼남이 고민을 많이 했습니다.

웹문서에 대해서 공부는 하고 싶은데, 어디서부터 어떻게 시작을 해야할지 몰라서 허우적댔습니다.

서점에 가서 책도 보고, 인터넷에서 검색도 해 보고 했습니다.

그러다, '이거 시작도 못해보고 접겠네' 라는 생각과 함께 일단 시작한다라는 생각을 합니다.

그래서 무작정 계획부터 새웁니다. 계획은 이렇습니다. 

일단 관련 서적 및 온라인 게시글들을 바탕으로 공부를 시작할 것이며, 체계적으로 정리하면 좋겠지만, 촉끼남은 웹문서의 '웹'자도 모르는 상황이므로, 그냥 닥치는대로 막 하는 걸로~~ ^^;;

 

자.. 그럼 이제부터 '웹문서 공부' 정리를 시작하겠습니다..!!

일단 HTML의 기본구조부터 시작하겠습니다.

이것이 요소라는 HTML문서의 기본구조입니다.

영어로,'Element' 라고 하며, 자동차에 비유하자면, 부품이라고 할 수 있겠네요.

이 요소는 태그와 요소 내용으로 이루어져 있습니다.

그리고 태그는 시작태그과 종료태그가 있습니다.

물론 시작태그만 있는 태그들도 있지만, 일단 위에서는 시작태그와 종료태그가 있습니다.

또, 시작태그는 기본적으로 <요소명 (공백) 속성>으로 이루어져 있으며, 속성은 [속성명="속성값"]으로 구성됩니다.

 

주저리 주저리 말로만 풀어 놓으니, 이해가 잘 안되는 것 같습니다. 하나씩 풀어 보겠습니다.

시작태그 : <a href=http://www.welcome365.tistory.com>

- 요소명 : <a

- 속성    : href=http://www.welcome365.tistory.com

- 속성명 : href

- 속성값 : http://www.welcome365.tistory.com>

요소내용 : 잡지식스토리

종료태그 : </a>

 

위에 하나씩 하나씩 나열해서 정리하기는 했지만, 개인적인 생각으로 용어는 그렇게 중요하지 않다고 생각됩니다.

용어가 중요한게 아니라, 그것들이 무엇을 의미하는지가 중요하다고 생각됩니다.

 

그럼 정리를 다시 한번 해 보겠습니다. 촉끼남스타일로 정리해 보겠습니다.

요소명 : 해당 요소의 성질이나 역할을 나타내는 명령어라고 정리하고 싶습니다.

위에서는 '<a'를 요소명이라고 설명했습니다. 편하게 <a>태그라고 말하기도 하는데, <a>태그는 다른 웹페이지를 링크시키는 역할을 합니다. 그 밖에 <header...>, <meta...>, <body...>, <title...>등의 많은 요소명이 있습니다.

태그    : 해당 요소를 표현하기 위해서 '태그'라는 표시 형태를 이용하며, '<'와 '>'기호로 하나의 태그를 이룹니다. 

쉽게 말해서 해당 요소가 어떤 내용인지 알려주기 위한 표시 방법을 태그라고 하는 것입니다. 위에서 말했다시피 요소명'a'를 <a>태그라고 말하기도 하는 것이 이런 이유 때문이라고 할 수 있습니다.

태그는 보통 시작태그와 종료태그로 이루어져 있으며, 위에서는 <a href=....>이 시작태그이고 이 요소의 마지막을 나타내는 </a>가 종료 태그인 것입니다.

일반적으로 시작태그로 해당요소를 시작하면 종료태그로 해당요소를 마무리 지어 주지만, 시작태그만 있는 태그도 있습니다. (뭐.. 더 정확히 이야기 하자면, 시작태그만을 표시하는 요소라고 표현하는게 더 맞는 표현입니다.)

속성명 : 해당 요소의 새부내용을 나타내는 명령어라고 정리하고 싶습니다.

위에서 'href'를 속성명이라고 설명했습니다. 'href'는 링크가 되는 웹페이지를 지정해 주는 역할을 합니다.

'href' 속성명 이외에 웹페이지가 열리는 방식을 지정해 주는 'target' 속성명도 있으며, 각 태그마다 적용되는 속성에는 비슷한 것들도 있지만, 특별하게 해당 태그에만 적용되는 속성이 따로 있는 것들도 있습니다.

요소내용 : 정말 쉽게 이야기 하자면, 웹페이지에 나타는 글을 의미합니다.

   위에서 보면 '잡지식스토리'에 해당하며, 실제로 웹페이지에 '잡지식스토리'라는 글이 나타나는 것입니다.

 

 

쉽게 설명해 보겠다고 했는데, 그래도 조금 부족한 것 같습니다.

음.. 그럼 개념을 정리하는 스타일 말고, 표현되는 스타일로 정말 간단하게 정리 한번 해 보겠습니다.

<시작 태그>...</종료태그>

각 요소는 태그와 요소내용으로 이루어져 있는데, <시작태그>로 요소를 나타내고, </종료태그>로 요소를 마무리 짓습니다. 시작태그와 종료태그 사이에 웹문서에 실제로 표시되는 요소내용으로 구성되어 있습니다.'...'이 되겠습니다.

 

아~ 쉽게 풀어 볼려고 해도, 그게 참 어렵다고 생각됩니다.

실제로는 개념만 확실히 잡고 있으면 아무것도 아닌 것들인데도 말이죠.. ^^;;

아무튼, 글로 풀어 쓴 HTML의 기본구조 정리는 여기까지 입니다. 다시 한번 말하지만, 개념이 중요합니다..!!^^;;

지금까지 잡지식스토리의 촉끼남이였으며, 다음 포스팅에서 더욱 유용한 정보로 다시 돌아오겠습니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 22. 15:19
   

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

 

이번에는 포토샵 자르기 툴에 대해서 간단하게 정리해 보고자 합니다.

 

과정 1 > 일단, 툴박스에서 자르기툴을 선택하고, 이미지 창에서 자르기를 원하는 영역을 드래그하여 선택합니다.

키보드의 엔터를 누르거나, 드래그 영역을 더블 클릭하면 선택영역만 자르기 기능이 실행됩니다.

취소는 메뉴바의 [Edit]-[Undo] 경로를 클릭하거나, [Ctrl + Z]키를 동시에 누르면 이전으로 돌아갑니다.

 

 

과정 2 > 삐뚤어진 이미지는 옵션바의 [Perspective]를 체크하면 기존의 사각 선택 영역을 수정할 수 있습니다.

삐뚤어진 이미지에만 해당되는 사항이며, 보는 것 보다 직접해 보면 쉽게 이해할 수 있을거라 판단됩니다.

 

 

과정 3 > 과정이라고 할 것도 없지만, 수정이 완료되면 이미지를 확인하여 작업이 잘 되었는지 확인합니다.

 

 

< 자르기툴의 옵션바 설정 - 자르기툴을 선택했을 때 옵션바, 선택 영역 드래그 전 >

(1) 자르기 크기 및 해상도를 설정합니다.

(2) Front Image : 작업중인 이미지의 크기 및 해상도 정보를 알려줍니다.

(3) Clear : 모든 값이 초기화됩니다.

 

 

< 자르기툴의 옵션바 설정 - 자르기 영역을 드래그하여 선택하였을 때 >

(1) Cropped Area : 자르기 선택 영역 바깥쪽의 잘려질 영역 처리 방법을 설정합니다.

   Delete는 바깥쪽 영역이 삭제되고, Hide는 삭제되지 않고 감춰집니다.

   감춰진 영역을 보려면, 메뉴바의 [Edit]-[Reveal All]경로를 클릭합니다.

(2)(3) Shild : 자르기 선택 영역과 바깥쪽 색상 구분을 설정하는 영역입니다.

 체크하고 색상을 선택하면 자르기 선택 영역 바깥쪽 색상이 해당 색상으로 표시되며, (3)Opacity로 투명도를 조절합니다.

(4) Perspective : 과정 2에서 설명한 것 처럼 삐뚤어진 이미지 모양을 변경할 수 있습니다. 

 

 

전체 이미지 중에서 원하는 부분만 자르거나 2개 이상의 이미지를 합성하고자 할 때, 또는 이미지 용량을 줄이고자 할 때에 꼭 필요한 툴이 바로 이 자르기툴입니다.

아주 기본적인 내용이라 생각됩니다만, 그 기능이나 사용법을 확실히 인지하여 나중에 유용하게 사용할 수 있어야 하겠습니다.

특히, 과정 2에서 설명한 Perspective 기능은 저같은 초보들은 잘 알지 못하는 내용이라고 생각됩니다.

실제로 유용하게 사용할지 어떨지 모르겠지만, 어쨌든 알고는 있어야 할 듯 싶습니다.

 

 

아무튼, 이번 포토샵 공부거리 정리는 여기까지 입니다.

지금까지 잡지식스토리의 촉끼남이였으며, 다음 포스팅에는 더욱더 유용한 포토샵 공부거리로 돌아오도록 하겠습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 20. 20:05
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

오늘 하루에만 해도 온라인 상으로 수많은 컨텐츠가 생성되고 있습니다.

지금 제가 이렇게 포스팅을 하고 있는 것도 컨텐츠를 생성하는 것이라고 할 수 있습니다.

(뭐..특별히 별 볼일 없는 것들이기는 하지만요..^^;;)

아무튼, 이렇게 만들어지는 수많은 컨텐츠의 제작자들은 모두 해당 창작물에 대해서 저작권을 가지게 됩니다.

 

그래서 이번에는 저작권표시와 관련된 이야기를 해보려고 합니다.

일단 저작권이 무엇인지부터 가볍게 알아보겠습니다.

 

저작권이라...

영어로는 Copyright라고 합니다.

인간의 사상 또는 감정을 표현한 창작물인 저작물에 대한 배타적, 독점적 권리를 이야기합니다.

그래서 온라인상에서도 새롭게 만들어지는 모든 창작물이나 컨텐츠는 제작자가 저작권을 가지게 되며, 일반적으로 해당 컨텐츠에는 저작권을 표시하게 됩니다.

그리고 저작권 표시의 방법에는 Copyrightⓒ All Rights Reserved 와 CCL(Creative commons license, 크리에이티브 커먼즈 라이선스)가 있습니다.

 

일단 제가 저작권에 대해서 알고 있는 것은 이 정도였습니다.

그런데 계속해서 블로그를 운영하면서 포스팅을 지속적으로 하게 되면서, 저작권표시에 대한 궁금증이 생겼습니다.

그래서 촉끼남이 저작권에 대해서 알아보게 된 것입니다.그러다 흥미로운 것들을 몇가지 새롭게 알게 되었습니다.

 

  첫번째, 새롭게 창작된 컨텐츠에 저작권 표시를 꼭 하지 않아도 저작권 보호를 받을 수 있다는 것입니다.

" 저작권법 제10조 제2항

  저작권은 저작물을 창작한 때부터 발생하며 어떠한 절차나 형식의 이행을 필요로 하지 아니한다."

라고 명시하고 있습니다.

그래서 컨텐츠는 창작이 될 때부터 저작권이 발생하며, 따로 표기를 하지 않아도 저작권법에 의해 동등하게 보호를 받을 수 있다고 합니다.

 

  두번째, [Copyrightⓒ All Rights Reserved] 와 [CCL]은 개념 접근 자체부터 다르다는 것입니다.

일반적으로 생각했을 때, Copyrightⓒ All Rights Reserved와 CCL는 모두 컨텐츠 제작자의 저작권을 보호하기 위한 표시라고 알고 있을 것입니다. 물론, 촉끼남도 지금까지 그렇게 알고 있었습니다.

음... 어떻게 보면 두 저작권표시 방법이 제작자의 저작권을 보호한다는 개념은 동일하다고 생각됩니다.

하지만, 조금 깊게 들어가 보면,

Copyrightⓒ All Rights Reserved 라는 저자권 표시 방법은 '해당 컨텐츠의 저작권은 제작자에게 있으니, 사용을 할 때에는 저작권자에게 허락을 받고 사용해라' 라는 의미를 가지고 있습니다.

반면, CCL 저작권 표시 방법은 '해당 컨텐츠의 내용은 저작권자의 허락이 없이도 임의로 사용이 가능하지만, 저작권자가 규정한 허용 범위 안에서만 사용이 가능하다' 라는 의미를 가지고 있습니다.

쉽게 이야기 하자면, Copyrightⓒ All Rights Reserved 저작권 표시 방법은 무단 사용 자체를 금지하는 것이고, CCL 저작권 표시 방법은 저작권자의 허락이 없어도 허용범위 안에서는 마음대로 사용해도 된다는 것입니다.

 

일단 기본적으로 모든 컨텐츠의 저작권은 제작자가 가지고 있음은 불변의 법칙입니다.

하지만, 컨텐츠의 내용을 타인이 사용할 때에 일일히 저작권자의 허락을 받을 수 없는 상황이 많기 때문에 그 과정을 간략하게 줄인 것이 CCL 저작권 표시 방법이라는 것입니다.

 

다음으로 CCL 저작권 표시 내용에 대해서 조금더 자세히 알아보겠습니다.

물론 제 블로그에도 CCL 저작권 표시를 하고 있습니만, 무슨 내용인지 자세히 모르는 상황에서 그때 그때 대충 기입하고 있는 상황입니다.

그래서 이번에 확실히 정리해 보고자 검색을 해 보았습니다.

cckorea.org 라는 사이트를 방문해 보니, 좋은 자료를 구할 수 있었습니다.(저작자 표시때문에 알려드립니다.^^;;)

일단 기본적으로 저작권표시 방법은 4가지가 있었습니다.

저작자 표시, 비영리, 변경금지, 동일조건변경허락이 그것으로, 아래 이미지를 보면 쉽게 이해할 수 있습니다.

 

 

솔직히 '동일조건변경허락'에 대해서 이해가 잘 안되었던 상황이였는데, 2차적 저작물에는 원 저작물과 동일한 라이선스를 적용해야 한다는 문구를 보고 확실히 개념이 정리되었습니다. 특히, '변경금지'표시는 저작물의 변경도 불가능하지만, '동일조건변경허락'은 저작물의 변경이 가능하다는 점이 차이가 있다는 것을 알 수 있습니다.

 

 

음..이번 포스팅은 여기까지 입니다. 지금까지 잡지식스토리의 촉끼남이였으며,

다음에 또 새로운 잡지식으로 다시 돌아오겠습니다..^^;;

 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 19. 03:00
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

이번에는 두 개 이상의 이미지 하나의 이미지 창으로 옮기는 방법에 대해서 정리해 보겠습니다.

다시 말해서, 어떤 이미지 창의 선택한 이미지 영역을 다른 이미지 창으로 옮기는 방법입니다.

말로 하려니까 설명하기 힘드네요. 아래 캡쳐 이미지를 보면서 정리해 보겠습니다. 

 

 

과정 1 > 여러 개의 이미지 창에서 이동을 하고자 하는 이미지 영역을 선택합니다.

아래 캡쳐이미지에서는 손거울 뒷면 이미지를 다른 곳으로 옮기고자 합니다.

전체 선택을 하고 [Ctrl + Shift + I]를 눌러 반전선택 효과를 얻을 수 있습니다.

 

 

과정 2 > 툴박스에서 이동툴을 선택하고 선택된 이미지 영역을 옮기고자 하는 이미지 창으로 드래그합니다

아래 캡쳐이미지에서 볼 수 있다시피 선택된 영역이 드래그 하는 방향으로 잘라내기 + 옮기기가 되는 것을 확인할 수 있습니다.

 

 

과정 3 > 옵션바의 [Show Transform Controls]를 체크하여 이동시킨 이미지의 크기 및 회전, 위치 등을

조절합니다.

해당 옵션이 체크되면 선택한 이미지 영역에 점선 박스가 생기는 것을 확인할 수 있습니다.

 

 

과정 4 > 선택한 이미지의 크기 및 방향, 위치 설정이 마무리되면 옵션바의 [Commit Transform]옵션을

클릭하여 설정 변경을 완료시킵니다.

아래 캡쳐이미지를 보면 알 수 있듯이, 프로그램에서는 체크표시[√]로 나타나 있습니다.

 

 

과정 5 > 수정 작업이 완료된 이미지를 확인합니다.

 

 

이상으로 하여 선택한 이미지 영역을 다른 이미지 창으로 복사하는 방법에 대해서 정리해 보았습니다.

더 정확히 이야기 하자면, 잘라내기 + 붙이기 기능이라고 할 수 있겠네요.

처음에는 잘 몰라서 설마 드래그 작업 하나만으로 이미지를 옮길수 있을까 라고 생각을 했는데,

진짜로 드래그만 하면 이미지가 옮겨지는 것을 보고, 와~~ 대박..!! 이랬습니다.

역시 이미지 수정 작업은 포토샵으로.. 라는 말을 할 수 밖에 없이 만듭니다..(제 생각입니다..하하^^;;)

 

아무튼 이렇게 해서, 이번 포스팅은 간단하게 마치는 것으로 하겠습니다.

지금까지 잡지식 스토리의 촉끼남이였습니다. 다음 포스팅에서 조금더 유용한 정보로 만나뵙겠습니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 18. 10:00
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

이번에는 이동 툴을 이용하여 영역을 선택한 이미지를 원하는 곳으로 이동시키는 방법에 대해서 정리해 보겠습니다.

또, 영역을 선택한 이미지를 바로 복사하여 원하는 곳으로 이동시키는 방법에 대해서도 알아보겠습니다.

 

이동 툴...

말 그대로 선택된 이미지 영역을 원하는 곳으로 이동시킬 수 있는 작업툴입니다.

 

그럼 캡쳐 이미지를 통해서 조금더 자세히 알아보도록 하겠습니다.

 

 

과정 1 > 해당 이미지 창에서 이동시키고 싶은 이미지 영역을 선택합니다.

아래 이미지에서는 녹색 사탕을 다른 곳을 옮기고자 사탕을 원형 영역 선택 툴을 사용하여 선택합니다.

참고로, [Alt]키를 사용하면 원형의 중심부터 선택 영역 크기를 선택할 수 있습니다.

     [Shift]키를 사용하면 정원형으로 영역을 선택할 수 있습니다.

 

 

과정 2 > 이동 툴을 선택하고 선택된 이미지 영역을 드래그 하여 원하는 곳으로 이동시킵니다.

참고로, 지정된 배경색 설정에 따라 최초의 이미지 영역은 색상이 달라진다는 사실.. 알고 계시기 바랍니다.

아래 이미지에서는 배경색이 흰색이므로, 선택된 이미지 영역을 옮기고 난 자리가 흰색으로 표시됩니다.

 

 

과정 3 > [Alt]키 + 마우스 드래그 작업을 통해서 선택된 이미지 영역을 복사하여 한번에 이동시킬 수도 있습니다.

최초의 이미지 선택 영역이 하나더 추가된다고 생각하면 되겠습니다.

 

 

툴박스의 이동툴 역시, 포토샵으로 하는 이미지 수정 작업의 기본이라고 생각됩니다.

이럴 때에 기본기에 충실하여 나중에 복잡한 수정 작업을 할 때, 막힘이 없어야 하겠습니다.

 

촉끼남 개인적인 사정 관계상 이번 포스팅은 간단하게 마치도록 하겠습니다.

지금까지 잡지식 스토리의 촉끼남이였으며, 다음 포스팅에서는 선택한 이미지 영역을 복사하여 다른 이미지 창으로 옮기는 방법에 대해서 정리해 보도록 하겠습니다.

 

 

 

Posted by DaumTistory
웹문서 공부2013. 9. 17. 09:30
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

촉끼남이 네이버 블로그를 하면서는 잘 몰랐는데, 티스토리 블로그를 하면서 웹문서에 대해서 궁금증이 조금씩 커지고 있습니다.

네이버 블로그는 이미 짜여진 형식안에서 레이아웃을 짜고, 포스팅을 하면서 블로그 운영을 합니다.

하지만, 티스토리 블로그는 이미 짜여진 스킨이나 레이아웃이 있기는 하지만, 블로그 운영자의 취향에 따라 수정이 가능하기 때문입니다.

솔직히 이야기해서 지금 사용하고 있는 스킨은 기존에 티스토리에서 제공하고 있는 것입니다. 그런데 제 취향이 아니라서 색깔만 조금 바꿨습니다.

아무것도 아닌 것이었지만, 웹문서의 '웹'자도 모르는 촉끼남에게는 한달이라는 시간이 걸린 작업이었고, 그 결과물 또한 촉끼남은 상당히 만족스럽다고 자화자찬하고 있습니다.

이렇게 된 상황에서 촉끼남은 웹문서에 대해서 공부를 안할수가 없겠다는 생각을 하게 됩니다.

그래서 이 '웹문서 공부' 카테고리를 통해서 웹문서에 대한 공부를 하고 정리를 하려고 합니다.

 

일단, 검색을 해보니, 여러 가지 관련 키워드들을 찾을 수 있었습니다.

 

HTML5 / CSS / JAVA SCRIPT 등등

 

이 외에도 관련된 키워드가 많이 있었지만, 중요하다고 생각되는 키워드만 나열하였습니다.

그리고 검색 결과를 간단히 나열하자면 다음과 같습니다.

 

HTML5

- 웹 문서를 제작하는 데 쓰이는 기본 프로그래밍 언어 HTML(Hypertext markup language)의 최신규격

- 엑티브X(AcitveX)를 설치하지 않아도 동일한 기능을 구현할 수 있고,

  특히 플래시나 실버라이트, 자바FX 없이도 웹브라우저에서 화려한 그래픽 효과를 낼 수 있다.

- HTML의 차기 주요 제안 버전으로 월드 와이드 웹의 핵심 마크업 언어.

  WHATWG(Web Hypertext Application Technology Working Group)에서 웹 애플리케이션 1.0이라는 이름으로

  세부 명세 작업을 시작하였으며, 현재에도 개발중이다.

 

CSS

캐스케이딩 스타일시트(Cascading Style Sheet)의 약자로 마크업 언어가 실제 표시되는 방법을 기술하는 언어로, HTML과 XHTML에 주로 쓰이며, XML에서도 사용할 수 있다. W3C의 표준이며, 레이아웃과 스타일을 정의할 때 자유도가 높다.

외부에 별도의 CSS파일을 만들어서 다로 관리 할 수 있어서 보다 유지 및 보수를 하기에 유용하다.

 

JAVASCRIPT

기본적인 웹 프로그래밍 언어이다. 일반 프로그래밍 언어는 컴파일이 필요하지만, 스크립트 언어는 컴파일이 필요없고, 주로 웹페이지와 함께 쓰인다.

HTML 페이지에서 기능을 추가하는데 사용되며, 정적인 페이지가 동적인 페이지로 변하게 한다.

 

 

조금 알아보니, 답이 안 나온다는 생각을 먼저 하게 됩니다.

왜냐구요..?? 저는 원래 전공이 컴퓨터 계열이 아니기 때문입니다.

생소한 단어들도 많을 뿐더러, 분위기 상으로 웹문서를 작성하고 수정하려면 위의 세가지 언어를 알아야 된다는 해석이 나오기 때문입니다.

그렇습니다. 알아보니, 실제로도 HTML을 기반으로 시각적인 부분은 CSS가 보조 역할을 하고, 동작하는 부분은 JAVASCRIPT가 보조역할을 한다고 합니다.

흠.. 그렇다고 포기할 촉끼남은 아니지만, 일단 답은 안나옵니다. ㅎㅎ

 

답답한 마음을 속으로 삭히며, 이번 포스팅은 일단 이쯤에서 마무리 하는 것으로 하겠습니다.

내일은 서점에 가서 조금더 알아봐야 하겠습니다.

지금까지 잡지식 스토리의 촉끼남이였으며, 다음 포스팅은 일단 서점을 다녀와서 작전을 짜고 계속 하겠습니다.

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 16. 01:01
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

오늘 군것질을 하다가 나쵸스타일의 모 과자 봉지에서 '훅~' 오는 멘트가 있어서 포스팅 한번 해보고자 합니다.

 

일단 캡쳐이미지부터 보시죠~~ 

다른 누군가가 너에게 정답을 강요하지만,

정답? 그런건 없어. 답은 언제나 너에게 있어.

가끔씩은 있는 그대로 즐겨.

조금 삐뚤어져도 돼.

삐둘어지더라도 언젠가 세상과 교차할꺼야.

뛰는 너의 가슴이 움직이는대로 따라가봐.

지금 너의 가슴은 뛰고 있니?

 

 

솔직한 이야기로, 이 글귀와 이 과자와는 아무런 상관이 없어 보입니다.

글귀의 내용은 불투명한 미래에 대한 불안함이나 두려움을 꿋꿋하게 이겨내고 자신있게 헤쳐 나가라고 힘을 주는 것이고, 과자는 단순한 나쵸 스타일의 짭조름한 과자이기 때문입니다.

그래서 촉끼남은 일단 한번 놀라고 시작합니다.

' 이런 글귀가 어떻게 과자 봉지에 있을수가 있지..?? 아무런 상관도 없잖아..?? '라는 생각이 들었기 때문입니다.

여러분들은 그렇지 않으세요..??

이런 이야기는 일반적으로 책에서나 찾아 볼 수 있는 글귀인데 이런 과자 봉지에 있으니 말이죠..

그래서 놀랐습니다.

 

다음으로 하고 싶은 이야기는 해당 글귀에 대한 것입니다.

언젠가 세상과 교차한다는 글귀나 가슴이 움직이는대로 따라가보라는 글귀는 분명 가슴에 와 닿는다고 생각됩니다.

전에 세상의 모든 일들이 '1+1=2' 와 같이 항상 정해진 답이 있다고 생각했던 시절이 있었습니다.

특히, 학창시절에는 더욱 그랬던 것 같습니다. 학교에서는 주입식으로 지식을 머릿속에 넣고, 학교 생활 이외에서는 세상을 배울 곳이 없었기 때문이였습니다.

학창 시절에 촉끼남에게 확실하게 정해진 답이란 것은 공부를 열심히 해야지 훌륭한 사람이 된다는 것이 가장 주도적이었습니다. (그때는 몰랐지만, 지금 생각해보면 정말 밑도 끝도 없는 헛소리라고 생각합니다. 하하^^)

그렇게 시간이 흘러 이제 사회 생활도 해 보고, 지난 날을 다시 곱씹어 보고 반성도 하게 되니까, 이제서야 이 세상에는 정답이 없는 것들도 정말 많다는 것을 알게 되었습니다.

뉴스 기사나 다큐멘터리를 보면 주위에서 안된다고 하는 것들을 부단한 노력으로 이루어 낸 사람들 이야기를 접하게 되는 경우가 있습니다.

그 사람들은 주위에서 안된다고 하는데도 왜 그것을 얻기 위해 노력했을까요..??

저는 그것이 될 것이라는 믿음이 확실했기 때문이라고 생각합니다.

이 글귀에서 말하는 조금은 삐뚤어져도 된다던지 너의 가슴이 움직이는대로 하라든지 하는 이야기가 이런 것들과 통하는 이야기라고 생각됩니다.

그것을 이루어낸 사람은 분명 가슴이 움직이는 대로 했을 것입니다. 그리고 그것은 틀림없이 조금은 삐뚤어진 것이었을거구요.

 

 

하하~~ 그러고 보니, 과자 봉지의 좋은 글귀 하나에 뭐라고 주저리주저리 떠들었네요.

뭐.. 촉끼남은 좋은 글귀라고 생각되서 님들과 함께 나누고 싶었던 것 뿐이고, 부수적으로 촉끼남 생각을 조금 보탠 것 정도 뿐이니, 그런갑다 해주시면 감사하겠습니다.ㅎㅎ

 

이번 포스팅은 이정도에서 마무리 하는 것으로 하겠습니다.

지금까지 잡지식 스토리의 촉끼남이였으며, 다음 포스팅에서 또 '훅~'가는 이야기로 다시 만나뵙도록 하겠습니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 15. 16:18
   

 

반갑습니다.

 

잡지식 스토리의 촉끼남입니다.

 

이번에는 마술봉을 이용하여 비슷한 색상을 가지고 있는 영역을 한번에 선택하는 방법에 대해서 정리해 보겠습니다.

그리고 선택 영역 반전 효과에 대해서도 알아보겠습니다.

 

마술봉 툴..

위에서 언급한 그대로 마우스로 클릭한 포인트와 색상이 비슷한 영역이 한번에 지정되는 툴입니다. 단순히 클릭 한번으로 넓은 영역을 선택할 수 있기 때문에 영역을 선택하는 툴 중에서는 가장 많이 사용되고 있다고 생각됩니다.

하지만, 복잡하고 많은 색상이 분포된 이미지에서는 선택 영역 지정에 어려움이 있을수도 있다고 하네요.

 

그럼 캡쳐이미지를 보면서 조금더 자세하게 정리해 보겠습니다.

 

 

과정 1 > 툴박스의 마술봉 툴을 선택하고 원하는 색상이 있는 영역을 클릭하여 해당 색상의 영역을 선택합니다.

 

 

 

과정 2 > 위 이미지를 보면 알 수 있듯이 이미지의 오른쪽 위 구석 영역이 모두 선택되지 않았습니다.

[Shift]키를 누르고 해당 영역을 클릭하여 선택 영역을 추가시킵니다.

그리고 선택된 영역에서 수정 작업을 진행하면 되겠습니다.

 

 

 

과정 3 > 다음은 이미 선택한 영역이 아닌 영역을 선택하는 방법에 대해서 정리해 보겠습니다.

쉽게 이야기 하자면, 위 이미지에서 '새'영역을 선택하는 방법입니다. 선택되지 않은 영역을 반전 선택하는 방법입니다.

[Select]-[Inverse]경로를 클릭하면, 반전 효과를 얻을 수 있습니다.

아래 이미지에서는 '새'영역이 지정됨을 알 수 있습니다.

 

 

 

< 마술봉의 옵션 바 정리 > 

(1) Tolerance (입력값 범위 : 0 ~ 255)

비슷한 색상 허용 범위를 설정하는 옵션입니다.

높게 설정할수록 선택되는 색상이 많아집니다.

(2) Contiguous

한국말로 '인접한, 근접한'이라는 뜻을 가지고 있습니다.

체크하고 영역을 선택하면, 인접해 있는 비슷한 색상 영역만 선택이 됩니다.

체크를 해제하고 영역을 선택하면, 클릭한 포인트의 색상을 가진 영역이 이미지에서 모두 선택됩니다.

(3) Sample All Layers

여러 개의 레이어로 구성된 이미지에서 모든 레이어에 기능을 적용할지에 대한 옵션입니다.

체크하면 모든 레이어가 대상이 되고, 체크 해제하면 해당 레이어만 대상이 됩니다.

 

 

이번에는 마술봉 툴을 이용하여 비슷한 색상으로 표시된 영역을 한번에 선택하는 방법에 대해서 정리해 보았습니다.

특히, 반전 효과는 아주 유용하게 사용할 수 있는 기능이기 때문에 꼭 알아두면 좋을 것 같습니다.

위 이미지에서 볼 수 있다시피 이미지의 '새'영역을 선택하려면 올가미 툴로 직접 작업을 해야 하지만, 배경 영역을 선택한 다음에 반전효과를 주면 아주 쉽게 영역을 선택할 수 있기 때문입니다.

 

아무튼, 이 정도로 해서 이번 포스팅은 마무리 짓는 것으로 하겠습니다.

지금까지 잡지식 스토리의 촉끼남이였습니다. 다음 포스팅에서 더욱더 '훅~'가는 내용으로 찾아 오도록 하겠습니다.

 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 14. 23:56
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

이번에는 툴박스의 올가미 툴에 대해서 정리해 보도록 하겠습니다.

 

올가미툴....

Lasso Tool 이라고 표시되는 것을 포토샵 프로그램을 통해서 알 수 있습니다.

영어사전을 찾아보니, '올가미 밧줄'이라는 뜻을 가지고 있습니다. 올가미 툴 모양도 밧줄 모양을 하고 있습니다.

올가미 툴의 기능은 해당 이미지에서 불규칙한 모양의 특정 영역을 선택하여 쉽게 수정할 수 있도록 도와주는 툴입니다.

 

그럼 캡쳐이미지를 보면서 자세히 정리해 보도록 하겠습니다. 

 

<일반 올가미 툴>

 

툴박스에서 올가미 툴을 선택하고 해당 이미지에서 원하는 영역을 드래그하여 선택합니다.

영역 선택 마무리는 드래그 시작점 근처에서 마우스 버튼을 놓으면 자동으로 드래그한 영역이 점선으로 바뀌변서 영역이 선택됩니다.

 

 

이미 선택된 영역에 다른 영역을 추가 시킬 때에는 [Shift]키를 눌러서 영역을 추가시키고, 선택된 영역에서 특정 영역을 제거 할 때에는 [Alt]키를 눌러서 영역을 제거할 수 있습니다.

 

 

<다각형 올가미 툴>

올가미 툴의 옵션 메뉴에서 'Polygonal Lasso Tool (다각형 올가미 툴)'을 선택하여 다각형 영역을 선택합니다.

마우스를 한번 클릭할 때마다 전환점이 생성되며, 영역 선택 마무리는 시작점에서 마우스를 한번 더 클릭하면 선택 영역이 점선으로 바뀌면서 영역 선택이 완료됩니다.

 

 

[←(Back Space)]키나 [Delete]키를 누르면 바로 전에 선택한 모서리 포인트가 삭제되면서 이전 단계로 돌아갑니다.

영역 선택 중에 [Alt]키를 누르면 다각형 올가미 툴이 기본 올가미 툴로 전환되는 기능을 이용하여 직선 영역 선택과 드래그 영역 선택을 적절하게 이용하여 작업 시간을 단축시킬 수 있습니다.

 

 

 <자석 올가미 툴>

올가미 툴의 옵션메뉴에서 'Magnetic Lasso Tool(자석 올가미 툴)' 을 선택하여 색상이 확실하게 구분되어 있는 경계선을 기준으로 영역 선택이 자동으로 이루어지는 툴입니다.

영역 선택 마무리는 시작점을 한번 더 클릭하면 선택한 영역이 점선으로 바뀌면서 영역 선택이 완료됩니다.

영역이 선택 될 때, 사각형의 점이 자동으로 표시되는데, 이를 'Anchor Point(앵커 포인트)'라고 하며, 옵션바의 'Frequency' 값이 높을수록 자동으로  표시되는 앵커점의 수가 많아집니다.

이미지가 굴곡이 많거나 복잡할 경우에는 Frequency 값을 높게 지정하는 것이 좋습니다.

[←(Back Space)]키를 누르면, 이전 앵커포인트가 제거되면서 이전 상태로 돌아갑니다.

 

 

<자석 올가미툴 옵션바 정리>

(1) Width (입력 가능 값 : 1~40)

입력한 값이 클수록 이미지 경계를 감지하는 범위가 넓어집니다. 쉽게 이야기 하자면, 일반적인 이미지 수정 프로그램에서 붓으로 그림을 그릴 때, 붓의 굵기를 의미합니다. 경계의 틈이 좁을 경우에는 Width 값을 낮게 사용하는 것이 좋습니다.

(2) Edge Contrast (입력 가능 값 : 백분율 수치)

수치가 높으면 경계 주변을 넓게 선택해 부드럽게 선택되며, 낮을 때에는 정교하게 선택하여 거칠게 선택됩니다.

색상 구분가 확실할 때에는 값을 높게, 구분이 확실하지 않을 때에는 낮게 설정하는 것이 좋습니다.

(3) Frequency

앵커포인트의 수를 조절하는 옵션으로, 앵커 포인트가 많을수록 정교한 이미지 선택이 가능합니다.

(4) Pen Pressure

타블렛이나 펜 마우스 사용자를 위한 옵션으로 펜의 압력을 감지하는 옵셥입니다.

 

 

올가미 툴의 종류에는 3가지가 있지만, 가장 많이 사용되는 툴은 자석 올가미 툴이라고 생각됩니다.

일반 올가미 툴은 마우스로 드래그를 해야 하기 때문에 사용이 불편하고, 다각형 올가미 툴은 직선 영역만 선택되기 때문에 이러한 불편함을 해결해 주기에는 자석 올가미 툴이 해답인 것 같습니다.

물론, 실제로 해당 툴들은 기능상으로 구분이 되지만, 촉끼남이 생각하기에는 그렇다는 말입니다.(오해는 마시길..^^;;)

아무튼 자석 올가미 툴 기능은 완전하게 마스터 하는 걸로~~

 

여기까지 해서 포토샵을 이용하여 이미지의 불특정한 영역을 쉽게 선택할 수 있도록 도와주는 올가미 툴에 대해서 정리해 보았습니다.

지금까지 잡지식 스토리의 촉끼남이였으며, 다음 포스팅도 열심히 정리해서 훅~ 오는 포스팅을 할 수  있도록 하겠습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 13. 12:14
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

오늘도 촉끼남은 출근길 지하철 안에서 벽보를 하나 보게 됩니다.

" 시민 말씀대로 이제 새벽에도 버스가 쭉 다닙니다."

 

해당 광고물의 내용은 '심야전용 시내버스'에 대한 것이었습니다.

그리고 그 옆으로 심야 시내버스가 필요한 이유에 대한 인상적인 멘트 하나가 눈에 딱 들어옵니다.

 

" 뚜벅이도 서러운데, 버스까지 끊겼네..!! "

 

캬~` 기가 막힙니다. 뚜벅이도 서러운데, 버스가지 끊기면 안되니까, 심야버스가 탄생하게 된 것입니다.

심야전용 시내버스가 필요한 진정 공감되는 내용입니다.

 

그러면서 촉끼남은 심야전용 시내버스가 뭔지 찾아봅니다.

'서울특별시 교통정보센터'라는 사이트를 방문하여 보니, 자세한 정보를 얻을 수 있었습니다.

 

심야버스는 심야 유동인구가 많은 홍대, 종로, 강남역 등을 경유하는 버스 노선이며, 버스 및 전철이 끊기는 시간부터 첫차까지의 새벽 대중교통 공백을 채우기 위해서 운행하는 시내버스입니다.

운행시간은 00시~05시까지이고, 배차간격은 35~40분라고 합니다.

 

 

N26 운행노선 (요금 1,850원)

강서차고지 ~ 홍대 ~ 신촌 ~ 종로 ~ 청량리 ~ 망우로 ~ 중랑차고지(2권역 ~ 6권역) 6대

 

 

N37 운행노선 (요금 1,850원)

 진관차고지 ~ 서대문 ~ 종로 ~ 강남역 ~ 대치동 ~ 송파차고지(3권역 ~ 7권역)

 

 

촉끼남은 개인적으로 N26번 노선이 마음에 듭니다.

저희 집 근처를 지나가기 때문입니다. 뭐, 정확하게 집 앞을 지나가는 것은 아니지만, 근처까지 버스를 타고 와서 택시를 타면 저렴하게 집에 돌아올 수 있기 때문입니다. 하하.. 그냥 저는 그렇다는 이야기입니다.

 

아무튼 이렇게 해서 지금까지 심야전용 시내버스에 대해서 알아 보았으며, 잡지식 스토리의 촉끼남은 다음 포스팅에서 더욱더 유용한 잡지식 정보로 돌아오겠습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 12. 23:58
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

이번에는 비점오염에 대해서 알아보도록 하겠습니다.

 

비점오염이라..

조금은 생소한 단어라고 생각합니다.

저도 모르는 단어였는데, 오늘 아침 출근길에 지하철 TV광고 채널에서 비점오염이 어쩌고 저쩌고 한다고 해서 알게 된 단어입니다.

 

일단 촉끼남은 네이버에서 이 '비점오염'을 어떻게 정의하고 있는지 알아 보았습니다.

네이버 지식백과에서는 농촌진흥청에서 정의하는 '비점오염'에 대해서 간략하게 설명하고 있었습니다.

 

오염원이 일정한 장소가 있는 것이 아니라 유동적인 오염원에 의하여 오염되는 것, 자동차, 농경지 시비 등.

 

이렇게 정의하고 있습니다.

 

하지만, 촉끼남이 출근길 지하철에서 본 영상은 길가의 배수로에 유입된 쓰레기나 오물들이 빗물에 의해서 하천으로 유입되는 장면이였는데, 이렇게 정의하는 것만으로는 잘 이해가 안 되었습니다.

 

그래서 촉끼남은 네이버 지식백과엣 연관 단어를 찾아봅니다. '비점오염원'이라는 단어가 있습니다.

해양과학 용어사전에서 정의하는 '비점오염원'의 정의는 다음과 같았습니다.

 

수질 오염원은 오염원의 성격에 따라 점오염원과 비점오염원으로 분류되는데, 점오염원은 오염 배출을 명확히 확인할 수 있는 점으로부터 하수구나 도랑 등의 형태로 배출되는 오염원이고, 비점 오염원은 넓은 지역으로부터 빗물 등에 의해 씻겨지면서 배출되어 정확히 어디가 배출원이지 알기 어려운 산재된 오염원으로부터 배출되는 것을 의미한다. 비점오염원의 예로서는 농경지, 방목장, 도시의 가로, 산림지, 교외지역 등이 있으며, 주로 토양 표면 또는 지표면 가까이 있는 잠재적 오염물질이 빗물에 씻겨 유출수에 포함되어 수계에 유입된다.

 

 

음.. 어느 정도 이해가 갑니다.

하지만, 촉끼남은 어딘가 살짝 부족하다는 생각이 들어 검색을 조금더 해 봅니다.

그러다, 한국환경공단 홈페이지까지 찾아 들어가게 됩니다.

한국 환경공단에서는 비점오염을 다음과 같이 정의하고 있습니다.

 

'비점오염'이란 평상시 지표면에 축척되어 있는 고농도의 오염물질이 주로 강우시 하천으로 유입되어 물고기나 폐사하거나 녹조가 발생하는 등 하천을 오염시키는 것을 말하는 것으로 가정하수, 공장폐수 등과 같은 점오염과는 상반되는 개념으로 사용하고 있다.

땅 위에 잇는 쓰레기나 애완동물의 배설물, 자동차 기름 등이 빗물에 씻겨 강이나 바다로 흘러들면서 물을 오염시키는 것을 의미하며, 평소 주위에 널려있는 여러 가지 오염물질들이 빗물을 타고 '우수로'에 흘러들어가는데, 우수로에 들어간 물은 특별한 정화시설을 거치지 않고 바로 강이나 하천으로 들어가게 되므로, 수질 오염의 정도가 심하다.

우리나라 하천으로 유입되는 오염물질 중 '비점오염물'이 68%를 차지하고 있고 앞으로도 계속 증가할 것으로 예상된다.

 

 

 

 

개인적으로 사람들이 생각하지 못했던 곳에서 수질오염이 진행되고 있다는 사실에 촉끼남은 조금 놀랐습니다.

그리고 이런 부분을 주의하여 앞으로 자연을 소중히 아껴야 한다고 생각합니다.

실제로 환경부나 한국환경공단에서 비점오염줄이기 캠페인을 지속적으로 진행하고 있으며, 비점오염을 줄이기 위한 저류지나 인공습지, 식생여과대, 식생수로 등을 건설하여 비점오염원을 통한 수질 오염을 막기 위해 다방면으로 힘쓰고 있다고 합니다.

그리고 우리 시민들도 강이나 하천으로 바로 유입되어 버리는 비점오염원들을 확실히 인지하고 '자연을 푸르게 푸르게~~'에 동참하여야 하겠습니다.

 

 

이번 포스팅에서는 '비점오염'에 대해서 알아보았으며, 지금까지 잡지식 스토리의 촉끼남이였습니다.

내용은 검색포털 사이트 '네이버'와 '한국 환경 공단' 사이트의 내용을 인용하였음을 알려드립니다.

그럼 다음 포스팅에서 다시 만나뵙도록 하겠습니다. 

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 10. 23:58
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

이번에는 포토샵 툴박스의 사각 선택 툴을 사용하는 방법에 대해서 정리를 해 보겠습니다.

 

일단, 기본적으로 영역 선택 툴이 하는 기능에 대해서 알고 있어야 하겠습니다.

영역 선택 툴은 어떤 이미지 전체 중에서 수정 작업을 원하는 일부 영역만을 선택하기 위한 툴입니다.

쉽게 이야기 하자면, 고치고 싶은 부분만 따로 선택한다는 이야기가 되겠습니다.

 

사각 선택 툴 이외에도 원형 선택 툴이란 것도 있는데, 다음 이미지를 보면서 조금더 자세히 정리해 보겠습니다.

(영역을 선택하는 툴 및 방법은 여러 가지가 있지만, 이번 포스팅에서는 사각 선택 툴과 원형 선택 툴에 대해서만 정리하겠습니다.)

 

 

< 사각 선택 툴 >

사용법은 아주 쉽습니다. 툴 박스의 사각 선택 툴을 선택하고 해당 이미지를 드래그하여 선택하면 되겠습니다.

 

 

< 원형 선택 툴>

원형 선택툴을 선택할 때에는 사각 선택 툴 위치에서 왼쪽 마우스 버튼을 누르고 있거나 오른쪽 마우스 버튼을 누르면 숨은 툴들이 보이는데, 두번째 점선 원형을 클릭하면 됩니다.

 

 

 < 원형 선택 툴 사용>

원형 선택 툴 선택 후에 원하는 영역을 지정하면 되는데, 원형 이미지의 테투리에서 드래그를시작하는 것이 아니라, 가상의 사각형을 그려 크게 드래그 해야 합니다. 아래 이미지를 보면 쉽게 이해되실 겁니다. 

 

 

< 선택한 영역 이미지 복사 및 이동 >

선택한 영역을 복사하여 다른 위치로 이동시키려면 키보드 단축키[Ctrl + Alt]키를 누르고 마우스로 드래그하여 이동시키면 됩니다.

 

 

< 픽셀이 뭐지? >

포토샵을 포함하여 이미지와 관련된 용어로 픽셀이라는 말을 자주 듣습니다.

픽셀은 픽셀은 이미지를 구성하는 최소 단위를 의미하는데, 이미지를 확대하였을 때 볼 수 있는 작은 사각형 하나를 1픽셀이라고 합니다.

결국, 포토샵 이미지는 이 작은 픽셀들의 집합이며, 이렇게 픽셀로 구성된 이미지를 '비트맵형식' 이미지라고 합니다.

 

 

<사각 선택 툴의 옵션바 기능>

(1) 선택 모드를 설정합니다.

첫번째는 기본 영역 선택 모드입니다.

두번째는 이미 선택된 영역에 새로운 영역을 추가시키는 모드입니다.

키보드 [Shift]키를 누르고 영역을 선택하면 동일한 효과가 발생합니다.

세번째는 이미 선택된 영역에서 일부 영역을 삭제시키는 모드입니다.

키보드 [Alt]키를 누르고 영역을 선택하면 동일한 효과가 발생합니다.

네번째는 이미 선택된 영역과 새롭게 선택될 영역이 중복되는 영역만 지정하는 모드입니다.

키보드 [Shift + Alt]키를 동시에 누르고 영역을 선택하면 동일한 효과가 발생합니다.

 

(2) Feather : 선택된 영역의 픽셀 경계를 부드럽게 해주는 정도를 설정하는 옵션입니다.

수치가 높을수록 경계가 부드럽게 표현되며, 범위는 0-255까지 입니다.

 

(3) Anti-alias : 이미지가 픽셀로 구성되어 있어서 이미지를 확대하면 경계가 계단형식으로 표현되는데,

이 옵션을 선택하면 경계가 부드럽게 표현됩니다. 위 < 픽셀이 뭐지? > 설명에 나타난 이미지는 Anti-alias가 설정되어 있는 이미지 입니다.

 

(4) Style : 영역을 선택하는 방식을 설정하는 옵션입니다.

             Normal - 기본적인 드래그 영역 선택 방식입니다.

             Fixed Aspect Ratio - 영역을 선택할 때 가로(Width)와 세로(Height) 비율을 지정하고 그 비율에 맞게

영역을 선택하는 방식입니다.

             Fixed Size - 영역 선택을 가로(Width0와 세로(Height)값에 입력한 크기로 영역을 선택하는 방식입니다.

 

 

 

주저리주저리 설명은 복잡하게 하였지만, 이번 포스팅 부분도 포토샵에서는 매우 기초적인 내용으로 판단이 됩니다.

하지만, 무슨 내용인지는 알고 있어야 하는 부분이라고 생각되어 정리해 보았으며,

계속해서 정리를 하다보니까 드는 생각인데, 포토샵은 단축키 부분을 제대로 숙지하고 있으면 작업시간을 효과적으로 단축시킬 수 있다고 생각됩니다. 앞으로는 단축키 부분을 더 자세하게 정리해야 할 것 같습니다.

 

아무튼, 이 정도로 해서 포토샵 사각 선택 툴 및 원형 선택 툴에 대한 사용법을 가볍게 정리 해 보았습니다.

그럼 다음 포스팅에서 유익한 정보로 다시 만나 뵙겠습니다.

지금까지 잡지식 스토리의 촉끼남이었습니다.

 

 

Posted by DaumTistory
포토샵 공부2013. 9. 9. 23:59
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

이번에는 툴 박스의 [돋보기 툴]과 [손바닥 툴]에 대해서 정리해 보겠습니다.

 

쉽게 이야기 해서 돋보기 툴은 이미지를 확대하고 축소시키는 툴입니다. 실제 이미지를 확대하고 축소하는 것이

아니라, 이미지 창에 보여지는 비율을 크게 하고, 작게 하는 것입니다. 화면 표시 배율을 조절한다는 말입니다.

다음으로 손바닥 툴은 이미지 창에 보이는 이미지 위치를 변경하는 툴입니다. 화면에 나타난 이미지의 위치를

이동시킨다는 말입니다.

 

자, 그럼 캡쳐 이미지를 보면서 조금더 자세하게 정리해 보겠습니다.

 

 

< 돋보기 툴 - 확대 보기 >


이미지 확대 보기 방법 1 > 툴박스의 돋보기 툴을 선택하고 확대 작업을 하고자 하는 영역을 드래그 한다.

이미지 확대 보기 방법 2 > 돋보기 툴 선택 후에 해당 이미지의 한 부분을 클릭하면

그 포인트를 기준으로 일정 비율로 확대 보기가 실행된다.

이미지 확대 보기 방법 3 > 돋보기 툴 선택 후에 이미지 창을 클릭하고 키보드의 Ctrl키와 +키를 동시에 누르면

확대 보기가 실행된다.

 

[Navigator]팔레트를 통해서 이미지 창에 표시되고 있는 영역이 전체 이미지 중에서 어느 부분인지 확인할 수 있다.

 

 

< 돋보기 툴 - 축소 보기 >


이미지 축소 보기 방법 1 > 옵션바의 '-'돋보기를 클릭하고, 해당 이미지를 클릭하면 축소 보기가 실행된다.

이미지 축소 보기 방법 2 > '+'돋보기 툴 상태에서 키보드[Alt]키를 누르고 있으면 마우스 포인터가 '-'돋보기로

바뀐다. 그 상태에서 마우스를 클릭하면 일정 비율로 축소 보기가 실행된다.

이미지 축소 보기 방법 3 > 돋보기 툴을 선택한 상태에서 키보드의 [Ctrl]키와 [-]키를 동시에 누르면 축소 보기가

실행된다.

 

 

< 돋보기 툴의 옵션 바 기능 정리 >


(1) 이미지 확대/축소 보기 선택

(2) Resize Windows to Fit : 확대/축소 보기 배율이 변경될 때, 이미지 창의 크기도 같이 변경하는지에 대한 설정

(3) Ignore Palletes : Resize Windows to Fit 이 설정되어 있을 때, 이미지 창의 크기가 팔레트 영역까지

변경하는지에 대한 설정

(4) Zoon All Windows : 여러 개의 이미지를 같이 작업하고 있을 때 모든 이미지를 동시에 확대/축소 보기 하는지에

대한 설정

(5) Actual Pixels : 100% 보기 비율로 변경. (툴 박스의 돋보기 툴의 더블 클릭 효과와 동일)

(6) Fit Screen : 포토샵 작업 영역에 가장 크게 표시되도록 이미지 창 및 보기 배율이 변경.

(툴 박스의 손바닥 툴의 더블 클릭 효과와 동일)

(7) Print Size : 이미지의 실제 크기로 보기 배율이 변경. (출력 크기로 변경)

 

 

< 손바닥 툴 >


이미지를 확대하여 작업할 때, 이미지가 보이는 위치를 변경해 주는 툴이다.

툴박스의 손바닥 툴을 선택하고, 이미지 창에서 마우스 드래그 동작으로 이미지 보기 위치를 옮길 수 있다.

작업 중에 키보드 [Space bar, 스페이스 바]를 누르고 있으면 마우스 포인터가 손바닥 툴로 전환된다. 

 

 

 

이번에는 돋보기 툴과 손바닥 툴에 대해서 정리해 보았습니다.

이미지 확대/축소 보기 및 이미지 위치 이동은 포토샵으로 수정 작업을 할 때, 기본적으로 자주쓰는 기능이므로

기능 작동법을 확실히 인지하고 있어야 할 것 같습니다.

그러니, 님들도 한번씩 연습해 보시기 바랍니다.

 

 

지금까지 포토샵으로 작업을 할 때에 이미지를 확대하고 축소하고, 또 이미지 창에 표시되는 이미지 위치를

이동시키는 방법에 대해서 잡지식 스토리의 촉끼남이 몇자 끄적거려 보았습니다.

자, 이번 포스팅은 이 정도에서 마치겠으며, 다음 포스팅에서 새로운 끄적거림으로 다시 만나뵙도록 하겠습니다.

 

 

 

Posted by DaumTistory
진짜 잡지식2013. 9. 8. 13:00
   

 

반갑습니다. 잡지식 스토리의 촉끼남입니다.

 

이번에는 지하철 취객 소란에 대해서 몇 자 끄적거려 보겠습니다.

지난 주에 출근길 지하철 역에서 전에 보지 못한 포스터가 붙어 있는 것을 보았습니다.

저건 뭐지..?? 하면서 어떤 포스터인지 확인을 합니다.

지하철 취객소란을 주의해 달라는 포스터였습니다.

 

 

 

포스터 내용은 이러했습니다.

 

지하철 이용승객 간 불편사항 1위는 '취객소란'입니다.

만취한 취객은 고성이나 다툼, 성추행, 토사물 등으로 주위사람들에게 피해를 주고 있습니다.

특히 막차시간 무렵에는 취객에 대한 직원들의 업무 처리로 인해

다수의 시민을 위한 서비스에 차질을 빚고 있습니다.

선진교통문화 정착을 위하여 때와 장소를 가릴 줄 아는 음주 문화가 필요합니다.

 

 

생각해 보니까, 정확히 맞는 말인 것 같습니다.

특히, 늦은 시간에 지하철을 이용할 때 보면, 취객소란을 피우는 사람들이 꼭 있습니다.

음주로 인해서 주위의 시선은 하나도 신경쓰지 않고 고성방가 및 고성통화, 그리고 꼭 주위사람들에게 시비를 걸고 하는 모습은 여러 사람들에게 눈살을 찌푸리게 하는 장면입니다.

또, 포스터 내용을 보면 알 수 있다시피, 지하철 직원분들도 이런 사람들 때문에 더 고생하는 것 같습니다.

 

아무튼, 때와 장소를 가릴 줄 아는 음주 문화 정착으로 선진 시민의 참된 모습을 보여주어야 하겠습니다.

여러분..!! 같이 할 수 있겠죠..?? ^^;;

 

 

지하철 취객소란에 대한 촉끼남의 끄적거림은 여기까지입니다.

잡지식 스토리는 계속되오니, 다음 포스팅에서다시 만나뵙도록 하겠습니다.

 

추천이나 댓글은 촉끼남에게 일용한 양식이 될 수 있다는 사실..!! 알아서 잘 부탁드립니다..!! ^^;;

 

 

Posted by DaumTistory