You Look Too Cool

Bootstrap公式サイトの目次を一覧できる「Bootstrap TOC」

最近はBootstrapに頼りきってウェブサイトを作っています。
公式サイトの説明を見ないと書けません。しかし説明が膨大で目次が複数ページにまたがるため使いにくいです。
そこで目次を一覧できるページを自作しました。

Bootstrap TOC不具合が生じたため調整中です。

単に各ページのナビゲーションを拾ってきて並べているだけです。 (さらに…)

WordPressのテーマをBootstrapで作る

このブログはWordpressを使っています。携帯電話用の表示にはプラグインで対応していましたが、動きが今一つなので、テーマを自作することにしました。
やはりBootstrapを使います。はっきり言ってモバイルフレンドリーにする方法をこれしか知りません。 (さらに…)

SereneBachのテンプレートにBootstrapを適用

サイトをモバイルフレンドリーにしないとGoogleに怒られるという話を書きました。
昔、SereneBachというブログシステムで書いていたブログがあります。
今も公開していますが、今回、Googleから、このブログがモバイル対応していないという指摘を受けたのです。 (さらに…)

Bootstrapで2カラムのブログをモバイルフレンドリーに

最近、Googleから「http://stabucky.com/sb/ でモバイル ユーザビリティ上の問題が検出されました」というメールが来ます。
今後、Googleは、スマートフォンなどの小さなディスプレイでも見やすくしないと、検索されたときの表示順を下げるそうです。 (さらに…)

デスクトップとモバイルの両方に自動的に対応する「Bootstrap3」

Bootstrapがバージョン3になりました。
Bootstrap
色々と変更されましたが、目立つのはレイアウト関連でしょうか。
最近はデスクトップ用の表示とモバイル用の表示の両方に対応していることが望ましいですが、Bootstrapを使うと簡単に設定できます。
後述のサンプルのようにDIVを設定すると、デスクトップのように幅が広い場合には2カラム表示、モバイルのように幅が狭い場合には1カラム表示、と自動的に調整されて表示されます。 (さらに…)

mixiから引越し

以前、mixiで書いた日記をこのブログにインポートしたのですが、内容があまりに貧弱なので、外すことにしました。
とは言え、全て捨ててしまうのももったいないので、エクスポートして、ブログ風に表示することにしました。 (さらに…)

グラフ化して表示する「プロ野球チャート」

日本のプロ野球のいろいろなデータをグラフで見られるサイトを作りました。

プロ野球チャート

お互いの対戦成績をグラフで表す「勝敗相関図」や各チームの成績をレーダーチャートで表す「戦力レーダー」などがあります。
それぞれの詳細については、あらためて紹介したいと思います。
グラフの描画についてはGoogleのAPIを使っています。
サイトのレイアウトについてはTwitterのBootstrapを使っています。

今後は「点差別勝敗率」などについても追加するつもりです。

名言集「1000 Word Dressing」

有名人の名言や面白い言葉を表示するページを作りました。

1000 Word Dressing

「サウザンワードドレッシング」と読みます。もちろんサウザンアイランドドレッシングの捩りです。
「千の言葉」というつもりですが実際は今のところ269個。
なるべく普通の名言集に載っていない言葉を集めているつもりです。