[전자신문]중대형 TSP 시장 변화 추이

10 Jun

전자 신문 : “LG 디스플레이, 중대형 TSP시장 ‘터치

스마트 패드 시장이 타깃이였던 TSP가 노트북과 데스크톱에서 점유율이 높아 짐에 따라 LG디스플레이에서 G2 TSP생산량을 늘리고 있다. 수요감소로 늘어난 4~5세대 LCD생산라인을 개조해서 사용할 예정. 대만 업체 AUO, 이노룩스도 TSP시장에 뛰어들고 있어 60~70달러 수준인 12인치 TSP가격이 절반으로 떨어질 예정

기사 통계 출처 : KDB대우증권 리서치센터

Advertisements

[정리]html

14 May

1. ID와 클래스의 쓰임의 차이

클래스는 다수의 요소에 사용이 가능하기 때문에 특정 요소를 유일한 스타일로 쓰고 싶다면 ID를 쓰는 것이 좋다.
-id 사용 방법: #id, p#id
1)#id :  해당 아이디를 가진 요소에 효과 적용
2)p#id: p요소가 해당 아이디를 가지고 있다면 p요소 선택????

2. 스타일 시트 리믹싱

CSS스타일을 여러개 작성하여 한페이지에 여러가지 스타일 적용가능

1)link를 여러개 작성하면 가장 하단의 link가 우선순위로 적용됨
: 상속 개념이 적용되며 상단의 CSS의 효과가 재정의 되지 않으면 그대로 사용함.

2)미디어 상황에 따라서 다른 효과 적용가능-미디어쿼리(440p)
: media=”screen, print 등등”,  max-device-width= 30px, min-device-width, max-width
=>미디어쿼리는 활발히 개발되고 있는 영역임(http://www.w3.org/TR/css3-mediaqueries/)

3. 정렬 요소들
text-align 같은 정렬 속성은 모든 인라인 요소에 적용됨(리스트, 이미지, 단락 등등)
하지만 블럭요소에 적용해야만 작동하며, 인라인 요소에 바로 적용하면 작동하지 않음.

4. 블럭요소에 선언된 ID 사용.
블럭 요소에 아이디가 선언되었을 경우. 그 사용은 #id h2{~~}와 같은 방법으로 사용되어야 한다. h2#id{~~}와 같은 방법으로도 사용 가능 하고 블럭 내부에만 효과가 적용되지만, 만약 블럭 외부의 동일한 요소 속성이 (h2) 선언 되었을 경우 블럭 내부에 적용하고자 했던 속성이 적용되지 않고 외부에서 먼저 선언되 효과가 적용되게 된다.

원리가 무엇인가? :  ID가 선언된 블럭 속의 요소에 접근하고자 할때는 먼저 아이디에 접근하고 그리고 그 안의 요소에 접근하는 것. 그리고 ID나 클래스가 선언된 요소(블럭요소 안에 있지 않은)에 접근할 때는 요소에 먼저 접근하고 나서 아이디나 클래스에 접근한다.

5. 줄간격 비율 속성으로 바꾸기
css  div같은 블럭 요소에 별도의 font-size 설정이 없다면 body와 같은 상위 요소의 속성을 상속 받는다. 이때 블럭요소 div에 line-height를 설정할 경우. 우선순위에 따라서 font-size를 선택하여 line-height속성을 적용한다. 하지만 여기서 블럭요소 div에 h1과 h2같이 font-size가 다른 요소가 존재 하더라도 기본으로 설정된 font-size에 비례해서 line-height를 설정해, 충분한 줄간격이 확보되지 않는 경우가 발생한다.
이 경우 line-height: 1; 과 같이 숫자로만 비율을 설정해주면 각의 요소의 font-size에 적절하게 비례하는 크기로 line-height를 설정한다.

6. 속성 간단하게 작성하기
padding & margin : 위 오른쪽 아래 왼쪽 순서로 입력
border & background : 순서 자유롭게 입력, 세부 속성은 레퍼런스 참조
ex)border- width,style,color
background-color, image, repeat
font : font-style font-variant font-weight(선택사항) font-size(필수)/line-height(선택)  font-family(필수)

7. span 요소
span 요소는 인라인 콘텐츠를 논리적으로 분리 혹은 묶는다.
특정요소를 아주 강하게 강조하고 싶으면 em이나 strong같은 요소를 사용하는 것이고, 스타일 변경을 원하는 경우 span을 사용한다.
인라인 요소의 패팅은 좌우에만 추가 된다. 이미지는 다른 인라인 요소와 다르게 블록처럼 작동한다.

8. 의사 클레스
클래스는 아니나 클래스 처럼 스타일을 명시하는 것을 허용하기 때문에 의사클래스라 한다. 하지만 HTML내부에 직접 입력하진 않는다. 또한 방문자들이 페이지를 사용하는 동안 발생하는 현상에 기반을 두고 여러가지 꾸미기를 제공한다.

9. 캐스케이드
여러 스타일 시트 중 어떤 스타일을 사용할 지 브라우저가 결정하는 방법
작성자>사용자>브라우저 정의의 우선순위를 기준으로 결정하며 그 내에서 여러개의 링크가 존재하는 경우
0 0 0
1)선택자가 id를 가지고 있는 경우 각각 1점
2)선택자가 클래스 혹은 의사 클래스를 가지고 있는 경우 각각 1점
3)선택자가 요소의 이름을 가지고 있는 경우 각각1점
으로  계산해서 크기가 큰 스타일 시트가 우선순위를 가지게 된다.

10. 플로우 속성
플로우 속성은 left와 light가 있으며 해당 블록 요소는 레이아웃에서 떠있는 형태가 된다.
다른 블록 요소는 float 속성이 적용된 블록 요소를 무시하고 인라인 요소는 해당 블럭 요소를 피해서 배열 된다.
플로우 속성이 없는 경우 인라인 요소의 마진은 서로 겹치지 않고, 블록 요소의 마진은 큰쪽으로 합쳐진다.
플로우 속성이 적용된 블럭요소의 경우 상단의 마진은 무시되지 않지만 나머지는 무시된다.(상단 블럭요소의 마진 이후에 배열되기 때문에)

[질문]공부 중 질문들!

13 May

질문1 : css요소에서 padding-left를 설정할 때 em을 기준으로 잡으면 무엇을 기준으로 잡히는가??

답 :padding은 컨텐츠와 관련있는 여유 이므로  해당 요소의 font와 관련되어 비율이 변한다.

ps : padding 말고도 margin요소도 역시 해당 요소 혹은 클래스의 font의 크기와 비례해서 비율의 기준이 변한다.  em은 거의 대부분 그러한듯.

————————————–————————————–————————————–

질문2: HTML에서 ID를 css에서 사용할 때 p#id{~~~}와 #id  h2{~~~}의 차이점은 무엇인가?

상황 : p#id{~~~}의 경우 요소 p에 ID가 직접 선언 되었고, #id h2{~~}의 경우에는 h2를 컨테이너(div)가 감싸고 있는 상황에서 h2에 효과를 주려고 한다.

답 :

추론 :  요소의 ID에 적용되는 효과는 그 요소에 바로 영향을 미치나, 컨테이너(div)내부에는 컨텐츠가 존재 하지 않고 박스만 존재 하기 때문에  컨테이너id에 부과된 효과는 컨텐츠에 영향을 미치지 못할 것이다.

ps : 두번째 것은 컨테이너 외부에 h2의 효과가 이미 선언 되어 있을 때 컨테이너 내부(div)의 h2에 다른 효과를 주기 위해 사용 되었다.(h2#id로 선언하면 외부에 먼저 선언된것이 우선순위를 가졌다.)

————————————–————————————–————————————–

질문3 : ” p#id: p요소가 해당 아이디를 가지고 있다면 p요소 선택” 라고 되어 있는데 ID는 이미 유일하게 할당되는데 굳이 선택하는 이유가 무엇인가? 해당 요소 내부에 또 다른 요소가 있을 경우 p#id의 형식으로 선택 가능한가? 아니면 꼭 #id p의 형태를 선택해야 하는가?

답 : (실험) ID가 선언된 블럭 속의 요소에 접근하고자 할때는 먼저 아이디에 접근하고 그리고 그 안의 요소에 접근하는 것. 그리고 ID나 클래스가 선언된 요소(블럭요소 안에 있지 않은)에 접근할 때는 요소에 먼저 접근하고 나서 아이디나 클래스에 접근한다.

ps : 실험해보고 정리 란에 써놓을것.

[전략]강연 비즈니스에 대한 TED의 자세

26 Apr

어제 TED의 성공비결에 대해서 이야기 하는 세미나에 다녀 왔는데, 한국에서 TEDx명동을 개최하시고 TED2013에 시니어 대사로 참여 하신 최웅식님의 강연이였다. 내부에서 벌어지는 일을 알게 되어 많은 도움이 되었다.

스크린샷 2013-04-26 오후 10.34.13

출처 : http://www.ted.com

TED에는 큰 변화가 있었는데 설립자 리차드 솔 워먼(Richard Saul Weman)이 소유주의 자리에서 물러나고 크리스 엔더슨(Chris Anderson)이 소유하게 되었다. 그와 동시에 TED는 새플링 재단에 인수되면서  영리단체에서 비영리 단체로 전환되었는데, 참석자들에게만 공개되는 폐쇠된 형태에서 개방형으로 바뀌면서 도약을 맞이하게 되었다.  리처드 솔 워먼은 TED의 핵심컨텐츠를 만들어 냈고, 크리스 엔더슨은 그 가치를 재생산하고 확산시킬 수 있는 구조를 만들어 냈다고 보여진다.

1. 리처드 쏠 워먼 의 핵심 가치-청중 경험 설계, 강연자는 록스타

리처드 쏠 워먼은 컨퍼런스에서 가장 중요한 것은 강연이 아니라 청중이라 생각했는데, 청중의 질이 컨퍼런스의 질을 결정 한다고 생각했다. 그래서 청중을 선별적으로 받는 독특한 전략을 취하게 된다. 1회 TED의 입장료는 1000$였고(현재는 7500$-약840만원), 참석을 위해서는 에세이 수준의 자기 소개서를 써야 했다.( 업적, 제품, 발명, 작품 등에서의 성취에 대해).  이러한 정책은 현장의 분위기를 일종의 팬덤이 날 수 있는 상태로 변화 시키게된다.  사회적으로 명망있는 사람들 혹은 그에 준하는 사람들이 모여서 서로 감탄하고 열광하고 소통하는 장소- 그래서 TED에서 강연하고 듣는 자체가 세계를 변화시키는 의미있는 일이 되는 것.  이것이 이후 TED의 성장 원동력이 되는 핵심 가치가 된다.  리처드 쏠 워먼은 1회 TED부터 이러한 정책을 유지했는데,  사업상 알고 있던 인맥들의 도움이 컸다고 생각된다.

그리도 또 다른 핵심 가치는 강연자를 청중들의 록스타로 만든다는 것이다. 그러기 위해서 연사를 철저히 서포트 하는 시스템을 갖추고 있는데, 한편으로는 연사의 자유도가 낮고 TED에 의해서 컨트롤 당한다는 생각까지들 정도 이다. 발표준비는 스피치교육, 프레젠테이션 및 리허설을 포함하는 7단계의 준비과정과 메이크업과 의상, 무대까지 컨트롤 하는 공연시스템을 갖추고 있다. 이러한 시스템을 통해 연사는 이런 과정을 통해 유머와 철학 그리고 특별한 용기를 갖춘 지성의 락스타로 거듭나게 된다.

스크린샷 2013-04-26 오후 10.35.50

 출처 : http://www.ted.com/

여기서 그치지 않고 무대는 위의 모습 처럼 콘서트장과 비슷한 모습으로 꾸며지며, 6개 이상의 조명을 사용하고 연사는 조명에 맞는 색으로 옷을 맞춰 입는다. 또한 18분 안에 자신의 이야기를 압축하여 전달하며 빠른 템포를 유지하는데, 이 모든 요소들이 합쳐지면서 높은 수준 지성을 갖춘 팬덤을 만들어 내게 된다.

이 두가지가 어우러 지면서 청중경험AX(Audience experience)을 만들어 내게 되는데, 더 많은 AX를 위한 여러 프로그램이 존재 한다. 사용자 경험은 참가자간의 네트워크가 큰 비중을 차지한다.
– 행사장에 바련된 다수의 소셜 스페이스(후원 기업)
– 연사와의 저녁 시간
– 5명 이상이 모여야 받아 갈 수 있는 점심 바구니
– 후원 기업에 의해 주최되는 식사 자리(기업측에서 초청을 해야 참여 할 수 있다.)
– TED connect(TED알고리즘에 의해 추천되는 인맥 top 10)

이 중 가장 흥미로운 것은 TED connect인데, 내 관심사를 몇가지 선택하면 독자알고리즘에 의해 추천된 10명의 리스트를 받을 수 있다. 실제로 top10 list를 바탕으로 많은 만남이 이루어 진다고 한다.  모든 참가자는 동일한 대우를 받는 원칙, 특별한 성취를 이룩한 참가자들, 그리고 connect와 같은 시스템이 결합되며  참가자에게 네트워킹에 의한 특별한 경험을 제공하게 된다.

2. 크리스 엔더슨의 비즈니스 모델 – 개방, TED에 손대지 말것

 크리스 엔더슨(Chris Anderson)은 우리가 알고 있는 TED를 만들어 낸 장본이다. 2002년에 내리막을 걷기 시작하던 TED를 인수하면서 폐쇄형 구조를 개방형으로 바꾼 장본인이다. 그가 한 일 중 가장 큰 일은 역설적이게도 TED에서 아무것도 바꾸지 않은 것이다. 그는 TED자체로 완벽하다고 생각했고, TED를 망치는 지름길은 무언가를 바꾸는 일이라고 외치고 다녔다. 그의 말데로 그는 TED가 외부로 커지는데 집중하는데 인수 후의 최초의 그의 행보를 생각하면 인수 당시에 TED를 다시 살려내기위한 확고한 계획은 없었던 것으로 보인다. 단지 TED의 가치를 확신하고 더 많이 퍼트리고자 하는 열정과 아이디어가 있었다고 생각된다.

그의 최소의 시도는 BBC에 영상을 파는 것이였는데, BBC는 너무 지적인 컨텐츠라는 명목으로 이것을 거절한다. 다음 시도는 팟케스트와 홈페이지를 통해서 강연영상을 공개하는 것이였는데, 유료컨퍼런스라는 가치가 흔들리수 있어서 위험한 시도였지만 다행히 반응이 좋았고  TED가 비즈니스적으로 성공하게 되는 밑거름이 된다. 여기서 영상을  CCL로 공개 했는데 (저작자 표시 및 비상업적 목적으로 사용하여야 하며, 원 저작물을 변경하거나 2차적 저작물을 만들 수 없음)이는 블로거들이 자신의 블로거에 영상을 실을 수 있도록해 더 많은 사용자를 만들어 냈다.

스크린샷 2013-04-27 오전 12.46.31

출처(OreilyMedia 구글 채널)영상

Oreilly 구글 채널

위의 그래프는 트레픽이 발생에 대한 통계인데, 6%에 불과한 Embeddable player가 블로그를 통해서 많은 입소문 효과를 만들어 내면서 TED.com에 많은 사용자 유입을 만든다..(다음 시도는 TED  Africa, India라는 현지 컨퍼런스를 직접 만들었으나 대실패.)

그 이후에는 필요한 업무들을 TED의 팬들과 협업하면서 해결하는 모습을 보이는데, TED-OTP라는 번역플렛폼을 제공하면서 열성적인 팬들이 자막을 제공하기 시작했고, TED.com의 접속자가 빠르게 늘어나는 개기가 된다. TEDx라는 이름으로 브랜드 라이센스를 가이드라인과 함께 공개하였는데, 다양한 나라의 다양한 영상들을 확보하는 개기가 됬다.(TEDx는 TED측에서 너무 많은 제약을 가해 태생적으로 성장하기에는 어려운 점이 있다고 보여진다. TEDx가이드라인)

현재 TED는 45.2M$(약40조;;;)라는 연매출을 올리는 기업으로 성장하였다.(TED, TEDAciteve and TED Globla-27.8M$//ted.com, TEDx, Tedprize, tedFellows-17.4M$) 대단한 성장인데, TED역시 다른 성공적인 IT기업들과 같은 원칙을 가지고 있었다. 핵심가치에 대해서는 타협하지 않고 끝까지 지켜낸것이 한 요인인데, TED의 믿을 수 없을 정도의 입장료, 그리고 청중선별 작업은 이러한 특성을 아주 잘 내포하고 있다고 생각한다. 그 이후에 비즈니스적으로 어려움을 겪을 때 핵심가치를 훼손하지 않고 비즈니스 모델만 변경한 것이 TED의 성공 두번째 성공 요인으로 생각된다.

[링크]HTML 자료 모음

22 Apr

스크린샷 2013-04-22 오후 11.51.11

시멘틱웹을 위한 참고서

https://docs.google.com/a/jennifersoft.com/file/d/0BwKGpbna5w4_ZTIyYWViYzctOTJiMC00MzE4LWEyNmQtMmM5NGI3OGI3ZGE4/edit#

레퍼런스 북, 2011년 버전. 클리어보스 HTML5 그룹

웹폰트를 사용하는데 도움이 될만한 사이트

FontSquirrel(http://www.fontsquirrel.com/) : 서버에 올려 놓은 무료 오픈소스 폰트

구글 웹 폰트 서비스(http://www.google.com/webfonts) CSS와 포트를 관리 하는 작업을 대신해줌

[링크]HTML5의 모든것

22 Apr

http://channy.creation.net/blog/776

 

HTML5에 대한 자료를 찾다가 잘 나온 자료가 있어서 링크를 남겨 놓는다.

HTML5는 4가 브라우저 개발자들을 위한 표준으로 제작되 일반 개발자들이 개발에 어려움을 겪는 상황을 해결하기 위해 시작 되었으며 WC3와 거의 모든 브라우저밴더들이 참여하고 있다. 개발자들을 위한 새로운 기능들을 제공하고 있으며, UI에서 부터 데이터베이스쿼리 까지 넓은 분야에서 기능을 제공하는 것을 목표로 표준이 만들어 지고 있으며, (많은 기능들이 제정됬으나 아직도 진행중) 위의 홈페이지는 그러한 변화들을 2010년도 부터 잘 정리하여 제공하고 있다.

영화가 어떻게 사회적 역할을 가르치는가?(벡델 테스트)

17 Apr

스크린샷 2013-04-17 오후 11.29.08

(출처 및 원본 영상 http://www.ted.com/talks/lang/ko/colin_stokes_how_movies_teach_manhood.html)

좋은 서비스는 무엇인가라는 질문에 대답 중 하나라고 생각되는 내용을 담고 있다.

콜린 스톡스는  사회적 역할 혹은 사람간의 상관관계를 배우는데 있어서 영화가 끼치는 영향에 대해서 이야기 하고 있다. 영화 오즈의 마법사와 스타워즈를 예로 들었는데, 오즈의 마법사는 주인공이 여성이며 악당도 여성이고 결국에는 모두가 친구가 되어 친구들 사이의 리더가 되는 이야기 인데 반해, 스타워즈는 온 우주가 남성밖에 없고 유일한 여성인 공주는 아무런 역할도 하지 못하고 있다가 승리의 전리품으로써 주인공을 축복해주는 역할이 전부이다. 그리고 요즘 영화의 추세는 대부분 스타워즈 부류 중 하나이다. 이야기는 대부분 남자, 소년 혹은 한 여자를 두고 다투는 두 남성의 이야기 이고, 악당을 물리치는데 초점이 맞춰져 있다.

콜린 스톨스는 여기서 벡텔 테스트라는 것을 소개 한다.

첫째, 두 명 이상의 이름이 있는 여자가 등장하고,
둘째, 그녀들이 대화를 하되,
셋째, 남자와 관련되지 않은 대화를 해야 할 것.

대부분의 영화는 이 테스트를 통과하지 못한다. 대부분의 영화들이 ‘남성’의 세계에 대해서 다루고 있다. 이것이 나쁘다는 것이 아니라 아이들이 꼭 알아야 하는 (성인도 마찬가지이다.) 무언가를 놓치고 자랄 수 밖에 없다.

콜린 스톨스의 이야기는 여기 까지 이다. 좋은 서비스란 무언가에 대한 고민이 여기서 돌파구를 마련했다. 내가 만약 관련 산업에서 서비스를 진행하고, 벡델 테스트라는 것을 알고 있다면 다른 시각으로 서비스를 만들게 될 것이다. 내가 만드는 것 그리고 세상에 모든 것들이 사람들에게 어떻게 영향을 미치고 있는지 명확하게 아는 것은 아주 중요한 변화를 만들어 낼 것이다.

벡델 테스트를를 검색하다가 흥미로운 글이 있어서 링크 합니다.

여자 아이돌이 기쁨조인가

——-4월 22일

좋은 서비스는 무엇인가라는 질문을 나눠 보면 ‘사람들이 원하는 것을 주는 것’, ‘사람을 이롭게 하는 서비스’ 둘 중에 하나가 될 것이다. 사람들이 원하는 것을 주게 되면 자연스럽게 돈을 벌 수 있을 것이다. 세상을 이롭게 하는 서비스를 하다보면 조금이라도 세상을 좋은 방향으로 바꿔 나갈 수 있는 것이고, 이 두가지를 모두 만족하는 것이 좋은 비즈니스가 될 것이다. 그리고 그 사이에서 일어나는 문제들의 본질을 파악해서 좋은 방향으로 이끌어 갈 수 있어야 겠다.

이러한 예로는 구글과 AOL과 같은 컨텐츠 공자들과의 관계에서 찾아 볼 수 있다. AOL은 미디어 기업인데 검색엔진에서 제공하는 검색 순위를 이용해서 컨텐츠 생산자들에게 35분에 한 꼭지씩의 기사 생산을 요구한다. 당현히 기사 내용의 질은 볼품없고 태그들은 검색 순위에 올라갈 수 있는 내용으로만 채워진다. 이런 환경에서 구글은 아직까지 장기적인 관점을 견지하며 선별적 검색 알고리즘을 도입하는 등 검색되는 정보의 질을 높히기 위해서 노력한다. 하지만 비지니스적인 측면에서 보면 컨텐츠 공장들의 수입원은 구글의 광고에서 얻는 수입이 50%이상이다. 컨텐츠의 질이 낮아지는 원인의 일부를 구글이 제공하고 있는 것이다. 그래서 구글은 ‘악하지 않은’ 수준의 도덕성을 유지하고 있는 정도이다. 사업을 진행함에 있어서 그 사이에서 가치를 유지하는 것 본질 보는 상태에서 규형잡힌 선택을 하는 것. 그것이 좋은 비지니스 이다.