[HTML] 코딩으로 웹브라우저에 Hello world! 출력하기

코딩으로 웹브라우저에 Hello world! 출력하기

웹브라우저에 다음과 같은 출력 결과가 나오도록 메모장을 통해 코딩을 해봅시다. 굵은 글씨로 출력되게 하는 방법은 여러가지가 있습니다. 웹 문서를 메모장을 이용해서 작성하는 것은 가장 기본적인 작성 방법입니다. 에디터를 이용하면 더욱 쉬우면서 효과적인 작성이 가능합니다.

브라우저에 출력될 결과물

그 중에서 한 가지 방법으로 제목태그를 사용했습니다. 물론 다른 방법으로 위와 같은 결과를 출력할 수 있습니다만 여기서는 간단한 태그를 사용했습니다. 'h1' 태그는 제목 태그 중에서 가장 상위 태그입니다. 이 태그는 한 문서에 하나만 사용하는 것이 검색에 유리합니다. 검색 로봇은 태그를 참고해서 검색하기 때문입니다. 

메모장에서 코딩한 내용

코딩한 내용을 저장할 때는 '파일 형식'에서 '모든 파일'을 선택하고 '파일 이름'을 확장자까지 기록합니다. 확장자는 'html' 또는 'htm'으로 부여합니다. 그래야 웹브라우저가 웹문서임을 인지하여 웹 문서 형태로 보여줍니다.

'모든 파일'에서 html 확장자로 저장

코딩 소스 보기

크롬브라우저에서 기능키[F12]를 누르면 코딩 소스를 볼 수 있습니다. 아래에 그림으로 시멘틱 구조까지 보여 줍니다.

크롬브라우저에서 코딩 소스 보기