サイト構築

CSSやJavaScriptの新しい動き、フロントエンドのWeb制作の現状とこれから必要とされるテクニックや考え方

Post on:2017年6月9日

ここ1, 2年で、フロントエンドの制作事情は大きく変化してきました。 スマホの登場によりレスポンシブ対応からモバイルファースト・モバイルオンリーへ、HTMLは構造化され、CSSはモジュール単位で実装され、JavaScri

...記事の続きを読む

ココに注目!最近のロゴデザインに使われている、すごいデザインテクニックのまとめ -2017 Logo Trends

Post on:2017年6月8日

ロゴのデザインには、タイポグラフィ、線、形、色、質感、バランス、リズム、配置など、デザインの基本となる要素や原則が詰まっています。最近のトレンドが効果的に取り入れられたロゴデザインに使われているトレンド、デザインテクニッ

...記事の続きを読む

CSS flexboxのレイアウトで困った時に使えるスタイルシートのテクニックまとめ

Post on:2017年6月6日

flexboxを使ってレイアウトを実装するのは、何年もの間floatやclearfixを使っていた人に新しい驚きと喜びを与えます。主要なブラウザすべてにサポートされ、採用するプロジェクトも増えてきました。 しかし、以前の

...記事の続きを読む

フォント好きの心をくすぐる素敵なフォント「Futuracha Pro」はデザインするのが楽しくなる!

Post on:2017年6月5日

素敵なフォントに出会えると、とても幸せな気持ちになれます。 先日ようやく本リリースされた「Futuracha Pro」もその一つ。 @colisscomでもつぶやきましたが、改めて記事にして紹介します。 Futurach

...記事の続きを読む

[JS]スマホにも対応!ページをスクロールした際、要素をアニメーションで表示する軽量スクリプト -t-scroll

Post on:2017年6月5日

スマホやタブレットに対応、もちろんデスクトップにも対応、ページをスクロールした際に、要素にさまざまなアニメーションを簡単に適用できる単体で動作する軽量(4KB)のスクリプトを紹介します。 jQueryなど、他のスクリプト

...記事の続きを読む

リセット用CSSはもういらない、ブラウザのバージョンに適したスタイルを適用して標準化 -PostCSS Normalize

Post on:2017年6月1日

ブラウザごとに異なるデフォルトのスタイルを整える時、リセット用CSSやノーマライズCSSを使用して、すべてのブラウザに共通のスタイルシートを適用している人が多いと思います。 定義したブラウザのリストに基づいて、norma

...記事の続きを読む

[CSS]object-fitの賢い使い方: インラインの動画を背景画像のようにブラウザいっぱいに表示するテクニック

Post on:2017年5月31日

HTML内にインラインで配置した動画や画像を、背景画像のようにブラウザいっぱいに表示するCSSのテクニックを紹介します。 レスポンシブに完全対応、スマホでもデスクトップのあらゆるサイズのスクリーンでも最適なサイズで表示さ

...記事の続きを読む

CSSで面倒なコード、HTML5の新要素やスニペット、FacebookのOGPやTwiterカードなどのコードを生成できるオンラインツール

Post on:2017年5月30日

CSSで面倒なコード、アニメーションやグラデーションやボックスシャドウなど、実装の結果を見ながら値を調整してコードを生成でき、HTML5の新要素やよく使うスニペット、FacebookのOGPやTwitterカードやmic

...記事の続きを読む

ローディングのアニメーションの次の段階、インターフェイスプレビューに対応するための軽量スタイルシート

Post on:2017年5月29日

Webページやスマホアプリを読み込む際に、ローディングのアニメーションを表示するのをよく見かけます。しかし、最近ではFacebookやSlackなどでインターフェイスプレビューとして、表示される予定のコンテンツをプレース

...記事の続きを読む

ファミカセ展は見ておかないと!クリエイター達のすごいアイデアとデザインが沢山あって楽しめる!

Post on:2017年5月26日

昔懐かしいファミコンが大好きな日本をはじめ世界のクリエイターが、こんなゲームがあったら、と作成した「わたしのファミカセ展」を紹介します。 突然インド人が右に現れたら、そりゃよけるしかないでしょw わたしのファミカセ展

 Prev 1 2 ... 4 5 6 ... 386 387 Next

top of page

©2017 coliss