【総まとめ】2018年特に印象的だった世界のベストWebデザイン厳選51個 - PhotoshopVIP

2018/12/26 85 users PhotoshopVIP マウスカーソル ホバーエフェクト

当サイトでは、定期的に魅力的な最新ウェブサイトのデザインをまとめて紹介していますが、2018年は革新的なエフェクトやインタラクティブな仕掛けをつかったサイトが、たくさん登場しました。 サイトに動きを加えるマイクロインタラクションやホバーエフェクト、一般的なグリッドレイアウトを無視したり、マウスカーソル... 続きを読む

Visual Studio Code 1.25が新しいグリッドレイアウトとアウトラインビューをサポート

2018/07/11 8 users フォロワー 作者 Visual Studio Code 共有

Visual Studio Code 1.25が新しいグリッドレイアウトとアウトラインビューをサポート いいね | 作者： Sergio De Simone Sergio De Simone フォローする 13 人のフォロワー , 翻訳者 編集部T 編集部T フォローする 0 人のフォロワー 投稿日 2018年7月10日. 推定読書時間： 2 分 | 共有 | 後で読む マイリーディングリス... 続きを読む

CSS Gridを使うならマスターしておきたいauto-fillとauto-fitの違い | Rriver

2018/02/21 106 users Rriver Repeat minmax CSS Grid

CSS Gridって本当に便利だなぁと思う今日この頃ですが、そのなかでも特に注目しているのが repeat() と minmax() です。この2つのCSS関数を使うとグリッドレイアウトの構築が楽になるだけでなく、CSS Gridだけで メディアクエリなしでもレスポンシブなレイアウト が実現できます。 今回はその repeat() で使える auto-fill と auto-fit という値につい... 続きを読む

手軽にCSSグリッドレイアウトのコードを生成できる「Griddy」 | Webクリエイターボックス

2017/04/16 112 users CSSグリッドレイアウト Webクリエイターボックス 複数

先日公開した記事「 CSSグリッドレイアウトで、サイズが違う複数のボックスをタイル状に配置する 」に続き、CSSグリッドレイアウト情報第二弾。今回はグリッドレイアウトを作成するにあたり、「 Griddy 」というCSSコードを生成してくれる便利なWebサイトがあったので紹介します。グリッドレイアウトの勉強にもなると思いますよ！ Griddy のサイトを開くと4つのグリッドアイテムが表示されています... 続きを読む

RecyclerViewとRealmを使ったグリッドインタフェースの構築(Thorben Primke) - Realm is a mobile database: a replacement for SQLite & Core Data

2015/11/25 19 users realm RecyclerView インタフェース 構築

アンドロイド - 推定所要時間: 25分 このチュートリアルでThorben Primkeは、Realm用に拡張されたRecyclerViewであるRealmRecyclerViewを使ってRealmに格納されたデータをグリッド表示する方法を示します。 アプリケーションにグリッドレイアウトを実装しようとしたことはありませんか？データがRealmに格納されているなら、すぐにこのようなインタフェースを... 続きを読む

[CSS]IE8もサポート、レスポンシブ対応のさまざまなレイアウトを手軽に使いたい人にぴったりな超軽量スタイルシート -GridLayout | コリス

2015/08/21 92 users コリス マルチカラム スティッキー CSS ブッダ

最近のWebページでよく使用されるシンプルな1カラム、マルチカラム、カード型のレイアウトをはじめ、フッタが常に最下部に表示されるスティッキー、Webアプリなど、人気のグリッドレイアウトを簡単に実装できる超軽量スタイルシートを紹介します。 もちろんレスポンシブ対応で、古い環境（IE8+, iOS5+, Android3+）もサポートされています。 レイアウト用だけのフレームワークを必要としている人に... 続きを読む

軽量でシンプルなレスポンシブフレームワーク「Skeleton」 |　バニデザノート

2015/07/27 62 users Skeleton グリッドシステム イレギュラー 横幅 羽根

「Skeleton」は、レスポンシブCSSフレームワークです。「シンプルで、羽根のように軽い」がコンセプトで、基本的なhtmlコンポーネントと、グリッドレイアウトのみが入っています。 モバイルファーストな意識が高く、ファイル自身も少なく軽量なので全体が見渡しやすく扱いやすい印象です。 960gsベースの、グリッドシステムです。HDなPCサイズでのみ横幅を広げるなど、イレギュラーなこともCSSをいじ... 続きを読む

グリッドレイアウト採用時に便利なjQueryプラグイン 20 | NxWorld

2013/11/11 139 users NxWorld Pinterest Behance 箇所 印象

有名どころだとPinterestやBehanceなどで取り入れているような、グリッドレイアウトを簡単に実装できるjQueryプラグインのまとめです。少し前はポートフォリオのギャラリー部分などのような箇所で主に使われている印象が個人的にあったのですが、最近ではブログの記事一覧やECサイトなどでもよく見かけますし、コーポレートサイトのトップに採用しているサイトなども多く見かけます。基本的な動きは同じよ... 続きを読む

「jQuery×HTML5×CSS3を真面目に勉強」最新記事一覧 - ITmedia Keywords

2013/08/29 23 users ITmedia Keywords 勉強 jQuery 基本

jQuery×HTML5×CSS3を真面目に勉強（3）： Pinterest風グリッドレイアウトを作ってみよう jQueryを使って、女性に人気の写真共有SNS、Pinterestのグリッドレイアウトを再現してみよう。（2013/6/10） jQuery×HTML5×CSS3を真面目に勉強（2）： 画像スライドショーでjQueryプラグインの基本を学ぶ jQueryでUIコンポーネントの作り方を学... 続きを読む

Bootstrap 3正式版がリリース。モバイルファースト、レスポンシブ、フラットデザインなどを採用 － Publickey

2013/08/20 90 users Publickey Bootstrap CSS リリース 採用

複雑なCSSを自分で書かなくてもHTMLのマークアップで簡単に美しい比率のグリッドレイアウトを構成でき、分かりやすいボタン、パンくずリスト、メニューなどのWebページを記述できるCSSフレームワーク、「Bootstrap」の最新版「Bootstrap 3」が公開されました。 Bootstrap Bootstrap 3ではモバイルファーストを意識したデザインとなり、ボタンやメニューなどはフラットデザ... 続きを読む

グリッドレイアウトを実装できるjQueryプラグイン総まとめ - W3Q - Web制作者のお悩み解決サイト

2013/07/25 29 users Masonry タイル状 プラグイン W3Q WEB制作者

グリッドレイアウトを実装できるjQueryプラグイン総まとめ パネルをタイル状に敷き詰めるプラグイン / Masonry / Grid-A-Licious他...全10件 続きを読む

レスポンシブなグリッドだけを提供する軽量スタイルシート「fitgrid」|オープンソース・ソフトウェア、ITニュースを毎日紹介するエンジニア、デザイナー向けブログ

2013/05/26 61 users グリッド タブレットサイズ ソフトウェア エンジニア ジレンマ

fitgridは本番環境下でも耐えられる軽量なレスポンシブグリッドなスタイルシートです。レスポンシブなWebデザインを実現するのは大変ですが、Bootstrapを使うとそれっぽさが残ってしまう…。そんなジレンマを感じている方はfitgridを試しましょう。fitgridは軽量なグリッドレイアウトを提供します。 デスクトップサイズでの表示。 1〜4列で細かく制御できます。 タブレットサイズ。幅が狭く... 続きを読む

UIトレンドの研究に！海外のユニークなUIのWebデザインまとめ11個 - W3Q

2013/02/18 52 users UIトレンド パララックス W3Q 研究 海外

【海外のユニークなWebデザイン】 　Webデザイン界隈では毎年、実験的なユニークなUIのWebサイトが次々と現れ、その中のいくつかが「トレンド」として爆発的に広まっていく傾向にあります。グリッドレイアウトやパララックス、レスポンシブWebデザインなどなど。それらはすべて海外で生まれ日本にやってくるのです。 　次のトレンドを見極めるためには、海外のユニークなWebサイトを研究することが一番の近道で... 続きを読む

グラフィカルな写真コンテンツを効果的に見せる!ランダムな配置のグリッドレイアウトのサイトデザインをまとめました | Webデザインクリップ

2012/12/05 73 users パネル 従来 配置 ランダム Webデザインクリップ

最近海外のサイトデザインで、ランダムなブロックレイアウトのデザインをよく見かけます。 シンプルでいながら絶妙なバランスで並べられたパネルの中にコンテンツが入れられており、従来のグリッドレイアウトとは少し違っており、サイトの新しいデザインの様な印象を受けます。 一見シンプルなコンテンツを印象的に見せたいサイトや、ファッション系サイトなどグラフィカルな写真を見せたいサイトではJSなどでダイナミックな動... 続きを読む

レスポンシブWebデザイン対応のCSSをカラム数やマージンを指定してダウンロードできる・34Grid - かちびと.net

2012/11/03 113 users マージン CSS カラム数 スパマー net

昨日に続き今日も似たような内容 ですが。グリッドレイアウトの レスポンシブWebデザイン対応の CSSフレームワークですが、こちら はグリッドのカラム数やマージン を指定できます。 どんどん便利になりますね。最近同じ内容の記事ばかり書いてて自分がスパマーみたいな気分になってきましたが気にしないようにします。 34Grid グリッドレイアウト x レスポンシブなフレームワーク。DL前にカラム数などを... 続きを読む

レスポンシブなグリッドレイアウトを実装できるjQueryプラグインまとめ6つ - コメンター

2012/10/24 75 users コメンター Facebookページ クリエイター シェア

コメンターとは コメンターは、クリエイターの気になるサイトやページをシェアして、匿名ならではの自由なコメントをみんなで楽しむコミュニティです。 このページをシェア 上記リンクをブックマークツールバーに登録することで、閲覧中のサイトをその場でシェアできます。 Facebookページ 2012年8月にオープンしたコメンターのFacebookページでは、クリエイター向けの最新Web/IT情報をどこよりも... 続きを読む

グリッドレイアウトの元祖ともいえるSuprbのGrid-A-Liciousがレスポンシブデザインに対応し装いも新たにjQueryプラグインとしてリリース！！ → Grid-A-Licious - コメンター

2012/10/15 25 users コメンター 元祖 jQueryプラグイン クリエイター シェア

コメンターとは コメンターは、クリエイターの気になるサイトやページをシェアして、匿名ならではの自由なコメントをみんなで楽しむコミュニティです。 このページをシェア 上記リンクをブックマークツールバーに登録することで、閲覧中のサイトをその場でシェアできます。 Facebookページ 2012年8月にオープンしたコメンターのFacebookページでは、クリエイター向けの最新Web/IT情報をどこよりも... 続きを読む

[JS]アナタのソーシャルコンテンツをまとめてPinterest風レイアウトで表示するスクリプト -Socialist | コリス

2012/09/03 51 users Twitter Facebook YouTube コリス

ブログのRSSをはじめ、Facebook, Twitter, Tumbler, Google+, Pinterest, Flickr, YouTubeなどのコンテンツを全てPinterest風のグリッドレイアウトで表示するjQueryのプラグインを紹介します。 幅800pxで表示 Socialistの使い方 Step 1: 外部ファイル head内に当スタイルシートと「jquery.js」と当スク... 続きを読む

Photoshop VIP どんなWebサイト制作にも対応、Photoshopでグリッド、カラムガイドラインを作成する方法

2012/08/10 59 users グリッド Photoshop Photoshop Vip

Home　>　 チュートリアル　>　Webレイアウトチュートリアル　>　どんなWebサイト制作にも対応、Photoshopでグリッド、カラムガイドラインを作成する方法 Photoshopを使ってWebデザインを制作するときに、まず必要となるのがピクセル単位で引かれたグリッドガイドラインです。 グリッドレイアウトを利用することで、コンテンツをすっきり見やすく並べるだけでなく、デザイン作業を直感的に行... 続きを読む

黄金比を取り入れたグリッドレイアウトのWebデザインを構築する為のテンプレートやアクションなどの補助キット・The Golden Grid - かちびと.net

2012/06/06 159 users psd Photoshop 960グリッドシステム 黄金比

黄金比を取り入れたグリッドレイアウト のWebデザインを作る際のPhotoshopや Fireworks用テンプレや、PSアクション などがセットになったデザインキット・ The Golden Gridのご紹介。アクション が便利そうでした。 黄金比を取り入れたグリッドレイアウト用のPSDやFw用テンプレとかアクションがセットになってるやつです。グリッドレイアウトは960グリッドシステムに準じてい... 続きを読む

グリッドレイアウトなレスポンシブWebデザイン対応のテンプレートを手軽に生成出来るジェネレーター・Responsify - かちびと.net

2012/06/01 59 users スターターキット テンプレ テンプレート net 操作

オンラインで手軽にレシポンシブWeb デザイン対応のテンプレを生成できる というジェネレーター・responsify.it のご紹介。グリッドレイアウトにも 対応可能です。 この手のはいくつか同じツールがありますけど、これはかなり使いやすい印象でした。操作もシンプルですし、スターターキットを生成するのに使えそうです。 Responsify レスポンシブWebデザイン対応のテンプレートを手軽に生成出... 続きを読む

グリッドレイアウトを作るときに役立つ便利なジェネレーターまとめ5つ - W3Q

2012/04/19 26 users ジェネレーターまとめ5つ W3Q

[Webサービス] グリッドレイアウトを作るときに役立つ便利なジェネレーター 続きを読む

Pinterestのようなグリッドレイアウトが組めるフリーのWordPressテーマまとめ4つ - W3Q

2012/04/18 113 users Pinterest WordPressテーマ W3Q

[WordPress・CMS] Pinterestのようなグリッドレイアウトが組めるフリーのWordPressテーマ 続きを読む

スライドショーやグリッドレイアウトなど、日本製の国産jQueryプラグインまとめ7つ - W3Q

2012/01/17 68 users スライドショー JavaScript W3Q 日本製

[JavaScript] スライドショーやグリッドレイアウトなど、日本製の国産jQueryプラグイン 続きを読む

CSSのみで約900パターンものユニークなグリッドレイアウトをドラッグ&ドロップで作成出来るWebサービス・3x4grid - かちびと. net

2012/01/09 329 users Masonry CSSジェネレーター CSS パズル レンガ風

3連休を如何お過ごしでしょうか。さて、 ちょっと面白いものを見かけたのでシェア します。Masonryのようなレンガ風の レイアウトをCSSのみでサクッと作れる Webサービス。パズルのように組み合わせ るので種類は900パターン近くになる そうですよ。 休日なので軽めの話題でも。 よくあるグリッドレイアウトのCSSジェネレーターと違って汎用性はありませんが、こういうサービスが出てきたのがちょっと... 続きを読む