Skip to content

CSS

  • 사용자경험
    HTML 반응형 이미지 문법 가이드
    브라우저가 마법을 부리는 HTML 문법들에는 srcset, <picture>, w 설명자가 있습니다. srcset만으로도 같은 이미지를 다른 크기로 또 아예 다른 이미지로 제공할 수도 있지만, w 설명자와 sizes 특성을 함께 사용하면 브라우저가 더 적절한 선택을 할 수 있습니다. 반응형 이미지로 '성능 향상'과 '디자인 제어'라는 두 마리 토...
  • 사용자경험
    [스매싱 매거진 6월 총정리] 그동안 무슨 일이 있었나요?
    속도가 사이트 성능을 좌우하기도 합니다. 워드프레스의 보안 플러그인 제작자들이 만든 패스트 오어 슬로(Fast or Slow)는 웹사이트 로딩 속도를 측정해줍니다. 전 세계 13개 도시에 있는 13개 서버로 구성된 네트워크에서 데이터를 받기 때문에 국내뿐 아니라 해외에서의 반응도 확인해볼 수 있습니다. 사이트의 문제점은 무엇이고 개선책까지 알려주는데 무료라...
  • 코드
    디자이너는 어떻게 코드를 배우나?: Part Ⅱ
    지난 1부에서는 터미널의 기본을 알려주고, 코딩 시작을 위해 생산적인 팁과 코드 편집기 선택 요령에 대해 설명했습니다. 2부에서는 깃과 같은 버전 관리 시스템를 비롯해 HTML, CSS, 시맨틱 코드와 주요 엔지니어링에 대해 소개합니다.
  • 디자인
    [스매싱 매거진 5월 총정리] 힘겨운 시간을 위한 학습 자료
    코로나19로 전 세계가 아직도 혼란한 지금 가족, 친구, 동료의 힘이 더욱 절실합니다. 제자리에서 스스로를 지키는 노력 역시 필요한 때입니다. 스매싱 매거진이 지난 한 달 웹 산업계의 주요 이슈와 프로젝트를 짚어주고, 흥미로운 읽을거리들을 소개합니다.
  • 사용자경험
    [스매싱 매거진 4월 총정리] 연결을 지속하고 서로에게서 배우세요.
    코로나19는 대면하지 않고 일을 처리하는 원격근무 시스템 등 대체 방법을 고민하게 만들었습니다. 스매싱 매거진 4월 웹 동향에서도 원격근무에 효율적인 전략을 소개합니다. 그 전략은 적용이 쉽고 차별화될 수 있습니다. 시각화에 유용한 도구를 소개합니다. 플립 카운터는 오픈소스로 모바일에 친화적이며 설치하기 편합니다. 몇 가지 사전 설정으로 각자만의 플립 카운...
  • 사용자경험
    브라우저는 사용자가 원하는 것을 어떻게 제공하나
    누구라도 예외 없이, 장애 구분 없이 웹에 쉽게 접근할 권리가 있죠. 따라서 디자이너와 개발자는 모든 정보와 기능을 공개하고 사용자가 상황과 맥락에 맞게 사용할 수 있도록 배려해야 합니다. 전체적인 제어는 사용자에게 넘겨서 콘텐츠를 이용하기 가장 좋은 환경으로 직접 구축할 수 있도록 말이죠. 통찰력과 깊이 있는 다음 기사를 읽고 웹접근성을 바라보는 눈높이를...
  • 사용자경험
    접근성 좋은 SVG – 패턴을 넘어선 포용성
    SVG 접근성 측면에서 보면 우리는 큰 진전을 이뤘습니다. SVG의 접근성을 최적화하는 데 도움을 주는 견고한 패턴은 간단한 이미지 혹은 좀더 복잡한 이미지를 만들 때에도 적용할 수 있습니다. 대부분의 개발자나 디자이너는 실제 사용자가 필요로 하는 것보다 WCAG2.1을 준수하기 위한 코드에만 초점을 맞춥니다. SVG를 어떻게 만드느냐에 따라 사용자는 장치...
  • 디자인
    [스매싱 매거진 3월 총정리] 진정하시고 스매싱을 읽으세요
    평소에도 트위터, 페이스북, 링크드인 등을 통해 웹 전반의 소식을 접하고 있을 것입니다. 이달에는 더욱 다채로운 온라인 강연을 소개합니다. 팟캐스트를 들어보세요. 지난 2012년 이래 열린 콘퍼런스 동영상들도 만날 수 있습니다. 또 현재 웹 산업계의 추이를 파악할 수 있는 읽을거리들도 알려줍니다. 현재 업계 또는 개인적 차원에서 진행 중이거나 발표된 재미있...
  • 사용자경험
    [스매싱 매거진 1월 총정리] 웹 퍼포먼스 최적화하기
    놀라운 속도로 변화하는 웹 업계에서 2020년 공동의 과제는 뭐니뭐니해도 웹 환경 개선이 아닐까요? 웹을 더 빠르고 안정적으로 만들기 위해서는 퍼포먼스를 최적화해야 합니다. 최적화된 웹 퍼포먼스의 중요성을 널리 알리기 위해 현재 많은 사람들이 노력하고 있습니다. 팟캐스트를 통해, 종이책이나 전자책으로, 각종 뉴스레터나 SNS를 이용해서, 세계 각국의 콘퍼...
  • 웹디자인
    [스매싱 매거진 12월 총정리] 새로운 소식
    코드에도 꿀팁이 있으면 좋겠지요? 지난 12월 한 달 동안 매일 업데이트된 짤막한 팁들로 개발을 좀더 편하게 해보세요. 배열 중복을 지우기, 브라우저 개발자 도구에 데이터를 보여주기 등 자바스크립트, HTML, CSS가 모두 포함되었으니 프런트엔드 개발의 보물창고라 할 만합니다.


맨위로