書いてはいけないHTML、CSS

date_range 2024/05/29
エンジニアインターン
_94fb4695-74a7-4255-a69b-319b9a1acfd1

こんにちは、WEBプログラマーコースの池田駿です。

一つのWEBページを模写して提出しては新たなフィードバックをもらう、

最近はそういった感じです。

最初は何が何だか分からなかったHTMLやCSSの書き方が最近徐々に分かってきました。

書いてはいけないHTML

HTMLは基本どんな風に書いてもサイトの訪問者には美しく見せられます。

しかし、HTMLで心掛けるべき相手はお客様というよりむしろロボットとプログラマーです。

ブラウザ内にはクローラーというロボットが巡回していて、そいつがサイトの内容を正しく理解してくれると関連度の高い検索に対して適切に表示されるようになります。

またコードを読む他の開発者(または将来の自分自身)がページの構造と内容を理解しやすくなります。そして修正や拡張が必要な際に、適切なタグが使われているとどこを修正すべきかがすぐにわかります。

つまり書いてはいけないのは、「デザインのためだけのHTML」。何を書いているのか、どういう構造なのかを伝えないといけないわけです。

書いてはいけないCSS

書いてはいけないのはpositionなどで具体的な数値を与えて無理矢理見た目を整えたCSSコードです。

なぜいけないのかというと、そういったコードは環境が変わったとき(ほかの人がほかの人のPCやスマホで見るとき)に崩れやすいからです。


全てを論理的に、完璧にやるのは難しいかもしれませんが、できるだけ「書かれるべくして書かれたコード」を目指していきたいですね!

*COMMENT*

  • 髙松 みすず

    髙松 みすず

    更新日:2024-05-29 18:00

    *コメント*

    コーディングを勉強中なのですごく参考になりました!
    position安易に使いがちなので、気を付けます!

    *コメント*

  • 永野 智成

    永野 智成

    更新日:2024-05-29 18:07

    *コメント*

    投稿お疲れ様です。
    「HTMLで心掛けるべき相手はお客様というよりむしろロボットとプログラマー」
    職業訓練校時代に知りたかったです笑
    次回の投稿も楽しみにしてます!

    *コメント*

  • 高橋 力都

    高橋 力都

    更新日:2024-05-29 21:50

    *コメント*

    お疲れ様です。

    『書いてはいけないCSS』、
    HTML/CSSの初学者である自分には、グサッとくる内容でした笑
    職業訓練校に通っていた際、下手に絶対単位で数値指定をして、
    レスポンシブ対応時に手間がかかったことが思い出されます。

    *コメント*

  • 恩田 かおり

    恩田 かおり

    更新日:2024-05-30 08:04

    *コメント*

    クローラーやプログラマーにも優しいコードを書く意識、大切ですね!
    勉強になりました。

    *コメント*

  • 石川 航

    石川 航

    更新日:2024-06-05 23:12

    *コメント*

    お疲れ様です
    webサイトは見栄えだけ良くしても検索エンジンの目はごまかせません

    検索エンジンのためだけでなく、お客様を勝たせるWebサイトにも繋がっていくので、
    それぞれのHTMLタグの意味を理解して、適切な構成で構築していきましょう

    *コメント*

*コメント*

*ログイン*

メールアドレス
パスワード