Web初心者の絵描きによるイラスト用のホームページのつくり方 STEP1

Yuko
絵描きとして、ちゃんとしたお仕事用のホームページをつくりました!

 –>> Web初心者のわたしが自力で作ったホームページはこちら

Webサイトづくりは素人、完全に初心者でした。(このブログを立ち上げたときも、ちっちゃいことからググって頑張りました)

この記事では、わたしと同じように

絵描き・イラストレーターだけどWebサイトづくりは初心者だよ〜。
そもそも初心者でも出来るの?どれくらい大変なの?」

と悩んでいる初心者に向けて、自力でイラスト用のホームページをつくるまでをシェアしたいと思います。

 

そもそも 「ホームページ」 といっても色んなタイプがありますが、今回わたしがつくろうとしたのは…

  • 仕事用のホームページをつくりたい
  • 海外のアーティストのようなポートフォリオサイトにしたい

と、目標だけは高めのゴール設定ですw

なんで「海外のアーティストのようなポートフォリオサイト」かというと、これまでの問い合わせが国内よりも海外からが多かったことと、自分がこんなサイトを作りたいな〜!と思ってブックマークしたサイトがほぼ海外のアーティストのものだったからです。

単純にかっこいいから、好みだから。こういうの作りたい!というポジティブなイメージ目標は大事です〜♪

 

Webサイトづくりは初心者で悩んでいる、、、でもがんばって海外のアーティストのようなホームページをつくりたい!という絵描き・イラストレーター仲間のために、そしてわたしの努力を成仏させるために(笑)、記事にしておきます。

✔︎こんな人に役立つ記事
  • Webサイトづくりは初心者の絵描き・イラストレーター
  • 仕事用のホームページをつくりたい
  • 海外のポートフォリオサイトのようにしたい
  • 自力(ワードプレス)でコスパ良くつくろうと思っている
  • 必要なものと費用感をざっくり知りたい!

 

Yuko
そもそも自分のホームページ(ポートフォリオサイト)って必要?!と、まだ迷い途中の方は、以下の記事を先に読んでみてください

わたし自身、ずっとSNSとブログというプラットフォームのみで仕事を受けていましたが、仕事のためにホームページをつくらねば!と思い立った理由などをお伝えしています。

 

 

Web初心者の絵描きによるイラスト用のホームページのつくり方

WordPressでホームページを作成するには?

さて、今回わたしがつくったホームページはこちらです。

ホームページ作成ツールはたくさんありますが、たくさん調べて悩んだ末、WordPress(ワードプレス)を使って自力でホームページをつくると決めました。

よく、簡単!無料ツールを使って初心者でもすぐできる!とか、3分でできる!とかい広告がありますが…. 誇大広告だと思います

そりゃ〜見た目を気にしなければ速攻でもできますが…..クリエイティブ従事者なら見た目は大事ですよね?

WordPressを使って自力でホームページをつくるなら、初心者にはそれなりに時間がかかります!と、わたしはハッキリ言いたいです。

お金はある!とにかく手間をかけたくない!という方には、まるっと全部でパッケージになっているサービス(StudioとかSquarespaceとか)も他にありますけどね〜。

(その辺りは前回の記事に書いています)

 

わたしがつくったホームページの場合は、具体的に以下のツール・サービスを使いました。

今回つかったものリスト

  1. サーバー:エックスサーバー (有料)
  2. ドメイン:エックスサーバー (無料キャンペーンを利用)
  3. ホームページ作成:WordPress(無料)
  4. デザインテーマ:Rife Free(無料)
  5. デザインプラグイン:Elementor(無料)
え?なんかよくわからんものがいっぱいあるんだけど!
Yuko
大丈夫!
ひとつひとつの始め方とか手順は、Webのプロのブロガーさんがいる!スクショ画像付きでブログ記事にしてくれているので、ググればOK!

 

WordPressでホームページを作成するために最低限必要なものは1〜3だけです。

しかーし!わたしの目標は海外のアーティストのようなポートフォリオサイトにしたい!なので、デザイン的に4と5も利用しました♪

 

もちろん、それぞれの要素ごとに選択肢は膨大にあります。

特に4と5は何万種類とか?無限です。

わたしも一応(Webサイトのことは分からないながらも)このブログをWordpressで3年運営していたので、過去のプラス&マイナスの経験をふまえて選びました。

選んだ基準などは、できあがったこのホームページとわたしこのブログの雰囲気などを基準に、あなたの参考になりそうなら、この続きもCheckしてくださいね^^

 

費用はどれくらい?

Yuko
Web初心者でもなんとか自力でつくれたので、初期費用はサーバー代4,000円のみ!

+維持費およそ月1,000円のみでできちゃいます!

ホームページ作成費用のうちわけ

  1. サーバー:エックスサーバー –>> 初期費用3,000円+月1,000円ほど
  2. ドメイン:エックスサーバー –>> 無料プレゼントを利用
  3. ホームページ作成:WordPress –>> 無料
  4. デザイン:Rife Free –>> 無料
  5. デザイン:Elementorプラグイン –>> 無料
自分のホームページ作成って、やっぱりお金かかるのか〜

仕事用のホームページを作成するためには、大なり小なり費用はかかります。

プロに頼まずに自力でつくってもサーバーとドメインの契約は必須です!

補足

サーバーとドメインってなぁに?

ブログでもホームページでも、自分のWebサイトを作成するには、サーバーとドメインというものを借りなければ!なのです。

サーバーはWebサイトのデータ置き場、ドメインはサイトのURLとして必要です。 だれかが言っていたわかりやすい例え話だと、サーバーは賃貸契約、ドメインは住所登録みたいなものですね。

特に!今回は仕事用のホームページ

これから新規営業もかけたいので、「営業ツールとして信頼感が欲しい」、というのがわたしの目的でもあります。そのための月1,000円というのは、かなり安いと判断しました。

 

必要な各サービスと選んだ理由

では、それぞれのサービスを契約しましょう!と言われても不安だと思うので、

Yuko
なぜそのサービスを選んだのか?理由をシェアしますね!

わたしはこれまでこのブログをWordpressを使って3年以上運営してきました。

今までに「もっとこうだったらな〜、ここが不便だな〜」と思うことが色々ありました。

たとえば、「サーバーはロリポップじゃなくてはじめからエックスサーバーにしておけば良かった、、、」とか。 

この3年間のブログ運営で感じた、はじめからこうすれば良かった、、、という反省をふまえてこの5つを選びました。

それでは、ひとつずつ!

 

1. サーバー 

Yuko
たくさん画像をアップしても安定!コスパが良いのでエックスサーバーを選びました!

絵描き・イラストレーターだったら、サイトへアップロードするのは画像がメインです。

絵なので画質は大事だし、仕事につなげたいならあまり低画質はものはアップできません。

画像データは重いですよね。そして作品が増えるほど画像は増えつづける!

 

かつてこのブログでは、容量はそこそこだけど安いロリポップ! というサービスを使っていました。

が、アクセス数がアップすると接続が遅くなっていくという不都合が…..

安定のために大容量のエックスサーバー に変えました。

大きいデータ容量でも安定して稼働してくれることはすなわちアクセスが安定すること!これ大事です。

ホームページを見てくれる人の利便性はとっても大切なことです。

 

そしてもうひとつのメリットは、エックスサーバー独自の「ドメイン無料プレゼント」というお得なキャンペーンです。

わたしはこのキャンペーンが決め手でした。その理由は次の2.で詳しく。

 

2. ドメイン

Yuko
キャンペーンを使えばドメイン代が永久に無料なエックスサーバーは長期でお得!

通常、ドメインは有料で契約します。

このブログも<ekakisketch.com>というURLを所有するためにはドメイン契約が必要です。

実はこれ、年1,500円ほどのコストがかかっています。

残念ながら、このブログを始めた当時はエックスサーバーのお得なキャンペーンを知らなかったのです….(´・ω・`)ゞ 

ホームページを所有する限り、ドメイン代は必ず毎年かかります!

まあ、正直ブログはいつ辞めるかわからないですが、仕事としてのホームページはすぐに辞める気持ちじゃないですからね!

この毎年1,500円の違いを10年20年と長期で考えると… もったいな〜〜〜ってことです。

永久に無料でドメインが使えるエックスサーバーを選ばないわけにはいきませんよね〜。

注意
エックスサーバー のドメイン無料プレゼントのキャンペーンは、期間限定キャンペーンです!

とはいえ、1年のうち8割くらいキャンペーン期間中という(笑)、ユーザーには超ありがたいキャンペーンです。エックスサーバー の公式HPでキャンペーン対象期間をチェックして、契約するならしっかり狙うのがオススメです!

わたしはホームページのドメインは無料で使っています^^

 

3. WordPress(ワードプレス)

WordPressはユーザー数が圧倒的に多いのです!情報収集するとき、この要素はめちゃくちゃ大事です。

ユーザーが多いおかげで、Webのプロがブログで紹介しているハウツー記事がたくさんあるので安心です。

このブログを3年以上運営している間も、システムアップデートに戸惑ったときググればすぐに解決方法が見つかりました。Web初心者の私でも大丈夫なくらい親切な記事がたくさんあります。

ただ、マニュアルを読んだりするのはとにかく嫌!お金はあるからプロに任せたい!という方にはWordpressは不向きだと思います。

わたしの失敗体験

もっと簡単で無料のホームページ作成サービスもあります。実はわたしも一度試しました。TumblrはSNSの延長でホームページがつくれる、と聞いて一時期ホームページ代わりに使ったことがあります。
しかしですね、、、思いの外、大変でした。Tumblrをホームページっぽく作り込もうとしても、ハウツー記事が少なくて困ったのです。(ざっくりとは作れても、ちょっとしたデザイン変更ができない。困った時のトラブルシュートが少なくて解決しないという。。。)ホームページ利用している日本語ユーザーが少ないから情報が出回ってないのかも。結局、簡単なようで調べるのがめんどくさくなってしまい、Wordpressに変えました。

>> 過去にTumblrでつくったホームページはこちら

4. WordPressデザインテーマ:Rife Free

Yuko
ここからは完全にわたしの好みです〜!

1〜3までは自分のホームページを所有するにあたり最低限必要なものでした。

ここからはデザインの話なので、完全に個人の好みで変わります。ご参考までに〜。

 

わたしのゴールは、海外のアーティストっぽくて、仕事用に作品をアピールできるポートフォリオサイトがつくりたい!」

ということで、

  • 海外のアーティストっぽいポートフォリオサイトのデザイン
  • コストは大事!無料 or 有料でも買い切り型
  • 英語でもOK

こんな視点で選んだのが、RifeというWordpressテーマです。

 

(画像:https://rifetheme.com/brownie/より)

Yuko
このサンプルサイトを見て、めちゃくちゃ使い心地いいーーー!と直感しました♪
え、、、英語じゃん!ムリーーー!

大丈夫、できるだけ紹介します!

 

英語だけど、公式のハウツーが充実で安心!

英語ですが、公式サイトにStep by stepで設定方法も詳しく書いてあるし、解説動画もあって親切です。

それにユーザーフォーラムもあって直接質問もできる!

公式サイトは英語ですが、デザインをダウンロードした後、実際にふだん使うユーザー画面は日本語対応しています。

 

5. WordPressデザイン用プラグイン:Elementor

Yuko
このデザインツール、最強です!!

このプラグインは、Web初心者でも直感的にサイトをデザインできる最強のツールでした!!

4でWordpressのテーマにRifeを選ばなかったとしても関係ありません。

このElementorはWeb初心者のWordpressユーザーにオススメしたい!!と思います。

 

そもそもこのブログ、絵描きのライフスケッチでもサイトのデザインを調整するには、HTML(Webサイトをつくるための知識のひとつ)が必要で、ちょこちょこ勉強しながらつくってきました。

とは言っても、ググって調べる程度ですが。

でも!

Yuko
Elementorを使えば専門知識が全く必要ないと言えるのでは?!

という衝撃でしたよ!

 

とはいえ、現時点ではまだ日本語の解説が少ないのでそこがネックですかね〜。

わたしからも(仕事の合間ではありますが)できるだけ解説していきますね!

 

Web初心者の絵描きによるイラスト用のホームページのつくり方:まとめ

おつかれさまです〜。

ホームページをつくると決めてから、つくりたいイメージが固まり、使うサービスの選定についてを紹介しました。

別の記事で具体的な設定方法も紹介していきますね。

一気にやろうとすると、Web初心者には頭がオーバーヒートしますから、ゆっくりコツコツと。

わたしは、1日ごとにちょっとづつタスクを分けて、作品制作してリフレッシュしながら進めていました。

なので、これから頑張ろうとしている方もぜひ息抜きしながらで〜

✔︎わたしが使ったホームページ作成サービス・まとめ
  1. サーバー:エックスサーバー 
  2. ドメイン:エックスサーバー ※無料プレゼントを利用
  3. ホームページ作成:WordPress
  4. デザインテーマ:Rife Free
  5. デザインプラグイン:Elementor

 

補足

もしあなたが仕事用のホームページをつくろうとしていてリサーチしているならば、ちょっとでも気になったサイトは即ブックマークしておくことをオススメします。

たくさんのサイトを回っているうちに、「あのちょうどいい説明のサイト、どこだっけ?」と思ってあとからググってみても、ちょうどいい情報には二度とたどり着けないことも多かったので!使えそうなら即ブックマーク!

では続きはこちらから〜

✔︎自力でホームページを作るまでシリーズ

  1. STEP 0 迷う。 自分にホームページは必要?
  2. STEP 1 作る。 どのサービスを使うべき?費用はどれくらい?ざっくり知るためにリストアップ ←今ここ!
  3. STEP 2 作る。イラスト用ホームページのデザインする!用意するものリストアップ ←続き
  4. STEP 3 作る。ポートフォリオページにつくりこむ