Bootstrap 2.0 → 3.1.1

Bootstrap3系

現状把握

 状態:調査中  閲覧数:2,267  投稿日:2014-05-12  更新日:2014-05-14
デフォルトコード or カスタマイズ
・現在使用しているBootstrap が、「公式サイトで配布されているデフォルトコード」なのか、「カスタマイズされたもの」なのかをまず確認

カスタマイズ
・現在利用している「bootstrap.min.css」は、「公式サイトで配布されているデフォルトCSS」ではなく、「カスタマイズを施したもの」
・カスタマイズ内容 … フォント等(詳細不明)
・「min」なので、もしかしたら「Bootswatch」で配布しているカスタマイズCSSをそのまま利用しているかもしれない

Bootstrap以外
用途 現使用ライブラリ名 新候補ライブラリ名 備考 決定
テーブル - FooTable 2系導入時にレスポンシブテーブルを探した際は、満足するライブラリが見つからなかった
セレクト拡張 Chosen Select2 両者の違いはこれから要確認
キャプチャ認証 QAPTCHA 継続利用予定 探した際の記録
不特定多数投稿 SCEditor 要検討 不特定多数投稿でHTMLタグを許可 -


Bootstrap 3 のレスポンシブテーブル

 閲覧数:926 投稿日:2014-05-13 更新日:2014-05-13

公式ドキュメント


Bootstrap 3 の「Responsive tables」に搭載されている機能
・モバイルサイズなどで画面からはみ出した場合、横スライド可能な状態で表示
Create responsive tables by wrapping any .table in .table-responsive to make them scroll horizontally up to small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.

期待値以下
・期待していた程、Bootstrap 3 のレスポンシブテーブル機能は充実していないことが判明
・上記 FooTable ライブラリ導入を決意

Bootstrap 3 のセレクト拡張

 閲覧数:801 投稿日:2014-05-13 更新日:2014-05-13

デフォルト


デフォルトBootstrap 3 は、セレクトボックス検索不可
・要ライブラリ導入


ライブラリ


セレクト拡張ライブラリ
・Chosen
・Select2
・両者の違いは?

両者の違い
・Chosenは一部、saas/coffeeで書かれている
・Select2の方が機能/ドキュメントが充実している

結論
・Select2 導入決定

不特定多数投稿

 閲覧数:670 投稿日:2014-05-14 更新日:2014-05-15

結論


SCEditor
・検討した結果、カスタマイズした上で継続利用することを決定

既存サービスへエディタを組み込むためには、カスタマイズするしかない
・前回探し回ったときにも感じたことだが、欲しい機能そのものだけを備えたエディタなど存在しない(多機能過ぎるのも問題なので)
・既存サービスへ組み込むためには、最終的にカスタマイズするしかない


調査内容


Redactor
・BBCode、Markdown、何れも未対応
・不特定多数投稿用途では使用不可

StackEdit
・デフォルトでYouTube動画再生未対応

BBCode or Markdown
・Markdownが流行っていることは認識している
・それなのにBBCodeを採用することは、時代の流れに逆行するようで若干の抵抗があるけれども、不特定多数投稿用途に対応するためには仕方がない

不特定多数用途でMarkdown記法
・Markdownエディタを使用すれば対応可能

選択肢
エディタ 記法 HTMLエスケープ 不特定多数投稿
Redactor HTMLタグ 必要 デフォルトでは不可
StackEdit Markdown 必要
SCEditor BBCode 必要
Markdown
・エディタがなくても書いた内容を、HTMLタグで表示可能
・しかし、不特定多数投稿用途で使用するためには、エディタが必須(エディタがないと、Markdownを知らない人はHTMLタグを利用できない)

セキュリティ目次



Bootstrap 3

Bootstrap3系 テーマ / テンプレート



週間人気ページランキング / 11-15 → 11-21
順位 ページタイトル抜粋 アクセス数
1 「パッケージ化されてない拡張機能を読み込む」でインストールした拡張は、chromeを「更新」すると正常動作しなくなることがあります。 | Chrome 拡張機能 12
1 鉄道会社毎のカラーコード | カラーコード(色) 12
2 FontAwesomeでアイコンが□(四角)になって表示されない Forbidden  | Font Awesome(フォント) 10
3 血の色 / #b30000 / #360800 / #ff0000 | カラーコード(色) 6
3 Design 0 6
4 Fireworks で背景画像透明化 | Fireworks CS3(Fireworks) 5
5 RGB ⇔ Lab | 色変換(色) 4
5 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 4
5 「Google Chrome」の文字が突然ギザギザで表示されるようになったら、「chrome://flags/#top-chrome-md」へアクセス後、右上の「Reset all」ボタンをクリックします。 | Google Chrome(ブラウザ) 4
5 「東京都」のカラーコード取得は難しい | カラーコード(色) 4
5 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 4
5 16進数カラーコード / 2進数 4
6 カラーコード / 色コード | カラーコード(色) 3
6 「:after擬似要素」は、Chromeの「要素を検証」で確認できない | 擬似(CSS) 3
6 金融機関ブランドカラー / コーポレートカラー | カラーコード(色) 3
6 個人的によく見返すエントリーへのLinkなど | その他 3
7 RGB ⇔ XYZ / CIE RGB / sRGB(D65) / sRGB(C) / Adobe RGB / NTSC RGB 2
7 RGBの種類 / ビットカラー | RGB(色) 2
7 8ビットカラー / インデックスカラー / パレットカラー 2
7 Windows10で「Google Chrome」が常に最前面に表示される。「アクティブウィンドウ」が最前面で表示されない → 解決方法存在しない | Google Chrome(ブラウザ) 2
2024/11/22 1:01 更新