htmler

webページ作成をサポート。webコーディングをショートカット。実験もするよ!

ホームページ制作の近道

ホームページを作ろう!

という人はたくさんいると思います。

 

目的は個人でもビジネスでもいろいろ。

 

ホームページの作成について僕はいろんな回り道を経てやってきました。

正直こんな道歩きたくなかった!とまでは言いませんが近道についてこっそり書いちゃいます。

 

まず結論は

パソコンは64bitwin10メモリ8gのi3以上のcpuを積んだSSDのパソコン。

ソフトはPhotoshopDreamweaverFFFTP。(無料でやる情報は↓)

素材集サイトへの登録。(商用webページであれば商用フリーか)

あとは下記サイトでいろんなホームページを見てこのブログのオススメ装備(テンプレやフレームワーク)を使ってください。

あとはお客様からの聞き出し能力です。

 

 

ホームページを作るにはまず、

  1. パソコン
  2. コーディングソフト(簡単に言うとテキストエディタ
  3. 画像等の素材
  4. デザイン力
  5. HTML,CSS,JS,PHP各種装備
  6. お客さんからの聞き出し力

これらが必要になります。

 

①パソコンとか文字うてりゃいいんじゃないの??

おっしゃる通りです。

ですが、画像編集、動画編集を視野に入れるのであれば、それなりの準備が必要になります。

それをふまえて、i3以上のプロセッサ、メモリは4G以上で、SSDであればなおよしです。ここでwin10の出番なのですがwin10は使わないメモリを圧縮してくれるので画像編集ソフトをひらきっぱでもそれなりに軽快にコーディングができます。

え?画像編集は分けてやれ?すいませんでした。

ちなみにノートパソコンであれば出先で書類が必要!ってなった時にささっとテザリングセブンイレブンネットプリントで出したり、書類を画像にしてSDカードから印刷、などもできますがノートで上記の条件のPCとなると色々大変です。

次に考えたいのが

 

②使うコーディングソフト。

 僕の推移は

EmEditorMicrosoft Expression→DreamWeaver

でしたが後ろ二つはそれなりに重い・・・

なのでPCそれなりにスペックが要求される場面が出てきます。

Microsoft Expressionは無料で使えるソフトでは比較的使いやすいので無料で使うならいいかも?2013年から無料で使えるようになっています。

言わずと知れたDreamWeaverAdobeのcreativecloudの料金がそれなり(月5000程度)ではありますが慣れると直感的な動作がとても軽快です。

photoshopとの連携機能や、illustratorベクターhtml5に書き出し等、adobeccはおすすめかも。ExpressionとGIMPを使ってた時代に比べて作業時間が3分の1ぐらいになりました。

 

③画像等のメインで来る画像については一番凝る事をおすすめします。

一発目にドーンと見える画像でそのページの印象が決まると言っても過言ではありません。

多少時間をかけても素材サイト巡りをおすすめします。

その場合、商用フリーか、改変の許可があるかは確認してくださいね。

 

そしてペイント以上の画像編集ソフトが必要になります。

フリーでおすすめなのはGIMP

photoshopと似た操作で使えるのでPhotoshopを学校で使っていたけど月々の支払いが・・・という人におすすめ。

元はlinuxで開発だったようなそんな気がします。オープンソースはいいことですね!

日本語版はこちら。

GIMP - 窓の杜ライブラリ

 

 

④デザイン力!これですね。

HPは見た目が命!

これはいろんなサイトを見て感性を磨いてみてください。

美術館巡りをするよりもサーフィンしたほうがいいですね!

オシャレなウェブサイトの参考デザインリンク集 | ウェブ・ファインダー

 

フレームワークのようなものですね!

これは書くと長くなってしまうので今回は簡単に。

制作をするにしてもテンプレートや基礎のCSS、埋め込みフォーム、お問い合わせフォーム等、かなりの資源が必要になります。

 

これを一からそろえるのは大変なので次の記事でまとめます。

 

⑥お客様の要望等、最初に最終形をしっかり見えるようにしておくのは重要なことです。

実際に依頼をいただいた時に、自分がいいと思うデザインで納品して全部作り直しになった事もあります。

最低限配色、写真等、先に決めておいたほうがいい事に関して契約書と共に次の記事で説明したいと思います。

作り直しが無いことを願います!

 

 

どうでしょうか?お役に立てそうでしょうか?

この記事についての質問ももちろん受け付けておりますのでコメントをどうぞ!

メール、Twitterでのお問い合わせももちろん可です。

 

よいコーディングライフを!