World of granshe.
[PR]
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
HTML5の文法
HTML5について学んでみました。
参考にさせていただいたサイト(敬称略)
翻訳系の記事では常々申しておりますが、
基本的に、W3Cのワーキングドラフト（英文）を読んでいるので、ここに書かれていることが原文と全く同じとは限りません。翻訳に際して生じる間違いがある場合がございます。
以上をご理解いただけると助かります。
間違いを発見した場合、ご連絡いただけると勉強になるのでとても嬉しいです。
連絡先：granshe@jcom.home.ne.jp
CMSにはまる
ここ最近、急にCMSにはまりだした。
というのも、バイト先でCMSをいじることになったのがはじまりなのですが。
ちなみにCMSというのは、コンテンツマネジメントシステムの略語です。
いちいちHTML書かなくても、プログラムでページをぱぱっと制作してくれる。
mixiなどのコミュニティサイトや、ブログもこのCMSの一種です。
現状、自分自身として思っているのが、
「コーダーとして生きていくのにもかかわらず、
この自分のサイト（ブログ）のコーディングの手抜き加減はどうなんだ？
（ついでに言うとポートフォリオサイトも）」
という点です。
ポートフォリオサイトはもちろん、ブログだって、
Webにおいてその人の人となりをあらわすものになります。
「コーダーです。マークアップできます！」
と言ってブログのURLを教えて、
「なんだ、コーダーなのにマークアップ全然こだわってないじゃん。
仕事できんのか？」
という未来が見えます。
入社したら、CMSでブログを構築しなおそうと思う。
そして、サーバとドメインをレンタルして作ってみようと思った。
今いじっているのはMovableTypeなのですが、
Wordpressをじっくり使ってみて使いやすいほうを採用します。
CMSって、更新する側、記事を投稿する側は非常に簡単だけれど、
構築がものすごく難しい！
凝り性なのでついついこだわるともうどうしようもなくなってしまいます。
あと、サーバサイドで色々やってるので、プレビューがかなりめんどくさい。
CMSが出来たら、コーダーなんていらないよ。
って言われたことあったけど、ウソだね。
CMS構築するのにどれだけ労力がかかるんだって話ですよ。
でも、HTMLとCSSをひたすら書いて量産する人をコーダーと言うなら、そういう人はいなくなるかもしれない。
でも、HTMLとCSSでサイトを構築する人は、CMSが普及しても絶対に必要な人材でしょうね。
CMS、難しいです。
strongとemの違い
今まで、文章の強調といえば、emタグではなくstrongタグしか使ってこなかったのですが、
今度、授業資料にマークアップ概論（みたいなもの）を盛り込むにあたって、
em（強調）、strong（強い強調）の2段階の強調の説明はどうすればいいんだ？と感じたので、
emとstrongの違いを調べることにしました。
ネットを調べた結果、一番納得したのが下記。
em要素とstrong要素（以下、引用）
英語の活字文書において、太字で書かれている箇所はより強い調子で読まれるべき箇所、読者に強く注意を喚起したい箇所であり、これは日本語での強調という言葉にそのまま該当するものだと思います。日本語の活字文書で同等の表現をするとすれば、同じように太字にするのがおそらく妥当でしょう。または、字を大きくするとか。
一方、斜体は、強い調子でというよりは、その文脈において語句の持つ通常一般の意味とは違う使われ方をする場合に用いられているような気がします。だから強調と呼ぶのはややニュアンスが違っていて、通常とちょっと異なる調子（異調？）とでも言われるべき箇所なのではないかと考えています。また、日本語の活字文書においては、傍点をつけたりとか、または鉤括弧や引用符で囲ったりするのが、この英語における斜体に相当する表現になるのではないかと思います。
さらに調査を重ねると、
どうもHTML5の仕様書にこのナゾを解くヒントがあるようで。
簡単に説明すると、
emは、文脈によって変わる強調、
strongは、文脈によらない強調、だということです。
これを聞いて、高校英語の問題で、二つの文章が出てきて、
「この文章で強調して読まれる部分はどこですか？」
っていう設問があったのと一緒じゃないかと思い出した。
たとえば、
I like apple（リンゴが好きです。）
という文があったとします。
この前に、
Do you like apple?（リンゴ好き？）
という質問が来ていたら、
I like apple（リンゴ好きだよ。）
と答えます。
が、もし
Do you like Orange?（オレンジ好き？）
という質問が来ていたら、
I like apple（リンゴが好きなんだよ。）
と答える場合もあるでしょう。
このように、文脈に依存する強意、
（英語で言うとアクセントに当たるのかもしれません。）
これにはemを使うようです。
そして、strong。
これは、文脈に依存しない強調。
「ここに入ってはいけません」とか、
「手の届かないところに保存してください」
とか、注意を喚起するというか、明らかに強調するというか、
この要素は重要です、というプライオリティ、優先度を示すというか。
HTML5の仕様書にも emが「強調」というふうに書かれていたのに対し、
strongが「重要」というふうに書かれていた。
文脈的なアクセントとしてemを用い、
重要度を示すのにstrongを用いる。
この点が、二つの明確な違いではないかと考えました。
テンプレート作りのメモ
今アルバイトしている会社を辞めるにあたって、
Webサイトのコーディングテンプレートを作って置いていこうかと思っている。
私の代わりにコーディングが出来る人はもちろんいるのだが、
彼はわたしと違い、コーディング以外のほかの仕事もこなすことができる。
もしそれほどコーディング業務が好きではないのなら、
コーディングに費やす時間を、他の作業に当てたほうがもっと楽しく仕事ができると思い、
この考えに至りました。
以下、テンプレートを作るにあたってのメモ。
基礎部分
- xml宣言をつける。
- XHTMLTranditionalで作る。
- 文字エンコードはutf-8にする。
- meta content keywordは忘れずにつける。
- import用CSSから読み込む。メディアはscrern, printにする。
IDとClass
- body直下に#container
- ロゴ、タイトル部は#header。ロゴは#logo
- #headerや#footerによくある「お問い合わせ」系ナビゲーションはul.utility
- グローバルナビゲーションは#gnavi
- トップページによくあるFlashや画像などのキャッチコンテンツを入れる#catch
- パンくずリストはp.tpath
- フロートを含むコンテンツ部を囲む#contents
- ３カラムサイトの場合、#mainと#subを囲む#leader
- メインコンテンツを入れる#main
- サブコンテンツ、ローカルナビゲーションを入れる#sub
- ３カラムの場合の最後のひとつ#ad（広告の場合）
- コピーライトなどフッターコンテンツは#footer
以上、メモ終わり。
内定先の昨年度の新人研修情報や、今年度の新人教育的な記事を見て
心躍らせる、3月中旬でした。
キレイなコード
@aroma
というサイトのHTMLコードを見る機会がありまして。
すごくキレイで驚いたのでメモ。
Web制作というのは、BtoBで行われるので、
作ったサイトは自社の作品でもありますが、それ以前にクライアント会社のものなので、
通常、サイトに制作会社の名前が載ることはまずありません。
これでどうやってクライアントを増やすんだろう？と思うことも多々あります。
また、嫌な言い方をすれば、Web制作会社がピンからキリまであるのも、
こういったことが理由なのかもしれません。
と、話がずれましたが。
とりあえず、コードがValidかどうかとか、JavaScriptがHTMLに直書きされてるとか、中身が空のdivタグがあるんだけど。とかは別として。
コードが非常に見やすい。
無駄なdivやidがあまりなくて、すっきりしてる。
これは、私にとってのキレイなコードが、「無駄なdivやidがあまりない」ものだからなわけですが。
これまでの記事を読めばお分かりかと思いますが、私はHTMLにdivやidをつけるのが好きではありません。
理由は、なんかソースが汚くなるから。というオタク的なものです。
それは、共同作業でコーディングをした経験がないから言えることであって、
HTMLをいじるのが自分ひとりであるという前提があるからであって。
実際の仕事は、きっと自分ひとりでコーディングができるわけではなく。
更新作業を自分以外のひとがやるということがほとんどでしょう。
その場合、divというタグでブロックをまとめておくことで、
コピペをするだけでコンテンツを増やすことができ、更新作業もだいぶ楽になります。
コーディングの方法に正しい、間違っているということはなくて。
サイトの規模と、サイトを作る側の規模、そして運営方法。
これらの要素を考えて、コードをどう書くか決めるべきなのだと感じました。
Copyright © 2008 A.Yu-ri all rights reserved.