Jay

Semantic Tags(Semantic Markup) 의미가 있는이라는 뜻으로, 중요한 점으로는 첫번째 SEO(Search Engine Optimization) 검색을 최적화 하기 위해서 제목과 부제목, semantic tags들을 잘 활용한다면 제목과 부제목 같은 특징들을 잘 파악할 수가 있다. 두번째 Accessibility 웹 접근성으로 음성으로 읽어주는 스크린 리더를 이용하거나 또는 키보드만을 이용해서 웹사이트만을 이용하는 경우 적절한 시멘틱 태그로 잘 만들어진 웹사이트이면 스크린 리더등 키보드든 잘 동작하게 된다. 마지막으로는 개발자들의 유지보수성 측면인데, 개발자가 HTML 코드를 바라봤을 때 한 눈에 이런식으로 구조가 짜져있구나라고 판단할 수 있고 이게 유지보수성과 연관이 있다.(Maint..

HTML basic body Element는 HTML의 Markup 명령어이다. content와 함께 사용된다. 대소문자는 구분하지 않는다. element는 body부분안에 => 들어간다. element에는 여는 태그와 닫는 태그가 무조건 있어야 한다. 아래와 같이 예제를 보자 (Opening tag_내용_ Closing tag =>전체가 다 Element이다) Hello World! Attribute 하나 이상의 속성이면 공백 필요 속성 이름 뒤에 등호 따옴표 필요하다. class="Note" 이 부분은 Attribute이다. Hello World Nesting elements 중첩요소이고 요소안에 다른 요소를 넣는 코드 HelloWow World. Empty elements(Images) 빈요소이고 ..

DOM요소 반영 주의해야 할 것은 DOM 요소에 추가하는 데이터들은 HTML 파일을 봤을 때 데이터들이 다 보인다. HTML 바디 안에 사용자가 정의한 데이터의 key와 value들이 들어가 있는것이 바로 보인다. 그래서 사용자에게 민감한 데이터는(보안에 조심해야 하는) 정보들은 돔요소에다가 추가해서 보관 하는 것은 좋지 않다.(암호화해서 JS안에 보관하자) 뭔가 로직을 처리하기 위한 정말 사용자에게 보여도 되는 그런 정보들이 있다면 데이터 속성을 이용해서 간편하게 작성할 수 있다.

카테고리별로 버튼 만들고-링크걸고 카테고리별로 설명

1 skills - skills&attributes - description 2 Skills 세부사항들 2. Tools 목록 지정하기 Visual Studion Code Atom Android Studio Code iOS development tools Sketch app 3 etc 목록작성 Git design passion of analysis

navbar#navbar section#about .navbar__logo ul.navbar__menu>li.navbar__menu__item*6 Home About Skills My work Testimonial Contact 이미지 태그 넣는법 img.home__avatar h1.home__title 줄바꿈 Hello, I'm Dream Coder button.home__contact 작성순서도 ccode class 지정=> class를 major변수명으로 지정 class안에 아이콘 지정=>아이콘 명지정(favaicon) => class title지정 => class description지정

html에서 컴포넌트 클래스 이름을 작성할 때 매우 복잡하고 유지 보수 하기가 힘들어서 클래스 이름을 작성할 때 잘 작성할 수 있을지에 대해서 이름을 작성하는 방법에 대해서 정의한 규칙이다 프로젝트를 모듈화해서 만들고 포스트 css 같은 애들을 이용하게 되면 이런 bem은 필요없지만 모듈화를 이용하지 않고 간단하게 프로젝트를 만든다면 뱀을 이용해서 만들면 더 쉽게 이름을 만들 수가 있다. 이름그대로 modifier으로 나누어서 이름을 작성하는 것을 말한다. 또 뱀은 하이라키(hierarchy)대로 이름을 일일이 다 작성하는 것이 뱀은 아니다. 뱀은 컴포넌트 단위로 블럭 레벨로 이름을 작성하는 거기 때문에 카드(예시) 카드 자체로 하나의 컴포넌트이다. cards는 이런 카드를 묶어 놓는 컨테이너일 뿐이다...

meta name="description" content="Portfolio for world-renowned software engineer Jay">    meta name="author" content="Jay">