# aside

dev_seongjoo

aside 태그가 무엇인가요? aside 태그의 개념 HTML5의 ` 태그는 웹 문서에서 주요 콘텐츠와는 관련이 적은 내용을 표현하는 데 사용되는 태그입니다. ` 태그 안에 포함된 내용은 일반적으로 주요 콘텐츠와는 독립적이지만 관련성이 있을 수 있습니다. 이 태그를 사용하여 부가적인 정보, 사이드바, 광고, 기타 부가 컨텐츠를 나타낼 수 있습니다. aside 태그의 예시 `` 태그의 사용 예는 다음과 같습니다: 위의 예제에서 ` 태그는 주요 콘텐츠와 관련된 부가 정보를 포함하고 있습니다. 이러한 부가 정보는 사이드바, 광고, 관련 링크 등을 포함할 수 있습니다. 웹 브라우저는 ` 태그를 사용하여 해당 내용을 주요 콘텐츠와 구별하여 표시할 수 있습니다. `` 태그는 웹 페이지의 레이아웃과 스타일링에 따라 다르게 표현될 수 있으며, 주요 콘텐츠와의

yeonn

✅Semantic web / Semantic tag > Semantic web : 기존 웹을 확장하여 컴퓨터가 잘 이해할 수 있는 의미를 기반으로                       의미적 상호운용성을 실현, 다양한 정보들을 컴퓨터 스스로 처리, 자동화,                       재활용 등을 할 수 있도록 하는 것이 목표 > Semantic tag : 시맨틱 태그가 나오기 전 웹 페이지는 구조를 만들기 위해 대부분 코드에    &nb

brinymaestro05

시맨틱 태그 semantic : 의미론적인, 의미적인 머리, 옆구리, 네비게이션, 발바닥, 등 이름만 가지고 어느 역할을 하며, 웹에서 어느 위치에 있는 태그인지 쉽게 파악 가능. 시맨틱 태그는 기능은x. div와 동일한 역할. 태그에 의미가 있기 때문에, 검색을 할 때 자료를 쉽게 찾게 해주거나 시각장애인에게 도움을 주기도 함. header 문서 상단에 위치하며 사이트의 로고, 검색창, 프로필 등등이 있음. nav 네비게이션. 운영하는 서비스롤 연결해주는 링크 역할. aside 사이드. 옆구리. 옆쪽에 있는 작은 메뉴를 의미함. section 문서의 구역을 나눌때 사용한다. article 잡지, 기사. 해당 구역 안에서 나타내는 콘텐츠. main 그 페이지에서 가장 메인이 되는 내용을 쓰는 곳. 한 번밖에 못씀. footer 발바닥. 화면 맨 밑에 위치하며 사이트를 요약해놓은 곳. 저작권 정보, 사업자, 연

soyunsarang

1. 자바스크립트의 탄생 넷스케이프 커뮤니케이션즈(회사)에서 웹페이지의 보조기능을 수행하고자 함 브라우저에서 동작하는 경량프로그래밍언어 필요 → 자바스크립트 (브렌던 아이크 개발) 이름: 모카 → 라이브스크립트 → 자바스크립트 2. 자바스크립트의 표준화 마이크로소프트에서 자바스크립트의 파생버전이 ‘JScript’ 출시하여 탑재 마이크로소프트와 넷스케이프 커뮤니케이션즈가 시장점유율일 높이기 위해 자사 브라우저에서만 동작하는 기능 추가 → 브러우저에 따라 웹페이지가 정상 동작하지 않음 (크로스 브라우징 이슈) 넷스케이프가 ECMA인터내셔널(시스템 표준화 관리하는 비영리 표준화 기구)에 자바스크립트 표준화 요청 ECMAScript → ECMAScript3(ES3) → ECMAScript5(ES5는 HTML5와 함께 출현) 3. 자바스크립트 성장의 역사 초기 웹페이지: 완전한 HTML 코드를 서버로부터 전송받아

yrats

semantic semantic image ‏‎ ‎ [![semantic image](https://slid-users-assets-v1-seoul.s3.ap-northeast-2.amazonaws.com/public/capture_images/e7cfd59462e04492bdb7a9f843efd5c5/da1327b2-958b-4b15-b54b-3a1f3a8ab37b.p

oiosu

HTML 구조를 나타내는 요소 1. [div] (https://developer.mozilla.org/ko/docs/Web/HTML/Element/div) : 컨텐츠 분할 요소 : 블록 레벨 요소 : 플로우 콘텐츠를 위한 통용 컨테이너 (순수 컨테이너로서 아무것도 표현안함) : 본질적으로 아무것도 나타내지 않음 2. span : 인라인 컨테이너 : 인라인 레벨 요소 : 본질적으로 아무것도 나타내지 않음 : 어떤 특성의 값을 서로 공유하는 요소를 묶을 때 사용 가능 > 🌵 span (인라인 요소) vs div(블록 요소) (둘이 매우 유사하지만 요소의 차이점 기억하기!) Semantic Web : 요소의 의미를 고려하여 구조를 설계하고 코드를 작성한다. (div, span : non-seman

uhye

패스트캠퍼스 강의를 정리한 내용입니다. "The RED : 견고한 UI 설계를 위한 마크업 가이드 by 정찬명" div, span 요소의 의미 아무 의미가 없는 태그 의미를 찾지 못했을 때 마지막으로 선택하는 태그 사용 빈도가 높을수록 HTML 태그를 의미 적절히 사용하지 않았다고 해석됨 div를 대체할 만한 요소들 span을 대체할 만한 요소들 Sectioning 요소 hx, hgroup, header, footer : 섹셔닝은 아니지만 함께 쓰는 요소 article, aside, nav, section : 섹셔닝 요소 header, footer : 도입부, 헤딩, 헤딩그룹, 목차, 검색, 로고 : 저자, 저작권, 연락처, 관련 문서 의미 범위 : 섹셔닝 루트(body) 또는 섹셔닝 콘텐츠(article, aside, nav, section) 반드시 필요한 요소는 아니지만 이런 의미일 때 di

lsh__97

시맨틱 웹 'semantic'이란 의미론적인 뜻을 가지며 마크업은 HTML문서 태그로 문서를 작성하는 것을 말한다. 시맨틱 마크업 사용 장점 검색 엔진은 시맨틱 마크업을 분석하여 페이지의 검색 랭킹에 영향을 줄 수 있는 중요한 키워드로 간주하여 SEO(Search Engine Optimize)에 영향을준다. 시각 장애가 있는 사용자가 스크린리더로 페이지를 탐색할 때 시맨틱 마크업을 푯말로 사용할 수 있다. -의미가 없는 div태그들을 탐색하는 것보다, 의미있는 코드 블록을 작성하는게 나중에 보기도 편하고 찾기도 쉽다. 개발자에게 태그안에 채워질데이터 유형을 제안할 수 있다. 시맨틱 태그 종류 및 특징 header : 소개 및 탐색에 도움을 주는 콘텐츠를 나타낸다. 예시로는 제목(페이지 제목, 글 제목), 로고, 검색 폼, 작성자 이름 등의 요소를 포함한다. header태그 안에 header태그 또는 footer 태그를 넣을 수 없다.

hoje15v

출처 : 20 mini projects ) section DOM Array Methods | forEach, map, filter, sort, reduce, sectionMusic player | HTML5 Audio API section Menu Slider & Modal | DOM & CSS -Brad Traversy HTML Part aside tag 사이드 바 만들 때 유용한 태그! main tag main part tag CSS part first-of-types 동일한 elements 중 첫번째 element를 선택한다. position : fixed 후 화면 전체 채우기 JS part async/ await **async 함수 내에서 data 값을 구하기 위해서는 res.json()까지 await 를 붙혀 변수에 값을 할당해줄 것! 그렇지 않으면 res.json()의 값으로 promise가 return

nasowoo

단순히 body 안에 버튼들을 생성하고 style에 > button { position: sticky; display: inline-block; top: 0px; left: 1000px; } 를 입력하면 버튼들은 위에 고정되지만(fixed) 버튼들끼리 서로 겹쳐있는 상태를 볼 수 있다. 그러나, body 안에 aside 태그를 생성하고 그 안에 button들을 집어넣은 뒤 style에 > aside { position: sticky; display: inline-block; top: 0px; left: 100

katej927

Q : "사이트에 이미지를 넣는 방법은 두 가지가 있습니다. img 태그를 사용하는 것과 div 태그에 background-image 속성을 추가하는 것. 두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋은지 설명해보세요." Semantic Web 의미: 의미론적인 웹 기존의 잡다한 데이터 집합이었던 웹페이지를 ‘의미’와 ‘관련성’ 을 가지는 거대한 데이터베이스로 구축하고자 하는 발상 Semantic Tags Sementic Web을 구현하기 위한 의미를 가진 태그들 HTML 태그는 non-semantic 요소, semantic 요소로 구분 non-semantic 요소 div, span 등 content에 대한 설명無 semantic 요소 form, table, img 등

lukawitch

Sementic 태그 레이아웃만을 위해 사용되는 태그이다. 태그자체에는 큰 의미가있지는 않다. 기능은 DIV하고 같다. header태그 (sementic 태그1) 보통 위에 어느페이지에서나 보여줘야할 부분 ex)로고 같은데에서 사용한다. nav태그 (sementic 태그2) 쉽게 생각하면 네비바라고 생각하면 된다. aside태그 (sementic 태그3) 사이드에 위치한 공간을 의미한다. section태그 (sementic 태그4) 여러한 내용들을 감싸는 공간을 의미한다. article 태그 (sementic 태그5) 핵심적인 내용을 넣을때 사용한다. footer 태그 (sementic 태그6) 페이지 제일 하단부분을 작업할 때 사용한다.