FE/HTML_CSS_JavaScript9 SEO(검색 엔진 최적화)에 대해서 SEO는 검색 엔진 최적화(Search Engine Optimization)의 약어로, 웹 사이트나 웹 페이지가 검색 엔진에서 높은 순위로 나타날 수 있도록 최적화하는 과정 및 기술을 의미합니다. 검색 엔진은 사용자가 특정 질의를 검색할 때 관련성 높은 결과물을 제공하기 위해 다양한 알고리즘을 사용하며, 이 알고리즘에 대응하여 웹 페이지를 최적화하는 것이 SEO의 목적입니다. 아래는 SEO에 관련된 주요 개념과 기술에 대한 간단한 설명입니다. 1. 키워드 연구 (Keyword Research) 특정 키워드를 타겟팅하여 해당 키워드에 대한 검색 트래픽을 높이고자 하는데, 이를 위해 어떤 키워드가 중요하고 유용한지 조사하는 단계입니다. 키워드 연구는 SEO 전략의 핵심이며, 특정 키워드를 효과적으로 선정하는.. 2024. 1. 3. Array 관련 메소드 (2) filter 배열을 받아 필터링된 값들만 배열로 반환하기 위해 reduce 배열을 받아 무언가의 값으로 만들어 반환하기 위해 forEach 배열을 받아 순환하기 위해 (값 반환 x) map 배열을 받아 새로운 배열을 반환하기 위해 arr.map() map() 메서드는 배열의 모든 요소에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다. const array1 = [1, 4, 9, 16]; const map1 = array1.map((x) => x * 2); console.log(map1); // Expected output: Array [2, 8, 18, 32] **map() 함수와 forEach() 함수와의 차이점 둘 다 배열의 요소를 순회하는 함수이지만, map() 함수는 각 요소를.. 2024. 1. 1. Array 관련 메소드 (1) arr.isArray() isArray() 메서드는 인자가 배열인지 판별합니다. type of로 배열을 검사하면 object를 리턴하기 때문에 배열인지를 확인하려면 isArray 사용 인자가 배열이면 true, 아니라면 false. Array.isArray([1, 2, 3]); // true Array.isArray({ foo: 123 }); // false Array.isArray("foobar"); // false Array.isArray(undefined); // false arr.forEach() forEach() 메서드는 각 배열 요소에 대해 제공된 함수를 한 번씩 실행합니다. 값을 반환하지 않습니다. forEach(callbackFn) const array1 = ['a', 'b', 'c']; .. 2023. 12. 4. Sass vs Tailwind CSS Tailwind CSS를 배운 날 들었던 생각과 똑같은 생각을 했던 사람의 글 https://blog.naver.com/gloomysight/222361628379 나는 왜 tailwind css의 팬이 되었는가 불과 1년전 나는 tailwind css에 대해 살짝 부정적인 글을 쓴 적이 있다. 아래가 바로 그 문제의 글. 이 cs... blog.naver.com [요약] inline css 선언 스타일과 유사하다. 그래서 정말 지저분한 코드를 만들어낸다는 단점이 있다. 이런 점은 @apply 명령으로 별도 클래스를 선언한 뒤 빌드를 하면 깔끔하게 클래스명을 단축시킬 수 있다. 그런데 이렇게하면 사실 기존의 css 방식과 다를 것이 별로 없다는 느낌을 주기도 한다. 그럼에도 불구하고 tailwind cs.. 2023. 11. 30. HTML 2 lazy loading 의 정의 페이지를 불러오는 시점에 당장 필요하지 않은 리소스들을 추후에 로딩하게 하는 기술 사용자가 페이지의 최상단의 이미지만 확인하고 나가버리면 데이터나 메모리에 낭비가 발생하게 되므로 나중에 사용자가 필요로 하는 시점에 로딩하는 것 컨테이너 요소 span : inline 요소 div : block 요소 E 문자를 div로 둘러 싸면 div가 한줄을 다 차지해서 나머지 문자가 아래로 밀려남 텍스트 레벨 요소 sub : 아래 첨자 / H2SO4 / 화학식이나 수학식에 사용 sup : 위 첨자 / 각주[1] / 각주를 달거나 약어를 설명할 때 사용 ** sub와 sup는 하이퍼링크로 위키와 연결하여 사용 함 mark : 형광펜 효과 / 삼각함수 abbr : 쩜쩜밑줄 s : 취소선 /.. 2023. 10. 30. HTML 1 figure 태그 (요소에 대한 설명이 필요할 경우에 사용) • 도표, 차트, 이미지, 표 등을 감쌀 때 사용하는 요소 ** figure 태그 내에 태그 : 요소에 대한 설명 ** html의 문서내에 img를 포함시키는 것이 아닌 연결시키는 구조 entity 코드 • 키보드에 없는 특수 문자들을 HTML 문서에 사용할 때 사용 entitycode.com → 등 ul, ol, li 태그 (순차, 비순차 목록) • ul, ol 태그 안에는 li 태그만 사용 가능 • ul 안에 ul을 또 사용하려면 ul > li > ul dl, dt, dd 태그 (설명 목록) • description lists : 설명 목록 / dt 와 dd를 감싸서 목록을 생성 • definition term : 용어 제목 / dl 안에 .. 2023. 10. 27. 이전 1 2 다음
