ファンサイトへの道の最近のブログ記事

下層ページデザイン - 5日目


前回の記事はこちら
http://arashi3.com/2010/05/fan002.html


ちょっと時間が空きましたが次は下層デザイン。
ページ上下部分は共通項目になるのでそれ以外を。
ページによって背景は変えていきます。


まずは「PARA-SOLとは?」というページから。

作品をある程度自分の言葉で紹介したかったので、
参考資料をもとにライティング。

文章が書き終わったらフォトショにテキストを貼ってレイアウト決め。

決めたレイアウトに沿ってタイトルやら画像やらを入れる。

キャラクターメニューの上に主なコンテンツのメニューを入れる。


駆け足ですが、デザイン完成。

fan002.jpg例によってスライス状態でw


余談ですが、
Twitterでフォトショ使ってレイアウトしたりしていることに驚かれたのですが、
紙媒体メインの人はイラレとかでやってるんですかね〜。

webでは高解像度はほぼ使わないので、
個人的にはフォトショで十分な気がします。

とはいえこれが答えではないので自分のやりやすい形を模索するのがいいと思います。
ちなみに僕はイラレまったくわかりませんw


ある程度方向性が固まったのであとはスムーズにいく・・・はず・・・。


ってことで続く・・・。



トップページコーディング - 3〜4日目


前回の記事はこちら
http://arashi3.com/2010/05/fan001.html


とまぁデザインの次はコーディング。
この作業は非常に地味?なので見た目的な何かはないんですけど、
今まで使ったことなかったCSSのdisplay:absoluteを使ってみた。

出来上がったのはこれ
http://para-sol.arashi3.com/


ぱっと見flashっぽいような雰囲気を漂わせていますが、
htmlとCSSしか使ってません。
というか僕flash使えないんですわw
(昔背景が勝手に動いていくflashを作って挫折)

基本的にどのブラウザでも見られるようにしたかったので以下の点に気をつけてみた。

・PNG24はIE6非対応なのでPNG8を使用
・クロスブラウジング対応(IE8、IE6、Firefox、Opera、Safari、Chrome動作確認済)
・1280×1024ですべてが見え、1024×768でもファーストビューを意識
・ボタンは基本オンマウス対応

ってな感じです。

IE5.5以下はごめんなさい無理だと思います。
あと携帯もたぶん無理。

ボタンはCSS仕様でほぼ背景画像なので現状は印刷非対応。
(これはそのうちなんとかします)

ソースコードはぶっちゃけひどいです。
見ないほうが幸せですw


次は下層ページのデザインかな・・・。
どこから手をつけようかな。


ってことで続く・・・。



Event


▼2012/4/30
COMIC1☆6

ち24b PYRITE
ゆるゆり本

▼2012/8/中
コミックマーケット82

申込済 PYRITE
ゆるゆり本

Doujin


▼娯楽部vs生徒会1
2011/12/31発行
ゆるゆり本。娯楽部と生徒会が雪合戦で対決!果たして勝つのはどちらか!なギャグ漫画です。
とらのあなで予約受付中。
とらのあな

▼トモダチ2
2011/8/14発行
あの花幼少時代オールキャラギャグ本。夏にみんなでプールへ行った時のお話。不幸なぽっぽ、変態ゆきあつの運命やいかに!
とらのあなで発売中。
とらのあな

▼トモダチ
2011/7/10発行
あの花幼少時代オールキャラギャグ本。じんたんが野球やろうぜと言いだして6人全員で草野球が始まる。打倒じんたんに燃えるゆきあつの運命やいかに!?
とらのあなで発売中。
とらのあな

▼October2April
ヒャッコの虎子と冬馬が中学時代に初めて出会ってから入学までのお話です。同じ時系列で10月から翌4月まで上下で話が展開していきます。
とらのあなで発売終了。
とらのあな

▼R-15 ※18禁
ヒャッコのプチエロギャグ4コマ本。一応18禁でっす。
とらのあなで発売中。
とらのあな

pixiv


twitter


About


このサイトは現役webデザイナーのアラシさんの趣味サイトです。

ad