みみずく

実は先日までの「なつ工房」のHPは、専門学校の授業の一環で制作したものでした。
自分でcssやら設定して、本当に自分で一から作ったんですが…まあ一度しか習っていないんでやり方もいじり方ももうとっくに忘れています。

しかもなんというか、習いたてでアレもコレもと詰め込んだせいですっごく見にくい・醜い、使いにくいサイトに！！

初心者あるあるですわ。


ライトボックス(クリックするとその画像が飛び出て表示される)とか、今はもうあまり見ない機能ですよね…。
一時期はフォトグラファーがばんばん使っていたけれど、今はネットショップが商品の細部まで見せるのに使うくらい？？



卒業する前の一年はほぼインターンで今のオフィスに出向していたので、ほぼ4年は手を付けていないことに…。
当然掲載内容はふっるーい作品ばかり！
そしてなんか若いというか痛々しいテキストが並んでいる‼

ぎゃー！
こ、こんなものを晒していたの……！？

調べたら、こんな放置サイトでも日々閲覧してくださっている方や、ウェブ拍手をぽちっとしてくださっている方もいて……本当に心が痛い…。


というわけで、半日かけて改装しました。


まずはテンプレート探し。
もう自分で一からなんて作りません、餅は餅屋、世の中にはいい感じの素材を無料で提供してくださるナイスサイトがいっぱいいます。
私がちまちまタグを打ち込んで構成するよりも、ぐっと無駄のないテンプレートがあるんです。

今回お借りしたのは、Staritさん。
http://sky.starlit.biz/
写真やイラスト、詩などを個人作家さんがよく使うのかな？
かわいいのから爽やかなのまでたくさんの素材を提供されています。


目指すは、さっぱりすっきりなサイト、です


もともとあまりデコっているのは好きじゃないので、もう必要ない機能やページは削除。
ライトボックスもいちいち作品増えるたびにタグ追加するのヤダ。
リンクページはこのブログのリンクがあるから作らない。
自己紹介も簡単に、詳細はこのブログを見てね！


作りたいページがわかったら、何が必要なのかを考えます。
たとえば今回は、バナーが古く感じたのでバナーも作り直しました。
以前のはね、粗くてもう恥ずかしくって…。


イラストレーターで制作。
フォトショップでも作れますが、今回はイラストレーターで。
元データがAIであったのと、別にgifアニメのバナーを作る気はなかったので。
200×40ピクセル、形式はウェブ上でしか使わないのでPNGで書き出しです。
印刷物…名刺や作品カードなどにも転用するならJPEGがいいですが、JPEGは若干粗くなるので、書き出す際は要注意です。


あとは掲載する作品の写真など。
掲載するスペースは基本500×400に決めた（というかテンプレートがそうだった。もちろん変更可能）ので、縮小するなり明度調整するなりして「見てもらいたい作品」のページを作成します。




必要なパーツやページを作ったらリンクを張っていきます。





タグもほぼコピペ。
細かな指示もホームページビルダー様で簡単操作^^
ちょっとわからないことも、ネットで検索すればすぐにヒットします。





大事なのは、作品をすぐにみられること。
作品を見に来ているんだからね。
なのでメニューの下にすぐ作品紹介を置きました。


形式は２フレーム。
左にこのメニューがあって、クリックすると右の大きな画面に作品やらが表示されます。


 

こんな感じ。
さっぱりすっきりなサイトになったかなーと自画自賛！


一応私のarrowsスマホでも確認できたので、スマホでも閲覧可能なはず。
長いこと放置していたので広告が出ちゃっているんですが、今日中には消えるかと。
写真もいくつか掲載しているので、よかったら見てみてくださいね！


 
http://natsukobo.client.jp/



ずーっとずーっとやろうやろうと思っていて、やっていなかったことなのですっきり！
今後はちょいちょい更新していこうと思います！








ブログのランキングに参加してみました！
よかったらクリックしてやってください

人気ブログランキングへ 

手作り市場あ～てぃすと 
素敵なハンドメイドサーチのランキング参加中