Home » Blog » Web

Web

Webサイト作成に関するいろいろ

favicon を付けてみました

favicon を付けてみました

 前々からファビコンをつけたいと思っていたんですが、納得のいくものが作れなくて保留にしてました。
 というのも、アルファチャンネルの付け方が分からなかったんです。
 ネットで検索した作り方はドット絵を描いてそれを「@icon」というツールで.icoファイルに変換するという感じでした。
 で、私がドット絵の作成に使ったのが有名なEDGEだったのですが、これはドット絵の作成にはとても良いツールなのですが透明度の設定ができなくて、みんなどうやってるんだろうなあ…と不思議に思っていたわけですよ。
 しかしふと、@iconがpsd形式を読み込めることを発見しました!はじめから説明に書いてあるのに、なぜ読んでなかったんだろうと自分が不思議です。
 というわけでPhotoshopで画像を作りpsdで保存したものを@iconに読み込んで合成しました。32bitで作ってしまったです。24bit以下はまた今度作ってみよう。

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

RecentEntriesにサムネイル付加

RecentEntriesにサムネイル付加

 トップのRecent Entriesの表示に悩み中です。
 更新情報一覧ページのようにサムネイル・タイトル・カテゴリなどを表示するのと、前のようにリスト表示だけのものと、どっちがいいかなー。
 とりあえずサムネイルありで表示件数3件に減らしてしばらく運営してみようと思います。うろちょろしてすみません。

 やり方書いておきます。

続きを読む

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

floatを他の要素に頼らず解除する

floatを他の要素に頼らず解除する

 トップの更新情報5件の下から全ての更新履歴を表示するページへのリンクをつけました。
 ついでに更新情報一覧ページの表示を変えました。タイトルとサムネイルだけ表示します。
 更新情報に加えておこうかと思ったけどたいした変更でもないしやめておきます。

 その変更した更新履歴一覧ページの表示で使っている、タイトルの「floatを他の要素に頼らず解除する」方法についてです。

 アサノさんのサイト、「Mushline」でこういう感じな表示をなさっていて、これってどうやってるんだろーとCSSを覗いてみてこのコードにどえらく感動しました。

.metadata dl:after{
  display: block;
  height: 0px;
  clear: both;
  content: "";
}

 要素をfloatさせたあとって、どの要素でそのfloatを解除させようかいつも考えるところだったんですが、:afterで解決する方法とか考えもつかなかったです。擬似的にブロック要素を作ってそこでfloat解除するんですね。スゴイ!
 IEには効かないんですが、IEはもともとfloatされていようが何だろうか中に入っているもののが入るサイズを勝手に計算してくれるやつなのでまあいいとしよう。paddingの影響も受けてくれるともっといいのに…。

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

Valid XHTML1.1 / CSS に

 サイト全体をValidなXHTML1.1 and CSS に…したつもりです。ひとまず完了。今後は本文中のコードとかメタ文字のエスケープに気をつけよう。

 WPにしてからいじり方がよくわからなくてHTMLをValidにするのを保留にしておいたのですが(そもそもWPの動作ですっころんでいましたから)、悔しいので一念発起。
 出るエラーをひとつずつやっつけるのであります!行くぜ!(不眠のためテンションがおかしいです)
 とりあえず The W3C Markup Validation Service でValidになって、 Another HTML-lint gateway で90点台を目指します。久々です…。

続きを読む

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

なぜオンラインブックマークを拒絶するのか

 最近気がついたのですが、同人系、というか二次創作がメインのサイトさんには「オンラインブックマークはご遠慮ください」といった注意書きがしてあることがあります。

 百歩譲ってリンク拒否の主張に従うことはあっても、違法でもない限り自分の所有するデータにどんな文字列が入っていようと文句言われる筋合いはないんですよね。ブックマークは違法でもなければモラル違反でもありませんし、ついでに言うならどのページのURIを控えておいても他人にどうこう言われることでもないわけで。
 どうやら検索避けの一種というか、そのための主張らしいということはおぼろげに理解できたのですが、はっきりした理由がわからず、気になったのでちょっと調べてみました。

オンラインブクマが危険とされるようになった原因は様々考えられていますが、ひとつには「オンラインブクマ(主にYahoo!)に登録されると検索避けが効かなくなる」という推測がありました。

cite : 二次創作+オンラインブックマーク総括

 ということだそうで。公開型やソーシャルブックマークならあるかもしれませんが個人で楽しむ非公開型には当てはまらない話ですよね。いくら参照自由の情報網といえど、ログインした先の情報まで参照できるようでは個人情報保護の観点からも大変よろしくありません。マーケティング用に各企業が参考にするというのならありそうな話ですが、それもそう言う用途に使いますよとユーザーの許諾を取ってからでないと違法です。

 ちなみに検索避けについてですが、「検索除けを入れよう」さんによると、二次創作物の成人指定作品をその分野に理解のない人や未成年に見られたくない、というのがその理由だそうです。
 女性向けの二次創作系サイトの管理人さんの多くは検索エンジンに対して強い警戒心を抱いているようです。片やSEO対策だの検索何位だのとしのぎを削り合い、片やwwwに存在する情報を網羅しようとするロボットの目をくらませることに心血を注ぐ、Web業界は奥が深いです。
 二次創作は法的にブラックなのでなるべく隠匿したいのはわかりますが、不特定多数の人がアクセス可能であることが前提の公共の情報網上に自ら掲載しているのだから、誰々に来られたら困る、という意識ではいけないんだよなあ。

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

リンクをクリックすると文字のサイズが中に戻る

現象
UTF-8でエンコードされたページからリンクをクリックして他のページに移動しようとした場合に、文字サイドが中に戻る場合があります。
原因
リンク元のHTMLの文字コードがUTF-8にて作成されており、リンク先がファイルをダウンロードするようになっている場合に発生します。
回避策
リンク元のHTMLの文字コードをShift JISにてエンコードしてください。
状況
マイクロソフトでは、この問題をこの資料の冒頭に記載したマイクロソフト製品の問題として認識しています。

cite : リンクをクリックすると文字のサイズが中に戻る

 IEでの動作確認がまた不十分で申し訳ないのですが、この間から動作確認中にこの現象が起こり、初めて気がつきました。UTF-8でエンコードされたページで起こるIEの不具合であり、MS社もこれを「問題として認識」していると書かれている以上、私にはどうしようもない状況です。
 どうやらキャッシュされたページではこの不具合は出ないようですが。
 文字コードをShift JISにしろってのも無理なお話でありまして。
 この問題が2005年に公開されているにもかかわらず、IE7でも解消されていないというのがいただけませんなー。直してよー。

 一応、解決方法を載せておきます。起動のたびに以下の操作をする必要があるようですが…。

解決方法は、IEでUTF-8のサイトを開き、一旦文字サイズを最大にします。
その後、中に戻します。
これで戻ると思います。
直らない場合、一旦文字サイズを最小にして、中に戻してみてください。

cite : WordPress Japan :: トピックを表示 - テキストサイズが一回り小さくなってしまった

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

amazlet を使い始めました

 Amazonへの商品リンクの作成はnDiaryのフィルタだと商品コードを書いておくだけで情報を自動取得してくれていたのでとても便利だったのですが、WordPressではどうしようかと悩んでいました。でもGoogleさんに聞いたらすぐでした。そりゃそうだ(笑)みなさんこれを使ってたんですねー。もっとはやく気がつけば良かった。
小粋空間: Amazon アソシエイト作成支援ツール一覧」さんでたくさん紹介されています。あまりに多すぎてどれがいいか検証していませんが、一番上に載っていたため一番最初に試し、使い勝手も良かったのでamazletにしました。
 ダウンロードは「amazlet - Amazon アフィリエイト簡単作成ツール : NDO::Weblog」からできます。

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

pixivに登録しました

ちょっと前からpixivに登録していたんですが、やっとイラストの投稿をしました~。
oCで描いたものはぽたに投稿してあるので、とりあえずそれ以外、SAIで描いたものをアップしちゃいました。
なんか流れが速くてスゴイ!

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

AIRまとめサイトWordPress版

AIRまとめサイトWordPress版

以前から言ってたAIRのまとめサイトWordPress版がとりあえずできましたー。
oCのコミュニティをかなり参考にしました :-)
これでアーカイブがだいぶ見やすくなったかな、と思います。
テーマはWP用に配布されているIndigo(Kaushal Sheth - Free Wordpress Themes and Blogger Templates)をベースに、AIR用にカスタマイズしました。

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

AIR用ロゴVer.2

すっかり公開が遅くなっていてゴメンナサイ、AIR用のロゴVer.2です。
ホントは新しい移転先で公開しようと思ってたんですが手が回ってないので先にこちらで…。

Download AIR_logo

同梱内容の使い方を説明しますね。

続きを読む

1ツ星2ツ星3ツ星4ツ星5ツ星 (まだ評価されていません)
読み込み中 ... 読み込み中 ...

1 2
Blog Archives
Feeds
Tag Cloud
Xbox LIVE Gamercard
評判:nsSaico評判 :
785ゲーマースコア :
レクリエーションゾーン :