2021.05.31

Web系の用語～代理店さんに聞かれた用語～

こんにちは！
MaromaroのShigeです。
今回のネタは、代理店さんなどに最近聞かれたWeb系の用語について。

僕は、どちらかというとフロントの立場で仕事をしています。
その立ち位置から技術者とお客様の間で専門用語の翻訳をする機会が多いので、いくつかピックアップしてご紹介します。
（過去にもMaromaroブログで書かれていますが、かぶらないように・・・・）

主にWeb制作で聞かれる用語

ディレクトリマップ

ディレクトリマップ（ディレクトリーマップ）とは、Webサイトすべてのページをまとめた資料のことです。
僕は主にExcelでまとめたりします。
内容は、ページID、階層、ページ名（ページタイトルになる）、フォルダ・ファイル名、その他備考として、動画設置やWordpress対応などを1行1ページにまとめます。
ですので、100ページあるWebサイトなら100行になる感じです。

ワイヤーフレーム

ワイヤーフレーム（WF）は、ページごとに要素をまとめる為の資料です。
上部に基本情報をまとめます（ディレクトリマップと連動します）
SEOに必要な、ページタイトルやディスクリプションもここに記載します。
メイン部分には、可能な限り見出し要素（h1～）を意識してページ要素をまとめて行きます。
この資料を基にデザインを行ったり、コーディングを行うので、大切な資料となります。

ハンバーガーメニュー

あれです。横3本のメニューアイコン、漢字の三のようなやつです。
主にスマホやタブレットなど画面の小さいなものの為にメニューを格納したやつですね。
最近ではPC版のWebサイトでも見かけるほど認知度も高くなってきていますね。
呼び方ですが、「ドロワーメニュー」とか言ったりもします。ハンバーガーよりちょっとかっこいいかも。

パンくず

PCサイトのヘッダー付近によくあるリンク要素です。
今開いているページが、Webサイトのどの階層にいるかを示す役割があります。
検索サイトからリンクしてきてもトップページとは限らず、そのサイトのどの部分かもわかります。
またテキスト要素で表現されることから、SEO対策の1つにもなります。
例：トップページ > （大カテゴリー） > （小カテゴリー） > 詳細ページ

レスポンシブ

1つのソースで、PC、タブレット、スマホと様々なサイズのデバイスに対応する技術です。
基本は拡縮で表現しますが、ブレークポイントという切替ポイントを用いることによってカラムの段落ちやレイアウトの調整を行うこともできます。

解析やSEOの話題で聞かれること

SEO

「Search Engine Optimization」の略です。「サーチエンジンオプティマイゼーション」
要するに検索エンジン最適化という意味で、検索エンジンにいかに気に入られるかってことです。
SEOには内的処理と外的処理があります。
内的処理（内部対策）とは、htmlなどのソースの最適化：タイトルタグやmetaタグの中身を検索エンジンに読みやすくしてあげること。
他にも見出し要素になるhタグを的確に表現することなどが挙げられます。
しっかりと行えば、ユーザービリティも向上しますね。
ちなみにGoogleが最重要視する3つの評価基準はこちらです。

Expertise（専門性）
Authoritativeness（権威性）
Trustworthiness（信頼性）

外的処理（外部対策）とは、主に被リンク対策。検索エンジン様が認めているサイトからリンクが張られていたり、関連する他のコンテンツからリンクされていたりすると優位に働くといわれてます。
他には
ページスピード：画像の重さやソースの書き方で変わってきます。
クローラーに円滑にクロールしてもらいインデックスされること：sitemap.xmlを設置するなど

GA（Googleアナリティクス）

Googleが提供する無料のアクセス解析ツールです。
無料ですので、わかりやすく使用するためには、ある程度の知識が必要になります。
そもそもアクセス解析とは・・・
Webサイトに訪れるユーザーの数、どこから来たのか、どんなキーワードできたのか、どんなページを見ているのかなど、ユーザーの属性や行動を知ることです。
GAを使えば、Webサイトの改善の指標を得ることができます。

コンバージョン

ここで言うコンバージョンとは、Webサイトの段階的な目標達成です。
あくまで段階的であって、一つの目標を達成したら、次の目標にといった具合に目標を転換していく感じです。
例えば、
読んで欲しいページに誘導する→資料請求して欲しい→会員登録して欲しい→購入して欲しい
など、コンバージョンは段階的な目標であってどんどん転換していくものということです。

クローラー

クローラーは簡単に言うと、ネット上にある情報を収集するためのプログラムです。
悪い意味で言うと、ネット上にあるメールアドレスを取集するプログラムを使ったクローラーなどもあります。
それはさておき、この流れで説明するとGoogleやYahooなど代表する検索エンジンがクローラーを使っています。
Webサイト運営者は、検索エンジン対策（SEO）として、このクローラーに情報を集めやすくサイトを作ったりして、検索エンジンにヒットさせています。
（現在、YahooはGoogleのクローラーを使っているという話もあります）
自分のサイトにクローラーが来たか知るには「site:」というのを使います。
例：site:https://blog.maromaro.co.jp/
検索エンジンに登録されていれば、自身のサイトの情報が表示されます。
もしされていない場合は「Google Search Console をお試しください」というメッセージが出ます。
参考にしてください。

リダイレクト

アクセスしたURLから別のURLに転送することです。
例えば、
Webサイトをリニューアルした際にURLが変わった場合に新しいサイトに転送する。
→サイトの評価を引き継げる
ばらばらだったページを1つのページにまとめた
など、用途はいくつかあると思います。
リダイレクト種類
・301リダイレクト：これを使うと、検索エンジンは古いURLへのアクセスを新しいURLに恒久的に転送します。
古いURLのページ評価も新しいURLへと引き継ぎます。
→ドメインを変更する場合
→WebサイトをSSLにする場合
などです。
・302リダイレクト：これは301とは異なり、一時的な転送の時に使います。
→ページのメンテナンス時のクローラー対策
などです。
設定方法ですが、
.htaccessによるリダイレクトが一般的かつ推奨されています。
ただ、サーバで.htaccessによるリダイレクトが使えない場合には、JavaScriptやmeta refreshなどを使います。

セキュリティ関連のこと（最近多い）

SSL/TLS

SSL（Secure Sockets Layer）/TLS（Transport Layer Security）
インターネット上で、データを暗号化して送りあう仕組みのこと。
数年前から、フォームなど個人情報などを送信する以外にもすべてのサイトにSSLをかけることが一般的になってきています。
これにより、例えばカフェなどの無料Wifiで通信する場合などでも暗号化で通信できるので、なりすましなどを防げるメリットがあります。
また、SEOにおいても全体にSSLがかかっているサイトを優遇する発表もありました。
無料や共用のSSLと独自SSLについては、予算のこともあるので強くは言えないですが、独自のSSLの方が信頼性は高いです。
ただし、無料でも「ドメイン認証型」のものであれば、信頼性を保てると思います。

クロスサイトスクリプティング（XSS）

クロスサイトスクリプティングは、フォームやCMSなどユーザーが入力した内容で表示が動的に変わるWebサイトで、悪意のあるスクリプトがWebサイトに入り込んでしまう脆弱性です。
具体的には
1、攻撃者がサイトの利用者などにメールなどで実行可能なパラメーター付きのリンクなどを送付
2、利用者などがそれをクリックして脆弱性のあるWebサイトにアクセスしちゃいます。
3、利用者のブラウザは表面上Webサイトが表示されますが、裏ではXSSの脆弱性によって悪意のあるスクリプトが実行されます。
4、悪意のあるスクリプトが、利用者などの個人情報を攻撃者に送信する。。
大まかにはこのようなことになります。
しっかり対策を行いましょう！！