DebTab

  • ホーム
  • DevTabとは
  • 記事一覧
    • きたえる
    • かえる
    • つくる
    • みちびく
    • たばねる
    • つたえる
かんたんログイン
Githubでログイン
Githubアカウントでかんたんにログインして、DevTabをもっと便利に使おう。

DebTab成長しつづけるデベロッパーのための情報タブロイド

DebTab

ログイン

検索 検索

つたえるために意味を考え、名前をつける

写真佐々木 将之

つたえる

2016.04.25

ポイントポイント

0

言葉に気持ちをのせる
Photo via VisualHunt

ギルドワークスの佐々木です。

最近、ランディングページをRuby on Railsに組み込む仕事をよく行います。HTML/CSSで組んだマークアップを、haml( http://haml.info/ )やerbといった別の形式に変換して取り込みます。非常に簡単な作業なのですが、奥が深いところがあります。

奥が深いと言っても、組み込む際の形式変換作業自体は、変換ツール( https://github.com/haml/html2haml )もあるため、それほど手数はかかりません。 実際に大変なのは、一度ビジュアルができあがってからの「修正」にあるように思っています。では、なぜ修正に手数がかかってしまうのか、少し考えてみます。

なぜ修正が大変になってしまうのか

ダミーテキストを入れてしまう

Lorem


Photo credit: bburky via Visualhunt.com / CC BY


まず、「ダミーテキスト」をつけることが原因の一つだと考えています。

「ここにタイトルが入ります」「これはダミーテキストですこれはダミーテキストですこれはダミーテキストです」といったものを目にしたことはありませんか。実際に、Googleで「これはダミーテキストです」と検索すると、多数ヒットします。 英語圏でも「Lorem ipsum」といった言葉で、ダミーテキストの文化がありますね。

こういったダミーテキストは、とりあえず文字列を書いておき、レイアウトやカラーリングを先に決めてしまうために存在していると考えられます。でも、考えてみると変ではないでしょうか。webページは、つたえたいことがあって制作しているのに、つたえるために一番有効である「言葉」がまだ決まっていないのです。

もちろん、顧客や他のメンバーの都合で、ライティングが進まないなどもあるかもしれません。しかし、先にダミーテキストを使っていくら綺麗なレイアウト・カラーリングを仕上げても、後からあがってきた言葉を当てはめてみて「何か違う…」となってしまいがちです。それは、つたえる内容を込める言葉が決まっていないので、当然の結果で、修正の工数がかさみがちになります。 むしろ、デザイナーだからこそ提案できるライティングもあるように思います。

HTMLで安易なクラス名をつけてしまう

Stairs


Photo via VisualHunt.com


HTML/CSSを実装する中で、img01、section01といった名前に意味のないクラスをつけてしまうことがあります。

しかし、実際に出来上がったビジュアルを見ながら要素や順番を改善していく中で、03が欠番になったり、05と02が逆転したり…といったことがよく起こります。結果、出来上がったHTML/CSSのソース内で奇妙な順番付けになってしまうケースが多くあります。

すべてのセクションや画像には、つたえる内容にふさわしい名前があるはずです。もちろん、それが最初から分からないことは多々あると思います。しかし、実装したものを見せてフィードバックを得る中で変更していくことは、よりよくつたえるために必要な正しいもの探しになると私は考えます。


フィードバックを受けてよりよくしていくために

上記のようなことを踏まえて、ダミーテキストを書いたり、安易な連番クラス名をつけたりせず、つたえるべきことに沿った名前をつける。それが、結果的に修正コストを小さく保てると考えます。 修正のコストが小さければ、フィードバックを受け取って、細かく改善でき、よりよくつたえることができるのではないでしょうか。

共感した

ポイントポイント

0

取り消す

この記事に共感したら、何度でも押してこの記事のポイントをみんなでアップしよう。

自分の感想を残す

この感想は、サイトに公開されることはなく自分にしか見えません。自分の考えのログを残すために感じたことを登録し、のこしておきましょう。あとで振り返ったときに、あのとき自分はこう考えていたのかということを知ることにより、あなたの成長へとつながります。

Githubでログイン

Githubアカウントでかんたんにログインして、DevTabをもっと便利に使おう。

  • ひとつ前の記事

    関西ITベンチャーの憂鬱と魅力

  • ひとつ後の記事

    ゴールデンウィークに、自分を鍛える一冊を読もう

この記事もどうですか?

価値探索とUXデザイン・その3:ユーザーの体験の流れを理解する

この記事は、 ギルドワークス アドベントカレンダーの8日目の記事です。 はじめに 前回の記事(インタ…

つたえる

2017.12.08

ポイント
0

「つたえる」力を伸ばすための知識をインプットしよう

ギルドワークスの佐々木です。 大型連休の方も多いのではないでしょうか。 普段慌ただしく仕事をしている…

つたえる

2016.05.02

ポイント
0

共有・表明・ふりかえりで広げる巻き込みの輪

これはギルドワークス Advent Calendar 16日目の記事となります。 私は、よいプロダク…

かえる

つたえる

2018.12.16

ポイント
0

シェア
  • Twitter
  • このエントリーをはてなブックマークに追加
  • Google Plus

ログインして
ブックマーク

  • Twitter
  • このエントリーをはてなブックマークに追加
  • Google Plus
  • ログイン
LINE@

新しい記事が出たときや、注目の記事などを
定期的にLINEでお知らせしていきます

LINEで登録

LINEイメージ

DevTab
成長しつづけるデベロッパーのための情報タブロイド

株式会社ギルドワークス
https://guildworks.jp
  • プライバシーポリシー
  • お問い合わせ

Copyright © GuildWorks Inc. All Rights Reserved.

ページのトップへ