スマホ版校舎ページ更新マニュアル

スマホ版校舎ページ更新マニュアル
2015/11/9
広報部鈴木
Copyright © Nagase Brothers Inc.
1
目次
1.
2.
3.
4.
5.
施策概要
スマホサイト用編集ページの使用ルール
スマホ向けサイトの編集の流れ
編集時に注意すべきこと
更新時チェックシート
Copyright © Nagase Brothers Inc.
2
1.施策概要(1/2)
PCからのアクセスは年々減少し、スマートフォンからのアクセス
は年々増加しているというのが、現代のウェブサイト全てに共
通する傾向となっています。
そのため、これからはスマホユーザーを第一に考えたサイト運
営をしていかなければなりません。
そこで今回、管理ページに「スマホサイト用編集ページ」を作成
いたしました。これにより、一部のコンテンツはPCとスマホで
別々の内容を表示し、それぞれに適した見た目で編集を行える
ようになりました。
Copyright © Nagase Brothers Inc.
3
1.施策概要(2/2)
以下の11項目が、新たに管理ページの項目に追加されました。更新
をよろしくお願いいたします。（SP＝SmartPhone）
・ベビークラス料金説明(SP)
・幼児クラス料金説明(SP)
・ジュニアクラス料金説明(SP) ・大人クラス料金説明(SP)
・特習クラス料金説明(SP)
・その他クラス料金説明(SP)
・バスアクセス説明(SP)
・フィットネス料金説明(SP)
・フィットネス説明(SP)[新規追加]
・体操教室料金説明(SP)
・カレンダー(SP)
上記項目の内容は、スマホにのみ表示されます。
また、「お知らせ、ブログ」と「選手の活動日記」の２項目は、編集画面
をスマホ向けのものに変更いたしました。
Copyright © Nagase Brothers Inc.
4
2.スマホサイト用編集ページについて(1/4)
左がスマホサイト用の編集
画面となります。
横幅がスマホの標準サイ
ズ（iPhone5s）となっており、
スマホ向けのページを編集
しやすくなっています。
次のページから3点ほど注
意点を掲載します。
Copyright © Nagase Brothers Inc.
5
2.スマホサイト用編集ページについて(2/4)
１）編集画面のサイズは変更
しない
右隅のボタンを押すと編集画
面が崩れる場合がございま
すので、スマホ向けページを
編集する場合は、編集画面
のサイズを変更しないように
してください。
Copyright © Nagase Brothers Inc.
6
2.スマホサイト用編集ページについて(3/4)
２）画像は、右図のように編
集画面からはみ出していて
も、実機では横幅いっぱい
に収まるように調整がなされ
ます。
ただし、画像の横にテキスト
を置くようなレイアウトは、表
示崩れの原因となるので避
けてください。
Copyright © Nagase Brothers Inc.
7
2.スマホサイト用編集ページについて(4/4)
３）表を用いたレイアウトは画面幅に
収まるように調整されます。
ただし、列が2列、3列と多くなるたび
に表示が崩れやすくなるので、その
点を考慮して編集を行ってください。
また、「表の挿入・編集」から、表の
幅の指定を行うと表示崩れの原因と
なります。
Copyright © Nagase Brothers Inc.
8
3.スマホ向けサイトの編集の流れ
1)PC用の編集画面から内容をコピー
2)スマホ用の編集画面に張り付け
3)スマホで見やすいレイアウト・装飾へ変更
上記の手順で編集を行ってください。
Copyright © Nagase Brothers Inc.
9
4.編集時に注意すべきこと
※起こりがちなミスを発見し次第、こちらの項目に対策を随時追加していき
ます。
1)画像の文字が小さすぎてスマホからは読みづらい場合
→リンクを設定し、大きな画像またはpdfに遷移させてください。
２）文字位置の調整のためにスペースを多用しない
→思わぬ表示崩れの原因となります。
Copyright © Nagase Brothers Inc.
10
5.チェックシート
（注意）スマホサイトを更新した際は、必ずスマートフォンの実機で更新した
サイトを見ながら、こちらのチェックシートをご確認ください
□
□
□
□
□
□
画像に書かれた文字が小さすぎて読みにくくないか
文字のサイズが小さすぎる、また不自然に大きい部分はないか
表や画像が画面幅を超えていないか
余計な空白がないか
テキストを中央寄せしていることで見づらくなっていないか
実際にサイトを見て読みづらいところがないか
Copyright © Nagase Brothers Inc.
11

Download Report