Card Check Box blog

更新履歴を転載しているブログです。

Post

log-201601

お知らせ

本日は CSS Grid Layout のテストを行ったため通常の更新作業はお休みしました。

お知らせ

h1 のフォントサイズを 20px に固定しました。これまでスマートフォンなどでは 18px で表示するように設定していましたが、ちょっと大きくなります。


右下のボタンはブラウザの幅が 748px 以上のときは下のスペースが高さ 56px になるように設定していましたが、スマートフォンと同じ(20px)にしました。Windows 8 の Modern 版 Internet Explorer 向けに設定していましたが、それ以外では意味がないので削除しました。


補足的な段落の左側にボーダーを追加しました。この段落の左側のやつです。

おしまい。

お知らせ

アイテムのページの CSS を更新しました。マージンなどを調整しただけです。定義リストの縦並びも試していますが、導入するかはまだ決めていません。

新規ページを作成しました。

  1. Merry のCDの特典カードです。

情報を追加しました。

  1. いきものがかりのCDA [超いきものばかり -てんねん記念メンバーズ BEST セレクション-] の特典カードです。

本日の発売アイテム

  1. VIXX のCDA [Depend on me] の特典カードです。
  2. がんばれ ! Victory のCDA(Maximum Single) [青春 ! ヒーロー] の特典カードです。

新規ページを作成しました。

本日の発売アイテム

  1. [DRAGONBALL 超 コレクションカードガム] に同梱されていたカードです。

お知らせ

左サイドにあるサイト内リンクの波紋エフェクト (Ripple Effect) を廃止しました。

お知らせ

Article 要素内のアンカーを hover/focus したときにハイライトするように CSS を修正しました。従来は色を変えていたのですが、コントラストが低くわかりづらいと感じたので修正しました。

アンカーのハイライトに CSS transition を利用していますが、自分の環境では Chromium や Opera (blink) で閲覧した場合、スムーズにアニメーションしません。以前から使っている波紋のエフェクト (CSS Animation) も同様の傾向があります。特に Opera (Developer 36.0.2106.0 で確認) がひどい感じです。自分の持っているパソコンが古いのが原因かもしれません。

Firefox や Vivaldi では問題ありません。環境はユーザーによって異なるので推奨ブラウザを決めるつもりはありませんが、参考までに。

お知らせ

テストページは Xdomain のサイト内に戻しました。以前のようにヘルプページから移動できます。BitBalloon はファイル名に 「help」 が入っているページが使えないなど使いづらい面がままあったので、使わないことにしました。悪くはないのですが、本格的に使いだしたらいまいちな面がいろいろ見えてきた感じです。AMP HTML のページも Xdomain のサイト内に移動しました。

新規ページを作成しました。

本日の発売アイテム

  1. CRAYON POP のCDA [CRAYON POP] の特典カードです。
  2. The Challenge のCDA [The Challenge Land] の特典カードです。
  3. koma’n のCDA(Maximum Single) [今日を取り戻せ !] の特典カードです。

お知らせ

AMP HTML のテストは終了しました。AMP HTML ではないページの方が処理が早いので、自分のサイトには必要のないものと判断しました。

お知らせ

本番環境ではテストしづらいので、初期テストは BitBalloon で行うことにしました。

新規ページを作成しました。

  1. SuG のCDの特典カードです。

情報を追加しました。

本日の発売アイテム

  1. [仮面ライダーゴースト コレクションカードガム 2] に同梱されていたカードです。
  2. [2015 プロ野球チップス オールスターズ] の特典カードです。

お知らせ

本日は cardcheckbox.a.la9.jp をいろいろテストするため通常の更新作業はお休みします。引き続き Xdomain の方をメインにする予定でしたが、@homepage から @nifty ホームページサービスにリダイレクトされる設定を行った都合上、Nifty の方をメインにすることにしました。Blogger や Twitter などに記載するリンクも今後は cardcheckbox.a.la9.jp 内のページへのリンクにすることにします。既存のリンクも修正できるものは修正していく予定です。


2016年1月17日 追記: 引き続き Xdomain の方をメインにすることにしました。

la9.jp は facebook で安全なリンクではないと表示され、リンクを書き換えられませんでした。

検索したら1年以上前からそのような状態だそうです。修正される目処も立っていないようです。

自分のウェブサイトはスパムではないし facebook ページはまったく使っていないので無視しても良いのですがね。念のため問題が解決するまで Nifty の方をメインにすることは延期することにしました。

ちぇ ! て感じ。


Nifty の方の検索ボックスをウェブ検索に差し替えました。

お知らせ

@hompage がサービスを終了することになったので、homepage3.nifty.com/cards は削除することにしました。2010年に新規受付を停止していたのでいつ終了するかと思っていたのですが、とうとうきました。@homepage から無料で @nifty ホームページサービスに移行できるようなので、代替のウェブサイトをそちらに作成しました(http://cardcheckbox.a.la9.jp/)。

サイトのデザインなどは Xdomain と同じで、テストページ以外は閲覧できます。検索ボックスはいちおう設置していますが、@nifty ホームページサービスのページはインデックスされていないので機能しません。


@homepage では .htaccess が設置できなかったため Xdomain に移行しましたが、@nifty ホームページサービスでは .htaccess が設置できるため、できることは変わらなくなりました。

しばらくは Xdomain の方をメインにしていきますが、2つも必要ないのでどちらかにしぼるかもしれません。

お知らせ

旧サイトの見た目をちょっと変えてみました。実験的なものなので新サイトの方は良さげなものがあれば部分的に取り入れるという感じになる予定です。

新規ページを作成しました。

  1. 水瀬いのりのCDの特典カードです。
  2. イベント会場などで販売された Swip のトレーディングカードです。

お知らせ

「まず最初に margin で調整して、さらに必要なら padding を追加する」 というように記述の方法を変更しました。ファイルサイズがちょっと減りました。


body 要素に line-height (値は 1.8) を追加しました。これまでは必要な部分に個別に書いていましたが、面倒なのでまとめました。微妙に見た目が変わっている部分もありますが、実用的には問題ないです(個人的な感想です)。


擬似要素はコロン2つで(「::after」 のように)表現することにしました。2016年1月12日(とうとう明日)に Internet Explorer 8 以下のサポートが終了するので更新することにしました。


Flexbox のベンダープレフィックスを一部削除しました。iPhone 向けの記述はしばらく残しますが、iPad および Mac OS X で Safari 8 以前を使用すると表示が崩れるようです(横並びにならないだけで見れないわけではないです)。また、QtWebEngine を利用したブラウザでこのウェブサイトを閲覧している方はいないようなので、現時点では考慮しないことにしました。


旧サイト(@homepage)では印刷向けスタイルシートは使わないことにしました。@homepage では圧縮転送を有効にできないのでファイルサイズを小さくすることを優先しました。


favicon.png は Firefox OS シュミレーターでサイトをホーム画面に登録したときにアイコンがぼけたので追加していましたが、読み込みに時間がかかるので削除しました。

新規ページを作成しました。

  1. SUPER JUNIOR のイベントなどで販売されたグッズなどに同梱されていたカードです。

情報を追加しました。

  1. SUPER JUNIOR のCDA(Maximum Single) [Devil / Magic] の特典カードです。

新規ページを作成しました。

  1. [MONSTER HUNTER X クリアカードコレクションガム] に同梱されていたカードです。

本日の発売アイテム

お知らせ

dd 要素の下線(dotted)を削除しました。無くても困らないし、ルビの下線と被らなくなるので良いかなーという感じです。このページ(更新履歴のページ)のお知らせの部分の下線(dashed)も削除しました。ブラウザの幅が狭い場合は背景色も付いていましたが、それも無くなります。目次の部分はいまのところ変更する予定はありません。

リンクの部分のアイコンは丸い枠の付いたものに再統一しました。そのほうがわかりやすいので。

新規ページを作成しました。

  1. CD [学園ハンサム キャラクターソング] の特典カードです。

本日の発売アイテム

  1. Little Glee Monster のCDA [Colorful Monster] の特典カードです。
  2. BOYS AND MEN のCDA(Maximum Single) [BOYMEN NINJA] の特典カードです。
  3. ベイビーレイズ JAPAN のCDA(Maximum Single) [走れ、走れ] の特典カードです。

お知らせ

Blogger のテンプレートの修正作業は終了しました。

情報を追加しました。

  1. GOTCHAROCKA のCDA(Maximum Single) [Marry me, ’cause I hate U] の特典カードです。
  2. VIXX のCDA [Depend on me] の特典カードです。
  3. LM.C のCDA(Maximum Single) [MONROEwalk] の特典カードです。
  4. Sexy Zone のCDA [Welcome to Sexy Zone] の特典カードです。

本日の発売アイテム

  1. [銀魂゚ カードウエハース 2] に同梱されていたカードです。

お知らせ

メインサイトの修正作業が終了しました。時間があったのでちょっと大掛かりになりましたが、なんとかなりました。CSS の書き方を変えただけなので、見た目はたいして変わっていません。class 属性を一部削除したのでファイルサイズは多少減りました。「トップページ」 および 「リンクのページ」 の目次は項目が多いので横並びのままですが、その他のページでは縦並びにしてみました。見た目が変化しているのはその部分くらいです。

Bitballoon で公開しているページもメインサイトと同様の修正をしました。


Blogger のテンプレートの修正作業は間に合わなかったので後日行います。記事をすべて張り替えねばならないので、多少時間が必要です。

お知らせ

通常の更新作業は明日から行います。

情報を追加しました。

  1. Little Glee Monster のCDA [Colorful Monster] の特典カードです。

本日の発売アイテム

  1. SHINee のCDA [D×D×D] の特典カードです。

お知らせ

あけましておめでとうございます。本年もよろしくお願いします。


アイコンはすべて外部ファイルにまとめることにしました。data URI と使い分けるのは管理がめんどうだったので。Blogger と Bitballoon は data URI のままです。