サイト設計の手間を大幅に削減する、実用HTMLテンプレート素材30個まとめ 2016年10月度
Bootstrapなどのフレームワークの登場によって、ウェブサイト制作は以前よりも手軽に、そして身近になってきています。特にデザイントレンドをうまく採用したHTMLテンプレートを利用することで、モバイル端末へのレスポンシブ対応はもちろん、簡単にサイトデザインを作成できるようになっています。 今回は、無料ダウンロードできる新作HTML5/CSS3テンプレート素材をまとめてご紹介します。どの素材も高品質なだけでなく、テキストエディタで編集しやすい仕様となっており、サイト制作が捗るアイテムが揃っています。今後のデザイン制作に活用してみてはいかがでしょう。 詳細は以下から。 サイト設計の手間を大幅に削減する、実用HTMLテンプレート素材まとめ Material Design for Bootstrap Google 公式のデザインガイド「マテリアル・デザイン」をコンセプトに、人気フレームワーク B
winstrap - Microsoft社公認のBootstrapテーマ
モダンなWebサイトを実現するためにはモダンなデザインフレームワークを使うべきです。そうすることで全体の統一感が生まれ、使い勝手の良いWebサイトが生まれます。継ぎはぎでは統一感を出すのは困難です。 今回はMicrosoft公式のBootstrapテーマ、winstrapを紹介します。最近のMSらしい、モダンなWebデザインが実現します。 winstrapの使い方 スクリーンショット多めで紹介します。まずはカラーリング。確かにそれっぽいですね。 カラーリングも複数パターン用意されています。 グラデーションも細かく設計されています。 枠組みだけ。 黒バックの場合。 タイポグラフィ。 アイコン。 グリッド。かなり細かい印象です。 ボタン。 チェックボックス。ラベル全体をチェックします。 トグルスイッチ。 フォーム。 テキスト入力。 コンボボックス。 ツールチップ。 ダイアログ。 タブ。 ナビゲ
通常サイトに不要な機能をそぎ落とした軽量CSSフレームワーク「Papier」を使ってみた
Papierとは Papierとは、とても軽量で手軽に使えるセマンティックなレスポンシブCSSライブラリです。 セマンティックというのは、適切なマークアップを使うことで文書に意味を持たせることです。 当然レスポンシブにも多用しているので、ちょっとした記述で手軽にレスポンシブサイトを作成することもできます。 Papierのサイズについて 僕がちょっと利用して感じたのは、通常のサイトで、よく利用するものだけに機能限定して、かなり軽量に仕上げてあるということです。 Bootstrapの場合 CSSフレームワークとしては、Bootstrapなどが有名ですが、Bootstrapは、ウェブサービスなど、様々な利用状況に対応できるように機能を盛り込んで作成されています。 そのため、ドットインストールのBootstrap開発準備で利用されているファイルだけ見ても、バージョン3.3.1の時点でサイズが以下の
Bootstrapよりキレイ！Googleのマテリアルデザインキット - ku-sukeのブログ
Bootstrapの見慣れた感というか、モック感から脱却しようとFoundationとかに手を出しかけてたのですが、Googleがだしてきたマテリアルデザインキットがすごく良かったので紹介します。 たとえば管理画面風のデザインはこれ ほかにもBootstrap風の上部メニューのデザイン（Android）もあったり コンポーネントと呼ばれる部品も充実しています。これ見るだけで色々できそうな気がしますね！ Blog風など幾つか提供されています。いまとあるサイドプロジェクトで簡易的な管理画面をつくろうとしてたのですが、早速活用していい感じに仕上げることが出来ました。 ダウンロードすると全テンプレートが含まれているので、コピペで組み合わせるだけでも結構いい感じに出来ます。Bootstrapに飽きてきたら、ぜひ使ってみてください。 www.getmdl.io
Bootstrapの為のカード型UIフレームワーク・「Bootcards」
BootcardsはBootstrapの為のカード型UIフレームワークです。カード型UIとは最近TwitterやGoogle等が提唱し始めたスタイル（？）です（参照：Twitterカード、Google Now カード）。今まで普通に触れていたUIに名前が付いただけのような気もしますが・・ｗ カードUIに関しては Inside Intercomで記事が書かれていたので合わせてご参照下さい。このカードUIにBootstrapで対応出来るようにする、というUIフレームワークになります。モバイルとタブレットファーストな印象で個人的には割と好きでした。ライセンスはMITとの事。 Bootcards動作サンプル
Codeply
HTML, CSS, JavaScript editor playground for designers & developers to compare, prototype and test frontend frameworks
Datepicker for Bootstrap, from Twitter
About Add datepicker picker to field or to any other element. can be used as a component formats: dd, d, mm, m, yyyy, yy separators: -, /, . Download Change log 12/3/2013 Fixed bug where date selection from previous and next year was wrong Fixed bug where a variable was polluting the namespace 10/3/2013 Changed so the value will not be set unless the user chooses a date 16/2/2013 Fixed it to work
Bootswatch
Easy to Install Simply download a CSS file and replace the one in Bootstrap. No messing around with hex values. Customizable Changes are contained in just two SASS files, enabling further customization and ensuring forward compatibility. Tuned for 5.3.2 Themes are built for the latest version of Bootstrap. Version 4, version 3, version 2, and other releases are also available to download.
[Android Tips] 2つの Android Bootstrap で爆速開発！ | DevelopersIO
Android Bootstrap Bootstrap といえば Twitter Bootstrap が有名ですが、Android の世界では2つの Bootstrap があります。Android Bootstrap と Android Bootstrap です。そう、見事なまでにコンフリクトしております。どちらも Android のアプリ開発を高速化するためのツールですが、役割は違います。具体的に言うと、1つはデザインのアセットをいい感じに作ってくれるもの、もう一つはよく使いそうなライブラリをいい感じにセットにしてくれるものです。それぞれ、ちょっと気になっていたので軽く使ってみました。 デザインのアセットをサクッと作る https://github.com/Bearded-Hen/Android-Bootstrap まずは UI デザインを何となくいい感じに作ってくれる Android
![[Android Tips] 2つの Android Bootstrap で爆速開発！ | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/091f15a7d75f8343165a62700143a86becce2771/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2013%2F09%2Fandroid.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Bootstrap | Designup
GitHub - jschr/bootstrap-modal: Extends the default Bootstrap Modal class. Responsive, stackable, ajax and more.