1クリックでSVGのデバッグが可能!SVGのパスをアウトラインに変換、アンカーやポイントやハンドルを表示 -xvg

Post on:2017年3月15日

Webページで使用しているSVGのパスをアウトラインに変換し、アンカー、コントロールポイント、ハンドルを表示してデバッグができるChromeの拡張機能「xvg」を紹介します。

[CSS]HTMLの潜在的な問題を見つける、少し高度なCSSのセレクタ -Linting HTML using CSS

Post on:2017年3月14日

HTMLは間違って記述されても、重大なエラーになることはあまりありません。 そのため、validではないHTML、セマンティックではないHTML、アクセシブルではないHTMLのコードが、ページ内に紛れてしまうことは非常に […]

色の組み合わせに役立つ!指定した色をベースに美しい色をつくりだす無料ツール -ColroMe

Post on:2017年3月14日

最近は、色のトーンを変化させた配色が注目されています。 例えば、同じ色相のブルーでも、彩度や明度を変化させたり、ホワイトやブラックを加えたり、同じトーンの色を使うことで、全体的に統一された美しいデザインをつくりだすことが […]

デザインのアイデアが豊富!最近のWebデザインで採用されているレイアウトやUI要素が揃った素材のまとめ

Post on:2017年3月13日

最近のWebデザインは、フラットデザインやマテリアルデザインが少しずつ進化し、コンテンツにフォーカスされたシンプルなデザインが定着してきました。写真は大きく、テキストは読みやすく、空白スペースは大胆に配置されています。 […]

ブログのタイトルや見出しを効果的にする!キャッチコピーを書くための基礎テクニック

Post on:2017年3月10日

ブログやサイトのタイトル・見出しの文言は、非常に大切です。 ビジターはそこにある言葉を見て、興味を引かれれば、コンテンツを読んでみようという気になります。また、ソーシャルサービスでも記事のタイトルだけ掲載されることが多く […]

[CSS]レスポンシブ対応のフォントサイズの指定方法 -デスクトップやスマホのビューポート幅(vw)に対して文字サイズを変化させる

Post on:2017年3月10日

CSSだけで、ルートのフォントサイズを元に最小値と最大値を指定し、その間のサイズはビューポート幅(vw)に対して自動で変化させるスタイルシートの記述を生成するオンラインツールを紹介します。 例えば、768px以下はすべて […]

[CSS]マージンとパディングの使い分け方 -コンテナとコンテンツ間、コンテンツ内の要素間

Post on:2017年3月9日

CSSでスペースを与える時、マージン(margin)とパディング(padding)はどのように使い分けをしていますか? Webサイトやスマホアプリで実際に使用されるUIコンポーネントを例に、マージンとパディングの使い分け […]

デザインにかなり使える!夕焼けから生み出された、高品質なグラデーション素材 -Sunset Gradients

Post on:2017年3月8日

デザインやイラストに、個人でも商用でも無料で利用できる、高品質な美しいグラデーション素材を紹介します。グラデーションは夕焼けから作成されており、その美しさはデジタルでもアナログでも堪能できます。 通常は有料素材ですが、今 […]

[CSS]レスポンシブ対応、サイドバーをアニメーションでスライド表示・非表示させるテクニック

Post on:2017年3月8日

レスポンシブ対応、アイコンをクリック・タップすると、サイドバーをアニメーションでスライド表示・非表示させるCSSのテクニックを紹介します。 スライドは単にそう見えるだけで、transformでサイドバーを変形させています […]

これぞプロのデザインテクニック!簡単なのにすごい、アイコンを作るテクニックのまとめ

Post on:2017年3月7日

オリジナルのアイコンを作るシンプルで簡単なデザインテクニックを紹介します。 円や矩形などの基本的な形を組み合わせたり、変形させたりして、さまざまなアイコンを作成します。 作業に慣れてしまえば、どれも1分もかからずにアイコ […]

top of page

©2026 coliss