2007年08月 アーカイブ

ページ上部のデザイン、ヘッダーデザインを大事にする

情報社会の現在、一般人が求めているのは情報でありデザインを見ているのでは、ありません。これは、確実です。どんなにデザインに優れたサイトであっても、訪問者が求めている情報が見つかりにくければ、そのサイトに訪れてくれる人は減少していくでしょう。

今のサイト制作で大切にしなければ、いけないことは訪問者が求める情報を見つけやすくするこです。

続きを読む

ヘッダーデザインのフリー素材4

天使の像

ホームページやブログのヘッダーデザインに使えそうなフリー素材を作りました。今回は天使の像です。これも絵画風に作成してあります。毎度ながら、たいしたものではないですが、よろしければお使いください。

続きを読む

ヘッダーデザインのフリー素材3

ピアニスト

ホームページやブログのヘッダーデザインに使えそうなフリー素材を作りました。今回はピアニストです。絵画風に作成してあります。たいしたものではないですが、よろしければお使いください。

続きを読む

DEATHNOTE the Lastname

L

ネタ的には古いのですが、DEATHNOTE the Lastnameの話をしたいと思います。

原作の話とは違うので賛否両論は、ありますが僕は面白いなぁと思いました。DEATHNOTEは、好きな作品で単行本も全巻揃えてます。単行本を読んでいる人には否定的な意見の方が多かったとは思うのですが、僕は賛成派です。

確かに、単行本のLの考え方と映画版のLの考え方には、大きな違いがあることは否めません。単行本Lは映画版Lのようなことはしないでしょう。(あまり書きすぎるとネタバレになるから、この辺が限界っす)

でも、作中の最後で。あ~なるほどって納得したんです。納得したし感動した(感動と言うか格好いいなぁと感じた)時点で否定派には、なれなかったです。

原作も知っていて、映画版を観てない人には、観てもらいたいなぁと思います。

HERO ABOUT THE MOVIE

HERO the Movie

今日は、九月八日から公開されるHERO ABOUT THE MOVIEの宣伝です。にっこり

HEROは知ってる人も多いと思います。HEROは面白くて、今見ても面白いと思うほどです。

今作は、どんなストーリー展開になるんでしょう?容疑者は何故、無罪を主張し始めるのか?どんな陰謀が隠されているのか?マスター(田中要次)はどんな料理をリクエストされるのか?気になります。

スクリーンで観たいなぁと思っています。マスター(田中要次)の「あるよ」がスクリーンで聞けるのは今回だけかも知れませんしね!にっこり

きっと面白いと思います。スクリーンで皆でマスター(田中要次)の「あるよ」を聞きにいきましょう!

ヘッダーデザインのフリー素材2

夜の街並み
ホームページやブログのヘッダーデザインに使えそうなフリー素材を作りました。今回は夜の街並みです。絵画風に作成してあります。たいしたものではないですが、よろしければお使いください。

続きを読む

わかりやすいレイアウト

WEBサイト(ホームページ)のわかりやすいレイアウトとは、訪問者が求めている情報を直感的に伝えられるレイアウトです。シンプルですっきりとしたレイアウトにすることを心がけ、訪問者にとって見やすいページにすることが大切です。見やすいことや的確に情報を伝えることを心がけることはアクセシビリティやユーザビリティにもつながっていくことになります。

また、レイアウトを考えるときに注目したいのは人の目の動きです。人間の視点は、左から右、上から下に動くと言われるZの法則と、Fの字を描きながら視点を動かすFの法則があります。これらの動きを意識してコンテンツを配置するようにします。例えば、更新履歴やメインコンテンツは訪問者が最初に読みたい情報です。このような重要な情報は、なるべく左、なるべく上から並べていくようすることが大切です。

基本を抑えることが、素晴らしいWEBデザインの一歩に繋がると思うので、僕もこれらのことを頭に叩き込んでおきます。にっこり

WEBデザインの配色は難しい

webレイアウトと配色は奥が深く特に配色は難しく感じます。中々サイトに適した配色ができないです。

色のことを学ぶには、基礎知識として色の三属性と色の持つイメージを知っておくことが大切みたいです。

続きを読む

SEOの知識

webデザインを勉強していると、SEOという言葉を聞きますよね。というかWEBとは切っても切れない存在それがSEO。自分でホームページを作成したことがある人は、ネットでアクセスアップの知識を知ったり学んだりするので、耳にすることが多いと思います。

ここで、いきなり質問:SEO対策ってどうすればいいの?

A:…どうするんでしょう。焦り分からないですね~。簡単に分かれば苦労しないですよね。

続きを読む

デザインするときに使用するソフトは?

WEBデザインするときに使うソフトは、おそらくPhotoshopかIllustratorかFireworksの3つだと思うのですが、皆さんは、どのソフトでデザインをしますか?

僕は始めの頃は、メインはIllustratorで補助的にPhotoshopを使用してでデザインしていました。Illustrator でデザインするときのメリットは配置のしやすさかな?デメリットはスライス機能が、いまいち使いづらい所。この頃は、Fireworks嫌いでした。ペンツールがPhotoshopとIllustrator に比べると使い辛かったので…

でも、以前務めていた制作会社はFireworksでWEBデザインを作成していたので、Fireworksも勉強しました。今では、デザインはメインはFireworksで補助的にPhotoshopを使用しています。Fireworksも、きちんと使用してみると扱いやすかったですね。焦りスライスツールは特に扱いやすくコレを覚えたときには、Illustrator をメインに使わなくなりました。

皆さんは、どのソフトでどうデザインしていますか?にっこり

ロゴデザイン

WEBデザインを勉強してますが、ロゴデザインにも興味があります。

ロゴデザインって色々あって面白いと思いません?よく思いつくなぁーっていうのも結構ありますし。

それに面白いとか憧れとは別にロゴデザインって、できるようになればホームページやブログのトップバナー(ヘッダーデザイン)とかも締まりのあるデザインになるし幅が広がると考えてます。

自分が作成したロゴで納得できるロゴデザインができたっていうのは一つもありません。オリジナルになるとアイディアが浮かばないんです…まだまだ、それだけロゴデザインも作り足りないんでしょうね…WEBデザインで活躍している方も尊敬していますが、ロゴデザインで活躍している方も尊敬します。

余談ですが、Photoshopのレイヤースタイルのべベルとエンボスを使用したロゴって綺麗で結構好きです。下のバナーは元の大きさより少し小さく縮小していますが、これもベベルとエンボスを使用して作成しました。

サンプルバナー01

デザインとコーダー

WEBデザインを勉強していくと、WEBデザインだけに専念する人か、コーディングだけに専念する人になることがあります。これは、駄目というわけではありません。WEBデザインに専念する人って多いらしいですし。

ただ、僕個人の意見になりますが、まったくコーディングの知識がなくWEBデザインに専念する人は問題があると思います。絶対駄目と言うわけではありませんが、コーディングの知識がないが故にコーディングするには無理があるデザインを作成する可能性がでてきたり、コーダーに無理を強いる可能性がでてくると思います。最悪デザインから、やり直しになる可能性もあり最終的には作業効率も低下します。

作業効率を考えれば、デザイナーもコーディングの知識を知っておくべきだと思うんですよ。逆にコーダーがデザインの知識を知れば、自分の幅が広がりディレクターへの道も見えてくるかもしれませんね。

コーディングもできて、デザインもできるようになる方が良いというか楽しいと思うんですけどね~。
僕はデザインもコーディングの技術も、まだまだ未熟だけど、自分でデザインして最終的にコーディングしていく工程が好きなんですよ。完成した充実感が大きいからです。

…最近は、WEBデザインもコーディングもできるように勉強していかないとホームページ制作会社に入社したり転職したりするのは、難しいとも思うしね…

デザインレイアウトをしてから配色をする

WEBデザインは、まず何の色のついていないデザインレイアウトを先につくり、全体のバランスを見ながら、色をつける部分を考えると配色はスムーズになると書かれている本がありました。

その理由は配色より先にレイアウトが決まっていれば、重要な部分や目を引きたい場所などを明確にすることができます。そして、そのレイアウトに合わせて、用いる色を決められます。

デザインレイアウトをしながら配色をすると、全体のバランスが頭の中で、はっきりしていないと効率が悪くなったり、修正工程が多くなりやすくなるそうです。

人によってデザインの仕方は人それぞれだと思いますが僕は、この本に書かれている通りの仕方が効率がいいと思いました。

ブログのトップバナーのフリー素材

フリー素材サンプル_1
ブログのトップバナーのフリー素材を作成してみました。にこやかな女の子と爽やかなイメージを意識したバナーにしてみました。たいしたものではないですが、よろしければお使いください。

サイズですが、800×200pxと780×200pxと760×200pxの三種類を用意してみました。お使いになりたいサイズをクリックして画像が表示されたら右クリックから画像をダウンロードしてください。

800×200px

780×200px

760×200px

使用にあたっては以下の事を、お守りください。なお、ご利用いただいた時点で同意されたものとします。

当サイトの素材は、個人利用の非商用サイトに限りフリーウェアです。

以下の内容を含むWebサイト、ブログでの利用は禁止します。
・ アダルト系(アダルトグッズ販売なども含みます)
・ 新興宗教系
・ 反社会的な内容や暴力的・猟奇的表現を含むサイト
・ 違法サイト(マルチ商法まがいの内容も含む)
・ 年齢制限のあるサイト

素材の再配布、販売行為を禁止します。

素材への直リンクはしないでください。必ず、ダウンロードしてお使いください。

配布された素材を使用したWebサイトにおいて第三者と生じた紛争については、理由を問わず当ブログサイト「WEBデザインを勉強中」は責任を負わないものとします。

以上です。尚、素材のご使用にあたり報告は必要ありません。けど報告があれば嬉しいですし次のフリー素材の作成の励みになります♪

スクールで学ぶか独学で学ぶか

WEBデザイナーになるためには当然学ぶことが必要になりますが、どうやって学ぼうかと最初は考えると思います。

だいたいマルチメディアスクールや専門学校で学ぶか、自分でネットで調べたり本を買ったりして独学で学ぶか、この二つに分かれます。

どちらの学習方法で学ぶ方が正しいとは言えません。どちらにもメリットがあるし、デメリットもあるからです。スクールで学べば、分からないことは講師に聞くことができますし同じ志を持った仲間とも巡り合えることもできます。独学で学べば、最低限の費用で知識を学ぶことができます。

続きを読む

Google AdSense

Google AdSenseを導入しました。

アフィリエイトに興味があったのでGoogle AdSenseに申請をだしていたのですが、ありがたいことに申請が通ったのでGoogle AdSenseを導入しました。

アフィリエイトも、もう珍しくもなく導入されている方も沢山おられるので簡単には稼ぎには繋がらなくなってきています。でも導入したからには頑張ってサイト運営をしていき、どうすれば人を集めることができるか考えると思います。

その中から学べることって多いと思うんです。サイトに人を集める集客術と言うのは、WEBでは基本であり、もっとも大切なことだと考えています。

簡単なことではなく難しいことですが、僕も自分なりに考えたり本を読んだりして集客術を学んでいこうと思います。

IE6は頑固なんです

インターネットエクスプローラー、通称IE。世界で一番使われているブラウザだというのはWEBのことを学んでいたら、必ず知ることですよね。現在Ver7がマイクロソフトよりリリースされていますが、使用されているのはVer6の方が、まだまだ多いです。

これまた有名ですがIE6は、XHTML+CSSでサイトを構築すると独自の解釈でサイトが崩れることがあります。もちろん僕もIE6に泣かされたことが多々あります。焦り

今では、それなりにですが対処方法も分かってきたので悩まされることは少なくなりつつありますが、たまにとんでもない現象を見せてくれて唖然となります。驚き!

思うにIE6って頑固なんですよ。周りと同じじゃ面白くないから周りと違う個性で我が道を行くみたいな感じで。

こんな頑固者とは付き合ってらんねぇ!…と、言いたいところですが突き放せないのも事実だし、そんな頑固なところが憎めないと思えたりします。焦り

もうしばらくお世話になりますIE6。

表示の違い

僕はWEBデザインをやっていて気になることの一つに、モニターの表示のされ方があります。

例えば、このブログのトップバナーは左側がJPEG画像で右側がflashで構築されています。Windowsでは、ディスプレイの画面の色の設定が最高(32ビット)なら、ほぼ違和感無くバナーが表示されていると思います。これを画面の色の設定を中(16ビット)にすると、JPEG画像とflashの部分がはっきりと分かってしまうくらい表示が見苦しくなってしまいます。

続きを読む

フラワーショップ

フラワーショップフラワーショップのサンプルサイトです。あまり堂々と見せれるものではないですが。焦り

トップページしか作成してありませんが、花屋さんらしく綺麗な雰囲気を持たせられるように心がけながら作成しました。サイト構築はXHTML+CSSで行いました。

XHTML+CSSでサイトを構築するっていうのは難しいですよね~。今でも文書構造は悩むし合っているのかなぁと思うし…おまけにデザインはよく崩れるし…

でも、自分の思ったとおりのデザインにコーディングできた瞬間が嬉しいし楽しいです。コーディングテクニックも磨きたいもんだ。

よかったら見てやってください。にっこり

フラワーショップのサイトを見る

すっかり夏です。暑いですね~。焦り

昨日、夜に履歴書を書こうと思ったら履歴書が無くなっていたのでコンビニに買いに行くことにしました。僕の住んでるところは田舎なので、近くにコンビニが無いので車で行きます。駐車場に向かって歩いていく途中に畑があるのですが、よく見ると何かが光っている。 はて…何だろうと思い、覗き込んでみると蛍が飛んでいました。

僕の近所では、まだ蛍が見れるのです。綺麗でしたよ~。

皆さんは、最近蛍を見ましたか?にっこり

ヘッダー部分をカスタマイズしました。

ヘッダー部分をオリジナルデザインに変更してみました。

ヘッダーを変えるだけでも印象が、変わりますね。にっこり

ヘッダーの右部分はflashで作成しました。アクションスクリプトは勉強していないので単純なものしかできませんが、簡単なものでも作成して完成品を見ると楽しくてしょうがないです。

テーマは夏らしく爽やかな感じを持たせようと考えて今回のヘッダー部分を作成しました。プロになるには、まだまだ程遠いですね…焦り

あぁ、でもこんなパーツ作成でも楽しいものです。パーツを作成してコーディングをして、それが自分の考えたとおりになった瞬間が楽しいです。

もっと勉強をして、もっと色んなことができるようにないたいです。

洗濯機

MTのエントリー編集画面で絵文字を挿入できるようにカスタマイズしてみました。にっこり

さて今日の夕方のこと母が洗濯していたときのことです。

以前から洗濯機の調子が悪く異音がしていました。それでも使用できていたので洗濯をしていたのですが突然…

ゴウン、ゴウン、ゴウ…ゴ……ゴガガガガ……ブジュ~

焦り

音が聞こえた瞬間に、あぁ壊れたなと思いました。

当然、洗濯ができないと困るのですぐに洗濯機を買いにいきましたよ。家に配達されるのは来週の水曜日です。

しょんぼりその間の洗濯どうするんだよ…

MTの仕組み

少しづつMTの仕組みを学びながら、カスタマイズをしています。

カテゴリーの順番を自分の思い通りに並べられるようにしたり、プロフィールの項目を追加したりしました。

ただ、トップページのカスタマイズは比較的簡単にできたのですが、アーカイブページのカスタマイズとかは少し悩みました。テンプレートのどれを変更すると、何処に適用されるのかが解かり辛いです。

それと相変わらずデザイン案ができてません。色んなブログのデザインを見て回っているのですが中々、思いつかないんですよね~

こんなことでは、一人前にはまだまだなれそうにないです。