티스토리 블로그 글 목록에 대하여

티스토리를 처음 개설한 후 계속 글을 쓰다가 맨 처음 작성한 글이 의미가 있겠다 싶어서 내가 쓴 처음 글의 숫자가 궁금해서 확인을 해보았었습니다. 그런데 분명 숫자가 1번이어야 하는데, 1번이 아님을 확인하게 되었습니다.

 

주소 체계

티스토리 블로그의 주소 체계는 숫자와 문자로 구성이 되어 있는데 필자는 처음부터 숫자로 사용해왔었고, 나중에 글이 1번부터 100번째 글, 1천번째 글이 의미가 있을 거 같아서 숫자로 사용을 해왔습니다.

포스트 주소 숫자 형식
포스트 주소 문자 형식

 

서식도 문서로 인식을 할까

글을 포스팅하는데 단순히 글만 쓰는 게 아니라 서식을 활용하시는 분들이 많이 계실겁니다. 블로그를 개설하고 바로 서식을 먼저 만든 후 글을 쓰게 되면, 서식과 글 관계없이 포스트 주소가 1부터 순서대로 부여가 된다는 것을 확인하였습니다.

예제 입니다.

 

고객센터에 문의 결과

글을 하나도 안 쓴 상태에서 서식을 먼저 작성한 후 글을 썼을 때 처음 글인데도 포스트주소가 1이 아니고 순서가 밀리게 되어서 이유를 몰라 다음 고객센터에 서식이 아닌 가장 처음으로 쓴 글의 포스트 주소 숫자를 1로 돌릴 수 있는지에 대해서 문의를 해 본 결과 다음과 같은 답변이 왔습니다.

답변과 같이, 서식이나 글이나 같은 주소체계이며, 어떤걸 먼저 작성하던간에 순서대로 주소가 부여되며, 글을 쓰다가 저장을 안하고 그냥 지우면 해당 글에 대한 포스트 주소는 없어지게 되며, 다음 번호로 부여가 됩니다.

예) 작성하던 글이 000.tistory.com/125 일 경우 지우게 되면 125번 주소는 이미 부여가 된 것이라,

새로 글을 써도 125번이 유지되는게 아니라 126번으로 됩니다.

  Comments,     Trackbacks
스크롤바 홈 버튼 만들기

블로그를 하실 때 기존의 블로그 스킨을 사용하시다 보면 홈버튼이 없는 경우가 있습니다. 그래서 PC는 물론 모바일 등 각종 디바이스에서 글을 읽다가 쉽게 블로그 홈으로 이동할 수 있는 홈버튼 만드는 방법을 알려드리고자 합니다.

 

이미지파일 고르기

 

PNG파일

구글 이미지에 home png라고 입력하시면 아래와 같은 많은 그림들이 검색이 되어 나옵니다.

개인적으로 png파일은 배경이 없는 투명파일이라 스크롤바에 적용시키기엔 jpg파일보다 보기가 더 좋을 것입니다.

다양한 사이즈(픽셀)의 그림이 있는데 적당히 가로세로 64px사이즈의 이미지를 찾아야 하는데, 번거로우실까 제가 찾은 파일을 첨부 하도록 하겠습니다. 

home.png
0.00MB

 

파일 업로드 하기

블로그에 적용시키기 위해서는 나의 블로그에 파일이 있어야 합니다. 블로그 관리자모드로 접속 하신 후-스킨 편집-html 편집-파일 업로드에서 해당 파일을 업로드 하신 후 우클릭으로 링크 주소를 복사하여 별도의 메모장에 해당 주소를 따로 백업해 둡니다.

링크주소를 복사하여 메모장에 붙여넣을 경우 아래의 그림과 같은 형식인데 여기서 필요한 부분은 images~png까지 입니다. 

예제 입니다.

 

HTML 편집

 

우선, 첨부된 소스파일을 받아 메모장에 별도로 복사해 두시면 됩니다.

<a href="" id="gohome" style="display:scroll;position:fixed;bottom:70px;right:10px;z-index:99999999" title="Home"><img src="./images/home.png" border="0"/></a>

소스예제.txt
0.00MB

hefr=" " 부분에 본인의 블로그 주소를 입력하시고, img src=" " 부분에는 업로드한 파일-마우스 우클릭으로 복사한 이미지파일 경로를 입력하시면 되는데 image앞에는 반드시 ./  이 붙어야 합니다.

 

위와 같이 png파일을 업로드하셨다면 이제 html부분에서 소스를 입력하면 되는데 <head>와 </head>사이 빈 공간을 확보하여 그림과 같이 입력-적용을 하시면 됩니다.

 

실행 확인

 

순서대로 제대로 하셨으면 특정 게시판에 머물렀다가 홈버튼을 누를 경우 블로그 홈으로 이동하는 것을 확인하실 수가 있습니다.

<a href="" id="gohome" style="display:scroll;
position:fixed;
bottom:70px;              //스크롤바 기준 홈버튼 세로위치
right:10px;               //스크롤바 기준 홈버튼 가로위치
z-index:99999999" 
title="Home"><img src="./images/home.png" 
border="0"/></a>

 

홈버튼의 위치를 수정하고 싶으실 때, bottom은 스크롤바 현재의 위치를 기준으로 하단으로부터 위로 얼마나 띄울것인가를 정하는 지정하며, right는 스크롤바 현재 위치로부터 왼쪽으로 얼마나 띄울 것인가를 지정할 수 있습니다.

  Comments,     Trackbacks
HTML과 CSS

티스토리 블로그를 시작하시거나 이용하시는 분들은 html과 css에 대해서 많이 들어보셨을 겁니다. 블로그를 예쁘게 꾸미는데 html과 css를 조금만 응용해도 얼마든지 내가 원하는 방향에 가깝게 예쁘게 꾸밀 수가 있습니다. 저 역시 티스토리 블로그 운영이 처음이고 초보자여서 가장 기초적이고 쉬운 설명으로 이해가 가기 쉽게 포스팅을 하려고 합니다.

 

HTML

HTML과 CSS는 프로그래밍 언어의 한 종류입니다. 그러나 프로그래밍 언어라고 하기보다는 페이지 기술 언어라 정의하는 편이 더 이해가 되겠습니다.

 

HTML(Hyper Text Marup Language/하이퍼 텍스트 마크업 언어)의 약자이며 웹사이트의 '콘텐츠'를 작성할 때 기본이되는 페이지 기술 언어입니다.

말 그대로 이용자께서 보고계시는 크롬이나 인터넷익스플로러 등의 웹페이지의 디자인이나 레이아웃을 기술하기 위한 것이며 페이지에 표시할 요소나 구조 등을 기술할 수가 있습니다.

 

HTML의 특징은 파일명이 .html이며 메모장과 같은 텍스트를 입력할 수 있는 기본적인 텍스트 편집 프로그램에 원하는 소스를 작성한 후 티스토리 블로그-스킨편집-html편집-html에 입력하여 바로 적용시키고 확인할 수가 있습니다.

 

CSS

 

CSS(Cascading Style Sheet/종속형 스타일 시트)의 약자이며 '스타일 시트'를 기술할 때 사용하는 언어입니다.

HTML보다 더 괜찮은 디자인으로 사용할 수가 있으며 역시 메모장과 같은 텍스트 편집 프로그램에 소스를 입력한 후 마찬가지로 html편집-CSS부분에 입력하여 바로 확인할 수 있습니다. 파일 확장명은 .CSS입니다.

 

HTML이 기본뼈대라면, CSS는 좀 더 디테일하게 꾸밀 수가 있습니다.

 

HTML과 CSS의 차이

 

 

좀 더 이해가 가기위해서 동그라미를 구현하였을 때의 차이점을 비교하겠습니다.

 

HTML로 원을 만들었을 때

<div style="width:100px;height:100px;border:1pt
 solid #1DDB16;border-radius:50px;
filter:alpha(opacity=30);opacity:0.3;
background:#1DDB16;"></div>

 

HTML과 CSS로 원을 만들었을 때

HTML 부분
<div id="circle1">
</div>
CSS 부분
.circle1 {
background-color:#86efef;
width:150px;
height:150px;
border-radius:75px;
margin:0 auto;
vertical-align:middle;
line-height:150px;

차이점 : HTML로만 만들었을 때는 CSS없이 자체적으로 원을 표현하였으며, 두번째는 CSS에서 원을 표현하여 Circle1이란 이름을 부과하고, HTML에서 Circle1를 호출하여 표현하였습니다.

 

정리하자면 HTML은 콘텐츠의 구조와 의미를 정의하며, CSS는 스타일과 레이아웃을 지정합니다. CSS를 사용하여 콘텐츠의 글꼴, 색상, 크기 및 간격의 변경, 애니메이션 및 기타 효과를 추가할 수 있습니다.

 

티스토리에서 HTML과 CSS는 소제목이나 인용구를 활용하여 글쓰기에 가독성을 높이는데 조금 더 도움이 될 수 있으며, 전문가가 아니더라도 활용을 한다면 충분히 글을 포스팅할 수 있다고 생각이 됩니다.

  Comments,     Trackbacks
5K/8K란 무엇일까요

 

컴퓨터의 모니터나 TV의 CF를 보시면 나오는 용어가 5K와 8K입니다. 이번의 포스팅에서는 그에 대해서 알아보고자 합니다.

 

모니터의 해상도

 

모니터나 TV의 화면은 화소(Pixel)라고 하는 수 많은 점들로 이루어져 있으며, 가로의 화소 수와 세로의 화소 수를 곱하기로 표현한 것이 해상도 입니다.

 

5K

K는 Kilo=1,000을 의미합니다. 

5K는 가로의 화소 수가 5000픽셀을 넘는다는 뜻인데, 일반 HD화면은 가로의 화소 수가 1280/ 풀 HD는 1920입니다.

이에 비해 기존의 4K의 화면은 가로X세로가 4096X2160정도입니다. 

5K는 가로X세로의 화소 수가 5120X1880정도에 이른다는 뜻입니다.

 

8K

8K의 해상도는 가로의 화소 수가 8000픽셀을 넘는다는 뜻이며 8192X4320 정도의 해상도 입니다. 

 

 

해상도와 화질의 관계

 

해상도가 아무리 높아도 빛이나 색이 제대로 구현이 되지 않으면 화질이 좋아 보이는 것은 아닐 것입니다.

사람의 시력이 아무리 좋아도, 생리학적으로 사람이 구별할 수 있는 명암의 단계는 한계가 있어서 초고화질의 명암비율을 구별하는 것은 힘들 것입니다.

 

마무리

 

프로페셔널한 고사양의 장비로 영상작업을 하지않는 이상 고화질의 해상도는 굳이 필요가 없다 생각됩니다. 

지금은 콘텐츠의 무한경쟁 시대입니다. 예전에 경제신문 오피니언 부분에서 읽었던 내용이 기억이 나는데, 고화질 화면 해상도의 경쟁은 무의미하고,  소비자의 니즈를 파악하여 얼마나 어떤 양질의 콘텐츠를 제공하느냐가 더 중요할 것입니다.

 

 

 

'IT' 카테고리의 다른 글

플랫폼이란 무엇인가  (0) 2020.04.20
혼합현실[Mixed Reality]  (0) 2020.04.20
g)그램)은 무게단위가 맞을까요  (0) 2020.04.20
JPG와 PNG차이  (0) 2020.04.20
조립식 컴퓨터 맞추는 법 - 메인보드  (0) 2020.04.20
  Comments,     Trackbacks
HTML로 글상자 만들기-[기본 박스]

티스토리로 글을 쓰고자 할 때 소제목이든, 인용구든 그냥 글만 쓰기에는 부족함이 있습니다. 그래서 CSS없이 HTML만으로 초간단 글상자 만드는 법을 알려드리고자 합니다.

 

초간단 박스

 

border 속성으로 테두리 만들기

<div style="border: 1px solid black; padding: 10px;">

 

안녕하세요 글 내용이 제대로 입력되는지 테스트 중입니다.

 

div라는 속성에 Style을 정의한다는 뜻인데, border은 테두리의 두께이며, solid black은 일반적인 검은 테두리를 정의한다는 뜻입니다. solid부분에 blue, yellow의 영어로 색을 표현할 수 있으며 영어 대신 html색상표(예: #000000)를 입력해도 적용됩니다.

 

점선과 도트 테두리

<div style="border:1px dashed; padding:10px;">
안녕하세요 점선 테두리 테스트 중입니다.
</div>

 

안녕하세요 점선 테두리 테스트 중입니다.

 

예: 파란색으로 변경은 dashed blue; 나  dashed #0054FF; 로 색 변경 가능합니다.

 

안녕하세요 점선 테두리 테스트 중입니다.

 

<div style="border:1px dotted; padding:10px;">
안녕하세요 도트 점선 테두리 테스트 입니다.
</div>

 

안녕하세요 도트 점선 테두리 테스트 입니다.

 

점선의 색 변경(예: 파란색) 역시 dotted blue; / dotted #0054FF; 로 변경 가능 합니다.

 

<div style="border: 1px dotted; border-radius: 5px; padding: 10px;">안녕하세요 테두리의 모서리 테스트 입니다.</div>

 

안녕하세요 테두리의 모서리 테스트 입니다.

 

border-radius: 5px 에서 px의 숫자를 조절하여 둥근 정도를 조절할 수 있습니다.

'티스토리 > 티스토리 Tips' 카테고리의 다른 글

스크롤바 홈 버튼 만들기  (0) 2020.04.20
HTML과 CSS  (0) 2020.04.20
CSS로 글상자 만들기-[모퉁이가 접힌 박스]  (0) 2020.04.20
소제목 서식 만들기  (1) 2020.04.20
첫 게시글  (0) 2020.04.20
  Comments,     Trackbacks
CSS로 글상자 만들기-[모퉁이가 접힌 박스]

티스토리 블로그의 장점은 내가 사용하는 스킨의 기본 틀 아래 글을 쓸 때 HTML과 CSS를 활용하여 레이아웃을 내 스타일대로 꾸밀 수 있다는 장점이 있습니다. 초반에 블로그를 시작할 때 어떤 블로그를 이용할까 고민하다가 티스토리 블로그를 선택하게 된 이유 중의 하나이기도 합니다.

HTML과 CSS를 잘 몰라도 조금만 검색하여 활용만하면 기존의 것도 내 스타일대로 조금은 바꿀 수 있다는 것입니다.

 

텍스트 상자가 필요한 이유

 

글을 쓸 때 거창하게 소설처럼 쓰지 않더라도 서론 본론 결론으로 나누어 쓰게 되는데 보통 [텍스트 상자가 필요한 이유] 처럼 서식을 활용한 소제목을 쓰게 됩니다. 그러나 소제목안의 글 내용도 분류하는 경우가 있는데 그럴 때 단순히 숫자 1. 2. 3. 이라던가 a. b. c. 처럼 뭔가 단순하게 하는 것보다는 그래도 글상자를 활용하게 되면 덜 밋밋하게 됩니다.

 

텍스트 박스를 활용한 예제 입니다.

 

소스와 이용방법

 

우선 html의 소스는 다음과 같습니다.  우선 아래의 첨부파일을 받으시면 됩니다. 내용을 복사하여 블로그관리-서식쓰기-서식으로 저장하시면 되는데, 소스를 서식으로 저장할 때는 글쓰기 모드를 html로 변환시켜 저장하셔야 합니다.

 

<div class="note1">
<p>여기다 글을 쓰세요</p>
</div>

박스소스html.txt
0.00MB
박스소스css.txt
0.00MB

다음은 css의 소스입니다. 역시 첨부된 파일을 별도로 받으시면 됩니다. 소스의 내용을 복사하여 블로그관리-html편집-CSS탭에 빈 공간을 확보하여 입력-저장하시면 됩니다.  CSS내용 중 @font-face } 밑에 빈 공간에 입력하셔야 하는데, 만약 @font-face가 없으면 최상단 내용 중 @charset "utf-8"; 보다 밑에 빈 공간 {   } 부분을 피하고 입력하셔야 합니다.

 

.note1 {         //note1이란 이름을 변경하셔도 됩니다.
    position:relative;
    background:#B2CCFF;
    width:300px;
    max-width: 100%;
    text-align: center;
    padding: 12px;
    color:black;
    }

.note1:before {  //note1부분도 동일한 이름으로 변경하셔야 합니다.
    content:"";
    position:absolute;
    top:0;
    right:0;
    border-width:0 16px 16px 0; 
    border-style:solid;
    border-color: #FFFFFF #FFFFFF #0054FF #0054FF; 
    background: #0054FF; 
    display:block; width:0;   
}

 

TIP
 
 

css에서 note1부분의 이름을 변경하실 때 html의 div class=" "안의 부분도 동일한 이름으로 변경하셔야 소스를 호출할 수 있습니다.

 

[ 소스 내용 - note 1]

 background : 박스 배경색인데 html 색상표로 변경 가능합니다.

 widht : 박스 가로사이즈이며 숫자 부분을 변경 가능합니다.

 text-align : 글씨의 배열인데, left(왼쪽정렬)/right(오른쪽정렬)/justify(양쪽정렬) 입니다.

 color : 글씨 색입니다. blue/red 등으로 변경 가능합니다.

 

 [소스 내용 - note 1:before]

 border-color : 박스의 접힌 부분인데, #FFFFFF는 블로그 배경이 흰색이라 변경 안하셔도 됩니다.

     #0054FF(background와 함께) 박스 접힌 부분의 색인데, 변경 가능합니다.

 

활용 예제

 

먼저 블로그 관리자모드-스킨편집-html편집-css탭으로 이동하셔서 빈 공간을 확보하시면 됩니다.

 

빈 공간을 확보 후 css 소스를 입력 후 확인을 누르시면 됩니다.

 

새로운 글쓰기로 들어가신 후 - html모드로 변환하여 html 소스를 입력 후 글 쓰는 부분에 원하는 문구를 입력하신 후 완료를 누르시면 됩니다.

 

소스 입력 후의 화면

 

 

사용하시는 스킨과 폰트에 따라 달라보일 수가 있으며, 반응형으로 만들어져서 디바이스 화면에 따라 사이즈가 달라 보일 수 있습니다.

'티스토리 > 티스토리 Tips' 카테고리의 다른 글

스크롤바 홈 버튼 만들기  (0) 2020.04.20
HTML과 CSS  (0) 2020.04.20
HTML로 글상자 만들기-[기본 박스]  (0) 2020.04.20
소제목 서식 만들기  (1) 2020.04.20
첫 게시글  (0) 2020.04.20
  Comments,     Trackbacks
플랫폼이란 무엇인가

플랫폼(Platform)이란?

원래 플랫폼은 역에서 기차를 타고 내리는 곳을 의미하며 사람과 물자가 어떠한 목적을 가지고 이동하기 위해 기다리는 곳입니다. 4차산업시대에 접어들게 되면서 플랫폼은 컴퓨터 시스템 환경을 구축해 개방하여 누구나 다양하고 방대한 정보를 쉽게 활용할 수 있도록 제공하는 서비스의 의미로 통용되게 되었습니다.

모두에게 익숙하지만 좀 더 쉽게 이해하고 접근하기 위해서 포스팅을 하고자 합니다.

 

영상 플랫폼

 

지금까지 사람들은 뉴스나 드라마는 TV를 통해서, 영화는 영화관을 통해서 관람을 하고 시청을 해왔습니다. 그러나 지금은 영상과 동영상 플랫폼 서비스를 통하여 국내 드라마, 해외드라마와 동영상은 물론이고 인기있는 최신의 영화까지 플랫폼 서비스를 통해 안방과 스마트폰에서 모두 다 즐길 수 있는 시대가 되었습니다.

대표적 영상 플랫폼 서비스는 거대기업 넷플릭스, 디즈니플러스, 유튜브, 페이스북을 기본으로 국내에서는 네이버TV, 카카오TV, 웨이브 등이 있습니다.

 

 

OTT서비스

OTT(Over The Top)서비스는 TV셋톱박스를 의미합니다. 서비스 초반에는 셋톱 박스를 통해 케이블이나 위성방송 서비스를 제공하였으나, 인터넷의 발전과 이동통신의 발전으로 스트리밍 서비스가 가능해져 TV나 PC뿐 아니라 다양한 디바이스를 통해 서비스가 확장되었는데 대표적으로 넷플릭스 등이 있습니다.

 

 

공유 서비스

공유 서비스는 대표적으로 차량 공유가 있는데, 목적지가 같은 사람끼리 한 대의 차량에 탑승을 하거나 내가 소유한 차량에 요금을 받고 대여하여 승차하는 서비스를 뜻하는데 대표적으로 미국의 우버가 있습니다.

기사와 승객을 모바일 앱을 통해 목적지를 정하고 요금을 지불하여 이동하는 서비스 입니다.  

그리고 공유 숙박 서비스가 있는데 주거지 일부를 타인에게 빌려주는 서비스로, 대표적으로는 에어비앤비가 있습니다. 

 

온라인 플랫폼

온라인 플랫폼은 대표적으로 구글, 네이버와 같은 검색엔진 기반 플랫폼과 전자상거래 플랫폼, SNS 플랫폼 등이 있습니다.  검색엔진을 통하여 내가 검색하고자 하는 정보의 제공은 물론이고 다른 서비스로의 연결, 지도, 내비게이션, 위치 기반서비스 등 다양한 서비스를 제공하고 있으며 전자상거래는 내가 필요한 물건을 PC나 스마트폰을 통하여 전세계적으로 구매 또는 판매할 수 있는 서비스를 제공하고 있습니다.

 

광고 플랫폼

광고 플랫폼의 대표적으로는 많은 블로거분들이 하고 계시는 구글의 애드센스라는 서비스 입니다. 

 

애드센스는 광고와 광고를 게재하는 블로그를 연결해주는 플랫폼인데 나의 회사나 제품을 홍보하기 위해서는 광고가 필요한데 그 광고를 애드센스에서 직접 하지 않고, 유튜브 또는 블로그를 통해서 광고하는 서비스입니다. 이용자들이 유튜브 동영상을 시청하거나 관심있는 내용에 대한 글을 블로그를 통해서 읽을 때 광고를 접하게 되는 서비스 제공 플랫폼이라 이해하시면 되겠습니다.

'IT' 카테고리의 다른 글

5K/8K란 무엇일까요  (0) 2020.04.20
혼합현실[Mixed Reality]  (0) 2020.04.20
g)그램)은 무게단위가 맞을까요  (0) 2020.04.20
JPG와 PNG차이  (0) 2020.04.20
조립식 컴퓨터 맞추는 법 - 메인보드  (0) 2020.04.20
  Comments,     Trackbacks
혼합현실[Mixed Reality]

4차산업혁명시대에 진입하고 있는 지금 영화나 애니메이션은 물론, 각 분야에서 가상현실(VR)과 증강현실(AR)의 활용도는 무궁무진합니다. 두 개에 대해서는 익히 많이 알려진 바에 비해 혼합현실(MR)에 대해서 잘 모르실 수도 있으신 분들을 위해 그 내용에 대해 포스팅 하고자 합니다.

 

가상현실(VR)

 

가상현실(Virtual Reality)이란 사람이 실제 체험할 수 없는 것에 대해서 가상의 세계를 만들어 실제와 같이 체험할 수 있는 기술을 뜻하는데, 체험을 하기 위해서 머리에 쓰는 디스플레이 디바이스 HMD를 활용합니다.

저의 기억으로는 대전엑스포 당시 3D안경을 쓰고 3D의 이미지를 체험하는 것이 있었는데, 그게 아마도 우리나라에 가상현실 기술이 도입되는 시기가 아니었을까 싶습니다.

 

 

HMD(Head Mounted Display)

HMD를 장착하여 오로지 눈 앞에 디스플레이를 통해 컴퓨터로 만든 가상의 화면 등을 보며 여러 체험을 하게 되는데 마이크, 스테레오 스피커 등 다양한 센서가 탑재가 되어있습니다. 스마트폰 패널을 활용하는 기기는 다이브라고도 하며, OTG젠더를 통해 스마트폰, 마우스, 손에 연결하는 외부기기를 통해 다양한 체험을 즐길 수가 있습니다.

 

 

증강현실(AR)

 

증강현실(Augmented Reality)은 가상현실이 이미지나 주변 객체 등을 가상의 이미지로 보여지는 반면에 증강현실은 현실에 기반하여 정보를 추가(증강-Augmented)하는 기술인데 즉, 현실세계의 이미지나 배경에 가상의 이미지를 추가하여 보여주는 기술입니다.

 

 

네비게이션을 예를 들면 기존의 네비게이션은 지도상 경로만 보여주는 반면, 증강현실을 적용한 네비게이션은 실제 도로장면에 주행 정보를 추가합니다. 그리고 의류매장이나 홈쇼핑 등에서 직접 옷을 입어보지 않고도 연결된 디바이스를 통해 실제 내가 입어본 것같은 시스템이 구현이 되기도 하였습니다.

 

 

그리고  5G의 기술과 게임을 접목한 게임형태의 콘텐츠로도 개발이 되기도 하였습니다.

 

 

혼합현실(MR)

 

혼합현실(Mixed Reality)이란 VR과 AR의 장점을 융합하였는데 실제 환경의 객체에 가상으로 생성한 정보(그래픽, 소리, 냄새 등)을 실시간으로 혼합하여 사용자와 상호작용하는 기술입니다. 별도의 장비없이도 눈 앞에서 실제와 같은 가상의 현실을 접할 수가 있는 기술이 개발 되기도 하였습니다.

 

홀로렌즈

홀로렌즈는 마이크로소프트에서 현실과 상호작용할 수 있는 기기이며 기존 VR용 HMD에 비해 더욱 진보한 기술과 HMD를 결합하여 만들었습니다. 현재까지 윈도우 10전용이며, 자신이 위치한 현재의 공간을 3차원 스캔할 수 있고 스마트폰이나 PC와 연결할 필요없는 단독 구동이 가능합니다.

 

 

활용분야

사람은 80%이상 시각에 의존하는데 혼합현실 기술 중 가장 활용분야가 높으며 헤드업 디스플레이, 홀로렌즈 등 시각활용 MR 기술이 많이 개발이 되고있습니다.

 

 

그리고 인간의 귀(고막)이 아닌 다른 방법을 통하여 소리를 전달하는 기술도 있으며, 촉각을 활용한 햅틱과 팁톡의 기술도 있습니다. 의료용 수술로봇 개발에서 촉각을 활용한 혼합현실이 등장하기도 합니다.

'IT' 카테고리의 다른 글

5K/8K란 무엇일까요  (0) 2020.04.20
플랫폼이란 무엇인가  (0) 2020.04.20
g)그램)은 무게단위가 맞을까요  (0) 2020.04.20
JPG와 PNG차이  (0) 2020.04.20
조립식 컴퓨터 맞추는 법 - 메인보드  (0) 2020.04.20
  Comments,     Trackbacks
g)그램)은 무게단위가 맞을까요

 

무게와 질량

 

무게(Weight)

무게는 물체에 작용하는 중력(지구가 물체를 잡아당기는 힘)의 크기입니다.

장소가 바뀌면 값이 달라집니다. 우리가 몸무게를 말할 때 몇kg라고 흔히 말하지만, 질량의 단위이지 무게의 단위는  아닙니다. 무게의 단위는 kg중 또는 kg·m/s² 입니다.

 

질량(Mass)

질량은 물체가 가지고 있는 물체 고유의 양이며 장소가 달라도 항상 일정합니다.

질량의 단위는 g(그램), kg(킬로그램)입니다.

 

미터원기

 

 

1kg의 기준

1870년 국제 미터위원회가 만들어 졌는데, 1875년 미터 조약에 의거해  미터원기의 질량을 1kg으로 하고 있습니다. 무게의 단위는 힘의 단위와 같은 뉴턴(킬로그램x미터/초²)이라는 단위를 사용하지만 질량과 지구 표면의 중력() 배수(9.8㎏/초2=1G)와의 곱셈으로 표시한 킬로그램 중()이란 단위가 사용되고 있습니다.

우리가 사용하고 있는 편리한 미터법과 kg이 처음 만들어지게 된 것은 프랑스 혁명이 일어난 다음 해인 1790년에 복잡한 도량형의 개혁안을 마련하게 되었으며, 길이의 표준 단위를 미터로 명명하고 1m는 지구의 북극에서 적도까지의 자오선 길이의 1천만분의 1로 하기로 결정하였습니다. 그 후 1793년 질량의 단위를 그레이브(grave)로 명명하고 1그레이브는 [0˚C  1 세제곱 데시미터(1 데시미터는 1/10 미터)의 질량]으로 정의 하였는데 1795년 새로운 법안이 만들어지며 질량 단위를 그램(gram, g)로 새로 명명하고 1g은 1/1000 그레이브가 됩니다. 

 

미터원기는 프랑스 과학자들이 이전에 사용하던 백금으로 만든 질량원기가 무르고 강도가 약한 점을 보완하기 위해 백금 90%에 이리듐 10%를 섞은 합금으로 새로운 킬로그램 원기를 제작하기로 하고 1883년에야 이전의 백금 원기와 동일한 질량의 원기를 제작하게 됩니다.

 

한국의 미터원기

1870년 5월에 17개국이 참여하는 미터협약이 체결되어 이후 국제도량형국(BIPM)이 설립되고, 1889년 9월 백금-이리듐 합금으로 새로 제작한 미터원기와 킬로그램 원기가 공식적 국제 표준으로 승인됩니다. IPK(international prototype kilogram)라고 불리는 국제킬로그램 원기는 BIPM에 보관되어 있으며, 동일한 복사본들이 만들어져 각국 국가표준기관에 보관되어 있습니다. 우리나라는 1894년에 처음 원기가 도입된 것으로 추정되며 1993년 새로운 킬로그램 원기은 No. 72를 도입하여 주 원기로 사용, 2003년에는 새번째 원기인 No.84를 도입하여 세계 7번째로 3개 이상의 원기를 보유하게 됩니다.

 

플랑크 상수

 

플랑크상수(h)를 기준으로 새로운 kg을 정의하게 되는데 플랑크상수는 빛 에너지와 파장 사이의 관계를 설명하는 양자역학 상수입니다. 여러 실험을 통해 플랑크상수의 측정값이 제시된 상태이며 킬로그램은 플랑크 상수와 진공에서의 빛의 속력(길이 표준) 및 세슘의 초미세 분리 주파수(시간 표준)를 이용하여 정의될 수 있기 때문에 플랑크상수가 빛의 속력처럼 고정값이 되면 kg m처럼 불변하는  자연 현상으로 새롭게 정의되게 됩니다.

'IT' 카테고리의 다른 글

플랫폼이란 무엇인가  (0) 2020.04.20
혼합현실[Mixed Reality]  (0) 2020.04.20
JPG와 PNG차이  (0) 2020.04.20
조립식 컴퓨터 맞추는 법 - 메인보드  (0) 2020.04.20
조립식 컴퓨터 맞추는 법 - 모니터  (0) 2020.04.20
  Comments,     Trackbacks
JPG와 PNG차이

 

티스토리 블로그에서 글을 쓰시면서 이미지를 업로드할 때 그림파일의 확장명은 JPG 또는 PNG파일을 주로 사용하실 겁니다. 그래서 JPG와 PNG의 차이를 설명드리고자 합니다.

 

JPG/PNG

 

JPG

jpg(joint photographic coding experts group 또는 joint photographic experts group)파일은 이미지를 저장하는 그래픽 파일 포맷 중의 하나입니다. 압축률이 뛰어나며 웹에서 표준으로 사용되며 jpeg압축 방식을 이용하여 압축한 이미지 파일에 사용하는 파일 확장명입니다.

jpg는 jpeg라고도 하며 같은 종류의 파일입니다.

 

PNG

png(Portable Network Graphic)는 비손실 그래픽 파일 포맷입니다. 압축률은 GIF보다 높고 트루칼라를 지원하며 GIF의 단색 투명층과 달리 8비트 알파 채너를 이용해 부드러운 투명층을 지원합니다. 단 GIF처럼 애니메이션 기능은 없으며, 주로 배경이 투명한 파일을 뜻합니다. jpg에 비해 용량은 크지만 문자나 날카로운 경계가 있는 그림은 jpg에서 손상되기 쉽기 때문에 png를 쓰는 편입니다.

 

차이점

 

jpg는 파일의 사이즈를 줄이기 위해 이미지의 몇몇의 정보를 버릴 수 있어서 저장 장치에 사진을 저장하기 유리하고 압축 비율은 직접 조정할 수 있지만 이로 인해 화질 저하가 있을 수 있습니다. 주로 사진에 많이 사용되는 포맷입니다.

 

png는 압축을 하면서 정보가 손실되지 않는데 화질 역시 손실되지 않습니다. 그러나 용량은 그만큼 jpg보다 큽니다. 주로 아이콘이나 그래픽한 이미지를 표현하는데 많이 사용합니다. 

 

JPG일 경우 입니다

 

PNG일 경우 입니다

 

간단히 비교하자면 PNG파일의 이미지는 JPG에 비하여 배경이 투명임을 알 수 있습니다. 

 

 

  Comments,     Trackbacks
소제목 서식 만들기

서식만들기

 

Step1

먼저, 관리자 모드로 접속한 후 왼쪽 메뉴-서식관리로 들어갑니다.

서식관리

 

Step2

서식관리-서식쓰기를 합니다.

서식쓰기

 

Step3

새로운 글쓰기 기본모드에서 HTML모드로 전환 합니다.

HTML모드
HTML전환 모드시

Step4

제목을 [소제목 서식] 처럼, 편한대로 정한 후 아래 입력칸에 첨부된 HTML 소스를 입력하신 후 저장하시면 됩니다.

입력 후
저장 후의 모습

 

활용하기

 

이제 새로 글을 쓰실 때 적당한 위치에서 글쓰기 메뉴 화면 우측-기본모드 왼쪽 점 3개 부분을 클릭하여 서식을 선택하신 후에 저장해 두었던 [소제목 서식]을 입력하시면 됩니다. 

서식 불러들이기
소제목 불러들이기

 

활용 예제

우선 첨부된 TXT파일 내용의 소스를 복사하시어 활용하시면 됩니다.

소제목.txt
0.00MB

<h3 style="box-sizing: border-box; font-family: Nanum+Gothic, sans-serif; 
border-width: 0px 0px 2px 10px;      // 왼쪽 두께 부분 //
word-spacing: 3px; border-bottom-style: solid; 
border-bottom-color: #000000;      // 아래 라인 색 부분 //
padding: 3px 5px; border-left-style: solid; 
border-left-color: #55555b;           // 왼쪽 선 색 부분 //
margin: 5px 0px; letter-spacing: 1px; line-height: 1.5; 
border-image: initial;"><span> 
<span style="font-size: 21px;">서식 만들기</span></span></h3>

 

border-width 0px 0px 2px 10px 부분에서

왼쪽 두께부분 10px 부분을 25px 정도로 두었을 때의 모습입니다.

border-bottom-color 부분에서

아래 라인 색 부분을 변경할 때 모습입니다. HTML 색상표에서 원하시는 색상을 고르시어 [#000000] 부분을 드래그 하여 입력하면 됩니다.

border-left-color 부분에서

왼쪽 제목 옆라인 색 변경 모습입니다.

txt파일 내용의 소스를 복사하시어 마음껏 활용하시면 됩니다!!

'티스토리 > 티스토리 Tips' 카테고리의 다른 글

스크롤바 홈 버튼 만들기  (0) 2020.04.20
HTML과 CSS  (0) 2020.04.20
HTML로 글상자 만들기-[기본 박스]  (0) 2020.04.20
CSS로 글상자 만들기-[모퉁이가 접힌 박스]  (0) 2020.04.20
첫 게시글  (0) 2020.04.20
  Comments,     Trackbacks
조립식 컴퓨터 맞추는 법 - 메인보드

컴퓨터를 구매할 때 모든 부품의 호환성이 맞아야 정상 작동이 되는 것은 물론이고 제대로 된 성능을 발휘할 수가 있습니다.

필자의 경험에 의하면 CPU/ 램/ 그래픽카드를 풀뱅(고사양)에 가깝게 맞췄었으나 무거운 프로그램이나 고사양의 게임을 할 때 뭔가 2% 부족한 느낌을 받았었습니다. 원인을 돌이켜보면 그에 맞는 메인보드가 아니었었습니다.

조립식 PC를 구매하시고자 하는 분들께 부품 고르는 법의 도움을 드리고자 포스팅하게 되었습니다. 

 

메인보드란?

 

 

메인보드(Main Board)는 마더보드(Mother Board)라고도 불리며, 컴퓨터가 작동하는데 필요한 부품 중 하나이며 각종 부품을 통제하고 관리하는 역할을 합니다. 컴퓨터의 작동에 필요한 부품들은 메인보드에 장착이 되어 되도록 다른 부품과의 호환성은 물론이고 등급이 맞아야 컴퓨터가 제대로 된 성능을 발휘할 수 있습니다.

 

TIP
 
 

인텔 CPU와 호환되는 메인보드 기준으로 포스팅 하였습니다.

 

제조업체

 

같은 부품이라 해도 제조업체가 다양합니다. 이는 그래픽카드/램/메모리/하드디스크/SSD디스크 등에 다 해당되는 내용이며, 메인보드의 대표적 제조업체는 ASUS/GIGABYTE/MSI/ASRock 등이 있습니다.

 

종류

 

기본 종류는 다음과 같습니다.

 

[인텔 CPU 호환]
 1. 100/200시리즈 : 인텔 6-7세대  
 2. 300 시리즈 : 인텔 8세대  
 3. Z 시리즈 : 인텔 9세대  
 4. B**0 보급형  100시리즈/200시리즈/300시리즈  
 5. H*10 중급형 100시리즈/200시리즈/300시리즈  
 6. Z*70 고급형 100시리즈/200시리즈/300시리즈  
 7. X  최고급형 99 또는 299  
 8. Q**0 기업용 

 

[AMD CPU 호환]
 1. A**0 보급형  300시리즈  
 2. B**0 중급형  300시리즈/400시리즈  
 3. X**0 고급형  300시리즈 /400시리즈  
 4. x*99 최고급형 3시리즈

 

칩셋

 

칩셋(Chipset)의 역할은 각각의 부품들을 서로 인식할 수 있도록 제어하고 조율하는 기능을 합니다.

과거에는 노스브리지/사우스브리지가 있었고 최근에는 노스브리지와 사우스브리지가 하나로 통합되었습니다.

 

노스브리지(Northbridge)

CPU와 가까운 곳에 위치하며 CPU와의 데이터 교환과 메모리관리, PCI-E 16X 같은 고속 버스 제어 등 고속과 연산 관련된 장치를 제어합니다.

 

사우스브리지(Southbridge)

상대적으로 CPU와 약간 떨어져 있으며 키보드나 마우스와 같은 입출력 장치 제어에 쓰입니다. 하드디스크 등이 연결되는 IDE/SATA포트, USB포트, PCI, PCI-E 1X와 같은 저속 버스 제어를 합니다.(저속 확장 장치를 꽂는 PCI슬롯 등의 제어를 담당)

 

폼팩터

 

폼팩터는 메인보드 크기에 따라 구분을 합니다. 메인보드의 크기가 클수록 더 많은 장치를 장착할 수 있지만 PC의 크기도 커지고 반대로 메인보드 크기가 작으면 PC크기도 작아집니다. (PC란 컴퓨터 케이스의 의미 )

메인보드 크기와 PC성능은 비례하는 것은 아닙니다.

 

가장 기본 규격 ATX는 가로 244mm/세로 305mm 이내

mATX(마이크로 ATX)는 기존 ATX 규격의 세로 길이를 가로와 같은 244mm로 줄인 규격입니다.

 

미니 ITX규격은 가로세로 170mm 입니다. 

 

확장슬롯

 

확장슬롯이란 사용자가 필요한 기능의 해당 부품을 장착하여 강화할 수 있다는 점입니다. 메모리 전용과 범용 슬롯으로 나뉘는데 메모리 전용 슬롯은 PC의 메모리를 위한 슬롯으로 DDR3/DDR4 메모리를 꽂을 수 있습니다. 최소 1~2개의 메모리 슬롯이 제공되며,

필자의 경험에 의하면 (개인차이와 제공되는 슬롯의 차이가 있음) 메모리의 구성은 보통 4개로 꽂는데 메모리가 8기가일경우 4X2/ 16기가일 경우 8X2 입니다. 

범용 슬롯은 메모리를 제외한 그래픽카드나 사운드 카드, TV수신 카드 등을 장착하기 위한 다목적 슬롯입니다.

 

인터페이스

 

SATA는 HDD나 SSD, ODD 같은 보조장치를 연결하는 포트이며, SATA포트가 많을 수록 더 많이 연결할 수 있어 저장공간의 확보가 더 넉넉해 집니다.

M.2는 SSD를 위한 전용 인터페이스 입니다. 메인보드에 기본 2~6개가 제공되며, SATA방식에 비해 약 5배의 전송속도를 낼 수가 있습니다. 

 

전원부/내장 사운드

 

PC본체와 별도인 모니터를 제외하고 CPU와 그래픽카드, 메모리 등에 전원까지 공급하는 역할을 합니다. 그래픽카드는 기본전원 외에 추가로 파워서플라이로부터 공급받기 때문에 메인보드의 전원부는 CPU 전원부로 이해하시면 됩니다.

 

기본적으로 메인보드에는 내장사운드가 장착이 되어있습니다. 하지만 내장사운드만으로는 고사양의 게임이나 고음질의 노래 등을 듣기에는 부족하여 별도로 사운드카드를 추가하거나 외장사운드 카드를 연결합니다. 

 

백패널

 

내부 부품의 연결 뿐아니라 외부로부터의 장치를 연결하는데 모니터와 연결되는 선, USB 장치, 키보드와 마우스장치 연결 등을 합니다. 

'IT' 카테고리의 다른 글

플랫폼이란 무엇인가  (0) 2020.04.20
혼합현실[Mixed Reality]  (0) 2020.04.20
g)그램)은 무게단위가 맞을까요  (0) 2020.04.20
JPG와 PNG차이  (0) 2020.04.20
조립식 컴퓨터 맞추는 법 - 모니터  (0) 2020.04.20
  Comments,     Trackbacks
조립식 컴퓨터 맞추는 법 - 모니터

조립식 컴퓨터의 장점은 일체형 컴퓨터와 달리 부품을 제조사를 선택하여 구매할 수 있다는 점입니다. 좀 더 쉽게 조립식 컴퓨터를 구매하는 방법을 소개하고자 합니다.

 

개요

 

모니터의 성능이 얼마나 좋느냐에 따라 내가 즐겨하는 게임을 눈이 덜 피로하게 플레이할 수 있고, 내가 작업하는 작업물의 과정과 결과물을 선명하게 볼 수가 있습니다. 

 

화면 크기

화면의 크기는 인치단위로 표시하게 되는데 보통 16인치~34인치정도까지의 크기가 있습니다. 인치의 크기는 가로X세로의 크기가 아니라 모니터 대각선 길이를 뜻합니다.

1인치는 대략 2.54cm이며, 모니터 전체의 대각선 크기가 아니라, 테두리를 제외한 실제 화면을 염두해야 합니다.

 

화면 비율

화면 비율(가로:세로)은 와이드/울트라 와이드로 나뉘는데 보통 와이드의 경우 16:9/ 17:9/ 16:10 으로 나뉘며 울트라 와이드의 경우 21:9/ 32:9로 나뉘게 됩니다. 가끔 비율이 16:10 또는 2.35:1 등 비율로 출시되는 제품이 있으며, 디스플레이의 종횡비(aspecto ratio)에 따라 사이즈가 달라지게 됩니다.

 

 

해상도

 

모니터의 해상도 단위(PPI, Pixel per inch)는 길이 단위당 표시되는 픽셀 또는 점의 수입니다. 화면에 픽셀을 얼마나 표시할 수있는지를 의미하므로 PPI가 높을 수록 이미지가 정교하게 나타나게 됩니다. 1인치당 몇 개의 픽셀로 이루어졌는지를 나타내는 PPI와 1인치당 몇 개의 점(dot)으로 이루어졌는지를 나타내는 DPI(Dot per inch)로 나뉘게 됩니다. 각 수가 많을 수록 고해상도의 이미지를 표현할 수가 있습니다.

 

DPI는 예를 들어 이미지가 72dpi라면 가로X세로 각 1인치에 72개의 점(5,184)으로 이루어져 있는 것입니다.

모니터 해상도의 단위는 가로세로 1366x768~1024x768정도 입니다.

 

응답속도

 

모니터를 통해 어떠한 이미지가 움직일 경우, 눈에는 움직이는 것으로 보이지만 실제로는 움직이는 것이 아니라 모니터 패널은 수많은 화소(점)로 이루어져 있습니다. 화소는 색을 바꾸거나 끄고 켜는 것을 반복하게 되는데 이러한 과정에 걸리는 시간을 응답속도라고 합니다. 응답속도의 단위는 0~4ms에서 17~10ms정도로 이루어져 있습니다.

응답속도 측정의 기준은 GTG(Gray to gray)와 WTB(White to black) 등이 있으며 GTG는 밝은 회색에서 어두운 회색으로 전환되는 시간을 측정/ WTB는 흰색에서 검은색으로 바뀌는 시간을 뜻합니다.

 

주사율

 

주사율은 보통 60Hz~100Hz 정도 이며, 주사율이란 화면에서 1초에 얼마나 많은 장면을 표시할 수 있는지를 나타내는 수치입니다. 60Hz라면 1초동안 화면을 60단계로 쪼개어 보여줄 수 있다는 의미입니다. 고주사율의 경우 보통 초당 120~240단계(120Hz~240Hz)까지도 보여줍니다.

주사율이 높을 수록 장점은 FPS 종류의 게임을 할 때이며, 일반적인 문서작업이나 웹서핑 등을 할때는 고주사율은 장점을 발휘하지는 않습니다.

 

곡률

 

 

곡률은 곡선 또는 곡면의 휨 정도를 나타내는 변화율입니다. 커브드 모니터에서 R(Radius)로 표현하며 4000R은 반지름이 4000mm인 원의 곡면을 의미하며 R값이 작을수록 많이 휘어집니다. 

 

패널

 

IPS(In Plane switching)는 TN패널에서의 좁은 시야각이나 저품질의 색 재현력 등을 개선하기 위하여 개발되었으며, 수평으로 눕힌 액정 분자를 수평방향으로 회전시켜 백라이트 광량을 제어합니다. 시야각이 170도 이상이며 어느 각도에서 보던 깨끗한 화면을 제공합니다.

 

VA(Vertical alignment)는 역시 TN패널을 개선하기 위하여 개발되었는데, 전압을 주지 않았을 때 액정 분자가 수직 방향으로 배열되며 최대 전압을 주었을 때 액정 분자가 수평 방향으로 배열 됩니다. 

 

명암비의 차이

전압을 주지 않았을 때 액정분자가 수직으로 배열되며 백라이트 빛을 차단하기 때문에 IPS나 TN패널의 명암비가 1000:1이라면 VA패널은 3000:1 정도 입니다. 명암비가 높을 수록 어두운 곳은 더 어둡게, 밝은 곳은 더 밝게 보이지만 응답속도가 TN, IPS 패널에 비해 느린 단점이 있습니다.

 

DCI-P3

 

미국의 7대 메이저 영화사가 설립한 벤처회사인 DCI가 영화에서 실제와 같은 색을 표현하기 위해 제정한 디지털 시네마 색 표준을 의미 합니다. 보통의 색 표현은 sRGB/ Adobe RGB를 사용하는데 DCI-P3 색 표현의 영역은 이에 비해 sRGB보다 25%정도 더 넓습니다. 보통 70~90% / 90~100% / 100%~ 정도의 제품군이 있습니다.

 

기타

 

기타로는 영상입력단자 HDMI / HDMI 2.0 등을 지원하는지 HDR을 지원하는지 살펴보시면 됩니다. 

 

'IT' 카테고리의 다른 글

플랫폼이란 무엇인가  (0) 2020.04.20
혼합현실[Mixed Reality]  (0) 2020.04.20
g)그램)은 무게단위가 맞을까요  (0) 2020.04.20
JPG와 PNG차이  (0) 2020.04.20
조립식 컴퓨터 맞추는 법 - 메인보드  (0) 2020.04.20
  Comments,     Trackbacks
첫 게시글

 

안녕하세요. 제 블로그의 첫 번째 글입니다.

티스토리를 포함하여 블로그 운영이 처음인만큼 차별적인 콘텐츠와 스토리를 담을 예정입니다.

앞으로 1일 1포스팅이 어려울 수도 있겠지만, 티스토리를 운영하면서 알게되는 새로운 사실과 저처럼 블로그, 티스토리 블로그 운영이 처음이신 분들을 위하여 작은 팁 역시 포스팅할 예정입니다.

 

 

티스토리란?

티스토리(TISTORY)는 다음카카오에서 운영하는 블로그 서비스입니다. 

티스토리에서는 HTML과 CSS를 잘 몰라도, 내가 운영하는 블로그를 내 스타일로 원하는 만큼 꾸밀 수 있습니다. 

다양한 기본 스킨을 제공하여 처음 접하시는 분들도 쉽게 접근하고 운영할 수가 있습니다.

 

 

포스팅 예정사항

 

 2020년 4월 20일 블로그 개설 및 2020년 4월 20일 최초 글 작성

 - IT 관련

 - 트렌드 콘텐츠

 - 티스토리 관련 팁

  Comments,     Trackbacks