シンプルなHTMLでセマンティックに実装することにこだわった、アクセシブルでレスポンシブ対応のサイトをより簡単に制作するためのフレームワークを紹介します。 MIT Licensesで、個人でも商用でも無料で利用できます。 Turret Turret -GitHub Turretの特徴 Turretはアクセシブルで、セマンティックで、レスポンシブ対応のサイトをより簡単に制作するためのフレームワークです。 レスポンシブ対応 読みやすいマークアップを使い、レスポンシブ対応のグリッドやエレメントを汎用性に優れたclassを使って実装しています。 Design First 直感的なユーザインターフェイスのために、文字の定義とカラーパレットにフォーカスしています。 No JavaScript スクリプトは使用せず、LESSベースでネイティブのWeb要素を採用しています。 セマンティック マークアップは
We are creating horizons, each new skyline is a unique, living outline that changes with the evolving architecture. Standard Markup We're developing a shared vocabulary, creating common HTML modules with consistent naming conventions. OOCSS & SCSS CSS is written in beautifully organized SCSS partials, grouped by the role each CSS rule and classname play.
2, 3, 4, 6, 9, 12, 18の均等分割をはじめ、黄金比の分割にも対応したグリッドレイアウト用のCSSのフレームワークを紹介します。 The Square Grid [ad#ad-2] The Square Gridのグリッド設計 グリッドの全幅は994pxで、両端に余白7pxをとり、残りの980pxを均等に35分割したものをベースにしています。 均等分割のカラム
http://andrzejonsoftware.blogspot.com/2014/04/be-careful-with-rails-way.html 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約2時間前 「RailsでInteractorをうまく利用する」と「DHHとのピンポン」で紹介した議論をうけて立ち上がったサイト( http://www.dhh-ping-pong.com/ )で、DHHに挑戦するコードのピンポンが行われてます。 最初に取り上げられたAndrzej Krzywdaとのやりとりは、こちら。Andrzejのリファクタリングについてのオリジナルのブログはこちら。 また、Andrzejは最新のブログの投稿で、その比較について解説しています。 自分はコードとRailフレームワークとの関係をな
ビジネスモデルに特効薬のフレームワークあります ビジネスモデル・キャンバス http://www.businessmodelgeneration.com/canvas 全方位的でいてフォーカスの効いたビジネスモデルモデルデザイン。チームでやるならなおさらパワフルなツールです。 この記事の対象者 規模の大小ではなく、新しいビジネスの仕組みやマーケティングを考えたりディレクションをしている人とかに効きます! 例えば、 新規事業企画でステークホルダー(関係者の人々)と本質の理解を共有したい人 新しいサービスを開発したい人 なんか新しいことしたいのだけれどもモヤモヤしている人。 に、読んでもらって、使ってもらえればちょっと嬉しいです。 目次 キャンバス 9つの視点 価値提案 顧客の視点 業務プロセスの視点 財務の視点 俯瞰と掘り下げ ケーススタディ まとめ キャンバス ビジネスモデル・キャンバスは
IE6をはじめ、iPhone, iPadにも対応した、可変レイアウトも固定レイアウトにも利用できる実用的で多彩なグリッドを組み立てるCSSのフレームワークを紹介します。 StackLayout デモページ:Basic Mockup [ad#ad-2] StackLayoutの主な特徴 StackLayoutの対応ブラウザ・デバイス StackLayoutで使用する12個のclass名 StackLayoutのデモ StackLayoutの使い方 StackLayoutの主な特徴 わずか12個のclass名で、コンポーネントを管理 class名は、簡単にセマンティックなものに変更可能 ネストの制限は無し floatのクリア無しで、エレメントを横列に簡単に並べることが可能 デフォルトは可変レイアウト用で、固定レイアウトにも対応 各カラムの溝の設定は簡単で、px, %の両方に対応 StackLa
TopCoatはグレー系を主体とした落ち着いた雰囲気のWebデザインフレームワークです。 最近はWebデザインフレームワークが多数出揃ってきました。サイトの雰囲気によってフレームワークを選ぶと良いでしょう。グレー系の落ち着いた感じを出したいならばTopCoatを使ってみましょう。 グレースケールを基調としたはっきりとした見た目のUIです。 ウィジェットは数多く提供されています。 フォーム系。 スライダーなどもあります。 スピナー。効果的に青が使われています。 こちらはモバイル。スマートフォンで使えます。 アイコンとラベルのセット。 テキストエリアとチェックボックス。 基本的に濃淡2色のバックグラウンドが選択できます。 オーバーレイ表示。これも色々使えそうです。 TopCoatはデスクトップとモバイルのそれぞれにデザインが提供されています。グレー系が約6色、青系が2色程度で構成されています。
specky boyのエントリーから、ブラウザのスタイルの初期化やレイアウトのテンプレートなど、スタイルシート設計のベースとなるCSSのフレームワークを紹介します。
Working with hugedomains.com was a quick and easy process. We got to speak to multiple real people located in Colorado without having to wait on hold! Our only complaint was we felt we had to overpay more than this particular domain was worth, and we weren't able to negotiate it down to a level that we felt was fair. However, payment and delivery were seamless, and within a few hours we had all of
誰かがきっと作ってくれると思っていた。 prototype.jsのようなライブラリを利用するのは、便利な機能が多いという事もあるが、各ブラウザ間での相違を吸収してくれるという点も大きい。 その点において、CSSもまた各ブラウザ間での表示の差異が大きい。そこで試してみたいのがこれだ。 今回紹介するオープンソース・ソフトウェアはBlueprint、ブラウザ間の描画差異を吸収して簡単にマルチカラムを実現してくれるCSSライブラリだ。 Blueprintはヘッダ、コンテンツ、サイドバー、フッターのようなテンプレートをクラス指定するだけで簡単に作成できる。デフォルトのフォーマットはリセットされているので、ブラウザ間の違いが出るマージンやパディングの差異も吸収してくれている。 また、印刷時のCSSも用意されている。これを使えば印刷時やプリンタ経由でのPDF作成時に綺麗なものが仕上がるようになる。今後の
TOP > 「Webサイト改善は図を描きなさい!」 〜 SiteCatalyst達人から教わった分析フレームワーク こんにちは。マーケティング担当の伊藤大地です。 先日、米AdobeでWeb解析ツール「SiteCatalyst」のプロダクトマネージャープログラムマネージャー(初出時、役職を誤って表記しておりました。お詫びし、訂正いたします)を務めていらっしゃる清水誠さんが、一時帰国された折に弊社に遊びに来てくださいました。たっぷり2時間、最新Webマーケティング事情やWeb解析についてお話を伺いした中から、WebのKPI測定・改善サイクルとそのノウハウについて、エッセンスをお伝えしたいと思います。 清水さんが提唱されているWeb改善のフレームワーク「コンセプトダイアグラム」という手法は、主に3つのプロセスから成り立っています。 ユーザー視点でサイトを図解し、コンセプトを明確にする サイトの
Responsive design gets a whole lot faster A Framework for any device, medium, and accessibility. Foundation is a family of responsive front-end frameworks that make it easy to design beautiful responsive websites, apps and emails that look amazing on any device. Foundation is semantic, readable, flexible, and completely customizable. We’re constantly adding new resources and code snippets, includi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く