Web制作・運営・解析・SEO用語集

コーディング

HTMLやPHPなどのソースコードの記述を行うこと、またはその人員のことをいいます。

概要

コーディングとは、プログラミングとかなり近い性質を持っていますが、実際には指定の言語(ここではHTMLやPHP等)のソースコードを用いてクライアント側(コンピューター側)が理解できる記述を行うことをいいます。

HTMLは、本で言う「タイトル」「段落」等がタグとして記載ができます。
その記載すべき部分に文章や画像を表示させることで、Webページを構成していきます。
そういったソースコード制作業務を行う人を「コーダー」といいます。

この用語のメモ

見積もりで「コーディング費用」として登場する場面が多いです。
ページをデザイン・コーディング費用で一式表示する制作会社もあれば、分けて記載する制作会社もあります。

「SEOコーディング」と記載される制作会社も多いですが、マークアップをどれだけ考慮してくれるかを確認してみましょう。
(例えば、HTMLレギュレーションがあるか、SEO的な実績があるかなど)

デザイナーとコーダーでは、デザインの複雑さとコーディングでの再現度の問題で衝突が起こりやすいです。

クライアントの意向やマーケティング上必要な表現を行うにあたり、「テキストとして表現したい部分」と「画像として表現したい部分」をきちんとクリアにしておくことが円滑な制作進行につながります。
ディレクターとしてもこのあたりの調整をしっかり行うことが肝要です。

関連用語

  • HTML
  • 内部施策
  • セマンティックウエブ

Web担当・運営・解析・SEO問題集の例題問題

コーディングに関連するジャンルの練習問題を掲載しています。Web担当・運営・解析・SEO問題集一覧から各ジャンルの問題にチャレンジできます。
クリックすると問題の答えと解説が見れます。

Q:次のタグのうち、tableタグの入れ子に含まれないものを選んでください。
  • tbodyタグ
  • dtタグ
  • thタグ
  • trタグ
  • tdタグ

この答えの解説

dtタグは、dl(定義リスト)タグの入れ子になります。dlタグの入れ子にdtタグとddタグを使用します。
dtタグとddタグは、「質問と答え」の関係のような人まとまりの意味を持つ表現をしたいときに使うため、Q&Aなどのサイトに多用されます。

Q:次のタグのうちHTML5で使用できないタグを選んでください。
  • frameタグ
  • timeタグ
  • embedタグ
  • preタグ

この答えの解説

frameタグは、HTML5では廃止されました。
HTML5ではiframe(インラインフレーム)が引き続き使用できますが、frameはHTML5を文章構造、CSSを装飾指定に分割する過程上で廃止となりました。

Q:次のタグのうち、そのページを開いたときの画面上に内容が表示されないタグを選んでください。
  • headタグ
  • bタグ
  • aタグ
  • timeタグ
  • marqueeタグ

この答えの解説

headタグのみ、bodyタグ外に設置されるタグなのでページ内に表示されません。
しかし、ヘッダー情報があることによりGoogleの検索結果に表示させたりブラウザのタブにページのタイトル名を表示させたりすることができます。
また、SNSなどと連携して画像を表示させたりする機能もこのheadタグ内に様々なタグを用いて設置します。

Q:次のドメイン「test.com」をサーチコンソールに登録する際、登録できるURLを選んでください。
  • http://www.test.com
  • https://test.com
  • 他の選択肢すべて
  • http://test.com
  • https://www.test.com

この答えの解説

この場合、出題のドメインでは上記のドメイン全てを登録することができます。
しかし、内部施策でメタタグなどを使用しURLを統合しないとURLがwww有り無しで分かれた場合、サイトの評価が分散されてしまいます。

Q:Googleサーチコンソールで何がわかるのか次の中から選んでください。
  • どんな検索ワードでどれくらい検索結果に表示されどれだけクリックされたかがわかる
  • あらかじめ決められた検索ワードのうち一つの検索結果でどれだけクリックされたかがわかる
  • あらかじめ決められた検索ワードで表示された検索結果でどれだけクリックされたかがわかる
  • どんな検索ワードでどんな風に検索結果に表示されどれだけクリックされたかがわかる

この答えの解説

サーチコンソール上では、「どんな検索ワード」で「どれくらい検索結果に表示」され「どれだけクリックされた」かがグラフ上で視覚的にわかるツールになります。

Q:AMPの正称を選んでください。
  • Attachement Mobile Pages
  • Accelerated Mobile Presents
  • Attachement Mobile Products
  • Accelerated Mobile Products
  • Accelerated Mobile Pages

この答えの解説

AMPの正称はAccelerated Mobile Pages(アクセルレイテッドモバイルページ)になり、その頭文字をとりAMP(アンプ)と呼ばれます。
AMPはコンテンツの高速表示を目指すプロジェクトで、Twitterとともに開発をされています。

Q:次のうち、最も効果が期待できるSEO施策を選んでください。
  • SEO業者にすべてを任せる
  • ユーザー属性を熟考し一つのコンテンツを作る
  • 何でもよいサイトをたくさん作りリンクを張る
  • ミラーサイトを作成する

この答えの解説

ユーザーの情報や傾向を知った上で、そのユーザーに対する必要なコンテンツを作り、継続的に更新し続けることで再訪、外部リンク獲得確率が高まります。
それ以外の施策はGoogleガイドライン違反になる若しくは可能性が高まるため、期待できない内容になります。

Q:業者から次の選択肢の提案があった場合、やめておいた方がよいものを選んでください。
  • 当社はYahoo!やGoogleの検索アルゴリズムに精通しています。
  • 当社はあらゆる業界においての情報サイトを有しており、ライターを8名常駐しています。
  • 当社はロングテールSEOに強く、競合他社とのSEOで勝てています。
  • 当社は20名超のマークアップエンジニアを抱えています。

この答えの解説

正解の選択肢では、施策の具体性の説明がないのでブラックハットSEOを行っている可能性が高く、ペナルティを受けた場合のリカバリが非常に難しくなるため、対応方法を聞くべきです。

Q:SEO業者を選ぶ上で長期的に成果を出す可能性の高い業者を選んでください。
  • リンクに強い業者
  • ライターが多数在籍の業者
  • Googleのアルゴリズムに詳しい業者
  • レスポンシブデザインなどhtmlコーディングに精通した業者

この答えの解説

いずれも強いことに越したことはありませんが、特に大切だと思うのはしっかりサイトを作り込んでいるかどうかが最優先だと考えます。
コーディングがしっかり作り込まれているサイトは、更新しやすくコンテンツの追加も行いやすいため、更新頻度が高くなるのと、良質なコンテンツを作成することに工数を割くことができるため、結果的に長期的な成果を出しやすいサイトにできると考えています。

関連タグ【Web制作】に関するよくある質問

Web制作に関するよくある質問を抜粋しています。Web制作に関するよくある質問はこちらから。

Webサイトを作るときにどんなことを意識していますか?

今でこそ、SEOを中心にコーディングを組むことが大半になってきているため言える話になりますが、Webサイトの一ページ一ページは「本」を作る意識を持って取り組んでいます。
ちゃんとタグにも「タイトル(表題)」や「見出し」、「段落」など、「作文」や「国語」にまつわる言葉が多く出てきますね。

Google側も同じように「記載されている内容」が「どの場面」で「どれぐらいの分量」の情報が「検索された内容に対し正確性があるか」が重要です。
コーダーやライターはその辺りを意識することが大切です。

デザイナーは、Googleよりも人間側が認知する視覚情報がもっともウエイトを占めるため、分かりやすさとトレンドをいかにストレスなくユーザーに供与できるかが大事で、ユーザーエクスペリエンスの精度に関わります。
Webサイトは、成長を前提に作ることが大事です。そういう意味では、いつまでもページが増え続ける「1巻だけの本」を作り続ける意識が必要ではないかと考えます。

Web制作に必要なソフトを教えてください。

製作工程に応じて使いやすいソフトが大筋決まっていることが多いです。

構成案やサイトマップを作る際はMicrosoftの「Excel」や「PowerPoint」が鉄板です。
大まかなデザイン枠を作る分にはPowerPointがあれば十分作れますし、サイトマップやスケジュール・見積もりなどの情報は、Excelがほとんど使われることが多いです。
いずれもPDFに手軽に変換できる点も非常に使いやすい要因となっています。

デザイン面では、Adobeの「Illustrator」か「Photoshop」が鉄板で、まれに「Fireworks」を使用しているユーザーもいます。
一般的に紙媒体もやっている企業では、「Illustrator」を使用してサイトデザインを制作しているケースが非常に多いです。

コーディング等ではAdobeの「Dreamweaver」がもっとも有名ですが、テキストエディタでコードを作成できる力があれば、ワードパットソフトの「Terapad」やGithubが提供している「Atom」も非常に使いやすいです。
コーディング面においてはファイルのエンコードとHTMLやCSS記載のエンコードをあわせないと文字化けも起こしてしまうので、個人的には「Terapad」が使いやすいと感じています。

運用面、特にアクセス解析などにおいてはこちらもMicrosoftの「Excel」や「PowerPoint」が非常に使われます。ツールとしては「Googleアナリティクス」と「Googleサーチコンソール」を使います。
Excelはうまく使えば得られたアクセス情報からさらに様々な視点でのアクセス情報を拾い出すこともできるため、Excelを使いこなせることができれば大きな武器になります。
アクセス解析等はディレクターが兼任しているケースも多いです。

ざっと上げましたが、全てを担当する場合は「Excel」「PowerPoint」「Illustrator」「Photoshop」「Dreamwerver」「Googleアナリティクス」「Googleサーチコンソール」の7つをマスターすることで大半の業務が行える形になります。
浅く広く習得するか、深く狭く習得するかは得手不得手で決めればよいのではと思います。

CSSを習得したい場合、何から習得したらよいですか?

CSSは組み込みされたHTMLの装飾を行うものです。よって、レイアウト等の配置もこのCSSで行う形になります。
CSSを初めて使用する際に壁にあたってしまうポイントとして「float」の処理ではないかと思います。
むしろ、floatの仕様が理解できればある程度のレイアウトのコントロールができるようになるので、何度も繰り返し組んでみましょう。
floatと併せて「clearfix」というものも覚えるとレイアウト崩れが防げます。

関連タグ【Webシステム】に関するよくある質問

Webシステムに関するよくある質問を抜粋しています。Web制作に関するよくある質問はこちらから。

Wordpressを組んでみたいと思っていますが、どこから勉強するべきですか?

Wordpressを構築したい方向けをメインにお話しますと、まずは必要なファイルが何なのかを知ることが大事です。
さらに各ファイルを連結させるためのPHPコードを知ることが大事です。まずは、このあたりがどのように設置すれば表示されるのかを知ることが大事です。

記事を表示させるには、表示にかかる部分をループで処理し、特定の記事番号でアクセスされたときに呼び出されるようにプログラムを組む必要があります。
ここからは様々なソースコードの記載方法がありますので、ネット上の情報を見ながら色々試して見ると良いでしょう。

javascriptはどのようにして組んでいますか?

あまり自分自身でコードを組むことは行っていません。
javascriptはあらゆるサイトに動作別でたくさんソースコードが公開されているのでそれらをアレンジして自分流に組むことが多いです。

組んだのに動かないこともたくさんあり、その場合は1行ずつ面倒でも検証し続けることで、記載ミスを見つけて動かすことができているのでいきなりイチから全部組まないとダメ!ということではありません。
制作現場でも自身で組んでいるコーダーももちろんいらっしゃいますが、サイトからソースを抽出することが多いです。

Wordpressはどんなものですか?

Wordpressはオープンソース型のブログサイト構築アプリのことで、これを使うことで「好きなデザイン」で「固定ページ」や「記事」を特段HTMLを知らなくても一般的なブログサービスのように構築できるアプリです。

企業サイトでも非常に普及しており、一般事務職の方々が「新着情報」を更新し続けることもごく当たり前になりました。
このWordpressで特に求められるのは、アプリ導入から構築するところまでが必要で、その構築費用にかなりの初期費用を投資する必要があります。

関連タグ【SEO】に関するよくある質問

アクセス解析に関するよくある質問を抜粋しています。SEOに関するよくある質問はこちらから。

競合他社から攻撃されている可能性があります。どうしたらいいですか?

まず、どのように攻撃されているかを冷静に見ていきましょう。特に多いのが「リンク」攻撃です。
不自然なリンクがあり、理不尽なペナルティが届いたら「リンク否認」をすぐに行いましょう。

SEO業者などによって質の低いコンテンツが載っているサイトからの大量のリンクが張られたりする悪質な手口を実行してくることがあるため、Googleから通知が着たら「あわてず」「冷静に」「URLを確認してリンク否認」を実行しましょう。

そして、「手動による対策」が表示されていた場合は、「不適切なサイトからのバックリンクがあったため、リンク否認を行いました。対象サイトはhttp://○○です。」といったような内容で送ると良いでしょう。

競合他社が鬱陶しいですが、どうやったら検索上位にできますか?

まずは、上位に来ているサイトのコンテンツをしっかり見てみましょう。
何故上位に来ているのか。答えは簡単で、競合他社のほうがその「検索結果に表示」されている内容について「説明が上手いから」とGoogleが認めているからです。

どのへんが説明が上手いのかということですが、まず文章量の多い少ないはそこまで関係ありません。
同じような情報であればどれだけ様々な視点を持って説明をしているか、という点であったり、全く同じコンテンツレベルだと感じるなら、それをGoogleが「どれだけ正確に読み込みできているか」も重要です。

アンカーリンクのつけ方も重要です。内部リンク、アンカーテキスト、前後ページの関連性など上げるとキリがありません。
やれることをやって、しばらく様子を見て、さらに改善案を考えページを成長させていく他ありません。

Googleサーチコンソールって何ですか?

クリック数、コンバージョン率、合計表示回数、平均掲載順位などの検索キーワード関連の他にGoogleにインデックスするページを増やしたり不要なURLを削除したりするツールです。

サイトの構造を精査したりサイト上に検出されたエラーを修正することにより、検索結果に画像を表示、評価の★マークをつけたり等といった検索に効果をつけることもできます。

SEOを行う上で何から行ったらよいかわかりません。

まずはGoogleアナリティクスとGoogleサーチコンソールを導入し、サイトに訪れる際に検索されているキーワードを探してみましょう。

次に、今展開しているコンテンツが「その検索キーワードにマッチしている内容かどうか」をしっかり精査した上でサービス説明を組み替えたり、検索されやすいキーワードを文中に文法上意味の通る状態を考慮した上で組み込むなどのてこ入れをしていきます。

検索順位が落ちた場合はどうしますか?

手動による対策で下がった場合は、1つ上の質問の内容の通り、コンテンツの中身を精査してみてください。

競合が順位が上がったことにより、順位が落ちることも当然ながら多々あります。
そのような場合は、相手のコンテンツのどういった点がよさそうに感じるのか、キーワードの頻出具合はどのようになっているのか、コンテンツに厚みや面白味があるか、どの端末でも問題なく閲覧できているか、サイトが軽いか(容量が少なく済んでいるか)。

ざっと思いつくものでもこれだけあります。競合と比べて劣ってそうと思うところは1つずつ地道に改善していきましょう。SEOは一日にして成らずです。

索引から探す

タグから探す

よくアクセスされている用語

その他カテゴリー

Webサイトトップページに戻る

スポンサードリンク