統計データマーケティングお役立ちレポート全てのカテゴリを見るferret記事をさがすCMS・Webサイト制作予算をかけず自分でホームページが制作したい!必要な6つのスキルとは?予算をかけず自分でホームページが制作したい!必要な6つのスキルとは?2018年06月28日CMS・Webサイト制作プログラミング会員登録する「予算をかけずに自分でホームページを作成したい」という個人事業主や中小企業の担当者は多いはずです。自分で作成するためには、"まずどういったスキルが必要なのか"すらわからず、その時点で挫折をしてしまう方も多いのではないでしょうか。今回はこれから知識を付けたいという方に向けて、Webページ作成の基本的な流れと作成のために必要な6つのスキルをご紹介します。WordPressのようなCMSの登場により、誰でも無料でホームページを制作できるようになりました。この機会に必要なスキルを学び、魅力的なホームページ制作を実現させてください。ホームページ制作の基本的な流れそもそも、ホームページ制作はどのような流れで進めるのでしょうか。基本的な流れからご紹介します。・ターゲットやペルソナ、ゴールを設定する・コンセプトを決定する・Webページのタイトルやキャッチコピーを決める・制作ポリシーを決める・サーバー・ドメインを取得する作成に取りかかる前に、まずはホームページ全体をとおして、どのような成果を得たいのかがはっきりしていなければ掲載すべき内容も定まらないという理由から、ホームページの土台となる方針やコンセプトを固めます。・CMSの設定をするページの設計図である「サイトマップ」を作り、ページのレイアウトを決めていきます。ホームページを制作・運用していくにあたり、それを管理するシステム「CMS」を利用する場合はユーザー情報など基本的な設定を行いましょう。●Webページの内容を作成する・コーディングする・ロゴやバナーを作成する・ブラウザごとの動作チェックを行う・テストサーバーで確認するそして、デザインが固まったら、続いてホームページの中身を制作していきます。ロゴや画像といった素材をもとに、HTMLと呼ばれる言語などを利用してコーディングを始めます。Consoleなどを利用し、検索エンジンにページを公開したことを知らせます。この作業を行うことで、検索エンジンに正しくページを読み込んでもらい、検索結果に表示されるようになります。参考:ホームページの制作フローを徹底解説|ferretWebページ作成に必要な6つのスキルでは、ホームページを制作するにあたり、具体的にどのようなスキルが必要なのか、について解説します。下記6つのスキルをご覧ください。HTMLHTMLとは、Webページを表現するための言語であり、タグと呼ばれる要素で構成されています。ホームページに掲載されるテキストや画像といった情報を、どのようなブラウザからでも見れるようにするための共通言語のようなものだと認識するといいでしょう。HTMLはシステムの動作を指示するプログラミング言語と異なり、文章がどの位置にあるか、ページの構造はどうなっているかといった情報を表現しています。参考:ホームページ制作初心者のためのHTMLタグの基礎知識・書き方がわかる記事5選|ferretこちらの記事では、プログラミングの専門的な知識がなくてもわかるHTMLタグの基本知識を解説していますので、ぜひ本記事と併せてご覧ください。CSSCSSは、Webページ上でデザインを表現するために用いる言語です。HTMLだけでは表現できない、文字のフォントやカラーといった情報を表現することができるので、よりデザイン性の高い見た目のホームページに仕上げることができます。参考:CSSの基本~スタイルシートとは|ferretこちらの記事では、CSSの基本について解説しています。"どういった言語なのか"という基本情報を知りたい方は参考にしてみてください。JavaScript(ジャバスクリプト)JavaScriptは、ホームページ上で動きを表現するための言語です。マウスカーソルが動くのに合わせて変化するアニメーションやページスクロールに合わせてついてくるバナーなど、動きのある要素はHTMLやCSSでは基本的には表現できません。JavaScriptを利用すればこうした動きを表現できるので、より高度なWebページへと仕上げることができるでしょう。Optimization)は日本語では「検索エンジン最適化」と訳され、自社のサービスに合った検索キーワードの検索結果にホームページが表示されるようにする手法を指します。検索結果の上位に表示されることで、ホームページへのアクセスを増やすことができるため、集客施策の1つとして活用されています。SEOでは、検索エンジンがホームページのどの部分を評価しているのかを知り、高く評価されるようにページ内部の構造を含めて調整していく必要があります。アナリティクスページへのアクセス数やユーザーがどのようなページを見ているかを知ることで、Webページで改善すべき点が見えてきます。したデータの分析を「アナリティクス」と言い、Webページの改善には欠かせません。競合他社のWebページを分析することで、自社の売り出すべき点も見えてきます。大きな成果をホームページを軸に挙げたいという人は、ぜひアナリティクスのスキルを磨くことをオススメします。ライティングホームページのトップに掲載するキャッチコピーやサービス紹介に掲載する紹介文の作成の際には、もちろんライティングのスキルが求められます。キャッチコピーはホームページ全体の印象にも大きく関わる重要な要素のため、他社の事例やから学んだり、修辞法などの文法を学び、コピーライティングのスキルを磨くことが求められます。(https://ferret-plus.com/1743):blankまとめCMSによっては、HTMLやCSSの知識がなくてもテンプレートのみでWebページを作成できるものもあります。ホームページへの集客につながり、魅力的なページにしていくためには、以下のスキルを身に付けておくことが重要です。・Webページの内容を作成する:HTML・Webページの見た目の質をあげるCSS・Webページに動きを追加する:JavaScript・検索エンジンからのアクセスを増やす:SEO・Webページの分析・改善を行う:アナリティクスそれぞれのスキルを学ぶには、書籍などを参考にして勉強しましょう。こちら記事では、ホームページ制作を学ぶ際に役立つ書籍を紹介しています。自分の学びたいスキルが明確になってきたら、こういった書籍から学んでみるのもいいでしょう。したスキルを学ぶことを目的としたカリキュラムコンテンツもご用意しておりますので、ぜひ参考にしてみてください。-|ferretページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るWordPressWordPressとは、CMS(コンテンツマネジメントシステム)の1種で、ホームページ管理システムのことです。ブログ感覚で記事の修正・追加が行えるうえ、通常のホームページ並みのデザインを作成することができます。システム)と言います。ホームページを作成するには文章や画像などのコンテンツの作成からHTML、CSSを使った構成・装飾の記述、リンクの設定などが必要ですが、CMSを使用すればこれらの作業を自動的に行なうことができます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るコンセプトコンセプトとは、作品やサービスなどに一貫して貫かれている考え方をいいます。デザインと機能がバラバラだったり、使い勝手がちぐはぐだったりすると「コンセプトが一貫してないね」などと酷評されてしまいます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るサイトマップサイトマップとは、ホームページの中にあるページ構成を一目見て分かるようにした、目次のような案内ページのことを指します。ホームページ内にある全てのページへのリンクが一覧になっていることが多いです。訪問した人でも、どこに何があるのかがすぐに分かるようにすることを目的として作成されます。詳しく見るレイアウトレイアウトとは、もともと「配置」や「配列」を指す語です。ここでは、「ホームページレイアウト(ウェブレイアウト)」と呼ばれる、ホームページにおけるレイアウトについて説明します。システム)と言います。ホームページを作成するには文章や画像などのコンテンツの作成からHTML、CSSを使った構成・装飾の記述、リンクの設定などが必要ですが、CMSを使用すればこれらの作業を自動的に行なうことができます。詳しく見るユーザーユーザーとは、コンピューターやシステムを利用する人のことを指します。意味を持つ英単語で、対義語は「メーカー」や「デベロッパー」などがあります。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るHTMLHTMLとは、Webページを記述するための言語です。""にはさまれたさまざまな種類の「タグ」によって、文章の構造や表現方法を指定することができます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。Consoleとは、Googleが無料で提供しているツールの1つで、ホームページを運営する上で重要な情報を把握できます。自分が作成したホームページの集客・管理を効果的に行うために利用するもので、訪問者の属性や検索キーワードなどを詳しく調べることができます。詳しく見る検索エンジン検索エンジンとは、インターネット上に無数に存在するホームページのデータを集め、ユーザーにそれらを探しやすくしてくれるサービスのことです。「検索サイト」とも呼ばれます。JAPANやGoogleなどがあります。大手検索エンジンは、スマートフォン向けのアプリも提供しており、これらは「検索アプリ」と呼ばれています。GoogleやYahoo!などの検索エンジンで検索したときに表示される情報のことです。Page」の頭文字から「SERP」と呼ばれることもあります。検索結果には、検索エンジンの機能に関する情報と、検索キーワードに関連する情報を持つページが表示されます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るHTMLHTMLとは、Webページを記述するための言語です。""にはさまれたさまざまな種類の「タグ」によって、文章の構造や表現方法を指定することができます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るタグタグとは、原義では「モノを分類するために付ける小さな札」のことです。英語の「tag」を意味するものであり、荷札、付箋といった意味を持っています。インターネットに関する用語としてのタグは、本文以外の情報を付与するときに用いられます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るテキストテキストとは、純粋に文字のみで構成されるデータのことをいいます。太字や斜線などの修飾情報や、埋め込まれた画像などの文字以外のデータが表現することはできませんが、テキストのみで構成されたテキストファイルであれば、どのような機種のコンピューターでも共通して利用することができます。詳しく見るHTMLHTMLとは、Webページを記述するための言語です。""にはさまれたさまざまな種類の「タグ」によって、文章の構造や表現方法を指定することができます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るHTMLHTMLとは、Webページを記述するための言語です。""にはさまれたさまざまな種類の「タグ」によって、文章の構造や表現方法を指定することができます。詳しく見るタグタグとは、原義では「モノを分類するために付ける小さな札」のことです。英語の「tag」を意味するものであり、荷札、付箋といった意味を持っています。インターネットに関する用語としてのタグは、本文以外の情報を付与するときに用いられます。Satisfactionの略称で「顧客満足度」を意味します。顧客との関係維持、サービスの発展に関するマーケティング戦略に関わる用語です。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るHTMLHTMLとは、Webページを記述するための言語です。""にはさまれたさまざまな種類の「タグ」によって、文章の構造や表現方法を指定することができます。詳しく見るフォントフォントとは、同一の特徴を持った文字の形状を一揃いでデザインしたものです。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。Satisfactionの略称で「顧客満足度」を意味します。顧客との関係維持、サービスの発展に関するマーケティング戦略に関わる用語です。詳しく見るJavaScriptJavaScript(ジャバスクリプト)とは、Webサイト上でさまざまなインタラクティブな動きを実現するために用いられる言語もっと詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るクロールクロールとは、検索エンジン内のシステムであるクローラ(ロボット)が一つ一つのサイトを巡回し、サイトの情報を収集することを指します。詳しく見るバナーバナーとは、ホームページ上で他のホームページを紹介する役割を持つ画像ファイルです。画像にリンクを貼り、クリックするとジャンプできるような仕組みになっています。画像サイズの規定はありませんが、88×31ピクセルや234×60ピクセルが一般的です。静止画像だけでなく、アニメーションを用いたバナーもあります。詳しく見るHTMLHTMLとは、Webページを記述するための言語です。""にはさまれたさまざまな種類の「タグ」によって、文章の構造や表現方法を指定することができます。Satisfactionの略称で「顧客満足度」を意味します。顧客との関係維持、サービスの発展に関するマーケティング戦略に関わる用語です。Optimization)とは、GoogleやYahoo!などのサーチエンジン(検索エンジン)で、特定キーワードで検索が実行されたとき、ホームページが表示される順位を上げるためのさまざまな施策のことです。詳しく見る検索エンジン検索エンジンとは、インターネット上に無数に存在するホームページのデータを集め、ユーザーにそれらを探しやすくしてくれるサービスのことです。「検索サイト」とも呼ばれます。JAPANやGoogleなどがあります。大手検索エンジンは、スマートフォン向けのアプリも提供しており、これらは「検索アプリ」と呼ばれています。GoogleやYahoo!などの検索エンジンで検索したときに表示される情報のことです。Page」の頭文字から「SERP」と呼ばれることもあります。検索結果には、検索エンジンの機能に関する情報と、検索キーワードに関連する情報を持つページが表示されます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。GoogleやYahoo!などの検索エンジンで検索したときに表示される情報のことです。Page」の頭文字から「SERP」と呼ばれることもあります。検索結果には、検索エンジンの機能に関する情報と、検索キーワードに関連する情報を持つページが表示されます。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。Optimization)とは、GoogleやYahoo!などのサーチエンジン(検索エンジン)で、特定キーワードで検索が実行されたとき、ホームページが表示される順位を上げるためのさまざまな施策のことです。詳しく見る検索エンジン検索エンジンとは、インターネット上に無数に存在するホームページのデータを集め、ユーザーにそれらを探しやすくしてくれるサービスのことです。「検索サイト」とも呼ばれます。JAPANやGoogleなどがあります。大手検索エンジンは、スマートフォン向けのアプリも提供しており、これらは「検索アプリ」と呼ばれています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るユーザーユーザーとは、コンピューターやシステムを利用する人のことを指します。意味を持つ英単語で、対義語は「メーカー」や「デベロッパー」などがあります。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るキャッチコピーキャッチコピーとは、商品などの宣伝の際に使用される文章のことです。宣伝をする対象のイメージや特徴を簡潔にまとめつつ、見た人の印象に残る必要があります。一言で完結するものから数行になる文章など、実際の長さはバラつきがあります。キャッチコピーの制作を職業とする人のことを、「コピーライター」と言います。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。システム)と言います。ホームページを作成するには文章や画像などのコンテンツの作成からHTML、CSSを使った構成・装飾の記述、リンクの設定などが必要ですが、CMSを使用すればこれらの作業を自動的に行なうことができます。詳しく見るHTMLHTMLとは、Webページを記述するための言語です。""にはさまれたさまざまな種類の「タグ」によって、文章の構造や表現方法を指定することができます。Satisfactionの略称で「顧客満足度」を意味します。顧客との関係維持、サービスの発展に関するマーケティング戦略に関わる用語です。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るページ印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。詳しく見るコンテンツコンテンツ(content)とは、日本語に直訳すると「中身」のことです。インターネットでは、ホームページ内の文章や画像、動画や音声などを指します。ホームページがメディアとして重要視されている現在、その内容やクオリティは非常に重要だと言えるでしょう。CD-ROMなどのディスクメディアに記録する内容をコンテンツと呼んでいました。「Pardotユーザー会」が国内最大級のMAユーザー会へと成長した理由マーケティングオートメーション(MA)ADCMS・Webサイト制作Webサイト制作でよくある失敗例5選。プロのディレクターが教える処方箋とはCMS・Webサイト制作ADSEO(検索エンジン最適化)記事を作っているのにサイト流入が足踏み・・・・・・。そんな状況を打開する「正しい努力」の仕方SEO(検索エンジン最適化)BtoBマーケティングのノウハウ資料をダウンロード!基礎から4ステップで実践まで!BtoBマーケティング実践ガイド(無料)BtoBマーケティング実践ガイドは、BtoB事業のマーケティングのノウハウを網羅的かつ体系的にまとめたものです。基礎から応用まで4つのステップでマーケティングが実践できるBtoBマーケターの永久保存版です。株式会社SoLabo「0→1」「1→10」がどちらも叶う。株式会社ベーシック【求人】サービス価値を高め市場を創造。編集部厳選!最新情報をお届けもう一度読みたい記事をブックマーク実務に役立つ資料をダウンロード無料会員登録会員ログインこの記事を書いたライターferret編集部ferret編集メンバーが不定期で更新します。【2019年版】無料で使える画像編集ソフト・GIMP(ギンプ、ジンプ)の使い方AD記事を作っているのにサイト流入が足踏み・・・・・・。そんな状況を打開する「正しい努力」の仕方ADWebサイト制作でよくある失敗例5選。【2019年版】無料で使える画像編集ソフト・GIMP(ギンプ、ジンプ)の使い方ADWebサイト制作でよくある失敗例5選。PIECE』を超える異例の売上。『鬼滅の刃』が大ヒットした理由ケーススタディで学ぶ。関連記事AIをオンラインで学習できるおすすめサービス7選Webサイト制作でよくある失敗例5選。プロのディレクターが教える処方箋とはWeb担当者が陥りがちなサイト運営の行き詰まり。人気記事をもれなくチェックSNSで話題!BtoBビジネスで勝てるマーティングのノウハウを1冊の資料にまとめました。