Web Shakehands
Web Shakehands

Language


ストーリー4/スマートフォンサイトを作る時の3つのポイント!!



  • --a
    サー!!!!
    a--
    --b
    なんだ?
    a--
    --a
    サー!!!!
    a--
    --c
    あっ、あぶない。。。なんか飛んできたぞ。。。
    a--
    --a
    ブル!!!!
    a--
    --c
    ブル??
    a--
    --c
    なんだ、ダーツか。
    ダーツ??。。。姫咲さん、なんで会社の中でダーツやってんの?
    a--
    --a
    なんでって、ストレス解消よ。
    最近は自由な会社が増えているのよ。
    遊びながら、働くってやつ。
    a--
    --c
    だからって。。。
    怪我人が出るだろ。。。
    a--
    --a
    サー!!!!
    a--
    --c
    その掛け声、違うスポーツだから。。。
    a--

    「ガヤガヤ」「ガヤガヤ」

    おっ、すごいぞ!
    姫咲さん、ブル3連続!

    --b
    おっ、なんだか、みんな集まってきたぞ。
    a--
    --a
    サー!!!!
    a--

    おうーーー、またブルだ!

    「すっごーい、姫咲さんってスポーツ出来るのね。」

    --b
    姫咲さん、なんか注目されてるぞ。
    a--
    --a
    サー!!!!
    a--

    おう~~まただ!!!

    すごいわね、姫咲さん。

    そうね。

    違うわよ、合コンよ。

    151連敗中だってよ。。。

    えぇ、151連敗。。。

    次、誘っていいのかしらね。。。

    --a
    全部、聞こえてるわよ!!!!
    a--

    そろそろ、仕事に戻らないと。。。

    --c
    引きも早かったな。。。
    a--
    --a
    隼人!!
    a--
    --b
    はい!!
    a--
    --a
    これダーツ、捨てといてね。
    a--
    --c
    お安いご用で。。。
    a--
    --a
    まったく、ここの社員どもは!!
    a--
    --c
    いや、誰も何も悪くないような。。。
    a--
    --a
    この前も、ここの男性社員ときたら。
    a--
    --b
    男性社員?
    a--
    --a
    そうよ!
    ホワイトデーのお返しもらったのよ。
    a--
    --b
    良かったじゃないか!
    a--
    --a
    全員でこの板チョコ一枚よ!!
    しかも、ファミマのステッカー付きよ!
    a--
    --c
    全員って。。。
    a--
    --a
    男性社員350人全員に、手作りのチョコを一人一人に渡したのよ。
    なんで、これ一枚なのよ!!!!
    a--
    --c
    そういえば、姫咲さん入社する前に会社によく顔出してたな。
    あれはチョコあげてたのか。。。
    a--
    --a
    それに今6月よ、6月!!!
    3か月押しよ!!!
    a--
    --c
    3か月押しというか、忘れてたという言い方も。。。
    a--
    --c
    うん??でも、俺もらってないぞ。。。
    a--
    --a
    あ、あんたはいいのよ。。。
    a--
    --c
    俺だけ忘れたか?。。。
    a--
    --a
    それより、お父様からの仕事早く終わらせないと。
    a--
    --b
    社長からの仕事なんてすごいじゃないかぁ!!
    a--
    --a
    この手書きの原稿をタイプするだけなんだけどね。
    お父様ったら、タイプできないんですもの。
    オホホホ。
    a--
    --c
    親子で似てるな。。。
    a--
    --a
    でも、もう出来上がりよ!!!!
    a--
    --b
    早っ、なんでスマホでそんなにタイプが早い!!!
    a--
    --a
    10ページ目!!
    現在20分経過!!!!
    a--
    --b
    何??1枚、2分??!!
    a--
    --a
    はい、終わり!!!!!
    a--
    --b
    す、すごい。。。。
    a--
    --a
    ところで、この便利なスマホだけど、ホームページって当然、PCで見ているのと見栄えが違うのよねぇ。
    a--
    --b
    いい質問ですね!!
    a--
    --a
    ・・・・
    a--
    --b
    (ほら、早く、突っ込んで、池上さんかよ!って)
    a--
    --a
    ・・・・
    a--
    --b
    (分かってたよ。そうなるって。)
    スマホでホームぺージを見ることを考慮して、作り手側はユーザーに見やすくて、使いやすいページを提供しないといけないんだ。
    a--
    --a
    こんなん出来ました!!
    a--



    --c
    あっ、、、文字が大きくていいんじゃない。。。
    ただ。。。ただ。。。だ、ださ。。。
    a--
    --a
    だ、ださ???!!!
    a--
    --c
    だ、、ださないの?
    ネット上に。。。
    a--
    --a
    もう出てるわよ!
    社内メールで回すから。
    a--
    --c
    で、でてるんだ。。これが。。。
    a--
    --b
    でも、文字が大きいっていうのは、スマホでサイトを作る時のポイントだね。
    PCの小さい文字だと読みづらいからね。
    a--
    --a
    そうね、わざわざ拡大するのはめんどうくさいし。
    a--
    --b
    あとボタンを大きく作るのもポイントだ。
    スマホの場合にはタップする必要があるから、PCのマウスでクリックするよりも大きくしないと押しづらいんだよ。
    a--
    --a
    今ボタン付けたわ!
    a--



    --c
    それは大きすぎ!!!
    a--
    --b
    しかも、ハートの下にハートって、、セ、センスが。。。
    a--
    --a
    センスが??!!
    a--
    --c
    い、いえ、せんせい。。。個性的でいらっしゃる。
    a--
    --b
    もう一つポイントになるのは、文字の長さだね。
    a--
    --a
    長い文章って、スマホだとなんか文字ばっかりで読む気がなくなるわ。。。
    a--
    --b
    そうだね。
    こういった場合、スマホでは「アコーディオンメニュー」と言われるJavascriptでボタンにしてしまうといいよ。
    a--
    --b
    こういう感じでクリックすると伸びてきて、文章が表示されるようになるんだ。
    a--





    --a
    出来たわ!
    a--



    --c
    どんだけ、ハートだらけなんだ!!
    a--
    --b
    スマホサイトはユーザーが使いやすいサイトかどうか、Googleが評価しているんだ。
    a--
    --b
    この「モバイルフレンドリーテスト」にスマホのURLを入れるとチェックしてくれるんだよ!
    a--

    Mobile Friendly Test



    --a
    あら、フレンドリーじゃないみたい。。。
    a--



    --c
    まあ、そうだろうね。。。
    a--
    b--
    --d
    スマホサイトにはユーザーの使いやすさを考慮した3つのポイントがあるよ。

    1.文字のサイズが読みやすいこと

    2.ボタンが大きくタップしやすいこと

    3.アコーディオンメニューで文字を隠しておくこと

    文字が小さいとよみづらいし、拡大するのは面倒だから、読みやすい大きさにすることが必要なんだ。

    ボタンも小さいとマウスとは違ってスマホはタップするから、指で押しやすいサイズにするこが大切だ。

    文章が長くて多いと、ユーザーは読む気をなくしてしまうから、スマホの時にはアコーディオンメニューと呼ばれるクリックした時だけ縦に文章が伸びて表示されるボタンを設置するといいね。

    スマートフォンサイトはGoogleの「モバイルフレンドリーテスト」でユーザーに使い勝手のいいサイトかチェックできるよ。
    a--
    --f
    お父様に私が作ったスマホサイトを見てもらうわ!
    a--
    --e
    や、やめといた方が。。。。
    a--
  • 【 登場人物 】

    姫咲 みのり

    姫咲 みのり
    (ひめさき みのり)

    このストーリーの舞台となっているIT企業の社長の娘。 コンピューターに関しての知識はゼロ。キーボードのタイプが出来ない。でも、スマホ打ちは異常に早い。
    口癖は「ちゃんと教えないと、お父様に言って北海道に転勤にして差し上げますわ!」


    姫咲 みのり

    羽柴 隼人
    (はしば はやと)

    姫咲みのりの指導を頼まれたアンラッキーなベテラン社員。教え方に問題はない。仕事もしっかりしている。なのに、北海道に飛ばされそうになっている。





このエントリーをはてなブックマークに追加

今回の記事タイトル

ストーリー4/スマートフォンサイトを作る時の3つのポイント!!

前の記事 ストーリー3/ジョン・タイターとホームページを作るための様々なプログラミング


姫咲みのり ストーリー !

2017-08-31 ストーリー7/Google検索エンジンで店舗を検索する NEW!


2017-07-17 ストーリー6/HTMLコードを送ってくれ!!


2017-06-28 ストーリー5/ウェブサイトを作るためのさまざまな種類のレイアウト


2017-06-21 ストーリー4/スマートフォンサイトを作る時の3つのポイント!!


2017-06-18 ストーリー3/ジョン・タイターとホームページを作るための様々なプログラミング


2017-06-12 ストーリー2/色々なネット広告を使おう!!


2017-06-08 ストーリー1/WindowsとMacの表示の違い



E-mail を入力するだけで、あなたのHPを作るための
ノウハウメールマガジンを無料でお届けします
E-mail:
  

上部へ