読者です 読者をやめる 読者になる 読者になる

すけこむブログ

カメラが好きな都内在住31歳男性の写真ブログ。ニコンD810を愛用。2歳児の子育てにも奮闘中。

写真ギャラリー用サイトを作ってみた!ちゃんとレスポンシブぅぅう

f:id:sukecom:20151008213145j:plain

写真のギャラリー用サイトを作ってみました。はてなブログは引き続きブログとして運用を続けて、作品として大きく載せたい写真はギャラリー用のホームページにも載せていこうと考えているのです。

ポートレートを撮りはじめたくらいから、ブログとは別に写真を見てもらうことをメインとしたサイトをひとつ持っておきたいと考えてまして。このところ少し時間に余裕ができたので一気にしこしこと作ってみました。

ホームページとブログを分けて運用

f:id:sukecom:20151008213148j:plain

まだ写真は数点しか載せていないのですが、私のしょうもない自己紹介以外、文章はほとんど省きました。ギャラリー用のホームページは写真を見てもらうことが目的。私の言葉で補完せず、見てくれた人が自由に何かを感じ取ってもらえたらうれしい。

写真にタイトルをつけるのが非常に苦手なのですが、フォトコンテストに出すときの練習として、ギャラリーサイトに載せるときはタイトルもちゃんと考えていこうと思ってます。今掲載している写真に関しては、タイトル適当なんですけど・・

こちらのブログについては、私自身が好き勝手文章を書き散らすことで一種のストレス発散をしている面もあるため、引き続き写真半分・文章半分くらいのバランスで続けていきたいなと思っています。

写真を全画面表示、大きいディスプレイで見てほしい

f:id:sukecom:20151008213151j:plain

ギャラリーサイトでは写真をクリックすると全画面で表示されます。ブログでは横幅680pxで統一させてまして、ギャラリーサイトでなんとしても全画面表示を実装したかったのです。

ディスプレイサイズに合わせて全画面表示されるので、ぜひ大きなモニターで見てほしいところ。スマホでご覧になるときは、横向きにして写真が大きく表示されるように見ていただけたら嬉しい。左右にフリックすれば写真もスライドします。

はてなブログにも写真を大きく表示させる機能はあるけど

はてなブログには写真をアップロードするとクリックしたときに大きく表示させる機能がデフォルトで実装されていますが、見た目がダサいのでいつも私はclassによるスタイル指定を削除していました。たまに削除し忘れているときもありますが。

完全に好みの問題ですが、Flickrから写真をはりつけるときも、クリックでいちいちFlickrのサイトに飛んでしまわないようにタグを削除しているのです。

はてなブログでもうひとつブログを立ち上げて、ギャラリー用として運用することも考えましたが、デザイン面での自由度の高さを優先して自分で作っちゃうことにしました。.tokyoのドメインも初めて取得してみましたよ。

レスポンシブぅぅぅ!

f:id:sukecom:20151008213153j:plain

今回一番苦労したのがスマホでもいい感じに見られるようにレスポンシブ対応をさせたこと。ホームページを作ったことは過去何度かあるのですが、レスポンシブ対応は初めてだったので、いい勉強になりました。

画面の一番上に表示されているナビゲーションバーはスマホだとすっきりスマートな見た目に変形します。たとえるならzガンダムがウェイブライダーに変形するような、そんな感じ。タップるするとメニューがにょきっと現れます。

作品作りを頑張る

憧れているフォトグラファーや写真家さんたちの多くがポートフォリオとしてのギャラリーサイトを公開されていて、写真を撮る人間としてはまだまだペーペーのパーパーではありますが、私もちゃんと写真を公開していこうと思いまして。

ブログに載せる時もどの写真を載せるかちゃんと考えていますが、ギャラリーサイトへの掲載はコンテストに出すくらいの気持ちで、厳選したうえで掲載していこうと考えています。

フォトコンテストへの挑戦をそろそろ本格的に進めていこうと思ってまして、その一環としてギャラリー用のホームページもときどきいじっていこうと思います。

月1くらいでしか更新しないと思いますが、よろしければこちらのサイトもご覧くださいませ。