HTML&CSS FlexBoxの使い方（２）〜整列の方法とfloatレイアウトとの違い
FlexBoxを使った整列の方法とfloatとの違いを解説します。
floatレイアウトとFlexBoxレイアウトの違い
flexレイアウトの例・・・・自動で高さが揃う
floatレイアウトの例・・・・高さを揃えることができな...
lecture
HTML&CSS 
HTML&CSS FlexBoxの使い方（１）〜display:flexについて（動画あり）
通常フローしたブロック要素を横並びにするにはこれまでfloatプロパティを使用していましたが、その挙動は難しくて入門者を困らせる関門でした。CSS3で定義されたFlexBoxの仕組みを使うと簡単に横並びのレイアウトが出来上がります。また、今...
HTML&CSS 可変レイアウト（Fluid Layout）作成のポイント
DogRoboの一日は朝食で始まる。
ロボットの朝食なんてオイル臭い丸薬のようなものと思うだろうが、実際はトーストと目玉焼きにカフェオレとシャレている。特にカフェオレにはこだわりがある。牛乳とマンデリンコーヒーの割合は7：3に決めている。...
lecture ローカルリポジトリとリモートリポジトリについて〜SourceTreeでGitを使う
ローカルリポジトリとリモートリポジトリ
リポジトリとは、ファイルやディレクトリの履歴を管理する場所のことです。
自分のパソコン内でバージョン管理するために作成したリポジトリ（Gitで指定したフォルダ）をローカルリポジトリといいます。
...
HTML&CSS ボーダーに画像を使う方法〜CSS3
画像が使えないボーダーなんてジャムを入れない紅茶のようなものだ。
ボーダーに画像を適用するには border-image-sourceプロパティで画像を読み込んで、border-image-sliceで幅を指定すればよい。
まずはと...
HTML&CSS マルチカラムレイアウト 段組の作成〜CSS3
一般的にWebで読みやすい行の長さは、約30文字から45文字前後くらいといわれています。具体的な文字数の根拠は不明ですが、あまり長すぎる行は読みにくい傾向になります。
＊「ブログデザインを考える：１行の字数とWEB幅」に1行の文字数につい...
Illustrator パターンの作成のまとめ〜Photoshop と Illustrator
Photoshop CC（2015.5）とCapture CCを活用してパターン作成
Adobe Capture CCは写真を撮影するだけで、色、形、ブラシ、パターンなどの素材を作成することができます。
スマホなどのモバイルで無料で使用...
lecture Google Analyticsを使ったABテスト
GoogleAnalyticsでは「ウェブテスト」という機能があります。この機能を使用することでABテストを実施することができます。
「ウェブテスト」という機能を使用すると、ある指定のページを表示させると正規のページとテストパターンのペー...
HTML&CSS Koalaの使い方〜Sass
KoalaはSassをGUI環境で使うことができるコンパイラです。デザイナーさんはコマンド操作よりも、こちらの方が使いやすいかもしれません。
ここではKoalaの使い方を学習します。
Koalaのインストール（Windows)
Koa...
lecture Git入門（準備編）〜SourceTreeインストールとAtlassianアカウント取得
2016年2月にSourceTreeがアップデートしてアカウント取得の方法が判りづらくなりました。
Atlassianアカウント取得方法とあわせてインストールの手順の説明です。
SourceTreeインストール方法
SourceT...