Skip to content

Smashing Magazine’ 기사 모음입니다

전 세계적으로 영향력 있는 웹 디자인 분야 온라인 미디어 중 하나로 2006년 스벤 렌나르츠와 비탈리 프리드만에 의해 설립되었다.
웹 디자인계에서 실력을 인정받는 전문가들이 필자로 참여하여 웹 디자인, 웹 개발 관련 도서와 e북을 출판하고, 수준 높은 심층기사를 꾸준히 게재하고 있다. 2014년 현재 매달 1억 회 이상의 페이지 뷰, 평균 600만 명의 방문자 수를 기록하고 있으며 트위터 팔로워도 78만 명 이상이다.
매년 글로벌 웹 디자인 컨퍼런스를 개최하여 최신 이슈를 논의하는 등 웹 디자인계의 질적인 발전을 이끄는 핵심 역할을 하고 있다.

  • 코드
    <section> 버리고 HTML5 <article> 써야 하는 이유
    각 태그는 목적에 맞게 쓰여야 합니다. 제목을 표시할 때는 헤딩 태그를 〈h1〉, 〈h2〉··· 순차적으로 나열하는 구조여야 합니다. 같은 레벨의 〈h〉 태그에 〈section〉을 둘러싸서 제목 크기를 조절하는 방법은 겉모양만 달라질 뿐입니다. 〈section〉은 구획을 나눌 때 쓰세요. 〈main〉, 〈header〉, 〈footer〉, 〈nav〉 등은 스...
  • 웹디자인
    [스매싱 매거진 2월 총정리] 웹 개발자를 위한 무료 도구 소개
    SVG 미니파잉, HTML에서 CSS 추출하기, 접근성을 위한 컬러 팔레트 체크하기 등의 작업들을 빠르고 간편하게 해낼 수 있는 '작은 도우미(Tiny Helpers)'를 소개합니다. 무료 온라인 도구들의 모음이라고 할 수 있으며 API, 접근성, 폰트, 성능, 정규식, SVG, 유니코드 등 다양한 분야를 다루기 때문에 웹 개발자 여러분에게 도움이 될 것입...
  • 사용자경험
    [스매싱 매거진 1월 총정리] 웹 퍼포먼스 최적화하기
    놀라운 속도로 변화하는 웹 업계에서 2020년 공동의 과제는 뭐니뭐니해도 웹 환경 개선이 아닐까요? 웹을 더 빠르고 안정적으로 만들기 위해서는 퍼포먼스를 최적화해야 합니다. 최적화된 웹 퍼포먼스의 중요성을 널리 알리기 위해 현재 많은 사람들이 노력하고 있습니다. 팟캐스트를 통해, 종이책이나 전자책으로, 각종 뉴스레터나 SNS를 이용해서, 세계 각국의 콘퍼...
  • 웹디자인
    [스매싱 매거진 12월 총정리] 새로운 소식
    코드에도 꿀팁이 있으면 좋겠지요? 지난 12월 한 달 동안 매일 업데이트된 짤막한 팁들로 개발을 좀더 편하게 해보세요. 배열 중복을 지우기, 브라우저 개발자 도구에 데이터를 보여주기 등 자바스크립트, HTML, CSS가 모두 포함되었으니 프런트엔드 개발의 보물창고라 할 만합니다.
  • 웹디자인
    쓰기 모드와 CSS 레이아웃
    레이아웃 제작에 쓸 수 있는 여러 기술에 관련한 명세를 명쾌하게 설명해 CSS 작동 원리의 이해를 돕는 《새로운 CSS 레이아웃》의 저자 레이철 앤드루, 그녀가 CSS 레이아웃과 CSS 전반에 쓰기 모드(writing mode)가 미치는 영향과 중요성에 관해 설명한 글을 소개합니다. 쓰기 모드는 쓰기 방식이 다른 언어를 사용하는 문서를 만들 때 사용합니다....
  • 디자인
    [스매싱 매거진 11월 총정리] GitSheet 소개와 GraphQL 기초 배우기
    자주 사용하는 Git 명령어는 잘 기억하고 있지만 그렇지 않은 명령어는 쉽게 떠오르지 않죠. 이에 도움이 될 깃시트(GitSheet)를 소개합니다. 클릭 한 번으로 간편하게 명령어를 복사해 사용할 수 있습니다. 페이스북에서 만든 쿼리 언어 GraphQL을 기초부터 차근차근 배우는 데 도움이 될 오픈소스 튜토리얼이 있습니다. 하수라(Hasura)에서 만든 튜...
  • 웹디자인
    [스매싱 10월 총정리] 커뮤니티 자료들과 좋은 글들
    FOUC는 사용자에게 불편함을 끼치는 요소 중 하나입니다. 사용자가 최대한 덜 불편해 할 사이트를 제공하기 위해 적절한 폴백 폰트를 매치해주는 도구를 활용해보세요. 작지만 강력한 도구가 여러분을 도와줄 것입니다. 무언가에 집중하고 주도적으로 학습하기 위해서는 게임도 하나의 좋은 방법이라고 생각합니다. 게임을 통해 플렉스박스의 개념을 이해해보고, CSS 선택...
  • 코드
    객체 지향 CSS 소개
    객체 지향 CSS(Object Oriented CSS : OOCSS)는 CSS 생산성을 높이기 위해 개발된 방법론으로 CSS를 여러 개의 독립된 객체로 구성해 재사용성을 극대화합니다. 궁극적으로는 더 빠르고 효율적이며 추가와 유지보수가 쉬운 스타일시트를 만드는 데 목적이 있습니다. 최근에는 BEM 기법과 함께 사용되는 경우가 많고 부트스트랩 같은 CSS 프...
  • 웹디자인
    [2019년 9월 웹 개발 동향] 기본적인 생활 스타일을 받아들이는 법과 단순해지기 힘든 이유
    디지털 세상에서 살아가는 우리는 생산성을 높이기 위해 끊임없이 일을 찾고 단순함과는 점점 거리가 멀어지고 있습니다. 재충전을 위한 여가활동조차 온전히 누리지 못하고 있는 이 시점에 ‘기본’의 의미를 곱씹어 생각하며 일을 끝내면 아무것도 하지 않는 ‘기본적인 생활 스타일’을 한번 누려보는 것은 어떨까요? 파이어폭스 69가 출시되었습니다. 자바스크립트 퍼블릭 ...
  • 웹디자인
    [2019년 8월 웹 개발 동향] 강한 팀과 윤리적 데이터 센스메이킹
    모든 사람은 저마다 각자의 자리와 능력이 있습니다. 팀은 스타만으로 구성되는 것이 아니므로 팀원과 팀의 가치를 응원하고 지지하는 사람과 함께하려는 마음이 필요합니다. 사람들은 빠른 소프트웨어를 선호하고 구매하기 때문에 속도는 비즈니스 성공에도 중요한 요소입니다. 웹사이트 성능을 높이기 위해 아이프레임(iframe)을 섀도DOM(ShadowDOM)으로 바꾸게...


맨위로