今さら聞けない！読みづらいCSSプロパティの正しい読み方
新人時代、CSSプロパティの書き方は分かっても、「…これなんて読むんだろ…?」と思うものが数多くありました。自分だけが知らないのかも…と思ってごまかしているうちにはや数年…こんな思いをしているのは自分だけじゃないはず！
ということで、今回は読みづらいCSSプロパティ(というか以前僕が間違えて読んでいたCSSプロパティ…orz)についてまとめてみました。発音見本のリンクをつけましたので不安な方は聞いてみてください！
読みづらいCSSプロパティ目次
- alt
- a href
- img src
- width
- height
- text-align
- vertical-align
- opacity
- visibility
- hidden
- border-collapse
- background-origin
- border-radius
- rgba
- columns
- linear-gradient
- appearance
- text-emphasis
- text-justify
1. alt
オルトと読みます。僕は以前なぜか「アラート」と読んでました。
altは「alternate(代役,代理)」の略字です。そのまんまの意味ですね。
発音はalternateのやつですので前半に注意して聞いてみてください
2. a href
「a」をアンカー 「href」をエイチレフ(ハイパーレファランス) と読みます。
aは「anchor(碇)」の略です。船を留めるみたいなイメージですかね。リンク先を指定するために碇を下ろします。発音はアンカーの方のみです。
超良く使うタグですが、これをちゃんと読んでる人になかなか出会いません…(僕の周りでは)
3. img src
ソースと読みます。意味を調べてみれば当たり前なんですが分からない時は「エスアールシー」って読んでましたね(笑)
もちろん「source」の略です。
4. width
ウィドゥス、ウィズと読みます。よく使うのに読み方が難しいNo.1じゃないでしょうか。個人的にはダントツ１位です。発音も難しいので一度聞いてみる事をオススメします。
「with」と区別するためにわざとワイズと発音する事もあるようですが「あ〜この人間違ってる〜」って思われるのが嫌なので僕はあまり使いません。
5. height
ハイトと読みます。正直に告白しますとこの記事書くまで「ヘイト」と読んでました。知らなかった…お恥ずかしい…><
6. text-align
アラインと読みます。「g」は発音しません。僕は最初「アリグン」と読んでました！
7. vertical-align
バーティカル、バーチカルと読みます。
8. opacity
オパシティと読みます。僕はなぜか「オパクティ」と読んでました。テキトーw
9. visibility
ビジビリティと読みます。読むのも難しいですけど、スペルもよく間違えますね…たまにしか使わないからかな〜(遠い目)
10. hidden
ヒドゥンと読みます。input タグの type 属性にもあるやつです。
11. border-collapse
コラプス、コラップスと読みます。僕は「コルエイペス」と読んでましたw
12. background-origin
オルジン、オールジンと読みます。もちろん僕は「オリジン」と読んでました!!
13. border-radius
レイジアス、レイディアスと読みます。僕はず〜っとラディアスと読んでいましたがこれもなぜか一般的の様です。何ででしょうね…間違いが本物を超えてしまったのでしょうか…
14. rgba
アールジービーエーと読みます。そのままですね。でも、あまのじゃくな僕は「きっと特殊な読み方があるに違いない！」と思い込み「ルジュバ」と訳のわからない呪文をとなえていましたね…今となっては良い想い出ですがww
発音見本はもちろんありませんのであしからず
15. columns
カラムと読みます。僕は「カラムン」と読んでいました。かわいいですね。ワンカラムンとかw
これもスペルをよく間違えます。nを忘れるんですよねー
16. linear-gradient
グラディエント、グラジアントと読みます。これも発音が難しいので、発音見本で確認してみると良いかもです。発音見本を聞くとグレイディエントって言ってる気がする…
17. appearance
アピアランス、アピアレンスと読みます。
18. text-emphasis
エンパシスと読みます。css3からのプロパティなのでまだあまり使わないですが備忘録として。
19. text-justify
ジャスティファイと読みます。絶対「ジャスティフィー」だと思ったのに…
最後に
今回調べてみて、自分の読み方がまだまだ適当だったって事に気づかされました…heightはハイトなんですねー知らなかったー。
思わぬところで恥をかかぬようもっと勉強しなくてはっ！
※読み方について
今回の読み方は日本人のWeb系のデザイナーやプログラマーが使うレベルを想定して、日本で使用されるカナ読み方の中から掲載してます。決して、ネイティブの発音に近い読みを掲載しているわけではないので、ご注意を！
originの区切りは『or・i・gin』で、orとiの間が若干空いてる感じです。
「オールジン」と言う方がいますが、のばすほどではないので外人さんには伝わりません。
オルジンの方が適切です。
井畑さん、はじめまして！
タイガと申します^^
為になる記事、ありがとうございます。
ご自身の過去の読み方まで記載されてあり、
楽しく拝見することができました(笑
「href」はハイパーレファランスだったんですね。
ヒりーフって読んでましたよ（笑
勉強になりました！
また訪問させていただきますね^^
タイガ
タイガさんメッセージありがとうございます!!
記事読んでいただき嬉しいです!!
読み方はついついがんばって日本語読みしちゃいますよねwヒリーフって読む気持ちすごくよくわかります(笑)
またお気軽にお越しください
[…] ほんっとにはじめてのHTML5 タグの読み方 CSSプロパティの正しい読み方 […]
[…] 今さら聞けない！読みづらいCSSプロパティの正しい読み方 | クリエイティブメモメモ […]
一応、ネイティブ発音は良く知っていて、且つ、開発現場にいる自分の感想としては：
hrefはhyper text referenceですが、レファランスよりは
リファレンスの方が良く聞く気がします。
background-originもオリジンの方がよく耳にします。
radiusをレイディアスとするなら、gradientもグレイディエントで
良い（ネイティブに近くする）と思いますが、日本の開発現場なら
ラディアス、グラディエントで良い気がします（aを「ア」読み）。
phはf発音になるので、emphasisはエンファシスになると思います。
…まぁ、現場の言い出しっぺの発音が残る気がするので、ネイティブ発音に近づける
事を主観としないのなら、何が正しいってのも無いかもしれませんが。
hlefとありますが、hrefでは？？？
あぁ！お恥ずかしい…早速訂正させていただきました！コメントありがとうございました!!