Skip to content

모두보기

  • 웹디자인
    Sass 믹스인 중복 배제하기
    Sass는 작성된 스타일 시트와 브라우저에서 해석할 .css 파일의 계층이다. Sass는 CSS를 더 쉽게 작성하고 유지할 수 있는 기능을 제공하고, 스타일시트 작성자가 CSS를 DRY하게 유지관리할 수 있도록 돕는다. 우리가 원하는 대로 한 곳에서 중복 없이 핵심 스타일을 정의하고 선택자 하나로 스타일을 적용하는 '실용주의 프로그래밍'의 원칙과 무관하지 ...
  • 사용자경험
    컨텍스트에서의 웹 접근성
    웹의 혁신은 필수 요소인 접근성에서 비롯된다고 할 수 있지만 웹사이트를 개발하는 사람조차도 접근성의 중요성을 인식하지 못하고 있는 것이 웹 접근성의 주요 과제입니다. 웹 접근성 향상을 위한 다양한 기능의 디자인은 모든 사람이 사용할 수 있을 뿐만 아니라 예상하지 못한 용도를 발견하기도 합니다. 색맹 사용자를 위한 스마트폰의 색상 대비 설정은 밝은 햇빛 속에...
  • 디자인
    [스매싱 매거진 11월 총정리] GitSheet 소개와 GraphQL 기초 배우기
    자주 사용하는 Git 명령어는 잘 기억하고 있지만 그렇지 않은 명령어는 쉽게 떠오르지 않죠. 이에 도움이 될 깃시트(GitSheet)를 소개합니다. 클릭 한 번으로 간편하게 명령어를 복사해 사용할 수 있습니다. 페이스북에서 만든 쿼리 언어 GraphQL을 기초부터 차근차근 배우는 데 도움이 될 오픈소스 튜토리얼이 있습니다. 하수라(Hasura)에서 만든 튜...
  • 코드
    객체 지향 CSS 소개
    객체 지향 CSS(Object Oriented CSS : OOCSS)는 CSS 생산성을 높이기 위해 개발된 방법론으로 CSS를 여러 개의 독립된 객체로 구성해 재사용성을 극대화합니다. 궁극적으로는 더 빠르고 효율적이며 추가와 유지보수가 쉬운 스타일시트를 만드는 데 목적이 있습니다. 최근에는 BEM 기법과 함께 사용되는 경우가 많고 부트스트랩 같은 CSS 프...
  • 웹디자인
    [2019년 9월 웹 개발 동향] 기본적인 생활 스타일을 받아들이는 법과 단순해지기 힘든 이유
    디지털 세상에서 살아가는 우리는 생산성을 높이기 위해 끊임없이 일을 찾고 단순함과는 점점 거리가 멀어지고 있습니다. 재충전을 위한 여가활동조차 온전히 누리지 못하고 있는 이 시점에 ‘기본’의 의미를 곱씹어 생각하며 일을 끝내면 아무것도 하지 않는 ‘기본적인 생활 스타일’을 한번 누려보는 것은 어떨까요? 파이어폭스 69가 출시되었습니다. 자바스크립트 퍼블릭 ...
  • 웹디자인
    [2019년 8월 웹 개발 동향] 강한 팀과 윤리적 데이터 센스메이킹
    모든 사람은 저마다 각자의 자리와 능력이 있습니다. 팀은 스타만으로 구성되는 것이 아니므로 팀원과 팀의 가치를 응원하고 지지하는 사람과 함께하려는 마음이 필요합니다. 사람들은 빠른 소프트웨어를 선호하고 구매하기 때문에 속도는 비즈니스 성공에도 중요한 요소입니다. 웹사이트 성능을 높이기 위해 아이프레임(iframe)을 섀도DOM(ShadowDOM)으로 바꾸게...
  • 웹디자인
    [2019년 7월 웹 개발 동향] 최신 기법과 착한 말썽
    이달 웹 개발 동향에서는 파이어폭스 68, 크롬 76의 새로운 업데이트 소식과 점잖은 방식으로 세상을 바꾸어놓을 수 있는 프랭크 키메로의 ‘착한 말썽’에 대해서도 살펴봅니다. 파이어폭스 68에는 자바스크립트에 BigInt, 개발자 도구에 접근성 검사기, CSS 스크롤 스냅과 마커 스타일이 추가되었고 메서드, URL, 매개변수, 헤더를 편집하지 않고도 개발자...
  • 콘텐츠전략
    로봇과의 대화 : 음성 검색과 스마트 에이전트, 구조화된 콘텐츠 사례
    구조화된 콘텐츠는 스마트 에이전트나 음성 검색의 결과를 좌우합니다. 사용자가 음성 검색을 통해 정보를 찾을 때도 콘텐츠 구조화 정도에 따라 검색 결과가 달라집니다. 구조화가 잘 갖추어져 있지 않은 페이지는 사용자를 경쟁사로 빠져나가게하는 계기가 될 수도 있습니다. 이 기사에서는 구조화된 콘텐츠 형태를 소개하고 이를 적용해보고 적용하지 않은 사례와 차근차근 ...
  • 웹디자인
    그리드 완벽 가이드
    CSS 그리드 레이아웃은 CSS 레이아웃 시스템 중 최강이라 할 수 있습니다. 플렉스박스와 달리 열과 행을 다룰 수 있는 2차원 시스템입니다. 우리는 레이아웃에 CSS를 사용하지만 생각만큼 쉽지 않습니다. 플렉스박스는 유용하지만 2차원 레이아웃이 아니기 때문에 한계에 부딪히기도 합니다. 여러분이 구상한 웹 페이지가 CSS 단 몇 줄만으로 다양하게 구현되...
  • 웹디자인
    [2019년 5월 웹 개발 동향] 지나치게 복잡해진 제품 디자인과 보여주기식 일 중독
    최근에 저는 ‘비욘드텔에런드beyondtellerrand’라는 정말 환상적인 콘퍼런스에 다녀왔습니다. 이런 세미나를 다녀올 때마다 우리 산업과 커뮤니티가 발전하고 있다는 생각이 듭니다. 여기저기서 많은 조언과 영감을 얻고, 1년에 한 번밖에 보지 못하는 많은 친구와 사람들을 만나며, 훌륭한 발표를 듣습니다. 사람들은 자신들의 일에 얼마나 좌절했는지 이야기하...


맨위로