chot Inc.

ちょっと株式会社 社員ブログ
Blog
  • ホーム
  • ブログ
  • ここ最近、意識するようにし始めた技術的SEO関連のお話し

ここ最近、意識するようにし始めた技術的SEO関連のお話し

ナレッジ・ノウハウ
ここ最近、意識するようにし始めた技術的SEO関連のお話し

SHARE

こんにちわ、ちょっと株式会社 エンジニアのたっちーです。

web制作に携わってから、今まで知らなかったSEO関連周りについて意識するようになりました。
今回はその中のいくつかをアウトプットしようと思います。

HTMLマークアップ

初心に戻ってマークアップを意識するようになりました。
見出しやセクション、a11yなどまだまだ勉強するところは多いです。

パスディレクトリ構造

URLの構造を指します。
お知らせ一覧などを例に挙げるなら、

  • news
  • news/{contentId}
  • news/pages/{number}

などです。
サイトの構造を測定する上で、googleの評価につながります。

パンくずリスト

割と実装が漏れがちな子です。
サイトの構造を測定する上で、googleの評価につながります。

レイアウトシフト

サイトを表示したときに画像の読み込みなどで発生する、位置ずれのことを指します。
これは後述するCore Web Vitalsに影響が出てきます。
これを改善する方法の一つとして<img>タグの width, height があります。

画像フォーマット

svgやpng・webpなど、利用する画像に適した画像フォーマットが存在します。
利用シーンやサイズなどを意識するようになりました。

例えば、単色のロゴなどであればsvg
複雑な配色だが、透過素材が良い場合などはpng
などです。

構造化マークアップ

パンくずリストや、FAQなどの情報をJSONデータなどで持たせることで、Googleが読み取りやすいwebサイトを目指します。
パンくずリストのマークアップを追加する方法 - Google検索セントラル

Core Web Vitals

Googleが取り組んでいるユーザー体験向上に向けての指標です。
microCMSさんが詳しい解説をして頂いているのでこちらをご覧ください。

Googleの検索アルゴリズムに新たに追加されるCore Web Vitals(コアウェブバイタル)の3つの指標とは?


最後に

まだまだ、勉強不足な部分が多いのでこれからもキャッチアップしてきたいと思います。
a11yとか...a11yとか...etc

たっちー

フロントエンドエンジニア

1995年生まれ。2018年にweb業界に足を突っ込んだ同人イラストレーター。 現在ではフロントエンド領域を生業としながら幅広くwebをカバーしてます。 コーヒーとジャパンサブカルと技術のお話が大好きです。 ちょっと社では「たっちー」の愛称で呼ばれ、SNSでは「hanetsuki」と言う名前で活動しています。

関連記事

Copyright © 2022, chot inc.