ホームページを無料で初めて作る! -3時間目:無料テンプレ探しの堂々巡り⇒苦しい⇒からの見えてきたもの-

今日も頑張りました、50分HPのお勉強。

 

今日は、さっそく記事を変更していこう!

…と思ったのですが、またつまづきましたよw

 

しかし、諦めちゃダメ。

雨の後には虹が見えるんだぜ!?

 

 

ちょっと時系列に書いていく。

 

スポンサーリンク

設計図の罠

最初は、titleをいじる。

左上のロゴの上にある字が、変わると思ってたのな?

何も変わんねぇwと思ったら、実はタブ部分だったという罠w

 

うん、全然HTML理解してなかったな\(^o^)/

 

勘違いしていたところは、h1だったわw

しかし、これに気づいただけでも、すげぇ嬉しいのなんの。

 

 

んが、ここで問題が起きる。

 

前にフォトショで作った設計図。

「これを元に作ろうかなぁ~?」と思ったのがことの始まり。

 

きれいな無料テンプレにはめ込んで…

ん~なんかキレイにはまらないよな。

なら、他の無料テンプレ探すかぁ~?

 

ここからが、時間泥棒の始まりだった。

 

 

30分探すハメに

あ~、30分だったのか。

それだったらまだ短かったなw

いや、リアルタイムだと長く感じたんだよぅw

 

 

そう、これから使おう!と思っていた無料テンプレ。

結構な数があるんですね?

色々見ていたら、ふと思ったんです。

 

イラストのサイトを作ろうと思うんだけど、

この無料テンプレって、イラスト向きじゃなくないか?と。

 

 

イラスト用テンプレ

んで、「イラスト 無料テンプレート」って検索したんですね?

そしたらさ、すんげぇ~素晴らしいサイト見つかってね?

 

「Tumblr」っていうのなんだが、

素晴らしく美しくて。

しばらく見とれてたからねぇw

 

「あっ、もしかして、

神のような美麗イラストサイトってこういうの利用してんの?」

ってふと思ったからなw

 

どんだけ無知なんだよと\(^o^)/

 

しかし、逆に綺麗すぎんですよ。

なんちゅーか、ハムスターイラストのサイトを作るのですが…

 

これ完全にプロ絵師用のポートフォリオじゃね?と。

 

ちょっと場違いだな、と。却下になりました。

 

 

けどやっぱりイラストテンプレがいい

他にイラスト特化用のテンプレはないか?

探したんですが…なんだろう、英語が多い…。

 

そんなの、わっかんねぇーよ\(^o^)/

 

なんか違う…ってのがまた出たので、

もうイラスト特化用テンプレは諦めました。

 

 

あと、余談だが、FC2ってPHPが使えないらしい。

 

マヂか。

 

忍者HPでもそうであって、困ったんですよねぇ。

まぁ、PHPのない無料テンプレを選べがいいのか。

 

ってかね、PHPって言葉よくわからないけど、

「あ~!あれか!忍者でも困ったんだよね~!」って、

わかんないことがわかって、嬉しかったんだよね。

 

なんか、自己啓発系で勉強しまくった時に、たまに思ったんだけど、

私は新しい知識が増えるの、けっこう好きな方なんだろうか…?

 

 

見る人の気持ち、考えろ?

ここで、イラスト系のテンプレを探していたときに気になったブログが。

更新日付は古かったのですが(2012年)、今でも通じることだった。

 

ゴッチャゴチャしたきれいなサイトをイメージして、

そんなステキなHPを作りたい!と思いませんでしたか?

 

……思いました\(^o^)/

 

もっと早くその言葉を聞きたかったw

…まぁ、自分で気づけたからいいか…。

自分で気付けるのが一番最強だと思うし。

 

 

さらに、そのブログは同人誌用のHPを作ろう!というテーマだったのですが、

 

メインはなんですか?アナタの作品ですよね?

なら、デザインよりも作品を目立たせた方が、いいのではないですか?

 

………全くもって、そのとおりです\(^o^)/

 

あと、

  • まずは完成させる
  • デザインは触っているうちにわかってくる
  • 読みやすい配色を使う
  • サイトマップとかいちいち押さない
  • 誰でも分かる言葉でメニューを作る

 

というのも書かれていました。

 

散々迷ったときに欲しかった答えが、ここにあった

 

 

…いや、うん。

やっぱりさ、人間って素直に人の意見を聞けない生き物じゃん?

 

痛い目見ないと、それこそ理解できない。

しかも何回も痛い目見ても、学習しない(私だ)

 

マジで学習するまで時間かかるタイプだよね、私はな!!

 

いっぺん落ちた(迷いまくった)から、やっと素直に理解できた気がする。

 

 

人間の成長には、”素直”が不可欠である   -ルイ-

 

 

-原点回帰- ~まさかの気づき~

結局戻ってきた、最初の無料テンプレ。

ビジネス用のがいっかなぁ~?とか思ったけど、ビジネスじゃねぇんだけどな。

本当、謎なこと考えるよな。

 

結局、最初に戻ってきました。

数あるサイトを見まくる。

 

しかし、なかなか選べない。

ありすぎて、逆に迷う。

 

そうなんですよ。

選択肢って多すぎると、逆に混乱するんですよ。

んで、無駄に「もっとキレイに!」とか欲が出てくる。

 

 

  • 背景に色つけたいな~、これ背景どうなってんだ?HTMLわかんねぇw
  • サイドに、こんなのいらないんだけど?w
  • ってか、イラスト並べるのこれダサイよwやっぱイラスト特化テンプレ…

 

 

もーええわい!!\(^o^)/

 

さっきまで、

さんざん、

なやんだ、

だろうがぃ~~~~~~~~~~~~~~!!!

 

また繰り返すんかい、

また「イラスト特化の堂々巡り!片道★地獄切符コース♪」をエンジョイすんのかい!

 

お前は悩むのがそんなに好きか。ドMなのか。

 

とまぁ。

こんな感じで自分との戦いですよw

 

 

しかしですね、これを乗り越えると、

光が見えたんですよ。

 

 

  • サイドバーは、ハムスターの一覧に利用するのはどうかな?
  • サムネ、これハムを一覧で並べられるじゃん?
  • 会社概要のこれ、ハムスターの紹介とかに利用できるかも?
  • サイドバーでページを飛ばして、1ページずつハム紹介しようか?
  • このカラー、もしかして自分のフォトショ技術で変更できるのでは?

 

 

なぜか、

今あるもので満足して、

次々とアイディアが降臨してくださった

のですよ。

 

イメージが湧いてきて、

すんごい、わくわくしちゃってね。

 

 

 

あっ、無い物ねだりしてたんだなと。

有るもので勝負すればいいじゃないか、と。

 

 

それに、色んなテンプレを見ていたら、テンプレの規則性に気づいたんですよ。

だいたい同じ型で作られているって。

 

見回りまくった時間は、無駄じゃなかったんだなって。

 

 

色々といい感じになり、そっからはもう、

「すぐさまHTMLいじりにこう!」ってなったわけですね。

 

すごく不思議な感覚だった。

 

 

神デザインから学ぶもの

まず、全体のカラーを変更したくて。

 

無料テンプレは、

全体的に緑のカラーだったんですね?

 

imageフォルダの、

緑のバーか何か?の画像を見つけ、

フォトショで開く。

 

んで、

私はオレンジ系のサイトにしたかったので

オレンジ系に変更。

 

そして、ネット上で確認してみたら…

 

なんということでしょう?


そこの色が変わるのですか…!

 

びっくりした。

だってこの画像って超ちっさいんですよ?

横幅11pxですよ?

 

私は、バーというものは

最初から大きさを決めて作るもの

と思ってました。

 

しかしコチラの無料テンプレは

ちっさいがぞうを超並べる命令

がされていたのです。

 

画像編集じゃなくて

CSS?でやってたんですよ。

 

たぶんこれなら

いちいち画像を作り直す必要がない。

 

CSS?とちょちょい!

と直せば、すぐにサイズ変更が可能。

 

天才か?

 

と思ったんですよw

まぁ、こんなのHTML系に詳しい人なら朝飯前なんだろうがw

 

あともういっこ、メニューバー。

これも同じ要領。

ちっさい画像を作って、いっぱい並べる命令をするパティーン。

 

これが、

 

 

こうなる!

 

 

上の白部分が、

カーソルを合わせると下の色になるってね!

まじか、そんな作り方があるのか…!

 

 

超絶感動した!!\(^o^)/

 

 

「触っていたら、わかってくる」

って、こういうことかと。

はぁ~~~!!(感動のため息)

 

 

「既に出来上がったテンプレを触ったほうが、理解度が早まる」

って聞いたけど、こういうことかと。

 

ああ、楽しい…!!

 

 

と思ったら、タイムオーバー。

本日の作業時間の50分が経っていました。

 

おわりに

もっとやりたい!と思ったのですが、止めました。

こういう気持ちを持っていたほうが、明日のモチベが高まると思って。

 

いや~、しかしこんなことになるとは思わなかった。

超絶、探しているときは苦しんでいたのでねw

 

この気持を忘れないためにも、このブログでアウトプットしているのですが…。

 

この記事作るだけで、1時間10分かかったという罠w

 

 

とにかく、行動って大事。

明日も頑張ろう。

 

 

4時間目▼

ホームページを無料で初めて作る! -4時間目:挫折しまくったホームページ作成がどんどん進んで感動しまくった-
どーよ、これ? めっちゃよくねーべ!? いきなり今日の成果を出したったw ここまで来たら、楽しくて仕方がねぇよ。 んでは、今日やったことをおさらいしよう。 本日取り組んだ作業 ...

 

▼HP作成記録▼

HP作成まとめ前半

HP作成まとめ後編

 

 

 

無気力で居場所が無くて毎日つらいあなたへ

生きづらくて、人生詰みかけて辛かった私が、自分を好きになり、かつ残酷な世界で戦える方法を伝えています。

引きこもりながらお仕事しませんか?

コミュ障のせいで、人間関係も上手くいかず、働くのが辛い!苦しい!
この先、ずっとコミュ障に悩まされないといけないの!?将来が不安だ!!
「コミュ障なんかじゃなかったら…!!」
と考えたことはないでしょうか?

実はそのコミュ障、ネットのお仕事では大きな武器になるんです!
新しいあなたらしい働き方、見つけてみませんか?

HP作成記録
スポンサーリンク
コミュ障でもいいのです。
トップへ戻る