質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

6回答

15727閲覧

半角スペースや全角スペースが必要なとき、spanで囲んでcssで隙間を開けないといけないのでしょうが、現実どこまでcssでやっていますか?

退会済みユーザー

退会済みユーザー

総合スコア0

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

1クリップ

投稿2016/07/01 07:58

編集2016/07/01 08:24

半角スペースや全角スペースが必要なとき、spanで囲んでcssで隙間を開けないといけないのでしょうが、現実どこまでcssでやっていますか?

特殊文字や全角スペースを使って開けてしまったほうが正直らくですよね。

仕事ではまずいでしょうか?

具体例
斉藤(スペース)隆

CEO:(半スペ)斉藤(スペース)隆

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

maru0014

2016/07/01 08:20

「半角スペースや全角スペースが必要なとき」がどんな時か具体的に記述下さい
guest

回答6

0

そのスペースの幅でレイアウト調整をするという意味なら仕事であろうがなかろうがまずいと思います。半角は漢字の半分の幅で全角は同じ幅だとは限りません。
そうでなければ文中のスペースは使うべきだと思います。
ただし、行頭行末は削除されるので、そこには気を使わなくてはなりませんが。
あと、このような情報もあります。
  は半角スペースではないというお話

投稿2016/07/01 08:16

Zuishin

総合スコア28660

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2016/07/01 08:29

びっくりしました。みんな使ってますよね。 半角スペースという意味ではなかったのですね!!
guest

0

私はどちらかと言うと発注する側ですが、
表示上のちょっとした空間調整を全角スペースで行いたいという意図のご質問であれば、

プロとして仕事を受けてそんな感じのコーディングで納品されたら今後は永久にCSS/HTMLのコーディングを依頼しない。

程度にはマズイと思っています。

追記
もちろん、自社利用であれば、責任者の好きにすればいいと思います。
ソースを見られて、うわ、ダセえ!と思われても、SEO的に問題が出ても、HTML/CSSの意図や仕様を無視しても気にならない環境というのは存在すると思います。

投稿2016/07/01 08:13

編集2016/07/01 08:19
tanat

総合スコア18713

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2016/07/01 08:25

具体例 斉藤(スペース)隆 CEO:(半スペ)斉藤(スペース)隆 上記のような場合でもやはりspanで囲んでcssで開けるということですね。
tanat

2016/07/01 08:44 編集

うーん、文章としてスペースに意味があるのであればスペースや全角スペースを入れればいいですし、表示上(レイアウト的に)ちょっと開けたいというのであれば<span>や、その他の方法で開けるべきですだと考えます。 斉藤(スペース)隆 の場合、日本人の名前の表記として 姓(スペース)名 が意味を持つので、姓と名の間の連続しない半角スペースや全角スペースなら許容されると思います。 姓と名をそれぞれ独立した要素として扱ってその上でバランスを取りたいということなら、CSS(spanやそれぞれの要素のmarginなり何なり)で調整するべきかと思います。 CEO:(半スペ)斉藤(スペース)隆 も同様で CEO:(半スペ)が文章上の意味があるのであればOKですが、 これが表示上開けたいというだけならNGです。
退会済みユーザー

退会済みユーザー

2016/07/01 09:03

あえて別単語にしたい場合は特殊文字で開けて、ひとつの単語として使う場合はspanで開けるべきということですね。
tanat

2016/07/01 09:10 編集

kaz.Suenagaさんの回答の 文章やデータとして意味のあるスペースは文字としてのスペース デザイン・レイアウト上の空間調整のためであればCSSによる設定 が私の回答/コメントの意図するところと同じです。 その意味では >あえて別単語にしたい場合は特殊文字で開けてというのは 今一つピンと来ないのですが、 >ひとつの単語として使う場合はspanで開けるべきということですね。 というのは(<span>に限らずCSSでですが)そうだと思います。
退会済みユーザー

退会済みユーザー

2016/07/01 09:17

あえて特殊文字で間を開けたいケースが確かに思いつきません。 99% spanでよいということですね。
guest

0

ベストアンサー

元々、HTMLとCSSは「構造と表現の分離」を目指して設計されている、という大原則をベースに考えると、

  • 文章やデータとして意味のあるスペースは文字としてのスペース
  • デザイン・レイアウト上の空間調整のためであればCSSによる設定

とすべきではないでしょうか。

(余談)

また、これを言うと宗教論争が始まりますが、「全角スペース」というのは歴史的経緯で生み出されている悪習のようなものと考えられます。

文字としては「スペース」であり、その幅・表示は「フォント」と考えた方が自然でしょう。
その意味で文章中のスペースは「半角スペース」であるべきでしょう。

ただしその対象の文章が和文で漢字1文字分のスペースが適切である箇所なのであれば <span class="wabunSp">&nbsp;</span> など「(改行を避けたい)スペースを和文向けサイズで表示する」と考えるべきでしょう。

という考え方もあります、というご参考まで。

投稿2016/07/01 09:00

編集2016/07/01 09:02
kaz.Suenaga

総合スコア2037

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2016/07/01 09:13

>>> 文章やデータとして意味のあるスペースは文字としてのスペース 下記のようにSEO上も音声ブラウザ上も別単語として認識してほしい場合はあえて全角や半角スペースを使うということでしょうか? 天気 晴れ  湿度 10% >>> デザイン・レイアウト上の空間調整のためであればCSSによる設定とすべきではないでしょうか。 こちらは私の例のように名前とみうじを開けたいが、一つの単語である場合に使うということですね。
退会済みユーザー

退会済みユーザー

2016/07/01 09:14

みうじ > みよじ の間違えです。
kaz.Suenaga

2016/07/01 09:25

>下記のようにSEO上も音声ブラウザ上も別単語として認識してほしい場合はあえて全角や半角スペースを使うということでしょうか? そんなふうに言っているつもりはなく、単純に文章上スペースがあるならスペースが入るべきでしょう、ということです。 いただいている例ではそこの間がスペースであるべきかどうか判断つきづらいですが、セマンティックにという意味であれば、table や dl などで記述すべきにも思います。 >こちらは私の例のように名前とみうじを開けたいが、一つの単語である場合に使うということですね。 いいえ、この例こそが「文字としてスペースがある」例です。
退会済みユーザー

退会済みユーザー

2016/07/01 09:35

具体例 斉藤(スペース)隆 CEO:(半スペ)斉藤(スペース)隆 上記のような時にspanでなく、全角スペース、半角スペースで間を開けてしまってよいということでよろしいでしょうか? SEO上問題ないのでしょうか?
kaz.Suenaga

2016/07/01 09:43

少なくとも姓と名の間のスペースをスペース以外であけることは、検索性を下げることになるでしょう。 私が書くとしたら、 <span class="staffName">斉藤 隆</span> <dl> <dt class="staffTitle">CEO</dt> <dd class="staffName">斉藤 隆</dd> </dl> といったHTMLで、レイアウト・見栄えはCSSで設計すると思います。
退会済みユーザー

退会済みユーザー

2016/07/01 10:11

>>> いいえ、この例こそが「文字としてスペースがある」例です。 こちらの返答の意味がよくわからなかったのですが、 名前とみよじはCSSで開けるべきということですね。 ただ下記だと開けられないので名前をspanで囲んでということですね。 <span class="staffName">斉藤 隆</span>
Zuishin

2016/07/01 10:22

問題に関係ないことですが、少し気になったので。 みよじではなく「みょうじ」と書いていただけませんか? 漢字では名字となります。
退会済みユーザー

退会済みユーザー

2016/07/01 12:17

そうでしたね。 すいません
guest

0

全角スペースを使うことあります
文章の行頭の字下げとか、面倒なのでポチっと置いたりします

レイアウトの調整にスペース文字を使うのはあまりよろしくないですね
(まだNetscapeとかが使われてたころに作ったWebサイトではやっちゃってましたけど・・・)
フォントの種類によって幅が変わりますし、ブラウザ種類によっては解釈が変わってレイアウトが崩れたりするので、対応に手間が増えます

文中の字間を空けるのに使うのもあまりおすすめできません
検索でマッチしない、音声読み上げがまともにできないなどの問題があります

そういった問題にあまりかからない、特に意に介さない、ということなら

投稿2016/07/01 08:42

takito

総合スコア3111

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2016/07/01 08:56

具体例 斉藤(スペース)隆 CEO:(半スペ)斉藤(スペース)隆 上記のようなときは別単語に見えてしまって、音声ブラウザ上もSEO上も問題があるのでspanで対応すべきなのですね。 ただし下記のような文章のはじめを一文字インデントするときは使ってもOKということですね。  ああああああああ あああああああああ
takito

2016/07/01 09:31

その例でSPANタグを入れてスペース調整するのはやりすぎでしょうね 「CEO:」「斉藤」「隆」この3つはそれぞれ意味のある語になっているので、検索でも音声でも困らないと思います 表現上どうしても「C(半スペ)E(半スペ)O(半スペ):(スペース)斉(スペース)藤(スペース)隆」こんな感じにする必要性があるなら、スタイルシートで調整した方がよいでしょうね 文章のインデントについては私はぜんぜんかまわないと思ってますけど、text-indent を使ってある方がスマートだとも思います
guest

0

アバウトな基準として、「文章と関係ないところにスペースを入れる」とか「複数連続してスペースを入れる」というような場合は、基本的に泥臭い技になってしまうので、避けたほうがいいでしょう。

姓名の間のスペースや、単語の区切りに入れるスペースまでタグで書くのは、逆にやり過ぎです。

投稿2016/07/01 08:37

maisumakun

総合スコア145184

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2016/07/01 08:58

具体例 斉藤(スペース)隆 CEO:(半スペ)斉藤(スペース)隆 上記のようなときは使ってもよいということでしょうか?
guest

0

特殊文字でスペースあけることありますよ。

投稿2016/07/01 08:18

harashow1701

総合スコア854

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2016/07/01 08:31

仕事でも使うということですね。 ただ&nbsp; は半角スペースという意味ではないらしいですよ。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問