Yuya Saito studiomohawk

CSS Radar - 2013/04/08

What are the transparent bars in Chrome DevTools' timeline? by Nat Duca on Google+

Chrome開発ツールのタイムライン上に出現する透明なバーはいったい何を意味するのか？
何にもしていないのかと思いきや、そうではなく開発ツールが外のバーの表示に間に合わなかったか、GPUのボトルネックとなる箇所を示すそう。

How to structure a Sass project - Beginner

Sassを使ったプロジェクトのディレクトリ/ファイル構成について。

CSS Radar - 2013/04/05

Easy High DPI Images via HTML5 Rocks

Retinaのような高密度のディスプレイはモバイルの世界ではスタンダードになりつつあり、Apple社以外でもGoogleがChromebook Pixelで高密度ディスプレイ搭載モデルのマシンを発売した。
これらのディスプレイに対応する方法は仕様の策定を待っていられる状態ではない。
この記事では、それら高密度ディスプレイへの対応について紹介している。

Building Large, Maintainable, and Testable Knockout.js Applications via Nettuts+

CSS Radar - 2013/04/04

CSS Masks – How To Use Masking In CSS Now – TNG - The Nitty Gritty

webkitのみの仕様であったCSS Masksは今ではW3Cの仕様になっている。
この起源的には当然ではあるが、モバイルブラウザの多くはCSS Masksをサポートしている。
そんなCSS Masksの使い方について例を交えて紹介。

A Thorough Introduction To Backbone.Marionette (Part 2) via Smashing Coding

CSS Radar - 2013/04/03

1. Callbacks are imperative, promises are functional: Node’s biggest missed opportunity – The If Works

JavaScript(記事ではnode.js)におけるコールバックを命令型、Promisesを関数型と捕らえ、node.jsの多くのAPI、モジュールがコールバックを利用している点が欠点となっている解説をしつつ、関数型のアプローチについて、Promisesを使ったアプローチの利点を紹介。

2. Broken Promises

上記の記事に対して、node.jsのエコシステムの今を支えているのがコールバックではないかという反論。関数型アプローチに比べて命令型、コールバックをつかった場合は未来に発生するべき振る舞いをそれらしく表現できる点が多くのプログラマにとって理解しやすいという利点を紹介している。

CSS Radar - 2013/04/02

1. Making accessible icon buttons via NCZOnline

アイコンのみを使った<button>をアクセシブルに実装する方法。
Nicolas Zakas氏は最近よくこの手の記事を書いていて、非常に参考になる。
<input type="image">を使うのがベストオプションだが、アイコンフォントと仲がよくないので、その場合はaria-labelを利用して実装するとよいとのこと。

2. Bryan Summersett via Analyzing mbostock's queue.js

CSS Radar - 2013/04/01

1. List Out of Lambda / Steve Losh

現実のプロジェクトには活かせないかも知れないが、関数型プログラミングの根底について学べる素晴らしい記事。
考え方の切り替えは難しいが、やはり何事もやってみるのが近道なので、もう1度読み直してやってよう。

2. Thoughts on Using Web Frameworks - The Industry

TwitterのBootstrap、ZurbのFoundation、そしてHTML5 Boilerplateを「ウェブフレームワーク」とカテゴライズして、その利用シーンについて考察。私にとってはどのツールも自分のツールを作成するためのリファレンスとして捕らえている。

CSS Radar - 2013/04/01

1. List Out of Lambda / Steve Losh

現実のプロジェクトには活かせないかも知れないが、関数型プログラミングの根底について学べる素晴らしい記事。
考え方の切り替えは難しいが、やはり何事もやってみるのが近道なので、もう1度読み直してやってよう。

2. Thoughts on Using Web Frameworks - The Industry

TwitterのBootstrap、ZurbのFoundation、そしてHTML5 Boilerplateを「ウェブフレームワーク」とカテゴライズして、その利用シーンについて考察。私にとってはどのツールも自分のツールを作成するためのリファレンスとして捕らえている。

	/**
	* A "deeper" indented text effect with the :before and :after pseudo-elements.
	*/

	html, body {
	height: 100%;
	}

	body {
	margin: 0;

	/**
	* A "deeper" indented text effect with the :before and :after pseudo-elements.
	*/

	html, body {
	height: 100%;
	}

	body {
	margin: 0;

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Demo: [Add your bin title]</title>
	<meta name="description" content="[add your bin description]">
	<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/2.1.0/normalize.min.css">
	</head>
	<body>
	<div id="page" class="page">