Skip to content

모두보기

  • 웹디자인
    IE에서의 CSS 그리드 사용하기: 일반적인 IE 그리드 오해를 파헤치다
    IE와 크롬을 비롯한 엣지, 사파리, 오페라 같은 최신 브라우저에서도 작동하는 그리드, 폴백 레이아웃 없이 작성할 수 있는 CSS 그리드는 더 이상 미래의 이야기가 아닙니다. 여기 대니얼 토논이 IE와 최신 브라우저에서 안전하게 구현되는 CSS 그리드 사용법에 대해 알려드립니다. 모두 4부작으로 IE 그리드에 대한 오해를 풀어주고, IE에서도 완벽하게 구현...
  • 웹디자인
    쓰기 모드와 CSS 레이아웃
    레이아웃 제작에 쓸 수 있는 여러 기술에 관련한 명세를 명쾌하게 설명해 CSS 작동 원리의 이해를 돕는 《새로운 CSS 레이아웃》의 저자 레이철 앤드루, 그녀가 CSS 레이아웃과 CSS 전반에 쓰기 모드(writing mode)가 미치는 영향과 중요성에 관해 설명한 글을 소개합니다. 쓰기 모드는 쓰기 방식이 다른 언어를 사용하는 문서를 만들 때 사용합니다....
  • 웹디자인
    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, 매개변수, 헤더를 편집하지 않고도 개발자...
  • 콘텐츠전략
    로봇과의 대화 : 음성 검색과 스마트 에이전트, 구조화된 콘텐츠 사례
    구조화된 콘텐츠는 스마트 에이전트나 음성 검색의 결과를 좌우합니다. 사용자가 음성 검색을 통해 정보를 찾을 때도 콘텐츠 구조화 정도에 따라 검색 결과가 달라집니다. 구조화가 잘 갖추어져 있지 않은 페이지는 사용자를 경쟁사로 빠져나가게하는 계기가 될 수도 있습니다. 이 기사에서는 구조화된 콘텐츠 형태를 소개하고 이를 적용해보고 적용하지 않은 사례와 차근차근 ...


맨위로