くまりゅう日記

日記

こんな時期に冷凍庫半開き事件が勃発。氷がほぼ全滅したが、冷凍食品は再冷凍すれば大丈夫かなぁ……。

CSSのpx単位について調べたら1px=0.75ptてなってたのでいろいろ書こうかと思ったんだが、長くなったのでまた今度ね。

簡単にまとめると、CSS 2.1以降では1px=0.75ptなので、1pxの指定が実際は1ピクセルにならない場合があるぞ！これ大事！

イベントサイト作ってた

土日はイベントのサイト作ってた。ついこの前イベントやったばかりじゃないですか。前回が4月末で今回が9月中旬だから間が四ヶ月半しかなくて早いんだよなぁ。

前回のサイトは作ってもらったんだが、heroku上にJava+Play frameworkとやらで作られていて、どちらの勝手もわからないもんだから完全におまかせ状態だった。 今回も引き続き同じサイトを使うんだが、見た目やあちこちの文章くらいはいじれるようになりたいので手元で試して配置までやってみるかと。

Eclipse落とすところから始めるくらい最初からだったが、とりあえず必要なライブラリをつっこんであちこちパスを修正するだけでビルドは通った。 実行方法がさっぱりわからなかったが調べると.launchとかいうファイルを右クリックして実行すればいいのか。おー、ちゃんと動いた。 手元で試せるようになったので、あとはviewをいじりまくるだけだ。

Play!1.2.4のview文法はよくわからなかったが、かといってそんなに難しいわけでもないのでなんとなくで書いても動いてくれる。 問題はデザインだよなぁ。前回のサイトで気になってたところをまず直そう。

何故かフォントが明朝指定されてるのでゴシックにしたい。だがCSSを調べてみるとSan-Serif指定されてるな。最優先はWebフォントっぽいがそれに日本語が明朝で入ってるわけはないだろう。ということは英字のWebフォントで日本語がフォールバックしてなぜかSerifになってしまってるんだろうか。そんな動作するのかなーと調べてみると、どうもOperaの問題のようだ。他のブラウザで確認してみたら普通にゴシックでした……。 しかし俺を含む世の大半の人は当然最強伝説Operaを使ってるであろうから捨てるわけにはいかない。どう対処したものか考えたが、日本語主体のページで英字のみのWebフォントなんざ指定されても嬉しいところが全然ないのでWebフォント指定を外して完了した。Webフォントって文字数多い言語に対しては基本役に立たないよな¹。

bootstrapでレスポンシブルとかいうのになってて、ちょっとブラウザが小さくなるとメニューが折り畳まれるクソ仕様を外したい。 前回はメニューが無くて移動できませんという苦情が沢山あった。 外すのは簡単なんだが、項目名が長いメニューが横に並んでるのでブラウザが小さくなると折り返されてひどくぶっこわれてしまう。 これは項目を減らすのに加えmin-widthを指定して小さくなった時も折り返さないようにして対処。 しかしメニューから消した項目のリンクをどこにつっこめばいいのか難しいなぁ。

あとで気付いたんだけどメニューが折り畳まれること自体が問題なんじゃなくて、折り畳んだ後のメニューボタンがここを押せばメニューが出るってのがさっぱり分からないのが問題なんだよな。このボタンデザイン作ったやつは頭おかしいよ。 まあどっちにしろみんなPCでしか見ないサイトなんでレスポンシブルとか関係ないんで折り畳む必要がないんだよな。

bootstrapの横幅が940pxで固定されるのはブラウザをちょっと小さくするとすぐに横スクロールするのが気にくわねーのでfluidをつけまくろ……と思ったがタイトル画像が最低幅800はあるし、メニューのmin-widthも指定したのであんまり関係なかった。さらにサークルカタログで210pxのサークルカットを3列表示というのが上手くいかなかったので諦めた。元に戻してむしろタイトル画像の幅を940pxに拡大した。まあ右側に重要なコンテンツをあまり置かないようにすればいいだけですし。

サークルカットが210pxでその周りのboxのpaddingが10pxなのでboxのwidthは230pxですよねーと設定してみたらやたらとでかくなってしまった。いじってみると210pxで丁度らしい。えー、widthはpadding含まないとかどういうことよ！とか言ってたらpadding含むかどうかは実装依存だと教えてもらった。なにこの規格ゴミクズだわ。調べた感じだと古いIEではこう対処しろ的な話ばかりで最近のブラウザではwidthはpadding含まない方向で統一されているようだ。じゃあいいや。

トップ画像をabsoluteで左上に配置するのに困った。absoluteの座標系がさっぱりわからねぇよ。なんかごちゃごちゃいじってたらなんとかなったのでまあいいか。

でかいトップ画像を作らないといけないんだがこれが大変。俺にデザインセンスとか言うな。 頑張って最低限見れるくらいはできたんだが、でかすぎて埋まらねぇ。ここにイラストが欲しいなー(ﾁﾗｯとかひたすら言ってみたが、キャラクタージェネレータ的な物で生成された誰だよこいつ画像が貰えたくらいで時間的にやばかったので諦めた。こういうときお絵描きできるようになると便利なんですけどね。

あちこち修正したいところは多々あれども、とりあえず前回と同じ機能くらいは普通に動くし告知するくらいなら充分な見た目なので一旦諦めて配置した。herokuの配置方法がわからなかったが、予想通りmasterにpushするだけだというのでpushしてみたら無事動いてくれた。GAEみたいにバージョン選択みたいなのはないんですかね。あれがあるとアップロード即大公開じゃないからちょっと安心なんだが。

そんなこんなで土日はHTMLとCSSと画像いじってるだけで終わってもうた。結局デザインをどうするかとCSSが手に負えない辺りが一番困るっつーね。