メニューバー

こんばんは。

卒業制作展の件、以前から「したいなぁ～」と話題には上っていましたが、いよいよ現実味を帯びてきましたね。（というか、もうせざるを得ない状況にまで来ました!!!!）やるしかないでしょう!!!!それにしても、自分たちの展覧会だなんて、テンションあがりますね～。

チラシに関しては、本当なら私がイラストレーターの部分もしなければならなかったのですが、時間がなかったので八十吉さんにしてもらいました。ありがとうございました。あまりの速さにびっくり!!そして、てきぱきと作業が進むのを横で見ながら、盗みたい技がいっぱいありました!!やはり、イラストレーターでは、文字間を調節するための【ALT＋矢印キー】は、作業の効率化にかなり貢献しているということが、生の作業を見て分かりました。自分だったらこうしていただろうなぁ……、どえらい時間がかかっていただろうに……、と関心しきりでした。

さて、サイトの作成にも入っていますが、皆さん進み具合はいかがでしょうか??ちらりと目に入るimrさんの作業の早さや（だって、もう、サイトっぽくなっているのですよ?!）、八十吉さんが後ろでJavaScriptの何かを設置しているらしく「できた、できた」との声に、ま、まじでか……ツーーー（←焦りゆえの鼻水が流れる音。）となっておる私ですが、今日はメニューバーについて情報を共有いたしたく投稿します。

コンテンツをグルーピングすることは大切だと先日のSEOで習いましたが、グルーピングしたコンテンツをどのようにまとめたらええもんかのぅ～、と考えていたところ、こういう（上図参照）メニューバーを作ってみたいと思い、AB先生に相談してみました。

私の中では、JavaScprit Libraryからなんか探してきて、がんばってソースを読んで変更するところを突き止めて……、という作業をしなければならんだろうなぁ、と思っていたのですが、なんとこれ、Dreamweaverで一瞬で出来るそうです……!!!

授業中はあまり活用しませんでしたが、「Spry」という機能です。（右端の挿入バーみたいなやつのところからSpryメニューとかそういう名前だったと思います。）それをクリックだけでも既にこういうプルダウン式のメニューバーが出来るのです（作業時間、約30秒!!笑）が、さらに画像を入れ込んだりも出来るようです。

この相談をしたところ、むっちゃありがたいことに、AB先生は早速見本を（しかも、画像がロールオーバーでかわるやつをしてみたいというリクエスト通りに!!）作ってきてくれていました!!!（それが、上図です。）せっかくなので、皆さんにもそのファイルを共有します。下記URLにアクセスしてフォルダをDLしてみてください。

https://docs.google.com/open?id=0B7Z7VsqHIIggQXB5UFBsY2IyUkE

Dreamweaverでぽちっとクリックしただけで作った状態は、"test.html"の状態です。これなら、文字を任意のものに入れ変えるだけでカスタマイズ完了です。

AB先生が画像入りにカスタマイズしてくれたものが"index.html"というものです。コンテンツ（メニュー??）を増やすには、htmlのほうでソースを触ります。装飾に関しては、[SpryAssets]-[SpryMenuBarHorizontal]というファイルを開いて、自分のサイトに合うように幅を変えたり、色を変更したり出来ます。変更箇所については、コメントアウト(/* */)してあるので、探してみてください。（※Dreamweaverで作成している場合は、勝手にリンクを張ってくれているのでindex.htmlのファイルにくっついてきます。ちなみに、SpryAssetsというフォルダが自動的に作成されます。）

"index.html"が結局テンプレートのように使うことになるので、一番時間がかかり、構想を練らないといけないところだと思います。なので、こういう便利な機能があるのをせっかく教えてもらったので、興味のある人はご参考に。

なお、sakuraさんが見つけてくださった情報ですが、アドビが今10日間限定の値引きセールをしている模様です。Dreamweaverあんまりいらんかも、と思っていたのですが、このような便利な機能があると分かった今、うぐぐぐぐ、ほ、ほしいかも……!!!と思っている私です。

それにしても、サイト作成、私は意外に色決めとフォント決めに膨大な時間を費やしております。本当に難しい。フォント自体はいい感じなのに、それをサイトに埋め込むと、なんかダサかったり、色もカラーピッカーで見たらきれいなのに、ベターっと塗ってしまうと、なんか思ってる感じとちゃうなぁ、と思ったりして、なかなか決まりません。一応決定してボタンを作ってみたのですが、今家でそのファイルを開いてみたら、家のパソコンから見たら色が全然きれいじゃない……。う～む、ムズカシイね～!!