目次
-
- 社内Wikiおすすめの使い方 オススメ
-
- インストール 基本
- 設定 基本
- テンプレート 基本
-
- 最初に入れるお勧めプラグイン オススメ
- プラグイン一覧 オススメ
- DokuWikiの使い方 基本
- 標準機能でのページの書き方 オススメ
-
-
-
2018年9月開始の話題のレンタルサーバ
DokuWikiを理解
DokuWikiの構築
よく確認するページ
サイドバー
· 最終更新: 2018/10/15 by oreda admin
サイトの幅サイズの検討
概要
サイトの幅サイズの検討には十分考慮する必要があります。
特に広告を考慮すると、難しいです。
検討結果
- 1,024px
- 1,280px
- 1,366px
- 1,440px
DokuWikiレイアウトでの前提知識
| 通常時のレイアウト | サイドバーがあるレイアウトです。 |
| タブレットモードのレイアウト | サイドバーが通常のサイドではなく、上にくるレイアウトです。 |
| 携帯モードのレイアウト |
サイズ案
リキッドデザイン
PC、スマホ両方のサイト
| サイト全体 | サイドバーの幅 | タブレットモードの幅 | 携帯電話モードの幅 | CSS設定：body { min-width: xxxpx; } |
|---|---|---|---|---|
| 1200px | 320px | 1100px | 400px | なし |
主にPC用
| サイト全体 | サイドバーの幅 | タブレットモードの幅 | 携帯電話モードの幅 | CSS設定：body { min-width: xxxpx; } |
|---|---|---|---|---|
| 1440px | 320px | 1300px | 1000px | 1150px |
- タブレットモードにするのが、1300pxにして、1366pxの画面でも、サイドバーを表示する。
- CSS min-width:1150pxにして、スマホ、タブレットなどでもテーブルを見やすくする。
- サイドバー320pxは一般的な広告サイズ(300px)がちょうどはいるサイズです。
社内Wiki(PC用)
| サイト全体 | サイドバーの幅 | タブレットモードの幅 | 携帯電話モードの幅 | CSS設定：body { min-width: xxxpx; } |
|---|---|---|---|---|
| 1700px | 300px | 1000px | 400px | 1150px |
- 基本モニターが24インチ以上のPCのため、横幅は広めです。
- ノートPCのモニターでもサイドバーを表示するために、タブレットモードの幅は(1000px)にします。
- 携帯電話モードは考えないので、400pxとかありえない数字にします。
モニターサイズ
- モニターサイズは、「1024×768」、「1280×800」も多い。
- スマホは、320～640PX
| ベンダー | 機種 | サイズ |
|---|---|---|
| DELL | XPS 13 | 13.3インチ FHD AG (1920 x 1080) |
| Lenovo | ThinkPad X1 Carbon | 14.0型 (2560×1440 or 1920×1080) |
| hp | HP EliteBook 820 G3 | 12.5インチ HD 1366×768 |
| Mac | MacBook Air | 11.6インチ 標準解像度1,366×768ピクセル (16:9) |
| Mac | MacBook Air | 13.3インチ 標準解像度1,440×900ピクセル (16:10) |
| Mac | MacBook Pro | 13.3“ Retina Display 2560 × 1600 |
メモ
| リキッドデザイン | webデザインにおいて、ブラウザの横幅を変更した時にコンテンツの表示サイズも変更されるタイプのデザインのこと。サイズ可変デザイン。 |
| レスポンシブ | 単一のHTMLでスマートフォン、タブレットといった画面サイズが異なるデバイスへ対応できるWebサイト制作手法 |
· 最終更新: 2018/10/15 by oreda admin