애드센스를 활용해서 수익을 얻기 위해 티스토리를 운영하면서 Html의 사용은 필수적입니다. Html을 작성하고 티스토리에서 어떻게 출력되는지 테스트하기 위해서 '글쓰기'를 사용하는 방법도 있겠지만, 간단하게 메모장처럼 만들어진 웹사이트에 입력해보는 방법이 있습니다. 오늘은 Html 연습장인 'JSBIN'의 링크와 사용 방법을 공유하고자 합니다.
JSBIN 접속 방법
Html 연습할 수 있는 사이트를 여러개 돌아다녀 보았지만 JSBIN이 가장 직관적이면서도 사용성이 편했습니다. Html의 연습장인 JSBIN의 링크는 아래와 같습니다.
JSBIN 사용 방법
들어가 보시면 왼쪽과 오른쪽으로 분할된 화면을 맞이할 수 있습니다. 가운데 위쪽에 연습할 수 있는 언어들이 보이는데 Html을 연습할 것이기 때문에 Html과 Output만 선택되어 있는 기본 설정대로 사용하시면 되겠습니다. 혹시나, 다른 언어를 사용하고 싶으신 분은 아래와 같은 메뉴에서 해당 언어를 클릭하면 분할창이 추가되며, 다시 해당 언어를 클릭하면 창이 사라집니다.
이제, 실제로 JSBIN이 제대로 작동하는지 테스트해 보겠습니다. 테스트하고자 하는 Html 코드는 'Helloworld"라는 문자열을 가운데 정렬한 코드입니다. 해당 코드는 아래와 같습니다.
<p style="text-align: center;">Helloworld</p>
JSBIN에 처음 접속하게되면 아래와 같은 창이 우리를 반겨주고 있는데, <body>와 </body> 사이에 작성한 코드를 입력해주고 Run 버튼을 클릭해주면 됩니다. 아래 그림을 확인해보시면 왼쪽창에 코드를 작성했고 Run 버튼을 눌러서 오른쪽창에 'Helloworld'가 출력된 것을 확인할 수 있습니다.
마무리
오늘은 티스토리에 적용할 Html을 간단하게 테스트해 볼 수 있는 사이트인 JSBIN의 사용방법에 대해서 알아보았습니다. 애드센스를 적용하기 전이나 코드를 적용하기 위해 자주 사용하는 사이트이니 여러분도 유용하게 사용하셨으면 좋겠습니다.
댓글