'말랑말랑 컴퓨터'에 해당되는 글 334건

  1. 2013.07.25 엑셀 중복값 찾기/중복값 제거 (조건부 서식과 중복된 항목 제거) by Y
  2. 2013.07.22 [Y&S 4차 배포] 티스토리 초대장 배포(7장)(마감) by Y 38
  3. 2013.07.19 Y&S 블로그 100만 돌파 기념 이벤트 (TGI 쿠폰 무료 증정) 13
  4. 2013.07.18 [웹표준코딩] 플롯의 초기화 clear:both;와 홈페이지 기본 레이아웃 by S 10
  5. 2013.07.12 [엑셀기초] 엑셀 틀고정 by Y
  6. 2013.07.09 엑셀 함수 20 - DATEDIF 함수 (경과일수, 근속일수 구하기)
  7. 2013.07.07 [웹표준코딩] 플롯클리어 방법 by S 8
  8. 2013.07.05 [엑셀기초] 숫자에 표시형식 적용하기 by Y
  9. 2013.07.04 [엑셀기초] 엑셀 표 만들기 (매입매출장 만들기) by Y 12
  10. 2013.07.02 블로그 랭킹 위젯 설치 방법 (랭키닷컴) by Y 1
  11. 2013.07.01 엑셀 단축키 모음 파일 (자주 사용하는 단축키 위주) by Y 15
  12. 2013.06.22 [웹표준코딩 가로배치의 핵심] 떠서 이동하는 float의 이해② by S 3
  13. 2013.06.21 엑셀 함수 총정리 파일 (컴활, ITQ 대비) by Y 112
  14. 2013.06.20 [웹표준코딩 가로배치의 핵심] 떠서 이동하는 float의 이해① by S 10
  15. 2013.06.18 엑셀 주소라벨 만들기 (VLOOKUP 함수 실습) by Y 32
  16. 2013.06.17 블로그 방문자수 늘리기 - 네이버 오픈캐스트 개설하고 캐스트를 발행해보자 by Y 4
  17. 2013.06.16 블로그 스크린캡쳐 불펌을 방지하기위한 워터마크를 글 바탕에 삽입하다 by S 10
  18. 2013.06.14 블럭박스(Block box), 인라인박스(Inline box), 라인박스(Line box) by S 4
  19. 2013.06.13 내 블로그의 현재 성적은? (블로그 랭킹, 블로그 지수) by Y 9
  20. 2013.06.12 네이버 애널리틱스 vs 구글 애널리틱스 by Y 15
  21. 2013.06.12 포토샵 그림자효과(레이어스타일) 분리하여 포스트잇 만들기 by S 4
  22. 2013.06.11 엑셀 빈셀/빈칸 없애기, 공백 문자 없애기 by Y 7
  23. 2013.06.10 엑셀 함수 19 - REPLACE, TRIM, SUBSTITUTE 함수 (문자 변경 함수) by Y 2
  24. 2013.06.05 포토샵으로 생일 카드 만들기 by Y
  25. 2013.06.03 한글 바탕쪽 기능 (문서 전체에 같은 모양 적용하기) by Y 4
  26. 2013.06.01 티스토리 PC와 모바일에 구글 애드센스 광고넣는 방법과 광고개수 by S 15
  27. 2013.05.30 한글 표에서 셀 블록 설정(범위 지정) 방법 by Y 3
  28. 2013.05.27 엑셀 함수 18 - INT, TRUNC, ROUND, ROUNDUP, ROUNDDOWN 함수 by Y 4
  29. 2013.05.26 [Y&S 3차 배포] 티스토리 초대장 배포(마감) by Y 30
  30. 2013.05.24 박스모델의 연습과 멀티클래스 네임, 가상클래스 네임 by S 2

 

 

 

엑셀에서 특정 필드를 기준으로 중복값을 찾아 제거하는 [중복된 항목 제거] 명령이 있다.

하지만, 중복값을 찾는 기능은 없으므로 함수나 조건부 서식 등을 응용하는 방법으로 재량껏 찾아야 한다.

물론 눈으로 찾는 방법도 있겠지만, 데이터가 많을수록 불가능한 방법이므로 재껴두자.

여기에서는 중복값을 조건부 서식을 이용하여 찾아내는 방법을 먼저 알아보고

[중복된 항목 제거] 명령을 이용하여 중복값을 제거하는 방법을 공부해보자.

 

조건부 서식에 대해 모른다면 참조~!!

엑셀 조건부 서식 3 (수식을 이용한 조건부 서식) by Y

 

 

 

 

중복값 찾기(조건부 서식 이용)

 

 

 

 

1. 제목을 제외한 데이터 범위를 모두 선택한 후

[홈]-[스타일] 그룹의 [조건부 서식]-[새 규칙] 명령을 클릭한다.

 

 

 

 

2. '수식을 사용하여 서식을 지정할 셀 결정'을 선택한 후

수식 입력란에 '=COUNTIF($B$3:$B$29,$B3)>=2' 식을 입력한다.

성명 데이터의 개수가 2개 이상(중복될 경우)일 경우 서식을 지정한다는 의미이다.

 

COUNTIF 함수를 모른다면 참조~!!  

 엑셀 함수 10 (개수 구하기) by Y

 

 

 

 

3. 서식은 데이터를 강조할 수 있는 서식을 지정해주자.

여기에서는 셀 음영을 지정하기 위해

[채우기] 탭을 클릭한 후 아무 색이나 선택했다.

 

 

 

 

4. 마지막으로 [확인] 버튼을 클릭한다.

 

 

 

 

5. 성명이 중복되는 행에 자동으로 서식이 적용되어

중복 데이터를 쉽게 구분할 수 있게 되었다.

 

 

 

 

 

중복값 제거(중복된 항목 제거 이용)

 

 

 

1. 데이터를 모두 선택한 후 [데이터]-[데이터 도구] 그룹의 [중복된 항목 제거] 명령을 클릭한다.

 

 

 

 

2. 모든 열이 체크되어 있으므로 모두 해제하기 위해 [모두 선택 취소] 버튼을 클릭한다.

 

 

 

 

3. 중복 기준이 될 열만 선택한다.

여기에서는 성명 열만 선택했다.

 

 

 

 

4. 중복되었던 4개의 데이터 중에서 고유하지 않은 2개의 데이터가 자동으로 제거된다.

 

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

i n v i t a t i o n

티스토리 초대장

Y&S 블로그에서 초대장을 네 번째로 배포하려고 합니다.

 

 

아래의 조건을 만족하시는 분들 중에서 선택하여 드립니다.

초대장을 받으신 후 24시간 내에 블로그를 개설하지 않으면 회수되오니 바로 개설해주세요.

 

 

내일 아침(화요일 아침)에 댓글 확인 후 일괄적으로 초대장을 보내드리겠습니다. 
즉, 선착순이 아니니까 댓글을 최대한 정성스럽게 써주시길 부탁드립니다.

(댓글은 비밀댓글로 꼭 써주세요.) 

 

이런 분들께 드립니다!

1. 다른 블로그를 사용해보셨던 분 블로그 주소를 남겨주세요. (선택사항입니다.)
2. 이메일 주소가 정상적인 분 (필수)
3. 블로그를 시작하려는 이유를 최대한 인상적으로 남겨주신 분 (필수)

 

초대받으신 분들의 블로그는 꾸준히 모니터링 중이고, 앞으로도 그럴 예정이니 

이상한 용도로 블로그를 이용하실 분이나 처음에 글 몇 개 쓰시고 블로그를 내버려두실 분들은

신청을 자제해주시길 부탁드립니다.

열심히 운영하실 다른 분들의 기회를 뺏지 말아주세요.

 

 

------------------------------------------------------------------------------------------------

 

 

현재 저희 블로그에서는 방문자수 100만 돌파 기념 감사 이벤트를 진행하고 있습니다.

참여 자격 없는 이벤트이오니 많은 참여 부탁드립니다~^^

 

 2013/07/19 - Y&S 블로그 100만 돌파 기념 이벤트 (TGI 쿠폰 무료 증정)

 

 

초대장 배포가 마감되었습니다.

 

 

 

 

 

Posted by Y&S

 

 

 

블로그를 개설한지 219일이 된 오늘!!

드디어 고대하던 100만을 돌파했습니당~

 

 

 

 

방문해주신 모든 분들께 감사의 마음을 담아

Y&S 블로그의 첫 이벤트를 하려합니당~~

 

 

쌩유

 

 

 

 

 

상품은 쿠팡에서 진행하고 있는 T.G.I.FRiDAY'S의 크러스티드 치킨 세트 입니다.

총 3분을 뽑아서 드릴예정이구요~

상품 상세 페이지 http://www.coupang.com/deal.pang?coupang=41094381&isLanding=Y

(쿠폰의 유효기간은 8월 18일입니다)

 

 

제품 구성은 위와 같이 구성되어 있습니다.

어제 먹고 왔는데 둘이서 꽤 먹을만했습니당~

연인이 같이 먹는다면 더욱 맛있겠죠?^^

 

 

 

이벤트 기간 : 7월 19일 ~ 8월 4일

당첨자 발표일 : 8월 6일 (3명)

발표일에 발표글을 따로 올릴 예정이니 발표일에 꼭 확인해주세요~

발표글 댓글에 당첨자 전화번호를 알려주시면 쿠폰을 보내드릴 예정입니다.

 

 

 

이벤트 참가 방법

 

1. [말랑말랑 컴퓨터] 카테고리 글 중에서 가장 도움이 되었던 글 주소를 적어주세요.
2. [Y&S의 관심사] 카테고리 글 중에서 가장 공감이 되었던 글 주소를 적어주세요.
3. [말랑말랑 컴퓨터] 카테고리(엑셀, 한글, 웹디자인, 포토샵 등)에 포스팅했으면 하는 주제를

한 가지만 적어주세요.

4. 저희 블로그를 찾게 된 경로를 적어주세요. 

5. 저희 블로그에 해주고 싶으신 말씀 등을 적어주세요.

 

댓글은 꼭 공개로 해주세욧~

 

예)

1. http://yslife.tistory.com/469
2. http://yslife.tistory.com/55
3. 엑셀 강좌&팁 - VBA 관련 글을 올려주세요.

4. 엑셀함수를 검색하다 우연히 들어오게 되었습니다.
5. 블로그 번창하시길~~♡ 

 

 

그럼 많은 참여 기대하고 있을께요 ㅎㅎ

 

 

사랑해

 

 

 

 

 

Posted by Y&S

 

 

 

앞에서 플롯을 초기화시키는 방법으로 부모에 조취를 취하는 방법을 알아봤다면
이번엔 자식에 조취를 취하는 방법을 보자.

 

 


일반적으로 많이 사용되는 홈페이지 기본 레이아웃 구조는 아래와 같다.

 

 

 

 

이 레이아웃을 실전에 살짝 응용해서 코딩을 한다면,


일단 전체를 랩(wrap)으로 감싸 브라우저의 사이즈에 상관없이 가운데 정렬되게 만든 후

.wrap {width:800px; margin:0 auto;} <위드값이 들어가거나 이미지 같은것들이 받치고 있어야 함>


상단에 header를, 왼쪽 메뉴(side)와 컨텐츠부분(content)을 main으로 한번 더 감싸주고, 하단에 footer를 넣었다.

 

 

 

 

 


여기서 왼쪽 메뉴와 컨텐츠부분을 나란히 가로배치시키기 위해

둘다 float:left;를 사용하여 공중으로 띄웠으며

두 개 모두 공중에 뜬 상태이기 때문에 footer에 파란색 라인을 넣었더니

아래와 같이 main영역을 침범해 밑으로 기어들어간다.

 

 

 

 


이때 footer에 나부터는 플롯의 영향을 받지 않겠다clear:both;를 넣어주면
이제 정상적으로 footer영역에만 라인이 그어진다.

 

 

 

 

 

 

 

 

 

2013/07/07 - [말랑말랑 컴퓨터/웹표준코딩 html&css] - 플롯클리어 방법 by S

 

여기서 만약 앞 글의 overflow:hidden(넘치면 잘라라)을 사용해서 플롯초기화 시킨다면
레이어 팝업을 띄웠을때 위치에 따라 팝업이 잘리는 문제가 생기고,


display:inline-block;를 사용하여 메인을 인라인속성으로 바꿔버리면
가장 코딩이 많이 들어가야하는 main영역에서 앞으로 무슨일이 있을지 모르기 때문에


이때는 최대한 안의 영역은 건드리지 않고 바깥인 footer에서 해결하는 이 clear:both;를 사용하는 것이다.

 

 

 

 

 
 
 
 

 

 

Posted by Y&S

 

 

 

엑셀에서 데이터가 한 눈에 들어오지 않을 정도로 많을 경우

화면을 이동하면 제목이 보이지 않아 데이터 파악이 어려울 경우가 있다.

아니면 화면을 이동해도 특정 부분을 항상 표시해야할 경우도 있다.

이런 경우 엑셀의 틀고정 기능을 이용하게 된다.

틀고정 기능 자체는 굉장히 쉬운 기능이라 한번만 따라해보면 이해가 될 것이다.

 

 

틀 고정 방법

 

1. 행을 고정하여 화면을 아래로 내려도 항상 고정한 행이 화면에 표시되도록 할 수 있다.

=> 고정할 행의 아래쪽 행을 클릭한 후 틀 고정      

예) 고정할 행이 2행이라면 3행 클릭

 

2. 열을 고정하여 화면을 오른쪽으로 이동해도 항상 고정한 열이 화면에 표시되도록 할 수 있다.

=> 고정할 열의 오른쪽 열을 클릭한 후 틀 고정       

예)  고정할 열이 B열이라면 C열 클릭

 

3. 원하는 행과 열을 고정하여 화면을 오른쪽 아래로 이동해도 항상 고정한 행/열이 화면에 표시되도록 할 수 있다.

=> 원하는 행의 아래쪽, 원하는 열의 오른쪽에 해당하는 셀을 클릭한 후 틀 고정

예) 고정할 행이 3행, 고정할 열이 C열이라면 D4셀 클릭

 

 

 

 

행 고정

 

 

 

아래와 같이 내용이 많을 경우 화면을 아래로 이동해도

제목행은 항상 표시되도록 틀고정을 적용해보겠다.

 

 

 

 

 

5행을 클릭하여 선택한 후 [보기]-[틀고정]-[틀고정] 명령을 클릭한다.

 

 

 

 

 

5행 아래에 아래와 같이 긴 선이 표시된다.

 

 

 

 

 

화면을 아래로 내려보면 긴 선 윗부분은

틀처럼 고정되어 항상 표시되는 걸 볼 수 있다.

 

 

 

 

 

틀고정을 취소하려면 [보기]-[틀고정]-[틀고정 취소] 명령을 클릭하면 된다.

 

 

 

 

열 고정

 

 

 

이번에는 왼쪽의 거래처를 고정시키기 위해 B열을 클릭하여 선택한 후

 [보기]-[틀고정]-[틀고정] 명령을 클릭한다.

오른쪽으로 화면을 이동할 경우 A:B 열 부분이 고정되어 항상 표시되는 걸 볼 수 있다.

 

 

 

 

 

 

행/열 고정

 

 

 

행과 열을 동시에 고정하려면 원하는 행의 아래쪽,

원하는 열의 오른쪽에 해당하는 셀을 클릭한 후 틀고정을 하면 된다.

여기에서는 4행과 B열을 화면에서 항상 표시되도록 고정하기 위해

C5셀을 클릭한 후 [보기]-[틀고정]-[틀고정] 명령을 클릭한다.

 

 

 

 

 

화면을 아래와 오른쪽으로 이동해보면 4행과 B열이 항상 표시되는 걸 볼 수 있다.

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

DATEDIF 함수란?

경과년수, 경과개월수, 경과일수 등을 구할 때 자주 사용하는 함수다.

 

 

 

=DATEDIF(시작일, 종료일, "옵션")

시작일부터 종료일까지 경과일을 옵션에 따라 구한다.

 

옵션 설명

※ 옵션이 'MD', 'YM', 'YD' 일 경우 윈도우 버전에 따라

오류가 나거나 제대로 답이 구해지지 않는 경우가 있다.

 

 

 

 

DATEDIF 함수 활용 예 1

 

연인이 만난지 몇일이 지났는지 구해보자.

=DATEDIF(처음 만난 날짜,TODAY(),"D")

예) =DATEDIF("2012-05-11",TODAY(),"D")

 

*** TODAY()는 시스템의 현재 날짜를 의미한다 ***

 

 

 

 

DATEDIF 함수 활용 예 2

 

직원의 근무년수, 근무개월수, 근무일수와 근속기간을 모두 구하는 식을 구해보자. 

일단 작성일에 '=TODAY()' 식을 입력하여 현재 날짜가 표시되도록 한다.

 

 

 

 

근무년수에 '=DATEDIF(C4,$C$2,"Y")' 식을 입력한다.

시작일은 입사일이고, 종료일은 작성일로 지정한 후

경과년수만 구하기 위해 옵션에 Y를 입력한다.

 

 

 

 

근무개월수에 '=DATEDIF(C4,$C$2,"M")' 식을 입력한다.

경과월을 구하기 위해 옵션에 M 입력한다.

 

 

 

 

근무일수에 '=DATEDIF(C4,$C$2,"D")' 식을 입력한다.

경과일을 구하기 위해 옵션에 D를 입력한다.

 

 

 

 

'근속기간1'에는 경과년/경과월/경과일이 0이 되어도 그대로 표시해보겠다.

 

=DATEDIF(C4,$C$2,"Y")&"년 "&DATEDIF(C4,$C$2,"YM")&"개월 "&DATEDIF(C4,$C$2,"MD")&"일"

 

YM은 1년 미만의 개월수를 표시해주고,

MD는 1개월 미만의 일수를 표시해주는 옵션이다.

*** & 기호는 함수식이나 문자열을 연결하는 연산자다.***

 

 

 

 

'근속기간2'에는 경과년/경과월/경과일이 '0'일 경우 생략해보겠다.

 

=IF(DATEDIF(C4,$C$2,"Y")=0,"",DATEDIF(C4,$C$2,"Y")&"년 ")

&IF(DATEDIF(C4,$C$2,"YM")=0,"",DATEDIF(C4,$C$2,"YM")&"개월 ")

&IF(DATEDIF(C4,$C$2,"MD")=0,"",DATEDIF(C4,$C$2,"MD")&"일")

 

'IF(DATEDIF(C4,$C$2,"Y")=0,"",DATEDIF(C4,$C$2,"Y")&"년 ")' 식의 뜻은???

=> 경과년수가 0이라면 ""(공백)이고, 아니면 경과년수에 '년 '을 붙여 표시해준다.

 

IF 함수에 대해 알고 싶다면 함 보자~!!  엑셀 함수 7 (논리 함수, IF 함수) by Y

 

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

오랜만에 웹표준 공부글을 쓴다.
요새 왜이리 공부글이 쓰기 싫은지...ㅜㅜ
휴...반성반성.

 

 


플롯(float)을 줌으로 인해 생기는 변화를 어느순간 없애야 할 때가 있다.


이전 시간에 float을 주고 그를 감싼 부모에 테두리를 주면 테두리가 위로 붙어버리는 현상을 봤다.

다시 잠깐 보자면 이미지와 문장에 각각 float:left;를 주고

그 둘을 감싼 부모에 검은색 4픽셀짜리 테두리를 쳤더니
테두리가 위로 올라가서 붙어버린다. (붙어버린 라인의 두께는 8픽셀)

 

 

 

 

 

이는 아래처럼 이미지에만 float:left; 를 주어 부모에 테두리를 감쌀때 생기는 현상과는 다르다.

 

 

 

왜냐하면 이미지와 문장 모두에 float:left; 를 주게되면 둘다 공중에 뜨면서 테두리가 밑으로 기어들어가기 때문.

 

 


이를 해결하기 위해 플롯클리어시켜야 하는데 플롯클리어시키는 방법은 여러가지가 있다.
이것은 원래 정해져있던게 아니라 많은 사람들이 하나씩 찾아낸 방법으로 조금씩 성질이 다르다.

 

 

 

 

 

오늘은 부모한테 조치를 취하는 3가지 방법을 알아보자.

 

 

1. 부모에 overflow:hidden; 을 준다.

 

이미지와 글을 감싸고 있는 mother에 overflow:hidden;을 준다.

그럼 아래와 같이 자식들이 정신을 차리면서 부모가 자식들을 컨트롤 할 수 있게 된다.

 

 

 

 


이때, 부모에 width값을 따로 주지 않았기 때문에 윈도우창을 늘이던 줄이던 테두리의 가로값은 항상 100%를

가진다. (블럭요소의 일반적인 성질)

 

원래 오버플로어 히든은 높이에 맞춰 자를때 쓰는 속성이다.
하지만 여기서는 그 자를 기준이 없으므로 자신의 속성만 남게되는데 그 속성이 박스에 영향을 미치고
그 영향으로 인해 클리어시키는것.

 

 

 

 

 

 

2. 부모에 float:left;width값 준다.

 

플롯레프트는 width값을 주지 않으면 가능한 범위내의 최소한의 값을 가지는 성질이 있다.
이는 플롯박스라는 성질로 바뀌기 때문인데 이걸 이용해 아래처럼 플롯클리어 시키는것이다.

(만일 width값을 주지 않는다면 아래 3번과 마찬가지의 형태가 된다.)

 

 

 

 

 

 

 

 

3. 부모에 display:inline-block; 을 준다.

 

기존 <div>블럭요소가 2번에서는 플롯의 성질로 변환되었다면 여기선 인라인요소로 변환되면서

2번과 마찬가지로 100%가 아닌 가능한 범위내의 최소한의 값을 가진다.

 

하지만 가로,세로값을 줄 수 없는 일반적인 인라인요소와 다르게 <img>태그처럼 width값과 height값을 따로

지정해줄 수 있게 만든것이다.
이를 이용해 플롯클리어 시키는 것인데 여기에 width값을 주게되면 2번과 같은 효과가 나타난다.

 

 

 

정리하자면 1번은 여전히 블럭박스의 성질이고 2번은 플롯박스의 성질로 변환, 3번은 인라인박스의 성질로

변환된 것.

그러므로 1,2,3 모두 width값을 별도로 주지 않았을때

1은 100%의 자기영역을 차지하고 2,3 번은 자기가 가질 수 있는 최소한의 값을 가진다.

물론 세개에 width값을 지정해 준다면 전부 2번과 같은 결과가 될 것이다.

 

 

 

 

 

=====================================================================================================

 

 

 

그런데 만일 아래처럼 전체의 높이값이 따로 지정되어 있다면 굳이 플롯클리어를 하지 않아도 된다.

 

 

 

 

 

클리어는 높이(height)가 별도로 지정되어 있지않은,

내용의 길이에 따른 높이의 유동성이 있을때 사용한다는 것을 알아두자.

 

 

 

 
 
 
 

 

Posted by Y&S

 

 

 

엑셀 초보들이 숫자 표시형식으로 당황하는 경우들은?

1. 실제로 '15년'이라고 표시해야해서 '15년'이라고 입력한 후 더하기, 빼기 등의 계산을 하려고 하니 계산이 안된다.

2. '15%'를 입력하기 위해 '15'라고 쓰고 표시형식의 '%' 명령을 클릭하니 '1500%'로 표시된다.

3. 소수점 이하를 한 자리만 입력했는데, 소수점 이하 두 자리까지 표시가 된다.

 

 

엑셀에서는 숫자를 입력할 경우 순수하게 숫자만 입력한 후 표시형식을 적용하여 꾸미는 경우가 많다.

이럴때 많이 실수하는 경우 위주로 실습해보고 위와 같은 실수는 더이상 하지 말자~

 

 

실습파일과 완성파일

 

  표시형식.xlsx

표시형식 완성.xlsx

 

 

 

아래와 같이 숫자에 표시형식을 적용시키고, 백분율을 입력해보자.

 

 

 

 

1. 숫자를 입력한 후 원하는 문자 붙여 표시하기

 

숫자를 입력한 후 문자를 붙여 표시하려고 할 경우

1. 계산할 일이 없다면 그냥 문자까지 붙여서 입력해도 된다.  => '15년' 입력

2. 나중에 계산해야하는 숫자의 경우 반드시 숫자로 입력한 후 표시형식으로 문자를 붙여야한다. => '15' 입력

 

 

숫자 범위를 지정한 후 Alt+1 을 누르거나,

마우스 오른쪽 메뉴의 [셀 서식] 메뉴를 클릭한다.

 

 

 

 

'사용자 지정' 범주를 선택한 후 'G/표준' 오른쪽에 '년'을

큰 따옴표로 감싸서 입력한 후 [확인] 버튼을 클릭한다.

'G/표준'은 표시형식을 지정하지 않은 순수한 숫자를 의미한다.

 

여기서 잠깐~!!

큰 따옴표는 한글일 경우 생략해도 되지만, 영어나 특수문자일 경우

꼭 앞뒤에 넣어야하므로 처음부터 큰 따옴표를 넣어주는 습관을 기르자.

 

 

 

 

 

이제 계산할 수 있는 숫자이면서 문자가 같이 표시되는 데이터가 되었다.

 

 

 

 

 

2. 숫자를 입력한 후 '15,000원' 처럼 표시하기

 

우리나라에선 금액일 경우 '\ 15,000'와 같이도 표시하지만, '15,000원'와 같이 더 많이 표시한다.

하지만 1번과 마찬가지로 '15,000원'이라고 입력해버리면 계산할 수 없는 문자가 되어버린다.

결국 1번처럼 '사용자 지정'을 이용해야 한다.

 

 

기본급의 숫자를 모두 범위 지정한 후 Alt+1 을 누르거나,

마우스 오른쪽 메뉴의 [셀 서식] 메뉴를 클릭해서

[셀 서식] 창이 나타나면 아래와 같은 순서대로 작업하면 된다.

 

'#,##0'은 천단위 구분 기호(쉼표)를 숫자에 적용하는 사용자 지정 코드다.

 

 

 

 

이제 우리에게 친근한 '15,000원'의 방식으로 금액이 표시된다.

 

 

 

 

 

3. 백분율 입력하기

 

백분율을 입력하는 방법에는 두 가지 방법이 있다.

1. '15%'일 경우 입력할 때 '15%'라고 입력하는 방법으로 가장 많이 사용하는 방법이다.

2. '15%'일 경우 입력할 때 '0.15'를 입력한 후 '%' 서식 명령을 적용하면 입력한 숫자에 100을 곱한 후 %를 붙여서 '15%'가 되는 방법이다.

이 방법은 입력할 때 모두 100으로 나눈 결과를 입력해야 하므로 머리가 좀 아플 수 있다 ㅎㅎ

 

백분율 입력시 흔히 틀리는 경우

'15%'일 경우 '15'를 입력한 후 '%' 서식 명령을 적용하려고 하는 경우인데,

이렇게 입력하는 사람이 의외로다능~

이처럼 작업한 경우 결과는? '1500%'가 된다.

숫자 1이 100%에 해당한다는 것만 숙지하면 될 듯하다.

 

 

 

 백분율 입력시 맞는 방법과 틀린 방법  

 

위의 그림에서처럼 백분율을 입력하면 소수점 이하 자릿수가 제멋대로인 경우가 많다.

이럴때는 [자릿수 늘림], [자릿수 줄임] 명령으로 소수점 이하 자릿수를 가지런히 이쁘게 표시할 수 있다.

 

 

 

☞ 기타 표시형식 관련글

 

2013/01/03 - [말랑말랑 컴퓨터/엑셀 강좌&팁] - 엑셀 '표시 형식'의 '사용자 지정' 알아보기 by Y 

2013/01/07 - [말랑말랑 컴퓨터/엑셀 강좌&팁] - 엑셀 '표시 형식' by Y 

2013/01/14 - [말랑말랑 컴퓨터/엑셀 강좌&팁] - 엑셀 조건부 서식 1 ('표시 형식'의 '사용자 지정'으로 작성) by Y

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

엑셀에서 표를 만들 경우 유의할 점

1. 엑셀의 셀은 나눈다는 개념이 아예 없으므로 필요한 만큼 행/열을 확보해야 한다.

2. 확보한 셀에 '모든 테두리'를 적용하면 전체적인 작업이 쉬워진다.

3. 여러 셀을 하나로 합칠 경우 범위 지정 후 '병합하고 가운데 맞춤' 명령으로 합친다.

4. [Office 단추]-[인쇄]-[인쇄 미리보기]에서 한 페이지에 모두 표시되는지 확인한다.

5. 페이지보다 넘칠 경우 [페이지 레이아웃]에서 여백, 확대/축소 등의 기능으로 조절한다.

6. 페이지보다 부족할 경우 행은 삽입 기능으로, 열은 열 너비를 늘려서 페이지를 채운다.

 

 

 

 

 

엑셀로 매입매출장 만들기

 

아래와 같은 매입매출장을 만들어보자.

필요한 열을 세어보면 12개의 열이 필요한 걸 알 수 있다.

 

 

 

 

열은 12개, 행은 임의로 범위를 지정한 후 [모든 테두리]를 클릭한다.

 

 

 

 

이제 합칠만큼 범위를 지정한 후 [병합하고 가운데 맞춤] 명령을 클릭한다.

 

 

 

 

같은 방법으로 각각 셀을 병합한다.

 

 

 

 

글자를 입력한 후 각 열너비와 행높이를 조절해준다.

열과 열 사이의 선, 행과 행 사이의 선을 드래그하면 원하는대로 조절할 수 있다.

 

 

 

 

[Office 단추]-[인쇄]-[인쇄 미리보기]를 실행한 후 돌아와보면

아래와 같이 페이지를 구분해주는 페이지 구분선이 표시된다.

아래의 경우 가로로 한 페이지에 다 표시가 안되고 넘친다는 의미이다.

 

 

 

 

가로로 페이지 안에 모두 표시되도록 하기 위해

[페이지 레이아웃] 탭의 [크기 조정] 그룹에서 [너비]를 '1페이지'로 지정한다.

 

그럼 자동으로 1페이지가 되는 배율이 자동으로 지정되는데 여기에서는 '82%'로 축소되었다.

글자가 축소되는게 싫은 경우 여백을 좁게 조정하거나 직접 열너비를 줄이는 방법도 있다.

 

 

 

 

이제 1행의 높이를 늘리고 [B1:M1] 범위를 병합한 후 제목을 쓰고 테두리를 지정해준다.

 

 

 

 

화면을 아래로 내려보면 1페이지의 높이를 구분해주는 선이 보인다.

한 페이지에서 많이 모자란걸 볼 수 있다.

 

 

 

 

필요한만큼 행을 선택한 후 [삽입] 명령으로 행을 삽입하면 세로칸을 채울 수 있다.

 

 

 

 

이제 완성된 표를 미리보기하면 A4 용지에 알맞게 채워진 표를 확인할 수 있다.

 

 

 

 

완성된 매입매출장 파일

 

 매입매출장.xlsx

 

 

 

동영상 강좌

 

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

작년부터인가 다음의 블로그 랭킹 위젯 서비스가 중지되어

블로그 랭킹 위젯을 쉽게는 내 블로그에 설치할 수 없게 되었다.

 

다행히 랭키닷컴에서 무료로 블로그 랭킹 위젯을 제공하길래 블로그에 달아보았다.

일단 크게 신경쓰고 싶지 않아 사이드의 가장 하단에 달기는 했는데

눈에 보이니 신경을 영 안쓸수는 없을듯 ㅎㅎ

 

 

 

 

랭키닷컴에서 무료로 제공하는 위젯을 사용하기 위해서는

회원가입 후 본인의 블로그나 사이트를 등록해야 한다.

 

사이트 등록 신청을 해도 일주일 정도 심사를 거쳐 등록되기 때문에

인내심을 가지고 기다려야한다.

 

 

 

1. 사이트 등록

 

랭키닷컴(http://www.rankey.com/)에 로그인한 후 상단의 [사이트 등록]을 클릭한다.

 

 

 

 

등록여부를 확인 화면에서 본인 블로그(사이트) 주소를

 입력한 후 [등록여부확인] 버튼을 클릭한다.

 

 

 

 

새창이 뜨면 [신청] 버튼을 클릭한다.

 

 

 

 

이제 사이트 정보를 입력한다.

블로그라면 '카테고리'를 '개인블로그'로 선택해야 한다.

 

여기서 잠깐~!!

사이트 정보를 나중에 수정하려면 또 심사를 거쳐야하기 때문에

처음에 신중하게 정보를 입력하는 것이 좋다.

그리고, 아래처럼 '&' 기호를 넣으면 기호 뒤의 글자는 모두 무시되니

사이트명에 특수기호는 넣지 말자 ㅠ

 

 

 

 

약관에 동의한 후 [다음] 버튼을 클릭한다.

 

 

 

 

신청내역이 표시되면 정보가 맞는지 확인해보자.

 

 

 

 

사이트 등록 신청이 완료되고,

일주일 후쯤 등록이 완료되어 위젯을 신청할 수 있다.

 

위젯이 아니더라도 블로그/사이트의 여러가지 분석 서비스를

제공하므로 여러모로 사이트를 등록해놓는 것이 좋다.

 

 

 

 

 

2. 내 블로그에 위젯 달기

 

사이트 등록 심사가 완료되면 이제 랭키위젯을 신청할 수 있게된다.

랭키닷컴 첫 페이지에서 [순위정보]를 클릭한다.

 

 

 

 

왼쪽 메뉴에서 [랭키위젯 만들기]를 클릭한다.

 

 

 

 

주소를 입력한 후 [미리보기]를 클릭한다.

 

 

 

 

이때, 사이트 등록 신청을 하지 않은 상태거나,

심사가 완료되지 않은 상태라면 위젯이 만들어지지 않는다.

 

아래와 같이 위젯이 미리보기로 나타나면 크기와 색상을 선택하고

[위젯 설정 완료]를 클릭한다.

 

 

 

 

이제 우리에게 필요한 소스가 생성되었다.

소스를 복사(Ctrl+C)해 놓자.

 

 

 

 

티스토리 블로그를 기준으로 설명해보겠다.

[관리]-[꾸미기]-[사이드바] 메뉴에서

[HTML 배너출력]을 추가하기 위해 [+] 버튼을 클릭한다.

② 오른쪽에 추가된 'HTML 배너출력'의 [편집] 버튼을 클릭한다.

 

 

 

 

창이 뜨면 모듈 이름을 마음대로 지정하고,

아까 복사해둔 소스를 'HTML 소스'에 붙여넣는다(Ctrl+V)

소스 앞뒤에 <center>, </center>태그를 추가하여

위젯을 가운데 정렬할 수 있다.

 

 

 

 

추가된 모듈의 위치를 원하는 곳으로 이동하면

아래와 같이 랭킹 위젯이 나타난다.

 

그리고 위젯을 클릭하면 간단한 방문자 통계를 볼 수 있다.

 

 

 

 
 
 
 

 

Posted by Y&S

 

 

 

엑셀에서 사용되는 단축키 중에서도 유용하여

사람들이 자주 사용하는 단축키를 용도에 따라 정리해보았다.

 

엑셀에서 정말 자주 사용하는 단축키라면 Alt + Enter, Ctrl + Home, F4, Delete 등의 단축키와

파일 관련, 복사 관련 단축키를 들 수 있다.

그 외의 단축키도 사람에 따라 쓰거나 안쓰거나 하겠지만,

단축키는 많이 사용할수록 작업 시간이 단축된다는 걸 잊지 말자~!!

 

 

 

엑셀 단축키 모음.xlsx

 

 

 

 

서식 관련에서는 간단히 셀서식 단축키와

글자 꾸미는데 사용되는 단축키를 모아봤다. 

 

 

 

 

편집 관련 단축키가 좀 많은데..ㅎㅎ

워낙 알고 있으면 편리한 단축키가 많아 추려도 많음

  

 

 

 

입력에 관련된 단축키다.

Alt+Enter 단축키는 엄청 많이 쓰이므로 별 다섯개~!!

  

 

 

 

파일 관련 단축키는

대부분 응용 프로그램이 같다.

 

 

 

 

기타 단축키는 매크로나 빠른 실행 도구들의 단축키와 같이

사람들이 잘 모르지만 알고 사용하면 편리한 단축키를 모아보았다.

 

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

[웹표준코딩 가로배치의 핵심] 떠서 이동하는 float의 이해① by S

 

앞에서 이미지 밑으로 흘러내리는 글의 레이아웃을 봤다면

이번에 테이블을 사용한 듯 가로로 나란히 배치되는 레이아웃을 보자.


이미지에 float:left를 써서 왼쪽에 붙게했을때 글은 자연스럽게 이미지 아래로 흐르지만

글이 길어져도 레이아웃을 유지한채 이미지 옆에 배치시키면서 테두리를 둘러야할때가 있다.

 

 

이때는 글에도 역시 float을 써주면 되는데 실제로 해보면 아래와 같다.
200x200사이즈의 이미지를 하나 넣고 이미지와 글에 각각 { float:left; }를 주고

글에는 2픽셀짜리 파란색 테두리를 쳤다.

 

 

 

 

이렇게 되면 블럭박스가 글과 함께 움직이기 때문에 이때 사용한 가로사이즈 300픽셀은

온전히 글의 넓이가 되는것이다.
테두리도 역시 글에만 제대로 둘러진다.


(만약 이와 똑같이 했는데 이미지옆에 글이 같은 높이로 붙지 않는다면 리셋css를 사용하지 않았기 때문이므로 아래글을 참고할것.)

http://yslife.tistory.com/402

 

 

 

 

 

여기서 엥? 오른쪽에 붙이는데 글은 float:right 아냐? 라고 생각할수도 있다.
그렇지만 이렇게 하면 두개가 나란히 붙는게 아니라 아래와 같이 브라우저창을 기준으로 양쪽끝에 붙는다.

 

 

 

만일 글에다 float:right 를 사용하려면 그림과 글을 감싸고있는 부모인 mother에 넓이값을 지정해주면 되는데

그림이 200px, 글의 가로값이 300px이라고
mother의 가로값에 500픽셀을 준다면 아래와 같은 형태가 되어버린다.

 

 

 


왜 그럴까?

 

바로 글에 둘러진 테두리 2픽셀값을 생각하지 않았기 때문이다.
테두리 양쪽 4픽셀을 합하여 총 504픽셀이 되는데 부모의 width값을 500픽셀로 주었더니

들어갈 자리가 모자라서 밑으로 밀려내려가는 것.

 

이때, 가로값이 모자라는 상황에서 둘다 float:left 였다면 글이 아래로 내려가면서 왼쪽으로 붙는건 당연하다.

이렇게 되면 float을 써놓고도 전혀 먹지 않은듯 하니 이유를 모르면 여기서부터 헤매기 시작한다.

 

 


그렇다면 mother에 width값을 504px로 바꿔주거나 <p>의 width값을 296px로 바꿔준다면

글에다 float:right를 써도 원래대로 나란히 붙게 할 수 있을 것이다. 

 

이만큼 width값을 지정할땐 단 1픽셀만 어긋나도 민감한 상황이니 주의할것!

 

 

 

 

 


그런데 만일 부모인 mother에 테두리를 친다면 어떻게 될까?

 

여기서 글과 그림은 float의 사용으로 모두 공중에 떠있는 상태이기 때문에

부모 mother에 4픽셀짜리 검은색 테두리라인을 넣어보면
전체를 감쌀거라 생각했던 라인은 글과 그림을 무시하고 그대로 위쪽으로 붙어버리는 웃기는 상황이 발생한다.
(위에 붙은 검은색 라인은 위와 아래가 붙어버렸기때문에 4+4해서 총 8픽셀의 두께를 가진다.)

 

 

 

 

 

 


그렇기때문에 바뀌어버린 플롯의 성질을 어느순간 다시 제자리로 만들어야 할 때가 있다.
이를 플롯클리어 시킨다고 하는데 이는 다음 포스팅에서 다루겠음.

 

 

 

 

 
 
 
 

 

Posted by Y&S

 

 

 

70여개의 엑셀 함수를 총~~정리한 파일을 만들어보았다.

컴활 1급에 출제되는 배열수식이나 사용자 정의 함수,

재무 함수를 제외한 모든 함수를 정리했는데,

꼭 자격증 대비가 아니더라도 업무에 필요한 경우에도 사용되면 좋을듯하다.

 

파일 자체를 불법으로 공유하는 것을 막기 위해 배경 그림(워터마크)를 설정하고,

시트에 암호를 걸어 보호하여 배경 그림을 지우거나 내용을 수정하지 못하도록 설정했다.

 

하지만, 인쇄할 경우에는 배경 그림 없이 인쇄되니

 개인적으로 사용하는데는 아무런 지장이 없다능~

 

 

 

엑셀 함수 총정리 파일

함수 총정리.xlsx

 

 

 

'함수 총정리' 파일은 총 6페이지이며, 가로로 설정되어 있다.

 

수학/삼각 함수

'인수' 부분에는 함수의 인수를 각각 어떤 순서로 작성해야하는지

몇개의 인수를 적어야하는지를 최대한 알기쉽게 적었다.

 

 

 

 

 

통계 함수

'활용예'는 실제로 함수식을 어떻게 사용하는지

예를 들어서 적어보았다.

  

 

 

 

논리 함수와 정보 함수

'답' 부분에는 옆의 활용예의 답을 적었으며,

복잡한 식의 경우 설명도 같이 적었다.

정보 함수는 컴활1급용 함수다.

 

 

 

 

찾기/참조 함수

OFFSET, TRANSPOSE 함수는 컴활1급용 함수이고,

INDEX, MATCH 함수는 ITQ 엑셀용 함수다.

컴활2급을 대비한다면 나머지 함수를 공부하면 된다.

 

 

 

 

문자열 함수와 데이터베이스 함수

LEFT, RIGHT, MID 함수는 모든 자격증에 공통적으로 사용되고,

TEXT, LEN 함수는 ITQ 엑셀에서 출제된걸 본적있다.

  

 

 

 

날짜/시간 함수

개인적으로 함수 중에서 가장 쉬운 함수라고 생각함~

 

 

 

모두 끈기있기 공부하다보면 함수가 언젠간 내 발밑에

무릎꿇는 날이 올거라 믿으면서 열공하길~!!

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

이전까지 세로의 배치를 했다면 이제 가로배치의 핵심 플롯(float)을 알아보자.
사실 세로로 배치하는건 쉽고 간단하지만 항상 문제가 되는것이 바로 가로 정렬이다.

 

플롯(float)은 [부유하다], [떠있다] 라는 의미를 지니고 있다.
기본적으로 테이블을 사용하지 않고 마크업을하면 아래로 쭉~나열되는데
원하는 부분을 띄워서 오른쪽에 배치하거나 띄워서 왼쪽에 배치하거나...

이런식으로 가로로 연결하여 배치해 나가는 것이다.


이 플롯의 개념만 정확히 이해하고 사용할 수 있어도 웹표준코딩의 기본 레이아웃을 어느정도 잡을수 있다.
물론 테이블을 사용해버리면 쉽겠으나 테이블로 레이아웃을 잡는건 웹표준과 웹접근성의

권장사항에 어긋나므로...

 

 

어쨌든 이 플롯을 확실히 이해하기 위해서는 앞전의 블럭박스(Block box), 인라인박스(Inline box), 라인박스(Line box)의 개념을 정확히 알고 성질을 파악해야 한다.

 

블럭박스(Block box), 인라인박스(Inline box), 라인박스(Line box) 보러가기

 


이러한 블럭박스나 인라인박스에 float를 주면 플롯박스라는 다른 성질로 변하면서

기존 고유의 성질이 바뀌어 버린다.
예를들어 한칸을 다 차지해야 직성이 풀리는 성질인 블럭박스가

float을 줌과 동시에 플롯박스 성질로 변하여 부분으로 들어가 다른것과 함께 배치될 수 있는것이다.

 


일단 이론적인 플롯의 사용법은 간단하다.

 

띄워서 왼쪽으로 배치

float:left;


띄워서 오른쪽으로 배치
float:right;

left 나 right 말고도 none 이나 inherit 가 있으나 많이 사용하지 않으므로 일단 패스.

 

 

 

자, 그럼 플롯이 실제 어떻게 사용되는지를 보자.

 

이미지와 나열된 글이 있고 이미지에 float:left를 줘서 이미지 우측에 글을 배치시키려고 한다.
이때 이 이미지가 어떻게 떠서 이동하는지 눈에는 보이지 않지만 아주 천천히 그 경로를 보자면 아래와 같다.

 

 

1.이미지가 공중으로 뜬다.
2.문장이 이미지 밑으로 들어간다.
3.문장의 블럭박스는 그대로 있는 상태에서 텍스트들을 감싼 라인박스만 이미지영역만큼 우측으로 밀려난다.
(만일 이를 직접 확인하기 위해 p에(블럭박스) 실제로 border를 넣어보면 이미지 밑에부터 테두리가 쳐진다.)

 

 

 

 

 

위에서는 이해를 돕기위해 중간부터 테두리를 넣었지만

테두리를 치지 않더라도 보이지 않는 가상의 선들이 위와같이 존재한다고 생각하면 된다.

 

실제로 문장부분에 테두리가 필요해 p에 스타일을 준다면 당연히 테두리는 이미지 아래까지 기어들어갈 것이고,
p에 문장의 가로값을 지정하려 width값을 주었는데

들어가있는 이미지 크기보다 width값이 작다면 p안에 들어있는 텍스트는 이미지 밑으로 다시 밀려난다.

 

float은 옆으로 배치하는거라고 했고 분명 float을 사용했는데 왜 옆으로 배치되지 않는 것인지...

테두리가 어째서 내 의도대로 안쳐지는지...
위의 개념을 확실히 알고있지 않으면 도대체 왜? 이런 현상이 벌어지는지 자체를 알 수 없는것이다.


블럭요소 p는 가로값을 주지않으면 항상 100를 차지한다.
때문에 이미지 옆으로 밀려나있는 라인박스 때문에 글들이 이미지 옆에서 나오다가 이미지가 끝나는 순간
다시 전체영역인 블럭박스로 돌아가 이미지 아래쪽으로 글이 흘러내리는 것이다.
이는 이미지를 상단 우측이나 좌측에 글과 함께 배치시킨 네이버 뉴스글 같은데서 볼 수 있다.

 

 

 

 

실전

 

아래는 이미지대신 200x200 사이즈의 박스하나를 만들고 빨간테두리를 친 후 클래스네임 photo로 지정해 float:left 를,문장에는 파란 테두리를 치고 가로값 500픽셀을 주었다.

 

 

 

 

 

 

그럼 결과는 아래와 같은 모습이 된다.

분명 문장에 테두리를 주어도 이미지 아래까지 들어가 있는걸 알 수 있다.

이 때, 가로값 500px은 이미지를 포함한 파란테두리 값이다.

 

 

 

 

 

글이 길어지면 물론 빨간 박스 아래까지 내려가고,

 

 

 

 

 

문장 <p>의 width값만 500에서 150px로 바꾼다면 이미지200px보다 작기 때문에 아래로 내려간다.

 

 

 

 

그럼 글이 길어져도 이미지 아래의 영역을 침범하지 않고 이미지 옆쪽으로 나란히 나오게 하려면 어떻게 해야할까?

 

간단하다.
글에도 같이 float을 주어 함께 띄우면 된다.

(이건 다음 포스팅에서 좀 더 자세히 설명하겠음)

 

[웹표준코딩 가로배치의 핵심] 떠서 이동하는 float의 이해② by S

 

 

 

 
 
 
 

 

Posted by Y&S

 

 

 

보통 수백, 수천개가 넘는 주소로 우편물을 발송할 경우 엑셀, 한글, 워드, 엑세스 등의 프로그램을 이용해서 주소라벨을 작성한 후 구입한 주소 라벨 스티커에 인쇄하고, 그 스티커를 편지 봉투에 붙여 우편을 발송한다.

 

엑셀 강좌이니만큼 엑셀의 VLOOKUP 함수를 이용하여 주소 라벨을 만들어보겠다.

VLOOKUP 함수에 대해 잘 모른다면 한번 미리 보자~!!

엑셀 함수 4 (찾기/참조 함수) by Y

 

 

예제를 위한 준비파일과 완성파일이다.

 

 주소라벨.xlsx   주소라벨완성.xlsx

 

 

 

[고객목록] 시트에는 32개의 고객 정보가 입력되어 있다.

모든 데이터가 다 사용되는건 아니고, 실제로 주소라벨에 사용되는 데이터는 이름, 우편번호, 주소만이다.

 

 

 

 

라벨을 만들 첫번째 고객의 고객번호를 F3셀에 입력하면, 자동으로 다음 16개의 고객에 대한 주소라벨이 채워지도록 만들어 아무리 많은 주소가 있더라도 쉽게 주소라벨을 만들 수 있도록 할 것이다.

주소용 라벨 스티커로는 16칸, 18칸, 21칸, 24칸이 가장 많이 사용되는데, 여기에서는 16칸 우편발송라벨 규격에 맞추어서 미리 [주소라벨] 시트에 만들어놓았다.

 

 

 

 

1. 이름 정의하기

 

함수식을 복사할 경우 인수에 사용된 범위가 항상 고정되도록 하려면??

절대참조를 사용하는 방법과 이름을 정의하는 방법의 두 가지 방법이 있다.

 

여기에서는 제목을 제외한 모든 목록범위([고객목록] 시트의 B2:H33)와 고객번호 입력란([주소라벨] 시트의 F3셀)의 이름을 정의하여 함수를 작성해보겠다.

 

범위를 선택하려면??

1. 범위의 크기가 작다면 마우스로 드래그한다.

2. 범위의 크기가 굉장히 크다면 첫번째 셀을 클릭한 후 마지막 셀을 Shift 키를 누른 상태에서 클릭한다.

 

주소 목록은 굉장히 데이터가 많은 경우가 대부분이므로 아래와 같은 방법으로 범위를 지정해보았다. 

 

 

 

 

[이름 상자]에 '주소목록'을 입력한다.

 

 

 

 

이어서 [주소라벨] 시트의 F3 셀을 선택한 후 [이름 상자]에 '고객번호'를 입력한다.

 

 

 

 

2. 함수식 입력

 

이름 정의가 모두 되었다면, [주소라벨] 시트의 첫번째 라벨 입력 부분에 각각의 함수식을 작성해보자.

 

A1 셀    =VLOOKUP(고객번호+INT(ROW(A1)/3),주소목록,6,0)
A2 셀    =VLOOKUP(고객번호+INT(ROW(A1)/3),주소목록,2,0)
A3 셀    =VLOOKUP(고객번호+INT(ROW(A1)/3),주소목록,5,0)

 

ROW 함수와 INT 함수를 모른다면 한번 미리 보자~!!

엑셀 함수 15 - ROW 함수 (엑셀 일련번호 만들기) by Y

엑셀 함수 18 - INT, TRUNC, ROUND, ROUNDUP, ROUNDDOWN 함수 by Y

 

 

함수식 설명

 

 

1) INT(ROW(A1)/3) ??

 

ROW(A1) => ROW 함수는 셀의 행번호를 구하는 함수이므로 1이 구해진다

ROW(A1)/3 => 1을 3으로 나누면 0.3333....이 구해진다.

INT(ROW(A1)/3) => INT 함수는 가까운 정수를 구하는 함수이므로 0이 구해진다.

 

여기서 잠깐~!!

식을 A4 셀에 복사할 것이므로 A4셀에는 식이 'INT(ROW(A4)/3)' 식으로 변경되어 들어간다.

(왜냐? 상대참조니까~)

결국 A4셀에는 위의 식으로는 1이 구해진다.

같은 방법으로 A7, A11... 셀에는 각각 2, 3...이 구해지므로,

결국 다음 고객번호에 해당하는 고객의 주소가 입력된다.

 

2) 고객번호+INT(ROW(A1)/3) ??

 

INT(ROW(A1)/3)의 값이 0이므로 고객번호가 1이라면 1+0 값이 구해진다.

 

2) VLOOKUP(고객번호+INT(ROW(A1)/3),주소목록,6,0) ??

 

1번 고객부터 라벨을 만들기 위해 고객번호에 1을 입력한 경우 'VLOOKUP(1,주소목록,6,0)' 식으로 생각할 수 있다. 결국~~~!!

VLOOKUP(1,주소목록,6,0) => 주소목록 범위에서 고객번호가 '1'인 데이터의 6번째 열(주소)의 값을 구해온다.

VLOOKUP(고객번호+INT(ROW(A1)/3),주소목록,2,0) => 위와 같은 데이터의 2번째 열(이름)의 값을 구해온다.

VLOOKUP(고객번호+INT(ROW(A1)/3),주소목록,5,0) => 위와 같은 데이터의 5번째 열(우편번호)의 값을 구해온다.

 

 

여기서 잠깐~!!

아래와 같이 오류가 나는 이유는 고객번호를 아직 입력하지 않았으므로 'VLOOKUP(0,주소목록,6,0)' 식으로 간략화되어 고객번호가 0인 고객을 찾게 되는데, 데이터에서 고객번호가 0인 데이터가 없으므로 값을 찾을 수 없어 오류표시가 보여진다. 어짜피 고객번호를 입력하면 데이터가 제대로 표시된다.

 

 

 

 

이어서 오른쪽 상단의 라벨 부분에 아래와 같은 함수식을 각각 작성해보자.

 

C1 셀   =VLOOKUP(고객번호+INT(ROW(A1)/3)+8,주소목록,6,0)
C2 셀   =VLOOKUP(고객번호+INT(ROW(A1)/3)+8,주소목록,2,0)
C3 셀   =VLOOKUP(고객번호+INT(ROW(A1)/3)+8,주소목록,5,0)

 

 

함수식 설명

 

 

VLOOKUP(고객번호+INT(ROW(A1)/3)+8,주소목록,6,0) ??

 

1번 고객부터 라벨을 만들기 위해 고객번호에 1을 입력한 경우 'VLOOKUP(9,주소목록,6,0)' 식으로 생각할 수 있다. 결국~~~!!

VLOOKUP(9,주소목록,6,0) => 주소목록 범위에서 고객번호가 '9'인 데이터의 6번째 열(주소)의 값을 구해온다.

VLOOKUP(고객번호+INT(ROW(A1)/3)+8,주소목록,2,0) => 위와 같은 데이터의 2번째 열(이름)의 값을 구해온다.

VLOOKUP(고객번호+INT(ROW(A1)/3)+8,주소목록,5,0) => 위와 같은 데이터의 5번째 열(우편번호)의 값을 구해온다.

 

 

여기서 잠깐~!!

아래와 같이 값이 표시되는 이유는 고객번호를 입력하지 않아도 'VLOOKUP(8,주소목록,6,0)'이므로 고객번호가 8인 데이터가 자동으로 입력되기 때문이다. 어짜피 고객번호를 입력하면 값은 변하게 된다.

 

 

 

 

3. 함수식 복사하기

 

주소라벨에 함수식을 모두 채우기 위해 함수식을 작성한 [A1:D3] 셀까지 범위지정한 후 하단에 각각 붙여넣는다.

 

 

 

 

4. 고객번호 입력하기

 

F3 셀에 1을 입력하면 고객번호가 1인 고객부터 16인 고객까지 주소와 이름, 우편번호가 자동으로 채워진다.

 

 

 

 

F3셀에 17을 입력하면 고객번호가 17인 고객부터 32인 고객까지 주소와 이름, 우편번호가 자동으로 채워진다.

 

 

 

여기서 팁~!!

만약 24칸 주소라벨을 만든다면 세로로 12개가 입력되므로 함수식에서 아래 부분을 수정하면 된다.

 

C1 셀   =VLOOKUP(고객번호+INT(ROW(A1)/3)+12,주소목록,6,0)
C2 셀   =VLOOKUP(고객번호+INT(ROW(A1)/3)+12,주소목록,2,0)
C3 셀   =VLOOKUP(고객번호+INT(ROW(A1)/3)+12,주소목록,5,0)

 

 

동영상 강좌 보기

 

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

 

 

네이버 오픈캐스트는 인터넷에서 자신이 관심있는 글들을 모아 캐스트로 발행하여 다른 사람과 정보를 공유하는 서비스다. 자신이 블로거라면 블로그에 이미 작성된 글들을 모아 발행할 수 있어 쉽게 많은 캐스트를 발행할 수 있다.

 

만약 네이버 오픈캐스트를 발행하여 네이버 메인 페이지에 내 글이 뜨게 된다면 엄청난 방문자수와 함께 고정 구독자가 생기게 되므로 방문자수와 이웃의 두 마리 토끼를 모두 잡을 수 있게 된다.

하지만, 네이버 메인에 자신의 글이 뜨는 경우는 거의 로또 수준이므로 큰 기대는 하지 말아야 할 듯하다.

굳이 메인을 노리지 않더라도 오픈캐스트를 꾸준히 발행하다보면 구독자 층이 쌓여 방문자 상승의 효과를 노릴 수 있다. 그리고 혹시라도 메인에 뜨게 된다면?? 고럼 좋은거쥐~ㅎㅎ

 

오픈캐스트를 개설하고 내 블로그 글을 모아 캐스트로 발행하는 방법에 대해 알아보자.

 

 

 

1. 네이버 오픈캐스트 개설하기

 

 

잠깐~!! 오픈캐스트를 개설하기 전에 주의할 점~!!

 

네이버 오픈캐스트는 최소한 5명의 추천을 받아야 개설이 완료되도록 되어 있다.

그러므로 미리 추천인 5명의 이메일 주소를 확보해놔야 한다.

그리고 그 5명에게 추천 메일을 받으면 꼭 메일을 보고 추천 버튼을 눌러달라고 부탁을 해놓자.

그러면 개설 신청 후 바로 개설을 완료할 수 있다.

나도 지인들에게 부탁해서 이메일 주소 5개를 받아놓고 개설 신청을 시작했다능~

 

 

네이버에 로그인하고 오픈캐스트(http://opencast.naver.com/)에 접속한 후 오른쪽 상단에서 [내캐스트 관리] 메뉴를 클릭한다.

 

 

 

 

오른쪽 상단의 [개설하기] 메뉴를 클릭한다.

 

 

 

 

오픈캐스트에 개설에 대한 안내문이 나타나면 [캐스트 개설 시작하기] 버튼을 클릭한다.

 

 

 

 

약관 동의 화면이 나타나면 동의에 체크한 후 [정보 입력 및 추천인 등록] 버튼을 클릭한다.

 

 

 

 

이제 캐스트 정보와 추천인을 등록하는 화면이 나타나면 빨간색 * 표시 부분을 모두 입력해준다.

다른건 쉬우니 오픈캐스트 주소만 설명하자면 의미있는 두개의 알파벳을 입력하면

나머지 숫자 3개는 자동으로 입력되어 내 오픈캐스트 주소가 완성된다.

 

정보 입력이 완료되었다면 추천인 메일주소에 미리 준비해놓은 메일 주소를 입력하고

[입력 완료 및 메일 발송] 버튼을 클릭하면 자동으로 추천인 메일 주소로 추천 메일이 발송된다.

 

 

 

 

개설 신청 완료 화면이 나타나면 [개설 신청한 캐스트 확인] 버튼을 클릭한다.

 

 

 

 

[내 캐스트 관리] 화면의 [개설 신청한 캐스트] 메뉴 화면이 자동으로 나타나고

추천 메일을 읽었는지(수신확인), 추천을 해줬는지(승인여부) 확인할 수 있다.

추천은 14일 이내에 완료되지 않으면 개설 자체가 취소된다.

 

 

 

 

추천이 모두 완료되면 이제 [운영 중인 캐스트]에 개설된 캐스트의 정보가 나타난다.

이 화면의 [발행하기] 버튼을 클릭하거나

[내캐스트 관리] 화면의 오른쪽 상단에서 [발행하기] 메뉴를 누르면

언제라도 캐스트를 발행하여 다른 사람과 내 정보를 공유할 수 있다.

 

 

 

 

 

 

 

2. 오픈캐스트 발행하기

 

 

오픈캐스트를 발행할 때 주의할 점~!!

 

오픈캐스트는 한번에 8~10개의 글을 담아 발행하게 되는데, 이때 캐스트 제목도 입력하게 된다.

즉, 자신의 블로그에서 같은 주제에 해당하는 글들을 모아 하나의 캐스트보드에 발행하고, 제목을 지정하면 관련글의 효과를 누릴 수 있게 된다.

그러므로 오픈캐스트를 발행하기 전에 미리 내 블로그에서 발행할 주제와 글들을 정해놓는 것이 좋다.

 

 

[발행하기] 버튼을 클릭하면 아래와 같은 팁이 나타난다.

이 방법대로 오픈캐스트를 발행해보자.

 

 

 

 

먼저 링크(글)를 등록하기 위해 [링크등록] 버튼을 클릭한다.

 

 

 

 

아래와 같은 링크 등록 화면이 나타나면...

 

1. URL에 발행하고 싶은 글의 주소를 입력한다.

2. 링크이름에 블로그 이름이 붙는다면 글제목이 너무 길게 되므로 지워준다.

3. 글을 대표할 수 있는 이미지를 선택한다.

예쁘게 따로 꾸민 이미지가 있다면 [내 PC에서 가져오기]를, 글에 포함된 이미지를 사용하려면 [원문에서 가져오기]를 클릭한다.

4. 마지막으로 [저장] 버튼을 클릭한다.

 

 

 

 

같은 방법으로 링크를 8개 이상 등록해준다.

(여기서 선택한 레이아웃은 링크가 최소한 8개는 필요하고,

링크가 모두 채워지지 않으면 발행이 안되기 때문이다.)

 

등록된 링크를 선택하고, 원하는 캐스트의 레이아웃을 선택해준 후 [링크채우기] 버튼을 클릭한다.

이때 링크를 직접 오른쪽으로 하나씩 드래그하여 원하는 순서로 링크를 넣을 수도 있다.

 

 

 

 

8개의 링크가 모두 채워지면 No.1 캐스트의 제목과 설명을 입력한 후 [발행하기] 버튼을 클릭한다.

 

 

 

 

내 오픈캐스트가 아래와 같이 표시된다.

캐스트를 수정하고 싶다면 언제라도 [EDIT] 버튼을 눌러 수정할 수 있다.

 

 

 

 

 

 

 
 
 
 

 

 

Posted by Y&S

 

 

 

 

 

처음엔 블로그에 올리는 이미지에 워터마크를 삽입할 생각이 없었던건 아니다.


자신이 만든 이미지라는 표식으로 사용되는 워터마크는 불펌을 방지하기에 좋긴하지만
가운데에 잘 보이게 넣어버리면 막상 이미지를 보는데 방해되기도 하고

그렇다고 시야에 방해되지 않도록 한쪽 구석에 얌전하게 넣으면

그 부분만 잘라서 사용할 수 있으니 넣으나마나...

 

무엇보다도 Y언니와 난 이미지를 엄청나게 사용하기 때문에

글쓸때마다 일일이 워터마크를 넣는다는거 자체가 상당히 번거로운 일이었다.
(이러니 저러니해도 결국 둘다 그놈의 귀차니즘 때문에 -_-;;)

 

정보 설명 이미지들이 많은지라 사진자체는 그닥 하나만 따로 가져다 쓸만한건 없지만

문제는 드래그 방지를 해놓았더니 아예 내용 전체를 캡쳐해서 자신의 글인양 버젓이 포스팅에 사용하는 것.
웃긴건 그렇게 캡쳐해간글에 본인의 워터마크까지 떡하니 박아놓았더라 ㅡㅡ
(진짜 어이없었음;; 자기꺼 가져가는건 무서운 모양...)

 

아무런 말도 없이 가져다가 넣은후에

구석에 아주 조그맣게 출처하나 달랑 써놓는데 이게 과연 무슨 의미가 있나 싶다.

최근의 글들이 상단에 노출될 가능성이 많은 포털사이트에서

원본인 내 글보다 그 글이 더 상단에 노출되어 인기가 많고 댓글이 달리는 상황을 보고있노라면

자식을 빼앗긴 어미의 마음처럼 매우 분노가 치솟는다.

 

자료찾아가며 이미지 하나하나 사진찍고 만드는것들이 많아서

글 하나에 기본 3~4시간, 오래걸리는건 6~7시간,
어떤건 진짜 하루 종일 포스팅에 시간을 쏟아부어 겨우겨우 작성한것을

베껴가는 누군가는 한 5분이나 걸리려나?

 

그나마도 출처조차 적지 않은건 찾기조차 쉽지않다.
출처를 적어 놓은걸 발견한것도 상당히 많았는데 출처없이 무단으로 가져다쓴건 대체 얼마나 많을지...
내용없이 우리 블로그로 넘어오도록 링크만 달아놓은건 그나마 양반이랄까...

 

 

 

 

한달 전 언니랑 나는 안되겠다싶어 오른쪽에 플로팅으로 경고문을 배치했다.
무인카메라가 설치되어 있다고 경고문을 적어놓은 가게가 아무것도 없는 가게보다

절도율이 현저히 떨어진다는걸 어디선가 들었기에...

 

하지만 경고문을 달고도 며칠 전 또다시 캡쳐해서 사용한 글들을 발견했다.
어떤건 Y언니가 자신의 개인적인 생각을 넣은것까지 전부 들어가 있더라.;;

 

진짜 이제부터라도 워터마크를 박아야되나 생각하긴 했지만... 역시 귀찮아 ㅠㅠ
이미 올라가있는 이미지의 갯수가 족히 수 천은 넘을텐데 그건 또 다 어찌하냔 말이지...

 

근데 Y언니가 글에 백그라운드로 로고를 박아넣자고 제안했다.
오~ 그런 기발한 생각이!!!!!!!

살짝 글씨랑 겹쳐서 지저분해 보이지 않을까하는 걱정이 들긴했지만

아주 흐리게 넣으면 될것 같다는 언니의 말에 작업시도.

 

이럴때 학원다니면서 html+css 배워둔게 도움이 되는구나 ㅋㅋ

티스토리는 이렇게 자유도가 높다는 점이 참 좋은거 같다.

 

 

 

 


결과는 글을 읽는데 눈에 거슬리지 않는 선에서 깔끔하게 잘 들어간것 같다.
이미지에는 워터마크가 들어가진 않지만

이제 그대로 글까지 캡쳐해서 가져다쓰는 포스팅은 막을 수 있을 듯하다.
뭐 그래도 베껴가는 사람은 베껴가겠지만...

 

우리글은 대체적으로 내용이 길어서 아마 이미지만 캡쳐해 하나하나 베껴쓰는것도 쉽지않을거다 ㅋㅋ
게다가 똑같이 베껴쓴 글들은 네이버에서 중복포스팅으로 차단되어 검색되지 않으니까

이 방법 참 괜츈한듯...

 

바탕에 워터마크 넣는 방법을 올리고 싶었으나

이게 별로 어렵진 않은데 스킨에 사용된 클래스네임에 따라 어디에 넣는지가 달라지기 때문에

올리지 못했음ㅜㅜ

 

 

 

 

어쨌든 글 통째로 가져가는 생퀴들!!!

니들 인생 참 쉽게 산다?

글 니들이 좀 써!!!!!!!!!!!!!

그럴꺼면 뭐하러 블로그를 하는건지 원...

 

 

 

 

 
 
 
 

 

 

Posted by Y&S

 

 

 

블럭박스(Block box), 인라인박스(Inline box), 라인박스(Line box)의 기본개념을 정확히 알아야

뒤에 나올 'float'을 이해하는데 한결 수월해진다.

 

 

이것들이 어떠한 형태로 이루어져있는지 보자면,

 

위와 같이 하나의 문장에는 보이지 않는 인라인박스들이 무수히 존재한다.
만일 인라인박스에 부분부분 어떠한 스타일을 주려면 span같은 인라인 태그를 삽입하여

그 부분을 지정해 사용하는 것이다.
그러니까 결국 <span>이 빠져있는 각각의 단어들은 선택만 할 수 없을뿐 전부 인라인박스인 것.

그리고 이런 인라인요소들을 감싸는 라인박스가 있으며 또다시 라인박스를 감싸는 블럭박스가 존재한다.

 

실제 라인이 그려져있지 않더라도 문장 하나하나가 이런식으로 이루어져있다고 머릿속으로 생각할 것.
   

 

 

 

 

그럼 여기서중요한 블럭박스에 사용되는 블럭요소와 인라인박스에 사용되는 인라인요소의 차이를 보자.

 

 

*블럭요소*

 

<p>태그나 <div>와 같은 블럭요소는 화면 한줄의 100%를 자기의 영역으로 가진다.
때문에 width값을 별도로 지정해주지 않으면 브라우저의 창을 줄이던 늘리던 끝까지 꽉차게 보여지는 것이다.
자리를 전부 차지해버리는 블럭요소들은 이러한 성질때문에 width값을 별도로 주지 않을 시

다른 것의 옆에 배치될 수 없다. (자신이 한줄을 다 차지해야 하므로...)

 

이때, div는 특히 모든것을 아우르는 맡형같은 존재이다.
div > p
이렇기 때문에 같은 블럭요소라도 <p>안에 <div>를 자식으로 넣을 수 없다.

 

 

*인라인요소*

 
<span>같은 인라인요소들은 width값과 height값을 줄 수 없고,

padding과 margine의 값은 인라인 글줄인 옆으로만 적용되며

위,아래의 간격은 듣지 않느다. (line-height 로만 문장의 위아래 공간을 지정할 수 있다.)

 

이때, 인라인요소 중 예외적으로 이미지<img> 태그만 width값과 height값을 지정해 줄 수 있으며
만일 이미지를 블럭요소인 <div>로 감싼다면 이미지가 한칸을 전부 차지하여
이미지 옆에 글씨를 배치시킬 수 없는 것이다.

 

 

 

 

 

실제로 해보면 아래와 같다.

 

<div>안에 50x50사이즈의 이미지 하나와 텍스트를 넣으면 

인라인요소인 이미지<img> 옆으로 텍스트가 들어가고, 남는 텍스트는 아래로 흘러내린다.

'여름방학'부분에 인라인 요소인<span>을 넣어 파란색의 점선을 그어보면 글자 양 옆으로의 '20px' 패딩은

적용되지만 위 아래로의 패딩은 먹지않아 글 높이 간격이 벌어지지 않았다.

게다가 width값 '300px', height값 '300px' 역시 아무런 영향을 미치지 않았다.

(파란색 점선은 padding값만 적용 되었을 뿐이다.)

 

 

 

 

 

 

 

 

여기서 이미지에다 블럭요소인 <div>로 감싸주고 스타일로 파란색 테두리를 쳤더니

이미지 옆에 있던 텍스트들이 아래쪽으로 밀려났다.

게다가 파란테두리 라인은 자신이 차지할 수 있는 영역만큼 전체를 꽉 채웠다.

(빨간색 바깥쪽 테두리와의 간격은 빨간색에 10만큼 패딩을 주었기 때문)

 

 

 

 

 

 

 

만일 여기에 이미지와 텍스트들을 감쌌던 <div>대신 같은 블럭요소인 <p>를 넣는다면 어떻게 될까?

 

<p>안에 이미지를 감싼 <div>가 들어갔더니 아래처럼 <p>가 <div>를 감당하지 못하고

스타일만 바깥쪽으로 빠져버렸다.

 

 

 

 

 

 

 

그럼 여기서 한가지 의문.

인라인박스와 블럭박스는 알았다쳐도 인라인박스 요소들로 이루어진 가상의 라인박스라는 개념은 왜 필요할까?이는 뒤에 float에서 알아보자.

 

 

 

 

 
 
 
 

 

 

Posted by Y&S

 

 

 

현재 블로그를 열심히 하고 있지만, 대외적으로 내 블로그가 어느 정도 위치인지는 여태까지는 크게 신경쓰지 않았었다.

그냥 방문자수가 늘면 잘 되고 있구나 짐작하고, 댓글이 많이 달리면 방문자들이 어느정도는 만족하고 있구나 짐작하는 정도랄까...

 

그런데 몇달 동안이나 방문자수와 댓글이 답보 상태인 요즈음 블로그를 꾸준히 운영하기 위한 힘을 얻으려면 동기 부여가 굉장히 중요하다는 걸 뼈저리게 느끼고 있는 중이다.

이럴때 내 블로그의 현재 성적을 알게 된다면 조금은 새로운 힘이 생기지 않을까?

 

블로그의 현재 성적을 알 수 있는 방법에는 전체 블로그 중에서 내 블로그의 순위를 알 수 있는 '블로그 랭킹'과 블로그의 통합 점수를 의미하는 '블로그 지수'가 있다.

 

 

블로그 랭킹과 블로그 지수 제공 사이트

 

블로그 랭킹 - http://www.bigkeyword.com

블로그 지수 - http://bloglevel.edelman.com 

 

 

 

 

1. 블로그 랭킹 확인해보기

 

 

 

 

 

먼저 내 블로그 순위를 알아보자.

빅키워드(http://www.bigkeyword.com) 사이트에 접속해서

화면 중간쯤을 보면 블로그 주소를 입력할 수 있는 곳이 있다.

내 블로그 주소를 입력한 후 [전체랭킹 확인하기] 버튼을 클릭한다.

 

 

 

 

 

위와 같이 내 블로그의 랭킹이 바로 뜬다.

상위 1%라는 문구는 랭킹이 만단위일 경우에도 뜨는거 같으니

괜히 흥분할 필요는 없을 듯하다.

 

이 사이트에서 랭킹을 매기는 기준은 키워드의 독점 수준이다.

즉, 내 블로그로 유입되는 키워드 중에서

네이버나 다음 등에 상위 노출되는 키워드가 기준이 된다는 말이다.

 

그러므로 블로그 투데이가 같은 두 블로그라도 랭킹은 엄청난 차이가 날 수 있다.

좋은 글을 발행할수록 상위 노출되는 키워드가 많아지므로 괜찮은 기준이라는 생각이 든다.

 

700만여개의 블로그 중에서 매겨지는 랭킹이라고 하는데

어짜피 비활동 블로그가 대부분일테니

몇만개의 블로그 중에서 매겨지는 순위라고 생각해도 무방하다.

 

이 순위는 매주 월요일마다 갱신된다고 한다.

 

어찌됐거나 457위라니 감동의 눈물이ㅠ

 

 

 

 

 

블로그 랭킹 옆에 인기 키워드를 보여주는데

키워드 전체를 다 보여주지 않고 첫글자와 글자수만 보여준다.

아마도 키워드 관련 사이트라서 결제를 해야 나머지를 보여주나보다.

 

몇개는 알겠지만 몇개는 도무지 모르겠어서 궁금하긴 하다능~

 

 

 

 

 

2. 블로그 지수 확인해보기

 

 

 

 

블로그 레벨(http://bloglevel.edelman.com) 사이트에 접속한 후 왼쪽 상단에

내 블로그 주소를 입력하고 [Calculate] 버튼을 클릭한다.

 

 

 

 

 

이 사이트는 Influence(영향력), Popularity(인기도), Engagement(상호링크), Trust(신뢰도)

4가지의 평가 항목으로 블로그를 평가하여 아래와 같이 블로그 지수를 산출해준다.

 

 

5점 이하 : 저품질 블로그
7.5 : 일반 블로그
25점 이상 : 파워블로그
50점 이상 : 유명블로그 

 

 

우리 블로그가 완전 초기일 때 호기심에 한번 알아본 적이 있었는데 7.5점이 나왔었다.

그러니 블로그를 막 시작했다면 최소한 7.5점은 나온다고 보면 된다.

 

그렇다면 지금 25점은 굉장히 좋은 점수라 생각이 드는게 파워블로그라고 하지 않는감??

뭐 그건 아니겠지만~ㅎㅎ 그래도 예전보단 훨씬 높아졌으니 그것만으로도 기쁘다.

내가 블로그 검색 중에 본 최고의 점수가 40점이었으니 그 점수를 목표로 잡아도 될 듯~

 

 

--------------------------------------------------------------------------------------------------------

 

 

만약 열심히 운영하고 있는 내 블로그의 현재 성적이 궁금하다면 위의 두가지를 알아보자.

물론 결과를 완벽히 믿을 수는 없겠지만 최소한 나에게 새로운 힘을 불어넣을 수는 있을테니 말이다.

그 새로운 힘은 블로그에 어떤 식으로든 변화를 일으킬 수 있을 것이다.

 

 

 

 

 
 
 
 

 

Posted by Y&S

 

 

 

어제 네이버에도 블로그 분석기인 애널리틱스가 있다는 걸 알고 냉큼 찾아가 우리 블로그에 소스를 심고 구글 애널리틱스와 비교해보았다.

 

둘을 비교해본 결과 구글 애널리틱스는 이런저런 기능이 많은 반면에 인터페이스라든지, 사용자 편의가 부족한 반면, 네이버 애널리틱스는 화면이 굉장히 직관적이어서 사용자가 사용하기 편리하고, 중요한 기능만 딱딱 있어 분석하기 매우 좋았다. 물론 구글 애널리틱스만의 장점도 있었다.

 

먼저 네이버 애널리틱스에 내 사이트나 블로그를 등록하는 방법을 알아보고, 구글 애널리틱스와의 비교 체험기를 올려보겠다.

 

 

1. 네이버 애널리틱스에 블로그/사이트 등록하기

 

 

네이버 애널리틱스(http://analytics.naver.com)에 방문한 후 오른쪽 상단의 [바로 시작하기] 버을 클릭한다.

 

 

 

 

1단계와 2단계를 간단히 확인하고 넘어가면 3단계 사이트 등록 화면이 나온다.

본인이 분석하고 싶은 사이트나 블로그 이름과 주소를 정확히 입력한다.

 

 

 

 

4단계에서 [스크립트복사] 버튼을 누르고 [완료] 버튼을 누르면 사이트 등록이 완료된다.

 

 

 

 

사이트 등록이 완료되면 아직 스크립트를 블로그에 복사하지 않아도 아래 화면이 나온다.

물론 스크립트를 복사해야 분석이 가능하다.

 

 

 

 

티스토리 블로그 기준으로 [관리]-[꾸미기]-[HTML/CSS 편집] 화면에서

'skin.html'의 <body> 태그 위의 아무 곳에나 아래와 같이 복사된 스크립트를 붙여넣기(ctrl+v)하면 된다.

위아래 한글은 소스의 시작과 끝을 알리기 위한 주석으로 원래는 없고, 따로 입력한 구문이다.

 

 

 

 

스크립트를 내 블로그에 적용되면 [실시간분석] 기능만은 바로 확인이 가능하다.

나머지 기능들은 24시간이 지나면 확인할 수 있다.

 

 

 

 

 

 

2. 네이버 애널리틱스 사용 후기(구글 애널리틱스와 비교)

 

 

먼저 네이버 애널리틱스가 더 좋았던 점을 살펴보겠다.

 

네이버 애널리틱스의 화면([요약-사이트현황])인데 블로거들이 흔히 말하는 킬러키워드(인기키워드)와 유입검색엔진 유입양을 한눈에 확인할 수 있다. 게다가 신규방문자와 재방문자별로 페이지뷰와 체류시간 등을 따로 볼 수 있다.

 

인기 키워드를 제외한 기타 기능들은 구글 애널리틱스에서도 확인할 수 있지만 네이버 애널리틱스처럼 쉽게 한눈에 확인할 수 없고, 이리저리 뒤져서 따로따로 확인해야 하기에 너무 좋았다.

 

 

네이버 애널리틱스의 첫화면

 

 

인기키워드는 티스토리에서 7일간의 유입키워드로 확인할 수는 있지만 네이버 애널리틱스는 날짜를 지정하여 한달 단위나 원하는 기간 동안의 인기키워드를 확인할 수 있다는 점에서 정말 환영할만한 일이다.

이 기능은 구글 애널리틱스에서도 확인할 수 없었던 기능이라 더욱 반갑다능~

 

아래 화면은 [유입분석-유입검색어] 화면인데 인기키워드를 더욱 자세히 확인할 수 있다.

 

 

네이버 애널리틱스 [유입분석-유입검색어]

 

 

네이버 애널리틱스는 당연한 말이겠지만 한국사람이라면 훨씬 편하게 블로그나 사이트 분석을 할 수 있도록 메뉴를 만들어놓고, 화면 등을 굉장히 보기 좋게 직관적으로 구성했다.

아래 구글 애널리틱스 화면을 보자면 '참여도', '고급 세그먼트', 대시보드', '방문 심도' 등 언뜻 알아보기 힘든 단어로 채워져 있고, 날짜 조회 부분도 굉장히 불편하게 구성되어 있는 걸 볼 수 있다.

아무래도 영어로 만들어진 화면을 한글로 번역하는 과정에서 알아보기 힘든 단어로 바뀐 것도 있겠지만, 편리도만 보아도 완벽한 네이버의 승~!!이라 말하고 싶다.

 

 

네이버 애널리틱스 [방문분석-방문체류시간]

 

구글 애널리틱스 [잠재고객-방문형태-참여도]

 

 

 

 

이제 구글 애널리틱스가 더 좋았던 점을 살펴보겠다.

 

네이버는 [실시간분석] 기능에서 실시간으로 사람들이 보고 있는 페이지를 볼 수 있는 '인기페이지' 기능이 있는데, 네이버 애널리틱스에서는 이 페이지를 주소로만 확인할 수 있었던데 비해, 구글 애널리틱스에서는 글제목으로도 확인할 수 있다.

이게 은근히 블로그 분석에 도움이 많이 된다. 글주소를 클릭한다고 글이 뜨는게 아니라서 무슨 글인지 알려면 글주소를 복사해서 인터넷 주소창에 붙여넣고 확인해야하는 번거로움이 있다.

그런데 구글 애널리틱스에서는 친절하게도 글제목으로도 인기페이지를 표시해주니 한눈에 파악할 수 있어 정말 도움이 많이 되고 편리하다.

워낙 평소에 도움이 많이 되는 기능이라서 만약 네이버 애널리틱스에 이 기능까지 도입된다면 구글 애널리틱스가 더이상 필요가 없을 것 같다.

 

 

네이버 애널리틱스의 실시간검색 화면의 '인기페이지'

 

구글 애널리틱스의 [실시간-콘텐츠]

 

 

 

네이버 애널리틱스에서는 방문자들이 처음 들어온 페이지(시작페이지)와 마지막으로 본 페이지(종료페이지) 등을 따로따로 표시해주고 있다. 물론 구글 애널리틱스에서도 따로 표시해주지만, 이걸 종합적으로 그림으로 표시하여 방문자가 사이트에 방문하여 나갈때까지의 흐름을 한눈에 파악할 수 있도록 보여주는 기능도 있다.

방문자 흐름을 보다보면 사람들이 가장 이탈수가 적은 페이지를 파악하기도 쉬워서 사이트 분석에 도움이 많이 된다.

 

 

네이버 애널리틱스 [페이지분석]

 

구글 애널리틱스 [잠재고객-방문자 흐름]

 

 

 

그리고, 구글 애널리틱스에서는 티스토리 사용자들이 많이 달아놓은 구글 애드센스까지 페이지별로 분석할 수 있다. 물론 같은 구글이니 가능한 기능이니까, 애드센스 분석을 원한다면 구글 애널리틱스를 사용하는 방법밖에 없다.

 

 

구글 애널리틱스 [콘텐츠-애드센스-애드센스 페이지]

 

 

 

네이버 애널리틱스는 좀더 사용해봐야겠지만 일단 둘다 사용해본 결과 네이버에 구글의 몇가지 기능만 더 추가된다면 네이버를 사용하게 될 것같은 느낌이 든다.

아쉬운 점이라면 네이버 실시간분석 화면에서 가끔 몇가지 기능이 작동을 안하는 점인데, 비슷하게 구글도 실시간 화면에서 한글이 모두 '?'로 표시되는 경우가 종종 있는 걸보면 이건 '실시간'이라는 문제때문인 듯하다.

 

그나저나 네이버로 보니 확실히 우리 블로그의 페이지뷰나 재방문의 문제점을 다시 깨닫게 되었다는 ㅠ

앞으로 블로그 소통에 힘쓰고, 블로그에 관련글을 많이 작성하도록 해야겠다.

 

 

 

 

☞ 관련글

 

2013/02/25 - 블로그 분석의 모든 것 - 구글 애널리틱스(웹로그 분석) by Y

 

 

 

 

 
 
 
 

 

 

Posted by Y&S

 

 

 

 

 

 

포토샵에서 위와 같은 포스트잇을 간단히 만드는 방법을 알아보자

 

 

 

 

1. 일단, 적당한 크기의 새창을 열어준다. (단축키: Ctrl+N)

 

 

 

 

 

 

2. 백그라운드 레이어를 더블 클릭하여 레이어가 활성화 되도록 만들어 준다.

 

 

 

 

 

3. 활성화된 레이어(Layer 0)를 다시 더블 클릭하여 아래와 같이

Grayscale Paper 패턴들을 불러온다.

(이는 CS3 기준으로 없을수도 있다.) 

 

 

 

 

 

 

4. 그 중 Lined라는 공책느낌의 줄무늬가 들어간 패턴을 배경에 적용시킨다.

 

 

 

 

 

 

 

 

5. 여기에 새 레이어를 추가하고 포스트잇을 만들 적당한 크기를 선택해

원하는 색상을 입혀준다.

(단축키: 전경색 Art+Delete배경색: Ctrl+Delete) 

 

 

 

 

 

 

 

6. 색상을 입힌 레이어를 더블클릭해 그림자효과를 준다 (Drop Shadow)

이때, 그림자 색상이 너무 진하면 색상을 살짝 흐리게 회색톤으로 바꿔준다. 

 

 

 

 

 

 

7. 원하는 색상의 그림자 선택 후 ok를 눌러 그림자를 적용시킨다.

 

 

 

 

 

 

8. 레이어에 스타일을 주면 생기는 fx라는 글씨에

마우스 우클릭을 하여 Create Layer를 선택하면

그림자 효과 레이어가 따로 분리되는데

만약 다른 효과들도 여러개 주었다면 각각의 효과 레이어들이 전부 분리된다.

 

 

 

 

 

 

9. 생성된 그림자 레이어를 선택해 지우개로 그림자를 중간중간 적당히 지워주면

입체적인 종이느낌을 살릴 수 있다.

 

 

 

 

 

이런식으로 크기와 색상을 적당히 조절하고 투명도를 준다면

아래와 같은 여러종류의 포스트잇들을 간단히 만들 수 있는 것이다.

 

 

 

 

위 PSD파일을 첨부할테니 필요하신분은 받아서 사용해보시길...

 

포스트잇.zip

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

엑셀에서 빈셀/빈칸을 모두 없애는 경우이거나, 데이터에 입력된 쓸데없는 공백을 모두 없애는 경우 [홈]-[편집]-[찾기 및 선택] 기능을 이용하면 편리하게 없앨 수 있다.

 

중간중간 있는 빈셀을 삭제할 경우 빈셀들이 떨어져 있으므로 Ctrl 키를 누르고 빈셀을 각각 선택한 후 삭제하는 경우가 대부분일 것이다. 하지만, 이 방법은 데이터가 많으면 많을수록 즉, 빈셀이 많으면 많을수록 손이 많이 가고 오래 걸리므로 그럴 경우에는 아래와 같은 방법을 사용하면 금방 빈셀을 없앨 수 있다.

 

 

아래 첨부 파일을 다운로드한 후 같이 따라해보자. 

 

빈셀빈칸없애기.xlsx 

 

 

 

 

 

빈셀/빈칸 없애기

 

 

 

 

 

파일을 열어보면 '컴퓨터부품이력' 시트에 아래와 같은 데이터가 입력되어 있다.

 

 

 

 

1. 표 범위를 선택한다.

 

 

 

 

2. [홈]-[찾기 및 선택] 메뉴에서 [이동 옵션] 메뉴를 클릭한다.

 

 

 

 

3. 선택된 범위에서 '빈 셀'만 선택하기 위해 '빈 셀' 옵션을 선택한 후 [확인] 버튼을 클릭한다.

 

 

 

 

4. 아래와 같이 처음 선택한 범위 안에 있는 모든 빈 셀이 자동으로 선택된다.

 

 

 

 

5. 선택된 빈 셀 중에서 아무 곳에서나 마우스 오른쪽 버튼을 눌러 메뉴가 나타나면 [삭제] 메뉴를 클릭한다.

 

 

 

 

6. 원하는 옵션을 선택한다.

여기에서는 '셀을 위로 밀기' 옵션을 선택했다.

이 경우 빈셀이 삭제되고 아래 데이터가 위로 올라오게 된다.

 

 

 

 

7. 이제 아래와 같이 빈셀이 삭제되어 깔끔한 표가 되었다.

 

 

 

 

 

 

 

공백 문자 없애기

 

 

 

 

 

'원제품' 시트를 선택하면 아래와 같은 표가 있다.

각 데이터에는 쓸데없는 공백이 많이 포함되어 있는 걸 볼 수 있다.

 

 

 

 

1. [홈]-[찾기 및 선택]-[바꾸기] 메뉴를 클릭한다.

 

 

 

 

2. '찾을 내용'에서는 스페이스바를 한 번 눌러 공백을 입력하고,

바꿀 내용은 건드리지 않은 상태에서 [모두 바꾸기] 버튼을 클릭한다.

 

 

 

 

3. 데이터의 공백이 모두 없어져 깔끔한 데이터가 되었다.

 

 

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

 

REPLACE, TRIM, SUBSTITUTE 함수는 문자열 데이터에서 특정 데이터만 변경하거나 없앨 수 있는 함수들이다. 주로 이 함수들은 데이터를 일괄적으로 변경할 경우 사용된다.

 

 

 

REPLACE(원본텍스트, 변경 시작 위치, 변경 문자수, 변경텍스트)

원본텍스트에서 시작 위치로부터 해당 문자수만큼 변경텍스트로 바꿔주는 문자열 함수다.

예) =REPLACE("아름다운 너희나라", 6, 2, "우리")  =>  "아름다운 우리나라"

※ 공백도 하나의 문자로 취급되므로 6번째라면 '너' 위치가 된다.

 

TRIM(텍스트)

텍스트 앞뒤의 공백은 모두 없애고, 텍스트 사이에 있는 두 개 이상의 공백은 한 칸만 남기고 모두 없앤다.

즉, 텍스트에서 무의미한 공백을 모두 없애는 함수다.

예) =TRIM("  가  나다 ")   =>  "가 나다"

 

SUBSTITUTE(원본텍스트, 텍스트1, 텍스트2)

원본텍스트에서 텍스트1을 찾아 텍스트2로 변경하는 함수다.

예) =SUBSTITUTE("Y&S", "&", "/")   =>   "Y/S"

 

 

 

*** 활  용 ***

 

 

아래와 같은 표가 있을 경우 각각의 요구사항대로 데이터를 변경해보자.

 

 

 

1. 먼저 연락처의 앞자리를 REPLACE 함수를 이용하여 모두 '010'으로 변경해보자.

 

=REPLACE(E5,1,3,"010")

 

E5 셀의 첫번째 문자부터 3개의 문자를 010으로 변경하는 함수식이다.

 

 

 

 

2. 이름의 앞뒤에 공백이 불규칙하게 삽입되어 있어 보기에 안좋다.

TRIM 함수를 이용하여 이름 앞뒤의 공백을 모두 없애보자.

 

=TRIM(C5)

 

 

 

 

3. 고객코드의 '08'은 2008년도를 의미한다.

2013년도로 변경하기 위해 '08'을 '13'으로 SUBSTITUTE 함수를 이용하여 모두 변경해보자.

 

 

=SUBSTITUTE(B5,"08","13")

 

 

 

 

 

 

*** 추  가 ***

 

SUBSTITUTE 함수의 경우 다방면으로 사용될 수 있다.

한 셀에 두 줄 이상 입력된 데이터를 모두 한 줄로 변경하고 싶을 경우의 식이다.

 

=SUBSTITUTE(A1, char(10), " ")

 

A1 셀에서 alt+enter 기호(char(10))를 공백(" ")으로 변경한다.

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

아래와 같은 생일 축하 카드를 만들어

정성을 가득 담은 카드를 사랑하는 사람들에게 줘보자~

 

 

 

 

아래와 같은 크기의 새 이미지를 만든다.

인쇄할 것이므로 컬러 모드는 CMYK로 설정한다.

 

 

 

 

눈금자를 cm 단위로 변경한 후 아래의 위치에 가이드라인을 만들어보자.

 

세로 - 0.5cm, 3.5cm, 4cm, 7cm, 7.5cm, 10.5cm, 11cm, 14cm
가로 - 0.5cm, 3.5cm, 4cm, 7cm

 

** 가이드라인을 만들 때 [View]-[New Guide] 메뉴를 이용하거나,

눈금자를 클릭한 후 드래그하여 만들면 된다 **

 

 

 

 

사각 모양 도구로 흰색의 사각형을 두 개 만든다.

그리고 각각의 Shape 1, Shape 2 레이어를 그룹에 넣는다. 

 

 

 

 

이제 패턴을 만들어보자.

1. 아래와 같은 크기의 새 이미지를 만든다.

2. 'C:0, M:30, Y:20, K:0' 색상을 세로로 칠한다.

3. [Edit]-[Define Pattern] 메뉴로 패턴으로 저장한다.

 

 

 

 

Shape 1 레이어를 선택한 후 Pattern Overlay 레이어 스타일을 적용한다.

이때 앞에서 만든 패턴을 선택하면 된다.

 

 

 

 

아래와 같은 세로줄 패턴이 채워지면

1. 아래와 같은 사용자 모양 도구를 선택한 후 드래그하여 그린다.

2. 새로 추가된 쉐이프 레이어에 Stroke 레이어 스타일을 적용한다.

3. 두께는 2px, 위치는 inside, 색상은 'C:0, M:30, Y:20, K:0' 를 선택한다.

 

 

 

 

 

이제 아래와 같이 글자를 입력한다.

 

 

 

 

사용자 모양에 적용한 Stroke 스타일을 Alt 키를 누른 상태에서

Shape 1 레이어로 드래그하여 테두리 스타일을 적용한다.

 

 

 

 

 

완성된 카드 그룹을 3개 더 복사한다.

 

 

 

 

이제 각각의 그룹 안의 레이어를 Ctrl+E 키를 눌러 하나의 레이어로 합친다.

 

 

 

 

그리고 오른쪽으로 하나씩 위치를 이동한 후

Ctrl+U 키를 눌러 마음에 드는 색상으로 각각 변경한다.

 

 

 

 

같은 방법으로 Shape 2 레이어에 다른 모양의 카드를 만들어 8개의 다른 카드를 만든다.

 

 

 

완성된 카드를 인쇄하기 위해서는

1. [Image]-[Rotate Canvas]-[90 ˚CW] 메뉴로 세로로 이미지를 회전시킨 후

2. [File]-[Print] 메뉴를 이용하여 인쇄하면 된다~

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

한글의 [모양]-[바탕쪽] 메뉴는 문서 전체에 같은 그림을 넣거나, 쪽번호에 같은 모양을 꾸민다든지, 공통된 모양을 만들 수 있는 기능으로, 파워포인트의 슬라이드 마스터 기능과 비슷한 기능이라고 생각하면 된다.

 

여기에서는 아래와 같은 5페이지의 문서가 있을 때 왼쪽에 공통된 그림을 삽입하고, 쪽번호를 사각형 안에 예쁘게 표시되도록 문서 전체에 모양을 지정해보겠다.

 

 

 

 

1. 1페이지에 커서를 위치시킨 후 [모양]-[바탕쪽] 메뉴를 클릭한다.

[바탕쪽] 대화 상자가 나타나면 기본으로 그냥 설정해둔 상태에서 [만들기] 버튼을 누르면

홀/짝 페이지에 상관없이 모든 페이지에 같은 모양이 적용되고, 1페이지부터 모두 같은 모양이 적용된다.

 

 

 

 

2. 아래와 같은 바탕쪽 편집 상태로 화면이 바뀌고,

 [바탕쪽] 도구 모음이 표시된다.

 

 

 

 

3. 페이지 왼쪽마다 모두 그림을 삽입하기 위해 도구 모음에서

[그림 삽입]을 클릭하거나,

[입력]-[개체]-[그림] 메뉴를 클릭한다.

 

 

 

 

4. [그림 넣기] 대화 상자가 나타나면 원하는 그림을 선택한 후 [넣기] 버튼을 누른다.

이때 '마우스로 크기 지정' 옵션이 해제되어 있으면

그림을 드래그하지 않아도 바로 그림이 삽입된다.

 

 

 

 

5. 삽입된 그림을 더블 클릭하면 아래와 같은 [개체 속성] 대화 상자가 나타난다.

그림의 위치에서 가로/세로를 '종이'의 왼쪽/위로 수정하여 종이의 왼쪽에 붙도록 수정한다.

 

 

 

 

6. [그림] 탭에서는 [원래 그림으로] 버튼을 클릭해서

그림의 크기를 100%가 되도록 변경한다.

 

 

 

 

7. 아래와 같이 삽입한 그림이 왼쪽에 위치하게 된다.

 

 

 

 

8. 이제 쪽번호를 사각형 안에 예쁘게 배치하기 위해 [글상자]를 삽입한다.

[입력]-[개체]-[글상자] 메뉴를 클릭해도 된다.

 

 

 

 

 

9. 문서 아래에 적당한 크기로 그린 후 테두리에서 더블 클릭한다.

 

 

 

 

10. 글상자의 [개체 속성] 대화 상자가 나타나면

[선] 탭에서 '종류'를 '선 없음'으로 변경하고, 모서리를 '둥근 모양'으로 설정한다.

 

 

 

 

11. 이어서 [채우기] 탭에서 원하는 면색을 선택한다.

 

 

 

 

12. 이제 글상자 안을 클릭해서 커서를 위치시킨 후

[바탕쪽] 도구 모음에서 [쪽 번호 넣기]를 클릭한다.

 

 

 

 

13. '##'이 삽입되면 가운데 정렬도 하고, 글자 모양도 흰색으로 변경한다.

모든 작업이 완료되면 편집을 끝내기 위해 [닫기] 버튼을 클릭한다.

 

 

 

 

14. 작업이 완료되면 아래와 같이 왼쪽에는 그림이, 아래에는 쪽번호가 표시된다.

 

 

 

 

15. 인쇄 미리보기로 5페이지를 모두 확인해보면

문서에 모두 같은 모양이 적용된 걸 볼 수 있다.

 

 

 

이와 같이 바탕쪽 기능을 이용하면 한글에서도 멋진 문서를 만들 수 있다.

 

 

 

 

 
 
 
 

 

 

Posted by Y&S

 

 

 

블로그 운영하면서 가장 많이 받은 질문 중 하나가 애드센스 광고에 대한거였다.
역시 사람들은 돈 버는 거에 가장 관심이 많은가보다 ^^:;

 


일단 티스토리블로그에 광고를 넣는 방법으로는 관리자페이지 html/css에 애드센스 광고코드를 삽입하여

웹페이지 전체에 한꺼번에 넣는 방법과
글을 쓸때마다 내용 html에 광고코드를 일일이 넣어 모바일과 PC 함께 보여지게 하는 방법이 있다.

 

 


우선 글 전체페이지에 넣는 방법을 잠시 보자면,

관리페이지 html/css에서 Ctrl+F를 눌러 article_rep_desc를 적어 넣는다.
이게 본문의 글을 써 넣는 내용부분이라 할 수 있는데
를 기준으로

위쪽에 광고코드를 넣으면 본문상단에,
아래쪽에 광고코드를 넣으면 본문하단에 광고가 출력되는 것이다.
물론 광고코드를 여러개 이어붙여도 상관없다.

 

아래 그림과 같이 광고코드를 넣었다면 물론 본문 상단에 광고가 보여진다.

 

 

 

 

하지만 이런식으로 넣은 광고는 아쉽게도 모바일엔 나오지 않는다.
모바일을 통한 블로그 유입량이 절반을 넘어서는 지금

만일 모바일에 광고를 넣지 않으면 상당한 잠재고객을 잃게 되는것이다.


때문에 모바일과 PC에 같이 광고가 나오게 하기 위해서

포스팅을 할때마다 html에 따로 광고코드를 넣어줘야하는데
모바일광고 넣는 방법은 아래글에서 확인할 수 있다.

 

모바일광고 다는 방법 보기

 

 


이런저런 많은 시행착오를 겪고 몇 달간 실험해 본 결과
우리는 본문 상단 300x250짜리 두개의 광고가 수익면에서 가장 안정적이라고 생각했기 때문에 ]

(이는 물론 블로그마다 다르겠지만) 
현재 우리 블로그에서는 본문상단 우측광고는 관리자페이지 html/css에 넣어 전체 페이지에 나오게 했고
상단 좌측광고는 글을 쓸때마다 html에 넣어 모바일과 PC에 보여지게 만들었다.

 

 

 


그런데 이렇게 그냥 넣으면 간격이 잘 안맞고 두개의 광고가 나란히 위치하지 않기 때문에

그런꼴을 못보는 난, 약간의 스타일과 태그를 넣어 간격을 조정했다.

 

 

 

예를들어,

관리자페이지에 넣은 본문 상단 우측광고에는 위쪽에 아래와 같이 넣었고

<div calsss="article">
<div style="float:right;margin:43px 8px 0 4px;">

광고코드 삽입

</div>
</div>
<p><p><p>

 

 

글을 쓸때는 html에 아래와 같이 넣었다.

<P>&nbsp;</P>
<P>&nbsp;</P>

광고코드 삽입

<P>&nbsp;</P>
<P>&nbsp;</P>


이는 우리 블로그의 본문 가로폭 사이즈에 맞춰 300x250사이즈 광고 두개를 기준으로 조정한 것으로

광고가 들어갈 가로폭이 좁다면 당연히 300x250 사이즈 광고하나가 밑으로 밀릴것이고,

폭이 넓다면 [ margin:43px 8px 0 4px ]코드에서 픽셀값을 조정하면 된다.
43px은 위의 간격, 8px은 오른쪽 간격, 0은 아래 간격, 4px은 왼쪽 간격을 지정해주는 것으로
아마 좌,우 정도만 적당히 숫자를 조정하면 될 것이다.

 

 

 

 

 

자, 그럼 여기서 사람들이 헷갈려하는 문제.
바로 구글 애드센스 광고개수에 관한거다.

구글 애드센스에서는 한 페이지에 보여지는 광고를 3개까지규정하고 있다.
만일 그 이상 넘어가면 광고가 먹통이 되어 아예 화면에 출력되지 않는 것이다.

 


그럼 모바일 광고와 PC광고는 어떻게 개수가 적용될까?


이게 헷갈리는게 사람들이 PC광고와 모바일광고를 따로 분리해서 생각하기 때문인데

그냥 광고가 어디 나오느냐의 차이지 같은거라 생각하면 된다.

작년인가(?) 구글 애드센스에서는 콘텐츠광고와 모바일광고가 하나로 통합되었기 때문이다.

 

예를 들어 관리자페이지에 광고두개를 넣고 글쓸때 광고하나를 넣었다면

한페이지에 총 세개의 광고가 들어간것이며, 그 중 한개는 본문에 직접 넣었기때문에 모바일에서도 보여진다.

 

또는 관리자페이지에 광고를 한개도 넣지않고 글을 작성하면서 세개를 다 넣었다면

역시 PC에서 한페이지에 총 세개의 광고가 보여지며, 모바일에서도 세개가 전부 보여진다.
이러면 최대 6개의 광고효과까지 누릴 수 있는 것이다.

 

 

 

 

하지만 포스팅 중 내용 중간중간에 광고를 넣으면서 악의적으로 오클릭을 유도한다면 (링크나 이미지 근처)

이는 구글정책에 위배되어 광고가 정지당할 소지가 있으므로 신중을 기해야 한다.

 

 

결론은 PC에서 총 세개의 광고만 넣는다면 구글정책에 위배되지 않는 선에서 어느곳에 넣든 상관없다는 얘기.
그리고 그 중 모바일 광고는 본문에 넣은 광고만 보여진다는 것.

 

 

 

마지막으로 위에서 모바일에 광고넣는 방법을 읽었다면

광고를 PC에서는 보여지지 않고 모바일에서만 보여지게 숨김처리하는 법을 알 수 있다.

 

이 때, 간혹 사람들이 PC에서 숨김처리했으니 다른 광고하나 더 넣을 수 있는지에 대해 물어보는데
숨김처리는 말그대로 살짝 눈가림일 뿐이다.
구글 애드센스에서는 데이터를 이미 처리해서 광고가 출력되었기때문에

모바일에서 광고가 보여지는 것이고 PC에서 보이지 않더라도 한개의 광고로 똑같이 인식된다.

 

한마디로 그런 꼼수는 통하지 않는다는 것 ㅋ

숨김처리는 그냥 미관상 필요할때 사용하는 것뿐^^

 

 

 

 
 
 
 

 

 

Posted by Y&S

 

 

 

표에서 원하는 셀만 블록(까맣게 범위 지정하는 것을 의미)을 설정한 후 글자모양, 문단모양, 표 테두리, 배경색, 크기 변경 등의 작업하는 건 많이 해봤을 것이다.

셀을 블록 설정할 때 마우스로 드래그하는 방법을 가장 많이 사용하긴 하지만, 하나의 셀만 선택한다든지, 쉽게 표 전체를 선택한다든지, 떨어져 있는 셀을 선택하기 위해서는 키보드를 사용하는 것이 편리하다.

 

 

키보드와 마우스로 한글 표를 블록 설정하는 방법에 대해서 알아보자.

 

[F5] 한 번 누르기 - 커서가 위치한 셀만 블록 설정된다. (회색 원이 표시됨)

[F5] 두 번 누르기 - 커서가 위치한 셀부터 4개의 방향키로 연속된 셀을 블록 설정할 수 있다.(빨간색 원이 표시됨)

[F5] 세 번 누르기 - 무조건 표 전체가 블록으로 설정된다.

[Shift] 누르고 클릭 - 커서가 위치한 셀부터 [Shift] 누른 상태에서 클릭한 셀까지 연속된 셀을 블록 지정할 수 있다.

[Ctrl] 누르고 클릭 - [Ctrl] 누른 상태에서 클릭한 셀마다 블록 지정되므로 떨어져 있는 셀을 선택할 수 있다.

 

 

위의 5가지 방법으로 셀 블록을 설정하는 방법을 아래의 표로 실습해보자.

 

 

 

1. [F5] 한 번 누르기

하나의 셀만 블록 설정할 경우 원하는 셀을 클릭하여 커서를 옮긴 후 [F5] 키를 한 번 누르면 된다.

이때 블록 가운데에 회색 원이 표시되고, 방향키를 누르면 블록을 원하는 셀로 이동할 수 있다.

 

 

 

2. [F5] 두 번 누르기

빨간색 원이 표시된 블록이 표시되고 방향키를 누르는 방향으로 블록을 지정할 수 있다.

 

 

 

3. [F5] 세 번 누르기

표 안에 커서가 어디에 있었든지 무조건 표 전체가 블록으로 설정된다.

아무리 큰 표라도 이 방법으로 간단하게 표 전체를 블록 지정할 수 있다.

 

 

 

4. [Shift] 누르고 클릭

시작 셀을 먼저 클릭하고, 마지막 셀을 [Shift]를 누른 상태로 클릭하면

아래와 같이 연속된 범위를 설정할 수 있다.

 

 

 

5. [Ctrl] 누르고 클릭

처음부터 [Ctrl]을 누르고 원하는 셀을 마우스로 선택하면

아래와 같이 떨어져 있는 셀들을 블록 지정할 수 있다.

 

 

 

처음부터 [Ctrl]을 누르고 마우스로 드래그하면 아래와 같은 블록도 설정할 수 있다.

 

 

 

표에서 무슨 작업을 하든지 블록을 설정하는게 가장 먼저 할일이다.

이때 마우스 뿐만 아니라 키보드도 이용하면 다양한 모양의 블록도 설정할 수 있게 된다.

 

 

 

 

 
 
 
 

 

Posted by Y&S

 

 

 

함수나 수식으로 계산한 후 표시되는 숫자의 자릿수를 지정할 수 있는 함수에는 INT, TRUNC, ROUND, ROUNDUP, ROUNDDOWN 함수 등이 있다.

이 중에서 TRUNC 함수는 인수에서 자릿수를 생략할 경우 INT 함수처럼 정수만 표시하고, 생략하지 않을 경우 ROUND 함수 등과 같은 방식으로 사용할 수 있는 함수다.

 

------------------------------------------------------------------------------------------------------------

 

먼저 정수만 표시할 경우의 INT, TRUNC 함수에 대해 먼저 알아보자.

 

 

 

 

=INT(수)

수에서 소수 부분을 버리고 정수로 표시한다. 단, 인수를 넘지 않는 가장 가까운 정수를 구한다.

예) =INT(4.5) => 4, 4.5에서 가까운 정수는 4와 5인데, 4와 5 중에서 작은 정수인 4가 답으로 구해진다.

=INT(-4.5) => -5, -5에서 가까운 정수는 -5와 -4인데, -5와 -4 중에서 작은 정수인 -5가 답으로 구해진다.

즉, 수의 앞과 뒤에 해당하는 정수 중에서 더 작은 정수가 답으로 구해진다.

 

=TRUNC(수, [자릿수])

자릿수를 생략할 경우 수에서 소수 부분을 버리고 정수를 구한다.

예) =TRUNC(4.5) => 4, =TRUNC(-4.5) => -4

TRUNC 함수는 수에서 소수 부분을 버리면 곧 답이 된다.

 

------------------------------------------------------------------------------------------------------------

 

이어서 원하는 자릿수를 지정하여 표시하는 ROUND, ROUNDUP, ROUNDDOWN, TRUNC 함수에 대해 알아보자.

 

자릿수가 양수/음수/0일 경우

자릿수가 양수일 경우 - 숫자를 반올림/올림/내림/버림해서 소수 이하 자릿수만큼 표시한다.

자릿수가 음수일 경우 - 숫자를 반올림/올림/내림/버림해서 0의 개수를 자릿수만큼 표시한다.

자릿수가 0일 경우 - 숫자를 반올림/올림/내림/버림해서 정수만큼 표시한다.

 

예)

자릿수가 3일 경우 소수점 이하 세자리까지 표시한다. ( =ROUND(1234.5678, 3) => 1234.568 )

자릿수가 0일 경우 정수로 표시한다. ( =ROUND(1234.5678, 0) => 1235 )

자릿수가 -2일 경우 백단위로 표시한다. ( =ROUND(1234.5678, -2) => 1200 )

 

 

 

 

=ROUND(수, 자릿수)

지정된 자릿수로 반올림한 숫자를 표시함

 

=ROUNDUP(수, 자릿수)

지정된 자릿수로 올림한 숫자를 표시함

 

=ROUNDDOWN(수, 자릿수)

지정된 자릿수로 내림한 숫자를 표시함

 

=TRUNC(수, [자릿수])

지정된 자릿수로 버림한 숫자를 표시함

 

위의 함수들의 자릿수에 대한 각각의 결과는 위의 그림을 참조한다.

 

------------------------------------------------------------------------------------------------------------

 

활  용

 

 

 

 

------------------------------------------------------------------------------------------------------------

 

참고로 단순히 소수점 이하 자릿수만 지정할 경우 아래의 표시형식에서 [자릿수 늘림], [자릿수 줄임] 명령을 이용해도 된다. 하지만, 정수 부분의 자릿수를 지정할 경우에는 위의 함수를 사용해야 가능해진다.

 

 

 

 

 

 

 

 

 

 

Posted by Y&S

 

 

 

i n v i t a t i o n

티스토리 초대장

Y&S 블로그에서 초대장을 세 번째로 배포하려고 합니다.

 
아래의 조건을 만족하시는 분들 중에서 선택하여 드리려고 합니다. 초대장을 받으신 후 24시간 내에 블로그를 개설하지 않으면 바로 회수하니 바로 개설해주세요.


일요일 저녁에 댓글 확인 후 일괄적으로 초대장을 보내드리겠습니다. 
즉, 선착순이 아니니까 댓글을 최대한 정성스럽게 써주세요. (댓글은 비밀댓글로 써주세요)
 

이런 분들께 드립니다!

1. 다른 블로그를 사용해보셨던 분 블로그 주소를 남겨주세요. (선택사항입니다.)
2. 이메일 주소가 정상적인 분 (필수)
3. 블로그를 시작하려는 이유를 최대한 인상적으로 남겨주신 분 (필수)

 

어느새 벌써 세 번째 초대장을 배포하게 되었네요.

이젠 저에게 어느 정도 열심히 운영하실 분들을 알아볼 수 있는 노하우가 생겼길 바랍니다.

 

초대받으신 분들의 블로그는 꾸준히 모니터링 중이고, 앞으로도 그럴 예정이니 이상한 용도로 블로그를 이용하실 분이나 처음에 글 몇 개 쓰시고 블로그를 내버려두실 분들은 신청을 자제해주시길 부탁드립니다.

 

제가 초대한 분이 블로그를 열심히 운영하시는 모습을 꼭 보고싶은 맘입니다. 그래서 초대한 보람을 느끼고 싶으니 열심히 운영하실 분들의 신청을 기다리겠습니다.

 

 

 

 

 

Posted by Y&S

 

 

 

그럼 앞의 이론을 바탕으로 간단한 박스모델을 연습해 보자.
물론 리셋 css가 들어가있는 상태이다.

 

 


<연습1>

 

아래와 같은 박스들을 만들면 되는데,
440x440 사이즈의 선두께가 4픽셀인 빨간 테두리에

100x100, 392x100, 200x100 사이즈의 세 개 박스가 들어가 있고
그 중 가운데 392x100의 박스에는 텍스트들이 테두리에서 안쪽으로 5픽셀의 공간을 두고 들어가 있다.

 

 

 

 


이를 코딩하면 아래와 같다.

 

 

 


클래스 네임은 임의로 지정해 준 것이며 바깥 쪽 박스를 mother,

안에 박스를 차례로 son1, son2, son3 으로 주었다.

이때 주의할점은 보더(border)값과 패딩(padding)값을 계산해서

가로값(width), 세로값(height)을 주어야 한다는 것.


위에서는 'mother'의 패딩값을 사방으로 20픽셀로 주고 나머지는 그에 맞춰 'son'에서 마진으로 간격을

조정했는데 이건 딱히 정답이 있는건 아니다.
본인이 하기나름인데 무수히 많은 작업을 하다보면 겹치는 부분을 마진으로 넣어야 할지 패딩으로 넣어야 할지, 위로 넣어야 할지 아래로 넣어야 할지 헷갈리게 마련.


자신만의 규칙을 만들고 상황에 따라 적용시킬 수 있어야한다.
가장 좋은 방법은 다른 페이지에 공통된(재사용 가능한가의 문제) 부분이 있는지를 살피고

코딩을 최대한 줄일 수 있도록 실용적으로 사용하는것.
이를 위해 구조화, 규격화 하는 연습이 끊임없이 필요하다.

 

 

두번째 392x100의 박스는 굳이 가로(width)값을 주지 않아도 <div>태그가 블록요소이기 때문에

사용가능한 공간내에서 꽉 들어찬다.
이미 바깥박스에 사방으로 패딩 20을 넣었기 때문에 굳이 계산해서 width값을 넣어주지 않아도

결과물은 같다는 것.

이를 브라우저에서 확인하면 아래와 같이 출력된다.

 

 

 

 

이때 가운데 박스의 글씨는 패딩값 10을 사방으로 주었다 해도 글이 길어진다면 아래쪽은 적용되지 않고

밑으로 계속 넘쳐 흐른다는 사실.

 

 

 


 

 

<연습2>

 

아래와 같은 크기의 간단한 박스들을 만들어보자.

 

 

 

이를 코딩하면 아래와 같다.

 

 

 

물론 이도 정답이 있는건 아니다.

안쪽박스에서 전부 바깥쪾으로 마진을 주어 해결할수도 있겠으나

 

위에서는 제일 바깥쪽 박스(mother)에서 안쪽 사방으로 패딩을 준 후 안쪽 두번째와 세번째 박스(son2)를 위쪾으로 마진10 만큼 주어 공간을 띄웠다.

 

 

 

 

 

 

그렇지만 이런 반복되는 같은 스타일은 다른방식으로 처리할수도 있다.

 

 

 

첫째, 멀티클래스 네임사용

 

멀티클래스는 여러개의 클래스네임을 같이 사용하는것을 말한다.

안쪽박스의 클래스 네임을 전부 'son'으로 주고 위쪾으로 마진 '10'을 주었다면 안쪽 첫번째 박스의 마진이 'mother'에 준 패딩이랑 겹쳐서 위쪾이 총 20픽셀의 공간이 생기게 되는데

 

이 때 첫번째 박스에 한칸띄어 클래스 네임을 더 주고 

.son.first 이런식으로 사용하여 마진을 0으로 만들면 맨 위쪾에 들어간 마진10이 빠지면서 결과가 같아진다.

 

스타일이 중복이 될 경우 클래스 네임 한개보다 클래스 네임 두개를 쓴것이 우선되므로

첫번째 .son에서 안쪽박스들의 마진을 위쪾으로 전부 준 후에

두번째 son.first에서 첫번째 박스의 위쪾으로 준 마진 하나가 도로 빠진다는 것.

 

 

 

 

 

 

 

둘째, 가상클래스 네임사용

 

가상클래스는 말 그대로 클래스 네임을 따로 넣어주지 않고도 사용할 수 있다는건데

'익스플로러6' 까지는 적용되지 않아서 제작년까지도 쓸 수 없었다고 한다.

현재는 익스플로러6 사용자가 거의 없으니 사용되는데,

 

아래처럼 같은 이름을 가진 동급의 자식들 중 first-child를 써서 첫째를 부르거나

last-child를 써서 막내를 부를 수 있다. 

 

그러니까 멀티클래스를 사용했을때와 동일하게 'mother'에 패딩을 사방으로 넣고

'son'에 위쪾으로 패딩 10만큼 준 후, 'son중 첫번째 놈'의 마진을 다시 0으로 만들어 주었다.

결과물은 역시 똑같이 출력된다.

 

 

 

 

 

'멀티클래스 네임''가상클래스 네임'은 첫번째 방법보다 스타일의 사용을 줄이면서

좀 더 구조화 할 수 있으므로 상황에 따라 적절히 사용할 것!!!

 

 

 

 

 
 
 
 

 

Posted by Y&S