音楽同人サークル『Magicberry Fields』のブログです。
ニコ動マイリスト→http://www.nicovideo.jp/mylist/5662950
×
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
□ 頒布物（ＣＤ・同人誌）
□ サークルチケット（入場券）
□ おつり（１００円、５００円、１０００円）
□ テーブルクロス
□ ＣＤスタンド
□ おしながき
□ コルクボード
□ 値札
□ ディスプレイ（フィギュアなど）
□ ヘッドホン
□ ネットブック
□ マウス
□ ＣＤプレイヤー・ＭＰ３プレイヤー
□ ＣＤ・ＳＤカード
□ 電池
□ 飲み物
□ 軽食・お菓子
□ タオル
□ 折りたたみ傘
□ サークルチケット（入場券）
□ おつり（１００円、５００円、１０００円）
□ テーブルクロス
□ ＣＤスタンド
□ おしながき
□ コルクボード
□ 値札
□ ディスプレイ（フィギュアなど）
□ ヘッドホン
□ ネットブック
□ マウス
□ ＣＤプレイヤー・ＭＰ３プレイヤー
□ ＣＤ・ＳＤカード
□ 電池
□ 飲み物
□ 軽食・お菓子
□ タオル
□ 折りたたみ傘
PR
■作曲依頼について
同人音楽サークル『Magicberry Fields』では、作曲のご依頼をお受けしております。
■作曲のご料金について
無料でのご依頼もお受けしております。
しかし、無料での作曲依頼は月一のペースで届くため、希望するすべての方に曲を提供することができません。
申し訳ありませんが「一緒になって作品を作ってくれる方」「ギブ・アンド・テイクの関係を築ける方」 を優先とさせてください。
具体的には、
- 動画制作
- イラスト
- ボーカル
- 作詞
などを提供していただける方を優先します。
動画も絵も歌も作詞も無理って方は、有料でのご依頼も大歓迎です。
料金例
- ボーカル曲（ピアノ伴奏のみ） \5000-
- ボーカル曲（ピアノ、ギター、ベース、ドラム伴奏） \7000-
- オーケストラのBGM \10000-
料金の詳細は個別にご相談ください。
■ご提供できる形式
完成した曲は、以下の形式でご提供可能です。
１．主メロディーとコードだけの簡単なMIDIファイル
（アレンジをされている方用です）
２．曲として完成したMIDIファイル
３．ＭＰ３ファイル
４．ＷＡＶファイル
５．ＣＤ－Ｒ（ＣＤプレイヤーで再生可能）
６．楽譜（pdf、jpg）
（浄書はしていないため、読みにくい場合があります）
１．主メロディーとコードだけの簡単なMIDIファイル
（アレンジをされている方用です）
２．曲として完成したMIDIファイル
３．ＭＰ３ファイル
４．ＷＡＶファイル
５．ＣＤ－Ｒ（ＣＤプレイヤーで再生可能）
６．楽譜（pdf、jpg）
（浄書はしていないため、読みにくい場合があります）
■曲が浮かばないこともあります...
創作というものの特性上、
どうしても曲がイメージできない、ということがあります。
また、自分の音楽知識の低さから、作れない曲が存在します。
（例えば、クラシックの曲とか）
曲が作れそうもない場合は、作曲をお断りする場合があります。
あらかじめご了承ください。
もちろん、こちらの作った曲がイメージに合わなかった場合は、
ご依頼をお断りしていただいて構いません。
どうしても曲がイメージできない、ということがあります。
また、自分の音楽知識の低さから、作れない曲が存在します。
（例えば、クラシックの曲とか）
曲が作れそうもない場合は、作曲をお断りする場合があります。
あらかじめご了承ください。
もちろん、こちらの作った曲がイメージに合わなかった場合は、
ご依頼をお断りしていただいて構いません。
■曲サンプル
■著作権について
無償依頼、および同人系のご依頼の場合、完成した曲の著作権はKiaが個人で自己管理します。
著作権の放棄・譲渡・買取り等はいたしておりません。
有償の場合は個別にご相談ください。
■連絡先
以下の項目をご記入の上、メールにてご連絡ください。タイトルは「作曲依頼」など、分かりやすいものでお願いします。
・お名前（ハンドルネーム可）
・運営しているサイト、twitter、ニコ動のアドレス（あれば）
・ご依頼内容
・作って欲しい曲のイメージ（例：ピアノの曲、静かな曲、激しい曲など）
・公開中の曲の中で気に入った曲（あれば）
・歌詞（あれば）
・ボーカルの人数、男声・女声、キーの範囲（いれば） ・楽器構成（いれば）
・好きなアーティスト(作詞家、作曲家、歌手等)（いれば）
・作曲の期限、締め切り
・ご予算（有償 または 無償、具体的な金額）
・ご協力していただけること（動画制作、イラスト、ボーカル、作詞など）
詳細はこちらをご確認ください。
http://magicberry.nobody.jp/profile/request.html
夏イベお疲れ様でした。
自分は、一航戦専用アイテムと思われるカタパルト狙いでしたが。
E-3まで甲、甲、甲。E-4からは丙、丙、乙、丙で何とか完走できました。
延長なかったら危なかったです。
トータルで燃料・弾薬100kほど消えたし（イベ中の遠征・任務で40k程度回復）、しばらくは遠征に専念します。
遠征のポイントをまとめると
１．全艦キラ付けする
全艦にキラ付けして遠征すると、大成功になることがあります。
遠征に大成功すると、もらえる資源が１．５倍になります。
体感的には4隻の任務で7割、5隻の任務で9割、6隻だとほぼ100%で大成功になります。
1-1キラ付け１回で遠征４～５回分になるので、キラ付けの消費資源は小さいです。
２．ドラム缶ガン積み
東京急行、北方鼠輸送作戦などの任務は、ドラム缶の数も大成功に関係しています。
4隻以上にキラ付けし、全員ドラム缶2積みすると、ほぼ100%で大成功になります。
３．大発の利用
大発動艇1つにつき、もらえる資源が+5%上昇します。
最大4つで、+20%上昇の上昇になります。（それ以上積んでも+20%のまま）
ですので、大発を積める水上機母艦や阿武隈改二は、遠征要員の最有力候補です。
４．コストの軽い艦娘を使う
・駆逐艦 睦月型
・軽巡 天龍龍田（未改造）
・軽空母 鳳翔（未改造）
を使うと、消費資源が少し抑えられます。
空母の任務は軽空母で代用できます。鳳翔さんがが圧倒的に低コストです。
千代田千歳は、未改造のほうが資源消費は小さいですが、キラ付けを考え、甲標的で確実に敵を倒せるちとちよ甲を使ってます。
潜水艦は燃料の消費は小さいものの、睦月型より弾薬の消費が大きくなるので、燃料しか使わない任務には向いてます。
まるゆは消費資材は少ない反面、キラ付けがやりにくく大成功が狙えないので実用向きではありません。
自分用プランはこんな感じ。
■前提
・朝７時起き、夜１０時帰宅
・水母に大発4積み
・ドラム缶ガン積み
・駆逐艦は睦月型、軽巡は未改造天龍田、水母はちとちよ甲で計算
・阿武隈は改二まで育ててない
・大成功狙いで全艦キラ付け（ドラム艦積む任務は４隻のみキラ付け）
・キラ付けの消費資源は無視
■朝７時
■夜１０時
■1日合計
2627/2218/1065/ 840
夜に出した艦隊の編成を変えずに、朝そのまま遠征出せるようにしました。
これなら、忙しい朝でもなんとかなります。
まあ、重度の提督だと、朝飯食いながらやるとか、歯磨きしながらキラ付けとかするそうですが。
ついでに、任務の『「遠征」を３回成功させよう！』（100/100/100/100）も達成します。
他の任務や軽い遠征もあわせて1日で3000/3000/1500/1000。
一週間で20000/20000/10000/7000いけば、まあ上々ってところでしょうか。
自分は、一航戦専用アイテムと思われるカタパルト狙いでしたが。
E-3まで甲、甲、甲。E-4からは丙、丙、乙、丙で何とか完走できました。
延長なかったら危なかったです。
トータルで燃料・弾薬100kほど消えたし（イベ中の遠征・任務で40k程度回復）、しばらくは遠征に専念します。
遠征のポイントをまとめると
１．全艦キラ付けする
全艦にキラ付けして遠征すると、大成功になることがあります。
遠征に大成功すると、もらえる資源が１．５倍になります。
体感的には4隻の任務で7割、5隻の任務で9割、6隻だとほぼ100%で大成功になります。
1-1キラ付け１回で遠征４～５回分になるので、キラ付けの消費資源は小さいです。
２．ドラム缶ガン積み
東京急行、北方鼠輸送作戦などの任務は、ドラム缶の数も大成功に関係しています。
4隻以上にキラ付けし、全員ドラム缶2積みすると、ほぼ100%で大成功になります。
３．大発の利用
大発動艇1つにつき、もらえる資源が+5%上昇します。
最大4つで、+20%上昇の上昇になります。（それ以上積んでも+20%のまま）
ですので、大発を積める水上機母艦や阿武隈改二は、遠征要員の最有力候補です。
４．コストの軽い艦娘を使う
・駆逐艦 睦月型
・軽巡 天龍龍田（未改造）
・軽空母 鳳翔（未改造）
を使うと、消費資源が少し抑えられます。
空母の任務は軽空母で代用できます。鳳翔さんがが圧倒的に低コストです。
千代田千歳は、未改造のほうが資源消費は小さいですが、キラ付けを考え、甲標的で確実に敵を倒せるちとちよ甲を使ってます。
潜水艦は燃料の消費は小さいものの、睦月型より弾薬の消費が大きくなるので、燃料しか使わない任務には向いてます。
まるゆは消費資材は少ない反面、キラ付けがやりにくく大成功が狙えないので実用向きではありません。
自分用プランはこんな感じ。
■前提
・朝７時起き、夜１０時帰宅
・水母に大発4積み
・ドラム缶ガン積み
・駆逐艦は睦月型、軽巡は未改造天龍田、水母はちとちよ甲で計算
・阿武隈は改二まで育ててない
・大成功狙いで全艦キラ付け（ドラム艦積む任務は４隻のみキラ付け）
・キラ付けの消費資源は無視
■朝７時
| 燃料 | 弾薬 | 鋼材 | ボーキ | 時間 | 遠征名 | 条件 |
| +412 | +351 | 2:20 | 21.北方鼠輸送作戦 | 旗Lv15/計Lv30/軽1駆4/ドラム缶3 | ||
| +752 | -124 | +360 | +360 | 9:00 | 36.水上機基地建設 | 旗Lv30/水母2/軽1/駆1/他2 ※大発4 |
| +703 | +712 | +300 | +300 | 15:00 | 16.決戦援護作戦 | 旗Lv11/軽1/駆2/他3 |
■夜１０時
| 燃料 | 弾薬 | 鋼材 | ボーキ | 時間 | 遠征名 | 条件 |
| +412 | +351 | 2:20 | 21.北方鼠輸送作戦 | 旗Lv15/計Lv30/軽1駆4/ドラム缶3 | ||
| +428 | +434 | +180 | 6:50 | 40.水上機前線輸送 | 旗Lv25/計Lv150/軽旗/水母2/駆2/他1 ※大発4 |
|
| -80 | +494 | +405 | 2:45 | 37.東京急行 | 旗Lv50/計Lv200/軽1/駆5/ドラム缶4 |
■1日合計
2627/2218/1065/ 840
夜に出した艦隊の編成を変えずに、朝そのまま遠征出せるようにしました。
これなら、忙しい朝でもなんとかなります。
まあ、重度の提督だと、朝飯食いながらやるとか、歯磨きしながらキラ付けとかするそうですが。
ついでに、任務の『「遠征」を３回成功させよう！』（100/100/100/100）も達成します。
他の任務や軽い遠征もあわせて1日で3000/3000/1500/1000。
一週間で20000/20000/10000/7000いけば、まあ上々ってところでしょうか。
アリアンロッド2Eのキャンペーンで使ってるキャラクターです。
スキルガイド1対応。（スキルガイド2まだ買ってない）
《ファミリアコンビネーション》を主軸にしてみました。
貫通ダメージでの《ファミリアアタック》２連撃、しかもシーンは結構えげつないです。
あっ、２連撃できるかは、必ずＧＭに確認を取りましょう。
身内のハウスルールでは「できない」ことになってます。
でも、このレベル帯になってくるとどうしても火力不足に陥ります。
なので、《シーリィ》や《ビジテイション》＆《ラース》による味方の火力アップがメインの役割にシフトしていきます。
《ファミリアコンビネーション》だけでもＭＰバカ 食いするのに、おまけにケセドの杖まで使ったら、あっという間にＭＰが枯渇しました。
《シーリィ》か《ビジテイション》＆《ラース》どちらかあれば十分です。
個人的には《シーリィ》推奨。
このレベル帯だと、クリティカル出やすいし。
スキル枠３つで済みますし。
あと、クリティカルを出すモチベーションが生まれるので、ゲーム的にも楽しくなります。
空いたスキル枠で、ドルイドあたりを経由し《感知》関連のスキルを取ればよいかと。
《ブレッシング》は超強いです。
考えてみたら、フェイト１点分の上乗せがラウンド中続くわけですからね。
戦闘だけでなく、アドベンチャーパートでも支援として活躍します。
メジャーアクションを使うのと、《グローリー》で距離拡大しないと使いにくくその分スキル枠を食いますが、それだけの価値はあります。
《セイントブレッシング》まで行けば、セットアップで使えますし。
身内のハウスルールで連撃禁止となっとるので、《ファミリアコンビネーション》から《ブレッシング》が使うことが多いです。
なので《ファストドロウ》《エフェクトエクステンド》で効果拡大を狙ってます。
実際に宣言すると
「ムーブでファストドロウ、マイナーでアニマルパクト、メジャーでファミリアコンビネーションからブレッシング＋グローリー＋エフェクトエクステンドで○○○○と××××を支援して、ファミリアアタックでシーン攻撃します」
スタバの注文かよ。
シルア・レスティアーナ
Lv16
メインクラス：プリースト
サポートクラス：サモナー
称号クラス：プロフェッサー
種族：ヒューリン
■ライフパス■
出自：王侯貴族/ヒストリーを取得
境遇：紛失/領地を没収された
目的：命令/王子と結婚することを命令されている
■能力値■
HP：133
MP：169
フェイト：６
筋力 ２５／８
器用 １２／５
敏捷 １６／５
知力 １２／７
感知 ３１／１１
精神 ２２／１１
幸運 ９／５
回避判定 5
物理防御 23
魔法防御 20
行動値 16
移動力 9 m
■装備■
ケセドの杖 魔術の効果に+10
知恵の宝冠 【知力】【感知】【精神】＋１
セレスチャルアーマー
セレスチャルポイントアーマー
輪唱の耳飾り 魔術1つの効果に+1D
■所持品■
手提げバッグ
ベルトポーチ
異次元バッグ
ポーションホルダー
ウェポンケース
冒険者セット
EXMPポーション×２
ハイMPポーション×１０
祝福の花
毒消し
万能薬
耐毒符
ハイHPポーション×2
古代竜の牙 《クウェリィ》＋１回
使い魔×2 感知判定+2、精神判定+2
■スキル■
１ プロビデンス フェイト+1
５ プロテクション ダメージ－５D
１ アフェクション ダメージ０に
１ ブレッシング ラウンド中、すべての判定に+1D
１ グローリー 《ブレッシング》を20mに
１ ヒール 3D+CL×3回復
１ クイックヒール イニシアチブで《ヒール》を使用
１ ファミリアコンビネーション 《ファミリアアタック》＋メジャーアクション
５ ファミリアアタック (2+SL)D+CLの貫通ダメージ
１ ファミリアマスタリー 《ファミリアアタック》命中+1D
５ ファミリアレンド 《ファミリアアタック》ダメージ+SL×3
１ アニマルパクト サモナースキルをシーンに変更
３ マジックサークル ダメージや回復に+(SL)D
２ ファミリア 使い魔取得(感知判定＋２、精神判定＋２)
１ ファミリアサポート 《ファミリアアタック》命中＋1D
【封印】１ クウェリィ シナリオ１/GMに質問
１ セイントブレッシング セットアップに《ブレッシング》を使用
５ ハイプロテクション 《プロテクション》+[5+SL×3]
３ シーリィ クリティカル時、ダメージ+SL×10
１ ディバインフォース シナリオ1 /ダメージ+CL×5
５ ビジテイション 妖魔、魔獣、魔族にダメージ+SL×5
１ ラース 《ビシテイション》の分類無視、ダメージ+SL×2
１ バリア メインフロセスに複数回《プロテクション》
１ ファストドロウ シーン１、魔術の対象を２体に
１ エフェクトエクステンド 《ブレッシング》をシーン永続
■一般スキル
１ フェーストエイド 戦闘不能を回復
１ ヒストリー 歴史知識の知力判定+1D
１ ファインドトラップ トラップ探知+1D
１ トレーニング：筋力
１ トレーニング：器用
１ トレーニング：敏捷
１ トレーニング：知力
１ トレーニング：感知
１ トレーニング：精神
１ アイテムマスタリー ケセドの消費MP-2
１ ホーリーオーダーⅠ （意味なし）
１ ホーリーオーダーⅡ （意味なし）
１ ホーリーオーダーⅢ フェイト1使用、《プロテクション》を範囲に
１ フックダウン クリンナップにポーション使用
１ フェイス：アーケンラーヴ 命中+1
１ インテンション 最大ＭＰ+CL
★ ゲッシュ：女王への誓い 《ファストドロウ》取得
■使用成長点■
1320点 (Lv16 :1200+一般スキル70+ゲッシュ50)
スキルガイド1対応。（スキルガイド2まだ買ってない）
《ファミリアコンビネーション》を主軸にしてみました。
貫通ダメージでの《ファミリアアタック》２連撃、しかもシーンは結構えげつないです。
あっ、２連撃できるかは、必ずＧＭに確認を取りましょう。
身内のハウスルールでは「できない」ことになってます。
でも、このレベル帯になってくるとどうしても火力不足に陥ります。
なので、《シーリィ》や《ビジテイション》＆《ラース》による味方の火力アップがメインの役割にシフトしていきます。
《ファミリアコンビネーション》だけでもＭＰバカ 食いするのに、おまけにケセドの杖まで使ったら、あっという間にＭＰが枯渇しました。
《シーリィ》か《ビジテイション》＆《ラース》どちらかあれば十分です。
個人的には《シーリィ》推奨。
このレベル帯だと、クリティカル出やすいし。
スキル枠３つで済みますし。
あと、クリティカルを出すモチベーションが生まれるので、ゲーム的にも楽しくなります。
空いたスキル枠で、ドルイドあたりを経由し《感知》関連のスキルを取ればよいかと。
《ブレッシング》は超強いです。
考えてみたら、フェイト１点分の上乗せがラウンド中続くわけですからね。
戦闘だけでなく、アドベンチャーパートでも支援として活躍します。
メジャーアクションを使うのと、《グローリー》で距離拡大しないと使いにくくその分スキル枠を食いますが、それだけの価値はあります。
《セイントブレッシング》まで行けば、セットアップで使えますし。
身内のハウスルールで連撃禁止となっとるので、《ファミリアコンビネーション》から《ブレッシング》が使うことが多いです。
なので《ファストドロウ》《エフェクトエクステンド》で効果拡大を狙ってます。
実際に宣言すると
「ムーブでファストドロウ、マイナーでアニマルパクト、メジャーでファミリアコンビネーションからブレッシング＋グローリー＋エフェクトエクステンドで○○○○と××××を支援して、ファミリアアタックでシーン攻撃します」
スタバの注文かよ。
シルア・レスティアーナ
Lv16
メインクラス：プリースト
サポートクラス：サモナー
称号クラス：プロフェッサー
種族：ヒューリン
■ライフパス■
出自：王侯貴族/ヒストリーを取得
境遇：紛失/領地を没収された
目的：命令/王子と結婚することを命令されている
■能力値■
HP：133
MP：169
フェイト：６
筋力 ２５／８
器用 １２／５
敏捷 １６／５
知力 １２／７
感知 ３１／１１
精神 ２２／１１
幸運 ９／５
回避判定 5
物理防御 23
魔法防御 20
行動値 16
移動力 9 m
■装備■
ケセドの杖 魔術の効果に+10
知恵の宝冠 【知力】【感知】【精神】＋１
セレスチャルアーマー
セレスチャルポイントアーマー
輪唱の耳飾り 魔術1つの効果に+1D
■所持品■
手提げバッグ
ベルトポーチ
異次元バッグ
ポーションホルダー
ウェポンケース
冒険者セット
EXMPポーション×２
ハイMPポーション×１０
祝福の花
毒消し
万能薬
耐毒符
ハイHPポーション×2
古代竜の牙 《クウェリィ》＋１回
使い魔×2 感知判定+2、精神判定+2
■スキル■
１ プロビデンス フェイト+1
５ プロテクション ダメージ－５D
１ アフェクション ダメージ０に
１ ブレッシング ラウンド中、すべての判定に+1D
１ グローリー 《ブレッシング》を20mに
１ ヒール 3D+CL×3回復
１ クイックヒール イニシアチブで《ヒール》を使用
１ ファミリアコンビネーション 《ファミリアアタック》＋メジャーアクション
５ ファミリアアタック (2+SL)D+CLの貫通ダメージ
１ ファミリアマスタリー 《ファミリアアタック》命中+1D
５ ファミリアレンド 《ファミリアアタック》ダメージ+SL×3
１ アニマルパクト サモナースキルをシーンに変更
３ マジックサークル ダメージや回復に+(SL)D
２ ファミリア 使い魔取得(感知判定＋２、精神判定＋２)
１ ファミリアサポート 《ファミリアアタック》命中＋1D
【封印】１ クウェリィ シナリオ１/GMに質問
１ セイントブレッシング セットアップに《ブレッシング》を使用
５ ハイプロテクション 《プロテクション》+[5+SL×3]
３ シーリィ クリティカル時、ダメージ+SL×10
１ ディバインフォース シナリオ1 /ダメージ+CL×5
５ ビジテイション 妖魔、魔獣、魔族にダメージ+SL×5
１ ラース 《ビシテイション》の分類無視、ダメージ+SL×2
１ バリア メインフロセスに複数回《プロテクション》
１ ファストドロウ シーン１、魔術の対象を２体に
１ エフェクトエクステンド 《ブレッシング》をシーン永続
■一般スキル
１ フェーストエイド 戦闘不能を回復
１ ヒストリー 歴史知識の知力判定+1D
１ ファインドトラップ トラップ探知+1D
１ トレーニング：筋力
１ トレーニング：器用
１ トレーニング：敏捷
１ トレーニング：知力
１ トレーニング：感知
１ トレーニング：精神
１ アイテムマスタリー ケセドの消費MP-2
１ ホーリーオーダーⅠ （意味なし）
１ ホーリーオーダーⅡ （意味なし）
１ ホーリーオーダーⅢ フェイト1使用、《プロテクション》を範囲に
１ フックダウン クリンナップにポーション使用
１ フェイス：アーケンラーヴ 命中+1
１ インテンション 最大ＭＰ+CL
★ ゲッシュ：女王への誓い 《ファストドロウ》取得
■使用成長点■
1320点 (Lv16 :1200+一般スキル70+ゲッシュ50)
ホームページをスマホ対応させました。
http://magicberry.nobody.jp/
考えなければいけないのは、
・画面サイズ
・ＰＣサイトとの関係
でしょうか。
１．画面サイズ
ウチのページ＆ブログの４ヶ月間の解析結果を見ると。
と、見事にバラバラですが、横幅は、320pxを最低値と考えれば問題なさそうです。
これより大きい場合も考慮して、サイズを固定せず
width:100%;
のように指定することにします。
２．ＰＣサイトとの関係
一昔前はＰＣサイトとケータイサイトを別にするのが主流でしたが。
はっきりいって、両方修正するの面倒くさい。
なので、ＰＣサイトとケータイサイトを、共通のひとつのコードで表示できるようにします。
いろいろ模索した結果、単純に幅が一定値以下だったら、動的にレイアウトが変わるようにしました。
ここで使えるのが@media。
ブラウザのサイズなどの条件で、場合分けして書くことができます。
後は、displayでレイアウトを変えたり、表示・非表示を切り替えたらうまくいきました。
cssのコードはこんな感じ。
/* スマホ・PC共通の記述 */
div.main
{
width:100%;
}
div.menu
{
display: block; /* ブロック表示でメニューを上に表示 */
width:100%; /* 横幅めいっぱい表示 */
}
/* 右列 */
div.right
{
display: none; /* 非表示 */
}
/* PC用ページ */
@media all and (min-width: 960px) {
/* 横幅が960px以上だったら */
div.main
{
width:950;
}
div.menu
{
display:inline-block; /* インラインブロックでメニューを左に表示 */
width:130px;
}
/* 右列 */
div.right
{
display:inline-block; /* インラインブロックで表示 */
}
}
メリットは、PC上で動作確認ができること。
ブラウザの横幅小さくするだけで、スマホ向けの表示に切り替わります。
デメリットは古いブラウザが対応してないこと。
未確認ですが、おそらく、古いブラウザだと@media内の記述が無視されて、ＰＣでもスマホ向けのサイトだけが表示されるかと。
http://magicberry.nobody.jp/
考えなければいけないのは、
・画面サイズ
・ＰＣサイトとの関係
でしょうか。
１．画面サイズ
ウチのページ＆ブログの４ヶ月間の解析結果を見ると。
| 320×568px | iPhone5 | 56回 |
| 375×667px | iPhone6 | 29回 |
| 360×592px | android系 | 18回 |
| 320×480px | iPhone4など | 11回 |
| 360×640px | android系 | 11回 |
| 414×736px | iPhone6Plus | 2回 |
と、見事にバラバラですが、横幅は、320pxを最低値と考えれば問題なさそうです。
これより大きい場合も考慮して、サイズを固定せず
width:100%;
のように指定することにします。
２．ＰＣサイトとの関係
一昔前はＰＣサイトとケータイサイトを別にするのが主流でしたが。
はっきりいって、両方修正するの面倒くさい。
なので、ＰＣサイトとケータイサイトを、共通のひとつのコードで表示できるようにします。
いろいろ模索した結果、単純に幅が一定値以下だったら、動的にレイアウトが変わるようにしました。
ここで使えるのが@media。
ブラウザのサイズなどの条件で、場合分けして書くことができます。
後は、displayでレイアウトを変えたり、表示・非表示を切り替えたらうまくいきました。
cssのコードはこんな感じ。
/* スマホ・PC共通の記述 */
div.main
{
width:100%;
}
div.menu
{
display: block; /* ブロック表示でメニューを上に表示 */
width:100%; /* 横幅めいっぱい表示 */
}
/* 右列 */
div.right
{
display: none; /* 非表示 */
}
/* PC用ページ */
@media all and (min-width: 960px) {
/* 横幅が960px以上だったら */
div.main
{
width:950;
}
div.menu
{
display:inline-block; /* インラインブロックでメニューを左に表示 */
width:130px;
}
/* 右列 */
div.right
{
display:inline-block; /* インラインブロックで表示 */
}
}
メリットは、PC上で動作確認ができること。
ブラウザの横幅小さくするだけで、スマホ向けの表示に切り替わります。
デメリットは古いブラウザが対応してないこと。
未確認ですが、おそらく、古いブラウザだと@media内の記述が無視されて、ＰＣでもスマホ向けのサイトだけが表示されるかと。