Webサイトができました！
※当サイトは、アフィリエイト広告を掲載し、収益を得て運営しています。
posted by ゆみママさん 2010-10-26
馬場様、こんばんは。
ゆみママです。いつもお世話になっております。
講座修了後、自分で１から作ったサイトが初めてできました！
HTMLとCSSをTerapadで作成し、画像はFireworksで作成しました。（ブログ内のイラストはフリー素材です←自分で書こうとしたのですが、なかなかうまくいきませんでした（汗）早く公開したかったので、とりあえずの画像です。）
アップロードとリンクチェックでDreamweaverを使いました。
本を片手にコーディングしました。
今の段階では、難しいことができないので、デザインも極めてシンプルにしています。
サイト作成に当たっては、企画書のようなもの（ただ単に手書きしたものですが）を作りました。
このサイトのコンセプトは以下のような感じです。
①サイトの目的…8月まで受講していた通信講座の課題を掲載してリンクに登録。受講生やOBに見てもらう。
②メインターゲットは誰か…某通信講座受講中の人（だいたい２０～60代）
③どんなデザインにしたいか…初めなので最もシンプルに1段組み。メインカラーは水色、サブカラーを黄緑色にしました。
④使用する素材として、ヘッダー・バー・丸ボタン・ロゴ・TOP画像を作成しました。
⑤サイトの構成…ですが、ディレクトリ構造が突っ込み型になってしまいました。
企画通りに作るのは、とても難しいですが、一生懸命作ってみました。
お忙しいところ恐れ入りますが、このサイトについてアドバイスなどいただけましたらうれしく思います。
サイトのURL…http://www.webdesign-study.info
よろしくお願いいたします。
ゆみママです。いつもお世話になっております。
講座修了後、自分で１から作ったサイトが初めてできました！
HTMLとCSSをTerapadで作成し、画像はFireworksで作成しました。（ブログ内のイラストはフリー素材です←自分で書こうとしたのですが、なかなかうまくいきませんでした（汗）早く公開したかったので、とりあえずの画像です。）
アップロードとリンクチェックでDreamweaverを使いました。
本を片手にコーディングしました。
今の段階では、難しいことができないので、デザインも極めてシンプルにしています。
サイト作成に当たっては、企画書のようなもの（ただ単に手書きしたものですが）を作りました。
このサイトのコンセプトは以下のような感じです。
①サイトの目的…8月まで受講していた通信講座の課題を掲載してリンクに登録。受講生やOBに見てもらう。
②メインターゲットは誰か…某通信講座受講中の人（だいたい２０～60代）
③どんなデザインにしたいか…初めなので最もシンプルに1段組み。メインカラーは水色、サブカラーを黄緑色にしました。
④使用する素材として、ヘッダー・バー・丸ボタン・ロゴ・TOP画像を作成しました。
⑤サイトの構成…ですが、ディレクトリ構造が突っ込み型になってしまいました。
企画通りに作るのは、とても難しいですが、一生懸命作ってみました。
お忙しいところ恐れ入りますが、このサイトについてアドバイスなどいただけましたらうれしく思います。
サイトのURL…http://www.webdesign-study.info
よろしくお願いいたします。
ゆみママさん
こんにちは、馬場です。
初サイトですね！
サイト、拝見させていただきました。
最初からこりすぎてしまって
いつまでたっても公開できない人も結構いると思いますので、
とりあえず公開するというのは、とても重要なことだと思います。
ゆみママさんは、本当に行動力がありますね！
とても素晴らしいことです。
アドバイスを、とのことですが
初めてのサイトとして、言うことなしです！
きちんと企画した通りに作られていると思いますし、
初めてのサイトとは思えない程、
非常に良くできていると思います。
（私の初めてのサイトなんて、全然だめだめでした(笑)）
ただ、それではなんのお役にも立てないので、
ステップアップにつなげるために気づいたことを
お話しさせていただきますね。
■イラストについて
とのことですが、こういった線と塗りがはっきりしている
イラストは、非常にいいお手本になります。
前にもお話ししたかもしれませんが、
こういったイラストを遊び気分でトレースしてみると、
自然とイラストが書けるようになってきますよ。
（※ただしトレースしたものは、
著作権に反さないようにする必要があります）
■コーディングについて
さらなるステップアップとして
Another HTML-lintで100点を目指してみるといいでしょう。
そうすれば、より正しいコーディングの知識が身につきます。
すでにお読みになっているかもしれませんが、
Another HTML-lintは、下記ページで
ご紹介していますので参考になさってください。
▽文法チェッカーで正しい(X)HTML/CSSを書こう
http://www.be-webdesigner.com/tips/coding/syntax_checker.htm
■ディレクトリ構造について
ページ数が少ないうちは、それでもいいと思います。
「301リダイレクト」（簡単に言えば恒久的な転送）を行えば
簡単にページを転送できますので、
後でページが増えたときにでも整理すればいいでしょう。
もし後に行う際は、上記キーワードで調べてみてください。
■CGIの文字コードについて
CGIの設置もきちんとできていますね！
おそらく、パーミッションや、
文字コード関連で苦労されたのではないでしょうか。
特にお問い合せページのみShif_JISのようでしたので、
文字コードで試行錯誤されたことがうかがえます。
（おそらく同じと思われるCGIを私も使ったことがあるので、
そのあたりはよくわかります。）
このままでも特に問題は無いと思いますが、
案件によって文字コードが変えられないこともあります。
ですので、いつか余裕ができたときは
UTF-8など、他の文字コードでも対応できるように
チャレンジしてみるといいでしょう。
（重ねて言いますが、余裕ができてからで大丈夫です）
ステップアップのために
サイトを見て気がついたのはこれくらいでしょうか。
それくらい、初めてにして上出来です。
もちろん、プロのレベルまではこれからもっともっと
経験を積む必要があると思いますが、
今回のようなサイトを繰り返し作っているだけで
自然とできるようになっていきます。
これからも、是非どんどんサイト（ページ）を
公開して、一歩一歩前進していってください。
馬場誠
こんにちは、馬場です。
> 講座修了後、自分で１から作ったサイトが初めてできました！
初サイトですね！
サイト、拝見させていただきました。
> HTMLとCSSをTerapadで作成し、画像はFireworksで作成しました。（ブログ内のイラストはフリー素材です←自分で書こうとしたのですが、なかなかうまくいきませんでした（汗）早く公開したかったので、とりあえずの画像です。）
>
> アップロードとリンクチェックでDreamweaverを使いました。
最初からこりすぎてしまって
いつまでたっても公開できない人も結構いると思いますので、
とりあえず公開するというのは、とても重要なことだと思います。
ゆみママさんは、本当に行動力がありますね！
とても素晴らしいことです。
> お忙しいところ恐れ入りますが、このサイトについてアドバイスなどいただけましたらうれしく思います。
アドバイスを、とのことですが
初めてのサイトとして、言うことなしです！
きちんと企画した通りに作られていると思いますし、
初めてのサイトとは思えない程、
非常に良くできていると思います。
（私の初めてのサイトなんて、全然だめだめでした(笑)）
ただ、それではなんのお役にも立てないので、
ステップアップにつなげるために気づいたことを
お話しさせていただきますね。
■イラストについて
> フリー素材です←自分で書こうとしたのですが、なかなかうまくいきませんでした（汗）
とのことですが、こういった線と塗りがはっきりしている
イラストは、非常にいいお手本になります。
前にもお話ししたかもしれませんが、
こういったイラストを遊び気分でトレースしてみると、
自然とイラストが書けるようになってきますよ。
（※ただしトレースしたものは、
著作権に反さないようにする必要があります）
■コーディングについて
さらなるステップアップとして
Another HTML-lintで100点を目指してみるといいでしょう。
そうすれば、より正しいコーディングの知識が身につきます。
すでにお読みになっているかもしれませんが、
Another HTML-lintは、下記ページで
ご紹介していますので参考になさってください。
▽文法チェッカーで正しい(X)HTML/CSSを書こう
http://www.be-webdesigner.com/tips/coding/syntax_checker.htm
■ディレクトリ構造について
> サイトの構成…ですが、ディレクトリ構造が突っ込み型になってしまいました。
ページ数が少ないうちは、それでもいいと思います。
「301リダイレクト」（簡単に言えば恒久的な転送）を行えば
簡単にページを転送できますので、
後でページが増えたときにでも整理すればいいでしょう。
もし後に行う際は、上記キーワードで調べてみてください。
■CGIの文字コードについて
CGIの設置もきちんとできていますね！
おそらく、パーミッションや、
文字コード関連で苦労されたのではないでしょうか。
特にお問い合せページのみShif_JISのようでしたので、
文字コードで試行錯誤されたことがうかがえます。
（おそらく同じと思われるCGIを私も使ったことがあるので、
そのあたりはよくわかります。）
このままでも特に問題は無いと思いますが、
案件によって文字コードが変えられないこともあります。
ですので、いつか余裕ができたときは
UTF-8など、他の文字コードでも対応できるように
チャレンジしてみるといいでしょう。
（重ねて言いますが、余裕ができてからで大丈夫です）
ステップアップのために
サイトを見て気がついたのはこれくらいでしょうか。
それくらい、初めてにして上出来です。
もちろん、プロのレベルまではこれからもっともっと
経験を積む必要があると思いますが、
今回のようなサイトを繰り返し作っているだけで
自然とできるようになっていきます。
これからも、是非どんどんサイト（ページ）を
公開して、一歩一歩前進していってください。
馬場誠
12/06/30 facebookページ開設しました。RSS代わりにも使いたいと思います。
↓もし参考になりましたら、シェアしていただけると嬉しいです(^-^)