脂肪を燃やすトレーニング - MOL
古い本だが、知ったのはonyourmarkの雑誌を読んでいたら、マフェトン理論という単語が出てきたからだ。 なんとか理論と難しく聞こえがちだが、覚えるのは以下の180公式だけだ。 180 - (年齢) 上記の公式から導き出される数字を最大エアロビック心拍数として、それを超えないように運動するだけだ。私なら36歳なので、だいたい134 ~ 144の心拍数を維持してランニングするだけ。 運動慣れしている人、病み上がりの人でこの公式の数字はプラスマイナス10くらいするが、まぁ、だいたいこれくらいの心拍数を維持する。やってみれば分かるが、運動したらこの心拍数にすぐ達してしまうので、走っては歩いて、走っては歩いて、というかほんとうにゆっくり走る（ときには歩いてる速度と変わりないくらいに）。 ゆっくり走る練習といえば、LSD(Long Slow Distance)が有名だが、実際私も知ってたし、それっ
がんばらないデザインシステム - MOL
TLDR: Material Designをカスタマイズして利用した話 最近、デザインシステムって言葉よく聞きますよね。airbnbではDLSというデザインシステムを持っていたり、UberはBase Webというデザインシステムを持っていたり、アメリカ連邦政府も持ってたりします。国内のIT企業でもデザインシステムを作成しているとの事例もよく耳にします。 デザインシステムとは？ デザインシステム：デザインの基準やドキュメント、原則に加えて、基準を達成するためのUIパターンやコンポーネントなどのツールキットをすべて備えたもの。 デザインシステムの定義と作成方法、導入事例 | UX MILK では、デザインシステムってのはどういったもんなんでしょうか？これまでも、スタイルガイドやコンポーネントライブラリといったものは聞いたことがありますが、デザインシステムというのはそれらも含めたもう少し大きなモ
Grunt/Gulpで憔悴したおっさんの話 | MOL
先人たちが1年前に通った道で、いろいろいまさらかよって話なんですが。基本的に以下の記事読んだら分かります。要はGulpとかGruntといったモノ使わずにnpm run hogehogeでビルドしよーぜって話です。 task automation with npm run オレ的Gruntに対する最新の気持ち - from scratch Node - npm で依存もタスクも一元化する How to Use npm as a Build Tool // package.json "scripts": { "start": "npm run start-serve & npm run watch", "test": "stylestats public/files/css/maple.css", "start-serve": "browser-sync start --server publ
Wisteria：デザインツールとしてのCSS - MOL
Wisteria.css: A class selectors based harmless CSS library. t32k/wisteria WisteriaというCSSライブラリ作った。基本的な用途としてはモックアップや後方互換とかそこまで考えなくていい、小規模の個人用のページとかで使われることを想定している。 Skeletonという、すごくシンプルなCSSライブラリがあるのだが、僕はこれが好きで、ちょっとしたものとか作るときによく使用している。このブログもSkeletonをベースにしているくらいだ。 でも最近使ってて、なにかこう違和感というか、相容れないモノを感じたので、思い立って自分用のCSSライブラリを作ってみたのだ。 Harmless Wisteriaを作るにあたって、一番気をつけたことは無害であること。つまり要素にスタイリング（h2 { font-size: 24px }
修正しやすいCSSとは - MOL
@hilokiという男がいる。この男と初めて出会ったのは7年前だろうか、当時細々と石川でブログを書きながらWebデザイナーをしていた僕に初めて勉強会で声をかけてくれた人物である。 それ以来、当時彼が住んでいた大阪の勉強会と石川の勉強会で互いに参加しあったりして親交を深めていった。ついには2年という短い間ではあったが、某緑の会社で同僚として働けたことは本当かけがえのないものと感じている。 そんな彼が最近2冊目の単著を出した。1冊目の『HTML5＋CSS3で作る 魅せるiPhoneサイト』はもちろん購入して読書済だが、本当に丁寧に書いてあり分かりやすかった印象がある。そんな彼の出す本だから間違いないのは当たり前だが、特筆すべきは扱っているテーマだろう。 最近のCSSのWeb参考書というと、CSS3でこんなことができちゃいます〜、だとかアニメーションでこんなことがっ！？とか、こんなグラフィカルな
Sass/Compass徹底入門を監修しました - MOL
2014年3月18日に発売される、Sass and Compass in Actionの邦訳版である『Sass&Compass徹底入門 CSSのベストプラクティスを効率よく実現するために』を監修した。 Sass&Compass徹底入門 CSSのベストプラクティスを効率よく実現するために Wynn Netherland, Nathan Weizenbaum, Chris Eppstein, Brandon Mathis, 石本 光司 (株式会社サイバーエージェント) 翔泳社 2014-03-18 Amazonで詳しく見る by G-Tools 監修の依頼を受けて音速でハイと答えたのだけど、監修って何するんだろうねって感じだった。いや、原書の『Sass and Compass in Action』は以前から購入していて、Sass/Compassの開発者であるNathan Weizenbaumや
今どきのGruntを使ったフロントエンド開発（HTML/CSS編） - MOL
SassなどのCSSプリプロセッサを使うWebデザイナが増えてきました。Sassをコンパイルするだけなら黒い画面（ターミナル）を使わずともGUIアプリからの利用で問題ありません。が、ここは一歩踏み込んでGrunt（JavaScript製のタスクランナー）を使って、Sass以外のコンパイルやライブリロード、画像最適化、CSSのリントやスタイルガイド生成など、あらゆる作業をGruntに任せてより効率的な開発環境を手に入れてみませんか。 ども、Front-end Developerをしております@t32kです。今日はがんばります。 Frontrendというコミュニティ活動をしています。通常は東京で3~4ヶ月の周期でフロントエンドをテーマにした勉強会を開催しています。良かったらみなさんもご参加くださいませ。 Agenda 今日の話す内容は以下のとおりです。 なぜGruntを使うの？ Gruntの使
HTTPリクエストを減らすために【序章】HTTPリクエストは甘え - MOL
このシリーズはHTTPリクエストの理解を通じてWebパフォーマンスの重要性について考える5章構成になっている。 【序章】HTTPリクエストは甘え 【CSS Sprite編】スプライト地獄からの解放 【WebFont編】ドラッグ＆ドロップしてコマンド叩いてウェーイ 【DataURI編】遅延ロードでレンダリングブロックを回避 【終章】我々には1000msの猶予しか残されていない 1日目は、HTTPリクエストの概要について説明する。 例えに、私のポートフォリオページ（t32k.me）が表示されるまでの流れを見ていく。まず、検索からでも方法はなんでもよいが、ブラウザのURLバーにt32k.meと打ち込んでアクセスする。そのページを見にいくということは、つまりt32k.meに対してHTTPスキームでリクエストするということを意味している。 クライアントであるブラウザは入力されたURLを判断して、リソ
ぼくのかんがえたさいきょうのしーえしゅえしゅ - MOL
俺ももう30だし、夏なんで、CSSフレームワークはじめました。 とりあえず、UIエレメントとか作ってないし、CSSフレームワークとか言いながら、GithubのLanguage Staticsは98.3%、JavaScriptってな感じでGrunt Taskばかり充実してるような感じです、現状。 とりあえず、設計方針としてはマシなCSSを書くことを目標としている。この一年、スマホアプリのHTML/CSSコーディングをやってきたわけだが、度重なるUIの変更に耐えうるCSS、そして肥大化しないCSSとは何かずっと考えていて、特に答えという答えもで見つかっていわけだけど、とりあえずはこうしたほうがBetterなんじゃないかというの自分的に固まってきたので、公開してみた。 てか、最強のCSSなんて存在しないからなっ！！ t32k/maple - GitHub ありがちな落とし穴 これを作るにあたって
grunt-contribさえあればOK！ - MOL
世の中、Grunt0.4 が出たって持ちきりでやんス。 Grunt 0.4.0 released - Grunt: The JavaScript Task Runner 今までビルトインタスクだった下記はことごとく grunt-contrib-*シリーズと呼ばれるプラグインに置き換わってしまった。 concat grunt-contrib-concat plugin init stand-alone grunt-init utility lint grunt-contrib-jshint plugin min grunt-contrib-uglify plugin qunit grunt-contrib-qunit plugin server grunt-contrib-connect plugin test grunt-contrib-nodeunit plugin watch grun
CSSOとgrunt-csso - MOL
読書の秋、ご勉学の方はいかがでしょうか。 I’m your @t32k. 今日はCSSO (CSS Optimizer) – A CSS minimizer unlike othersの紹介だ。前回のCSSCombは単純にプロパティのソートをしてくれるものだったが、今回のはminimizerだ。 普段はSassの:compressed出力で最後デプロイしてるんだけど、もっとマシなものはないかなーと特には探してはないけど、@cssradarパイセンがCSSOがいいって言ったとか言わないとかあったので調べてみた。 ちなみにSassの:compressedはこんな感じで出力しているらしい。 Compressed style takes up the minimum amount of space possible, having no whitespace except that necessa
【翻訳】document.writeでSCRIPTを書き出すなやで！ - MOL
Original：Don’t docwrite scripts（2012-04-10）by Steve Souders 昨日のブログ記事のHTTP Archiveが速くなっている、大きな要因の一つとしてはスクリプトローダーを使用しないことです。そのスクリプトローダーとはスクリプトを動的に読み込むためにdocument.writeを使用しているものです。振り返れば、私は2009年4月のブロッキングなしのスクリプト読み込み、続・ハイパフォーマンスWebサイト(4章)において、document.writeテクニックについて記述していました。それは以下のようなものです。 document.write('<script src="' + src + '" type="text/javascript"><\/script>’); document.writeを使ったスクリプトローダーの問題点： 挿入し
【翻訳】なぜシリコンバレーはコードの書けるデザイナーを求めているのか？ - MOL
Original：Why The Valley Wants Designers That Can Code（2011-05-31）by Jared Spool もし周りにデザイナーが大勢いるのなら、デザイナーがコードも書けることは価値のあることかどうか話題に挙げてみてください。すぐに、モーゼが紅海を2つに割ったよりも早くデザイナー達の意見は分かれるでしょう。片方はプログラミングは必要不可欠なスキルだと主張し、もう片方はプロミグラミングはデザイナーの価値を下げてしまうと猛烈に論じるでしょう。 興味深いことに、プログラミングもできるデザイナーが価値があるかどうかはデザイナーの決めることではありません。それは採用マネージャーの仕事です。今日の雇用市場に基づけば、彼らがどの立場なのかは非常に明白です。多くの採用マネージャーは スーパーデザイナー を求めています。スーパーデザイナーというのはもちろん
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
