천천히, 꾸준히

😺 Study/HTML

[부스트코스 edwith] 웹 UI 개발 IR 기법 / 요소 숨김 처리를 활용한 프로모션 페이지 만들기 이번 강의에서는 프로모션 페이지를 마크업과 IR기법을 통해 접근성에 준수하는 방법까지 배울 수 있었다. 먼저, IR이란? Image Replacement 이미지를 볼 수 없는 사용자에게 적절한 대체 텍스트를 제공하는 것 태그의 alt 속성값에 들어갈 대체 텍스트가 너무 길거나, css에서 background 속성으로 들어간 의미가 있는 이미지의 경우 마크업으로 대체 텍스트를 대신한다. 대체 텍스트는! 의미 전달이 되도록 시멘틱 마크업 하기 화면에서는 보이지 않도록 css로 숨기기 / 하지만 스크린 리더가 읽을 수 있어야 함 이러한 요소 숨김 처리에는 안 좋은 예(BAD)부터 좋은 예(BEST)까지 3가..

2021. 3. 9.

😺 Study/HTML

온라인 스터디를 만들고 참여하면서 최소 하루에 2개 이상씩 수강목표를 세웠다! 어제는 진도가 빠른 스터디원의 프로젝트를 함께 도와주기도..! 이미 다 아는 것 같으면서도 강의를 들어보면 지나치던 것들이 속속 보인다. 개념이 이미 빠삭한 사람은 각 카테고리의 퀴즈만 풀어보며 복습해봐도 도움이 될 듯하다.

2021. 1. 20.

😺 Study/CSS, SCSS

CSS 단위에는 절대 길이와 상대 길이가 있다. 먼저, 절대 길이 px 화면에서 고정된 크기 값 pt 표준 인쇄 단위 window에서 9pt = 12px, mac에서 9pt = 9pt이다. 실무에서는 디자이너들이 가끔 pt로 psd를 보내주는 경우가 가끔 있을 수 있는데, 편의상 같은 값으로 계산하여 작업한다고 한다. 그다음, 상대 길이 % em 선언한 해당 폰트의 대문자 M의 너비를 기준으로, 상대적인 단위이다. em과 rem의 차이 em은 부모 요소의 영향을 받고, rem은 html의 영향을 받는다. See the Pen QWKzaPW by leecorin (@leecorin) on CodePen. .wrap의 font-size: 24px이고 .section의 font-size: 36px인 것을 알 ..

2021. 1. 16.

😺 Study/HTML

edwith에서 '자바스크립트의 시작' 편을 모두 수강한 뒤, 웹 UI 강의로 넘어갔다. 비록 이미 조금 익숙해진 html과 css를 주로 다루지만 프로젝트 과제도 있기 때문에 남는 것도 있을 것 같고, 무엇보다 내가 쓰던 것만 쓰는 단계에 이르러서 다시 되짚어보고 몰랐던 걸 체크해보는 게 좋겠다고 생각했다. 처음 html과 css를 접하는 분들에게 최적의 강의가 아닐까 생각이 든다. 차근차근 천천히 알아듣기 쉽게 알려주셔서 이해가 쏙쏙-👩🏻‍💻 강의를 통해 배운 html의 기본적인 구조를 다시 정리해본다. 처음 html을 시작할 때, 그저 항상 들어가는 것이니 이전의 강사님이 넘어가셨던 기억이 난다. meta는 내용없는 빈 태그, charset(character set[캐릭터셋]:문자부호) 속성은 문자..

2021. 1. 16.

😺 Study/JavaScript, jQuery

변수, 상수, 대입 연산자에 대해 알아보자. 변수: 바뀔 수 있는 값 (variable) 상수: 바뀌지 않는 값 (constant) 예를 들어, 텍스트가 많을 때 특정 값만 텍스트를 바꾸고 싶은 경우. 변수로 설정한다. var name='hello'; alert("lorem ipsum blabla"+name+"lorem ipsum blabla"); - 변수 name 위치에 hello가 할당되어 경고창이 뜬다. - 변수 name을 다른 값으로 할당해도 적용된다. (대입 연산자) - 텍스트가 많은 경우, 변수에 다른 값으로 할당하면 되기 때문에 유용하다. 참고: edwith [부스트코스] 자바스크립트의 시작 by 생활코딩 www.edwith.org/boostcourse-web-106/joinLectures/..

2020. 11. 23.

😺 Study/JavaScript, jQuery

자바스크립트를 처음부터 다시 공부해보니 언어를 받아들여야 한다는 거부감이 들었다. 무엇보다 어떻게 읽히고 동작하는지부터 알아야 훨씬 쉽게 받아들일 수 있을 것 같았다. 그래서 찾다가 알게된 edwith 사이트..! edwith은 네이버와 네이버커넥트재단이 제공하는 온라인 교육 플랫폼이다. 강의를 무료로 이용한 뒤 실무자에게 코드리뷰를 받을 수도 있다. 참고로 코드리뷰는 유료다. 자세한 내용은 아래 링크 참고// https://www.edwith.org/ 에듀케이션위드 : edwith 에드위드(edwith)는 네이버(NAVER)와 네이버 커넥트재단(NAVER Connect)이 제공하는 온라인 강좌(MOOC : Massive Online Open Course) 교육 플랫폼입니다. 에듀케이션위드(educati..

2020. 11. 23.