본문 바로가기

Semantic4

검색엔진최적화(SEO) 기초 검색엔진최적화(SEO) 기초 1. 검색엔진 최적화 검색엔진 최적화, SEO(Search Engine Optimization)는 Google, Bing 등의 검색 엔진에서 웹사이트를 더 나은 검색 랭크를 갖도록 최적화하는 기술입니다. 이를 통해 더 많은 트래픽을 유도할 수 있기에, 검색 포털 사이트에서 사용자가 키워드 검색시 검색 결과 상위에 랭크되면 좋을만한 서비스 혹은 웹페이지를 가진 사람들이라면 관심 갖고 공부해야 할 기술입니다. 기본적으로 검색 포털로 가장 많이 사용되는 서비스가 Google이므로 Google의 검색엔진을 예시로 간단하게나마 SEO에 대해 파악해봅시다. 2. Google 검색의 3단계 2-1. 크롤링 크롤러가 인터넷에서 찾은 페이지로부터 텍스트, 이미지, 동영상을 다운로드합니다. 크.. 2023. 3. 27.
웹 접근성(Accessibility) 1. 웹 접근성 웹 접근성이란 웹사이트 및 웹과 관련한 도구나 기술들이 장애나 불편함을 가진 사람들이 쉽게 쓸 수 있는 방법으로 디자인되고 개발된 것을 이야기 합니다. 웹 접근성을 위해 고려해야하는 장애나 불편함은 인지장애와 같은 정신적 불편함부터, 팔을 쓸 수 없거나 시력이 없거나 저하된 신체적 불편함은 물론, 아이를 한 손에 업고 있어서 한 쪽 팔만 사용할 수 있다던가 하는 일시적인 불편함을 모두 포함합니다. 인터넷의 아버지라 불리는 Vint Cerf는 “인터넷은 모두를 위한 것이지만, 우리가 그렇게 만들지 않으면 인터넷은 그렇지 않을 것입니다.”라고 말했습니다. 팔의 사용이 불편한 사람들, 청각이나 시각이 불편한 사람들, 사용하는 언어가 다른 사람들 모두가 웹 사이트와 앱을 접근하고 사용할 수 있어.. 2023. 3. 22.
Semantic HTML 작성하기 1. Semantic(시맨틱) 이란? 시맨틱이란 단어의 뜻을 전반적으로 우리 말로 나타내자면 코드 조각에 내포된 의미라고 볼 수 있습니다. 예를 들어 Javascript의 경우, 특정 라인의 JS가 실행됐을 때 어떤 효과가 일어나는지의 의미합니다. 코드를 작성할 때 함수 이름 등을 Semantic을 고려해서 지으면 가독성이 좋고 코드를 이해하기가 훨씬 쉬워집니다. 예를 들어, '복숭아'라는 항목을 가진 HTML 요소를 생성하는 함수를 상상해봅시다. 단순히 build('Peach')라고 함수 이름을 지을 수 있을테지만 createLiWithContent(‘Peach') 라고 작성하면 동작 자체는 똑같을지 몰라도, 코드 실행 효과가 함수 이름에 그대로 나타나게 되어 훨씬 코드를 이해하기 쉽고 보기 좋을 것입.. 2022. 10. 31.
HTML 기본 (下) 1. 태그의 경우 문서의 제목을 정의며 그렇기에 내용으로 텍스트만을 가질 수 있습니다. SEO에 굉장히 중요하기때문에 정확하고 의미있는 title을 부여하도록 해야합니다. 태그는 보통 character set이나 페이지 설명, 키워드, 문서의 저자, viewport 세팅을 위해 사용합니다. 브라우저가 내용을 어떻게 표시하고 리로드할지 알려주고 다른 웹서비스나 검색엔진에게 정보를 제공하는 역할입니다. HTML 작성시 뷰포트를 설정하여 모든 기기에서 웹사이트가 잘 보여지도록 해야합니다. 태그는 베이스 URL이나 페이지의 모든 상대 URL의 타겟을 설정합니다. 그렇기에 href속성이나 target속성 둘 중 하나 이상을 반드시 포함해야 하며, 한 문서엔 단 하나의 태그만 존재해야합니다. 2. 뷰포트(Viewp.. 2022. 10. 20.