この記事は、約2,600字で
書かれています。
~参考~
私の名前はさぁさと申します。趣味の一つは、毎年冬になると気象庁のアメダスを拝見し、
どのエリアに何cm雪が積もったのかを、観測することであります(とてもマニアックですねf(^_^;))
よろしくお願いします。
記号含め102字
~ネイティブ日本語注意案内~
!! This article is written in native Japanese and may not be translated well.
Please understand. (-人-)please
If you are interested, please read on.
(>ω<)b ←good
皆さんこんにちは。
気温も大分寒くなり、季節の変わり目とともにたそがれを感じているさぁさでございます。
あぁ、15年前の大学生時代に見た空と同じ空だ、、、
ちょっと肌寒くなってきたけど、ここからまた色んな出会いがあって(出会い好きだね)、年末にはまた盛り上がっていきたいなー!!
なんてことを当時は考えていました。(まぁ、結局何もなく、従前の男友達と遊んでいることが多かったんですけどね^^;v あ、でも大学1年時は実りました(^^)b)
まぁ、さすがにこの年でそういったことを思うわけにはいかなく(そんなことより仕事ガー!!)、
そう思ったところでスッと胸にしまっていたさぁさでした。(すみません私は男です)
ところで!!
今回は新サービス、「積雪&降雪の部屋」を開設しましたので、こちらについて書いていきたいと思いますが、
内容としては、「このサイトを開設するにあたって考えたこと」や、「デザイン・技術」といった点について主に書いていきます。
「サイトについて」はこちら↓↓をどうぞ。
日本の積雪と降雪を比較するサイト「積雪&降雪の部屋」
今回開設したサイトはズバリ、見出しの通りです。
気象庁の歴代最積雪ランキングTOP15の地点を使って、積雪平均や各降雪、ハイシーズン、ハイシーズン外での比較をランキング形式で行っています。
実際比較をしてみると、同じ雪でも色々な違いがあることが分かります。
気になった方はぜひクリック下さい↓↓
https://sekisetsu.salalalasa.com/
開設理由
やはり一番は「無いものは創る」です!!
今回開設したサイトは私が昔追いかけていた情報でもあり、当時は「日本の積雪や降雪をまとめたサイト、ないかな~」と何度か思ったりしていました。
しかし、「…であれば創れば良い」と。
「ジョブズも言ってただろ」と。(すみませんAndroid派ですm(_ _)m)
そして今回、さらに「Webでの就業を本格化させる」ということも相まって、開設することとなりました!!
サイト制作するにあたって考えたこと
当初のサイトイメージ→決定
最初は積雪や降雪といった各ランキング別に、全国からTOP15を洗い出したまとめサイトを想定していましたが、
降雪地域と言えども、あの気象庁アメダスの全地点をあたっていくのは、相当骨の折れる作業だったためボツとなり…
次に降雪地帯の各県で1地点ずつ選定してランキングさせようかと思いましたが、これまた数が増え、サイトを作り上げるのが大変だったため、ボツとなり…
最終的には最もポピュラーな、気象庁の最積雪ランキング-上位15地点を使って作ることにしました。(地理的にも比較的バランスが良かったし)
しかしこの15地点だけでもまとめるのは大変でした -.-;)
データが少ない地点でも1976年以降となっており、こういったデータを各ランキング別に洗い出しをかけていくので、数値の間違いがないかチェックしたりなど…
「シンプルにランキングをまとめたサイト」から「日本の雪を解説するサイト」並みに…
また、当初はランキングを作ってそこに補足文をそえる感じにしようと思っていましたが、
ランキングを作っている内に私自身もビックリしたことがあり(酸ヶ湯地点のハイシーズン降水平均など)、
補足文に補足文を足して…、なんてやっている内に日本の雪を解説するサイト並みになっちゃいました (^^;
Googleマップの埋め込みや画像の作成をやってみたかったということもあるけど…
最終的にはサブタイトルを「日本の積雪と降雪を比較するサイト」とし、日本の雪も解説するサイトとなっております ^^)b
デザイン・技術に関して
全体のデザイン
壁紙はもっと雪が描かれている方が良かったのですが、商用利用可・クレジット不要という条件ではこれが一番近かったのでこちらとし、
あとはメインエリアの背景色、メインエリア本文の見出し色、目次へボタンの色などを調整し、最終的に仕上げました。(デザインをやりだすとなかなか終わらない)
個人的にはサイト上部が一番上手く仕上がったかなと思い、気に入っています。
「星空に浮かぶ文字」という感じで神秘的(*'ω'*) みたいな m(_ _)m
カラム
今回のサイトも当ブログと同じく、WordPressで制作しましたが、今回は「まとめサイト」ということで、シングルカラムでドーンとしたイメージをしておりました。
右サイドバーを消す又は非表示にして、メインエリアを横に大きく拡大するので、かなりの設定が必要かと思っていましたが、
実際にはサイドバーにかかっているidを指定し、「display: none;」とするだけで非表示となり、あとはメインエリアの横幅を設定するだけだったので、アレッとなって拍子抜けしました (^^;カポッ
ランキングの表(テーブル)
今回初めて表をしっかり作成したのですが、やはり時間の多くはデザインに費やされました。
全体とのバランスを見て、どういったデザイン・色合いが良いのか?
というところです。
最終的にはシンプルであまり表っぽくないデザインとし、5位からはグラデーションを付けてあります。
技術的にはWordPressでの作成ということもあり、最初はプラグインで作成しておりましたが、セルの位置がずれるなどの不具合が発生したため、
WordPress標準の「表の挿入」で簡単な表だけ作成し、あとはCSSを使って実装しました。CSSは追加CSSに記述し、表ブロックの追加CSSクラスで指定しています。
ドロワーメニュー
今回はスマホサイトにドロワーメニューを実装しました。
WordPress(DIVER)の場合はデフォルトでウィジェットに用意されていますので、ここにカスタムHTMLを入れ込み、作成しています。
サイト開設2つ目を終えて
以上、代表的なところをお伝えしてきましたが、
今回は2回目のサイト開設ということで、サイトの基本的なところは初回(当ブログ)の半分ぐらいの時間で完了しましたが、
新しい機能やデザインといった「新領域」は初回と同じくらいかかっていますので、トータルでは初回の2/3くらいの時間で仕上がったと思います。(勉強になりました m(_ _)m)
また、先ほども述べましたが、これからはWebでの就業を本格化させるため、サイト開設(制作・開設~運営まで)に重点を置いていく予定です。
次回作にはぜひご期待下さい!!(サイトのアクセス数も増やさなきゃ -.-;))
それでは (^^)/~~~