WordPressを使ってビジネスでホームページを作成 [ネットビジネス]
WordPressを使ってビジネスでホームページを作成
ビジネスでWebサイトを作成する時に、メンテナンスがしやすいWordPressを使う事もある思います。
WordPressのテーマを選んで、「外観」や「設定」を最適化して完了!!
だけではお客様に満足してもらえません。
HTML&CSSの知識を身に着けてお客様に感謝されるWebサイトを作れるようになりましょう。
WordPressでホームページを作成
僕はビジネスでWebサイトの作成をしていますが、WordPressを使ってWeb作成する事が多くなりました。
仕事でWebサイトを作成する時
- メンテナンスが楽なこと。
- カスタマイズが容易なこと。
- 表示速度が速いこと。
3つのポイントを重視しています。
集客できるWebサイトは日々の更新が必要になります。
WordPressで作成したWebサイトはコンテンツを更新した時にページ内の変更だけですむ事が多いのでメンテナンスが非常に楽です。
CSSの設定で表示の仕方を美しく
お客様のニーズに合わせてデザインを変更する時に、CSSの知識が必要になります。
WordPressでCSSを編集する時は「Simple Custom CSS」というプラグインを使います。
このプラグインを使うと、テーマをアップデートした時でも CSSファイルが上書きされないので安心してCSSを変更する事ができます。
Simple Custom CSSについては、過去記事 → 「wordpressプラグイン僕のおすすめ6選はこれっ。 」も合わせてお読み下さい。
CSSの覚え方
CSSは、覚えるのではなくどのサイトを見れば解決できるか(チートシート)知っておくことが大切です。
チートシートとは?
カンニング・ペーパーのこと。
CSS 参考になるサイト
→ 日本語対応!CSS Flexboxのチートシートを作ったので配布します | Webクリエイターボックス
CSS で出来ること
CSS(Cascading Style Sheets)は、HTMLで記述されたWebページの体裁(レイアウト)を指定するための言語のこと。
CSSでは下記の事ができます。
- レイアウトを整える
- 色を変える
- 大きさを調整する
- 線をつける
- 形を変える
- アニメーションをさせる
過去記事 → ホームページ作成 HTML5、CSS3。基本的なHTMLの書き方 も合わせてお読み下さい。
ホームページ作成 HTML5、CSS3の基本 [ネットビジネス]
ホームページ作成 HTML5、CSS3。基本的なHTMLの書き方
ホームページが作れれば、クラウドソーシングなどで1万円から5万円程度の案件がこなせます。
スキルアップすれば、店舗や企業からの依頼を受注して独立し個人事業主になる事だってできます。
ホームページ作成に必要なHTMLとCSSの基本
HHTML(HyperText Markup Language)は、Webページのタイトル、見出し、段落、箇条書きなどの文章構造を記述する言語のこと。
HCSS(Cascading Style Sheets)は、HTMLで記述されたWebページの体裁(レイアウト)を指定するための言語のこと。
基本的なHTMLの書き方
- <!doctype html> このファイルははHTMLだとブラウザに説明するための宣言。
- <html lang="ja"> html要素内で使われている言語は日本語という意味。
- <meta charset="utf-8"> meta要素はhead要素内に配置し、このページに関する色々な情報を記述します。
- ・文字コード
- ・ページの紹介文(概要文)
- ・ページに関連するキーワード
- ・TwitterやFacebookなどのSNSの情報
- ・作ったソフト
- ・著者
- 今回の場合は、「このページは文字コード utf-8 」と宣言しています。
- <head></head> この中に metaタグ、titleタグの書き込み、スタイルシート(CSS)の読み込み、JavaScriptの読み込みを記入。
- <body></body> 文章の本体。
- <nav></nav> ナビゲーションと呼ばれる部分。リンク集の内容を示す見出しやリンクのリストなど。
- <article></article> 自己完結する内容を表すセクション。記事の見出しや文章など。
- <section></section> 汎用的なセクションを定義する。コンテンツ内においてテーマでまとめられた部分(見出しや文章など)。
- <header></header> まとまりの最初の部分。
- <footer></footer> 一般的にそのセクションの筆者、関連ドキュメントへの陸、コピーライトなどの情報。
- <title></title> Webページのタイトル。
- <h1></h1> 見出しとなるテキスト。h1からh6まで。
- <p></p> 段落。
- <a href="#" target="_blank"> リンクを作成。
- <img src="./images/sample.jpg" alt="サンプル画像"< 画像ファイルのURL.
- <div></div> CSSを適用させる部分で使う。
- <address></address> 連絡先。
- <small><small> 誤解を避けるための注意書きや警告、法的制限、コピーライトを表す法律用語など。
基本的なCSSの書き方