9search | 必要なときに、必要なフリー素材を。

2011/04/02 1947 users フリー素材 サンセリフ アコーディオン スライダー テクスチャ

商用利用可、クレジット表記・バックリンク不要のフリー素材を紹介するサイト。webエレメント (27)アコーディオン (2)カレンダー (2)スライダー (1)ツールチップ (2)ナビゲーション (6)フォーム (5)ボタン (13)アイコン (15)テクスチャ (4)パターン (3)フォント (3)サンセリフ (2)セリフ (1)ブラシ (6)ベクター素材 (1)リボン (5) 続きを読む

サイト作成に欠かせないサイトやサービスなどを20個｜Webpark

2011/03/09 1081 users フッター Webpark ギャラリー あん たくさん

私がサイトを作る際によくお世話になっているサイトやサービスを紹介します。フリーソフトも2つあります。ご参考になればうれしいです。あんじょうできてはるWebデザインのギャラリーはたくさんありますが、見やすさ探しやすさでこちらをよく見ます。MephoBoxヘッダーやフッターなど部分的なものにこだわった海外のギャラリーです。404やナビゲーションなんかもあり参考になります。ロゴストック日本を中心にかなり... 続きを読む

WEBデザインを制作する際の参考にしているWEBデザインまとめサイトをまとめました【2012年版】 | Webデザインクリップ｜Web制作に便利な情報を集めたまとめサイト

2012/05/10 1018 users Webデザインクリップ Web制作 参考 まとめサイト 見出し

以前、「HTML5でサイトをつくろう」のブログでwebデザインをする上で普段、参考にしているまとめサイトをご紹介させていただいたのですが、見れなくなってしまったサイトなどもありましたので、今回2012年度版として優良なwebサイトを紹介しているWebデザインまとめサイト(国内・海外サイト)や見出しやナビゲーション・ボタン・バナー・制作に役立つサイトを追加分も含めてまとめました。 国内編 strai... 続きを読む

UIデザイナーが理解しておくべき11種類のナビゲーションと特徴 | sogitani.baigie.blog

2014/07/17 861 users UIデザイナー sogitani.baigie.blog

WebサイトやアプリケーションのUIは、いくつかの要素の組み合わせで構成されますが、使いやすさに最大の影響を与えるのはナビゲーション要素でしょう。ナビゲーションのデザインを制する者がUIデザインを制する、といっても過言ではありません。 というわけでここでは、UIで最も大事な要素、ナビゲーションというものを整理して理解するために、その種類と特徴をまとめてみました。 1. グローバルナビゲーション ユ... 続きを読む

UIデザインにおけるナビゲーションのデザインパターンまとめ | sogitani.baigie.blog

2014/08/14 754 users 階層 sogitani.baigie.blog 側面 形状

前回エントリーでは「UIデザイナーが理解しておくべき11種類のナビゲーションと特徴」として、ナビゲーションの種類を、機能的な側面から分類し、ご紹介しました。 続編となる今回は、ナビゲーションをデザイン的な側面からとらえ、形状、ふるまい（動き）、階層というの3種類の表現軸に分けて、ナビゲーションでよく使われているデザインというものを整理してみました。 形状のデザイン UIにおけるナビゲーション要素が... 続きを読む

よく見かけるレイアウト・UIコンポーネント、それだけを実装するHTMLとCSSのシンプルなコードのまとめ | コリス

2021/02/18 748 users UIコンポーネント スニペット CSS Layout コリス

Webページやスマホアプリでよく見かけるレイアウト、ナビゲーション、UIコンポーネントなど、それだけを実装するHTMLとCSSのシンプルなコードをまとめたCSS Layoutを紹介します。 それだけを実装するため、HTMLとCSSのコードは非常にシンプル、カスタマイズも簡単だと思います。スニペットに登録しておくと、便利ですね... 続きを読む

[JS]jQueryのプラグイン100選 -2012年総集編 | コリス

2012/12/16 707 users jQuery コリス レスポンシブ スライダー レイアウト

2012年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年目立ったのは、やはりレスポンシブ、そしてCSS3アニメーションでしょうか。 スライダーやギャラリー系もレスポンシブ・アニメーション対応、ナビゲーションやPinterst風のレイアウトなど、多くのプラグインにそれら二つの要素が組み合わさっています。 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関... 続きを読む

ヘッダーやナビゲーション等、Webデザインをパーツ別に収集しているギャラリーサイトまとめ - かちびと.net

2011/01/25 660 users ヘッダー フッター ブブンデザインアーカイブ net 唯一

いくつか知っておいた方が、必要な時に 探しやすいと思ってメモします。Webサイト のデザインをヘッダーやフッターなど、 パーツ別に収集しているギャラリーサイトが いくつかあるのでまとめます。 そんな大量に有るわけではないですけど。パーツのデザインはいつも迷うのでこの手のギャラリーはいくつあっても結構重宝しますよね。 ブブンデザインアーカイブ 国内でおそらく唯一のパーツ別デザインギャラリーです。ナビ... 続きを読む

[JS]これFlashじゃないの？ってなるナビゲーションを実装するjQueryのチュートリアル | コリス

2011/03/27 655 users ローディング グリッド jQuery メインメニュー コリス

まずは、デモページを堪能ください。 ナビゲーションの各ラベルをクリックすると、それに対応したパネルがアニメーションを伴って開くようになっています。デモページ実装HTMLの構造は、背景画像、グリッドのオーバーレイ、ローディングのアイコン、メインメニューの4つから構成されています。HTML：背景背景は、背景画像とオーバーレイとローディングをdiv要素で内包します。 続きを読む

jQueryでスクロールすると上部に固定されるナビゲーション | webOpixel

2012/02/21 649 users jQuery webOpixel NAV clearfix

グローバルナビゲーションはロゴの下に配置されていることが多いですが、スクロールするとナビゲーション部分だけが上部に固定されるようなものをjQueryでやってみたいと思います。 html & css htmlです。 html <h1><a href="#">タイトル</a></h1> <div class="nav"> <ul class="clearfix"> <li><a href="#">HO... 続きを読む

商用利用も無料、ウェブ用のエレメント・ページレイアウト・アイコンのPSD素材の配布サイト -design deck | コリス

2011/05/05 621 users エレメント コリス 商用 ウェブデザイン用 Free PSD

ナビゲーション、ボタンなどのエレメントをはじめ、ページレイアウト、アイコンなど、商用でも無料で利用できるウェブデザイン用のPSD素材を配布しているサイトを紹介します。 design deck | Free PSD' [...] 続きを読む

中小企業のウェブサイトで陥りやすい5つの落とし穴とアドバイス | コリス

2011/04/12 590 users 中枢 ブランディング コリス ゴール マーケティング

下記は各ポイントを意訳したものです。 はじめに 1. 役に立たないナビゲーション 2. ゴールが不明瞭 3. カラーとコントラスト 4. 分かりにくいコンテンツ 5. 情報の詰め込み過ぎ はじめに もし、あなたが中小企業のオーナーであるなら、あなたのウェブサイトはあなたの会社の中枢であり、マーケティングとブランディングにおける極めて重要なパートでもあります。 見込みのある顧客がサイトのコンテンツを... 続きを読む

累計22種！UIが優れたiPhoneアプリの部分デザイン（ナビゲーション/メニュー編） | Find Job ! Startup

2013/10/20 584 users Startup LAUNCHPAD iPhoneアプリ 目次

いろんなUIを持ったアプリが並ぶiPhone App。 今回はその中から、特にUIの優れた「部分デザイン」を紹介します。アプリを開いた時、真っ先に目に入るナビゲーション/メニュー編です。 目次 今回はこんなナビゲーションを取り上げます。 スプリングボード スプリングボードはiOSやAndroidなどのOS・画面解像度にほとんど依存しないのが特徴です。ローンチパッド（LaunchPad）と呼ばれるこ... 続きを読む

よこ並びのCSS。

2017/02/15 569 users CSS レスポ タブ 昨今 順番

ナビゲーションやタブやアイテムリストなど、「よこ並び」にレイアウトするためのCSSについて、お馴染みの方法から最近の方法まで、順番に見ていきます。スマホサイトが優勢な昨今、要素をよこ並びにする機会は減ってきているのかな。とも思いますけれど、大きい画面で見るサイトでは、ナビゲーションやタブや、アイテムリストなど、よこ並びにレイアウトする機会はまだまだあるんじゃないでしょうか。もちろん画面幅にはレスポ... 続きを読む

フッターやヘッダー、ナビゲーションなど、パーツ別のデザイン例のまとめ - かちびと.net

2010/02/17 548 users フッター 備忘録 ヘッダー いとこ インパクト

ヘッダーだけ、フッターだけみたい、 というように、部分的にデザインの 例を見たいことが多いのでそんな 記事をまとめました。まとめのまとめ です。少し重いかもしれません。 主にブログデザインになってしまいますが、ヘッダー、フッター、ナビゲーション、フォームデザインなどなど部分的なデザインを参考にしたいとこに役立つまとめ記事を備忘録としてまとめています。 ヘッダーデザイン ユーザーにインパクトを与える... 続きを読む

最近のレスポンシブ対応サイトで見かけるナビゲーションのアイデア・実装方法のまとめ | コリス

2016/10/20 547 users 階層構造 レスポンシブ対応 ハンバーガーメニュー 去年 コリス

去年ぐらいはレスポンシブ対応のナビゲーションというとハンバーガーメニューばかりでしたが、最近ではスクリーンサイズに合わせるだけでなく、コンテンツや階層構造に合わせたナビゲーションが増えてきました。 Webページやスマホペ ...記事の続きを読む 続きを読む

ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集:phpspot開発日誌

2009/02/19 497 users phpspot開発日誌 jQueryプラグイン集 ページャ

25 jQuery Plugins for Navigation ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集。 階層メニュー、タブ、ツリーやページャにいたるまで、ナビゲーション部分に使えるjQueryプラグイン集25種がまとまっていました。 jQuery (mb)Menu クールなアイコン付階層メニュー BDC Drilldown Menu (iPod Style) iPod風... 続きを読む

Lucky bag::blog: line-height の値には単位なしが良いとされる理由

2006/04/10 492 users line-height length Lucky Bag

この記事が属するカテゴリー CSS CSS で行ボックスの高さを指定する line-height 値に、em(length) や %(percentage) などの単位を付けて指定しているサイトを意外と見かける。それは間違いではないし、例えばナビゲーションとかでブロック要素の垂直センターに配置するために意図的に指定しているんであれば良いんだけれど、そうでないなら line-height 値には単位... 続きを読む

15分でビジネスサイトを構築！WordPressの”中身”のテンプレートが便利！ | WP-D

2014/09/13 485 users WP-D テンプレート WordPress 中身 構築

みなさんご無沙汰しています。WPD-Bordeaux ことBizVektorの石川です。 さて、WordPressでビジネス向けのウェブサイトをつくろうとすると、最近では非常に優秀な無料WordPressテーマもあるようですが、そういった高機能なテーマがあったとしても サービス紹介や会社案内などいろいろなページを自分で作成 ナビゲーションを作成・設定 問い合わせフォームを設定 など、何だかんだと地... 続きを読む

jQuery：スクロールしたらヘッダーやナビゲーションを固定・変化させる動きを実装するサンプルコード 5 | NxWorld

2017/01/11 482 users jQuery NxWorld プレフィックス ヘッダー 見栄え

一度は見かけたことがあると思う、スクロールしたらヘッダーやナビゲーションを固定表示させたり見栄えを変化させたりする動きをjQueryで実装するサンプルです。途中から要素を固定させたり、スクロールした方向によって表示・非表示を切り替えたりなど全5種類です。 ※プレフィックスは必要に応じて追記してください。 ※以下で紹介している方法はいずれもjQueryを使用していますので、あらかじめ読み込ませてくだ... 続きを読む

HTML5でWebページを作成する時のベースになるシンプルなコードで書かれたテンプレート | コリス

2015/10/26 479 users GIRLY DROP 上部 コリス ブラウザ 必要最小限

HTML5でWebページを作成する時に役立つ、必要最小限のブランクのテンプレート、ナビゲーションを上部に固定配置、写真画像などの背景画像をブラウザいっぱいに表示させるシンプルなテンプレートを紹介します。 画像: Girly Drop HTML5で作成する時の必要最小限のテンプレート ナビゲーションを上部に固定配置 背景画像をブラウザいっぱいに表示 ※以前、当ブログで紹介したものもバージョンアップさ... 続きを読む

CSSの参考になるアイデアがいっぱい！2018年スタイルシートを使ったテクニックのまとめ | コリス

2018/12/13 471 users コリス Calc CSS テクニック 参考

2018年も、CSSの進化がすごかったです！ CSSを使ったアニメーションはより快適なものが増え、JavaScriptを使用しないと実装できなかったものがCSSだけで実装できるようになったり、vwやvhやcalc()などを効果的に使用したり、レイアウト、ナビゲーション、カードなどもより洗練されて実装されています。 さまざまな素晴ら... 続きを読む

[CSS]ヘッダは上部固定で、フッタはコンテンツが少なくても最下部にするスタイルシート、レスポンシブにも対応！ | コリス

2013/02/25 471 users ブッダ ナビゲーシ コリス ヘッダ CSS

ナビゲーションを配置したヘッダはスクロールしても常に上部に固定されており、フッタはコンテンツの量が少なくても最下部に配置されるページを実装するスタイルシートを紹介します。 Sticky footer with fixed navbar コンテンツが少なくてもフッタは最下部に、レスポンシブ対応で！ デモ Bootstrapに素晴らしいデモがあったので、そこからデモを紹介します。 デモでは、ナビゲーシ... 続きを読む

ヘッダ、フッタ、ナビゲーション、見出しなど、Webサイトでよく使うパーツのデザインを集めたギャラリーサイトのまとめ | コリス

2015/04/14 463 users ブッダ コリス ヘッダ インスピレーション 見出し

ヘッダ、フッタ、ナビゲーション、見出しなど、Webページでよく使う各コンポーネントやエレメントごとに国内・海外の素晴らしいデザインを集めているギャラリーサイトを紹介します。 眺めているだけで、さまざまなインスピレーション...記事の続きを読む 続きを読む

Web制作者が知っておきたい、ハンバーガーメニューに代わるスマホ向けのナビゲーションのまとめ | コリス

2017/02/14 452 users スクリーン 議論 候補 コリス スマホ

スマホのナビゲーションをどうするか、Web制作者の間で多くの議論が交わされてきました。スマホのスクリーンは小さく、掲載する情報量には限りがあるため、多くの情報を格納できるハンバーガーメニューが候補にあがるでしょう。 しか ...記事の続きを読む 続きを読む