Home / Diary / 2008年4月のログ
- ダウンロード
- 本体:nomorescripts.js
- 設定ファイル:nomorescripts_domains.js
経緯
- OperaでNoScriptが実現された日。にてblockscriptsおよびblock externalの存在を知る。
- ソース見る
- なーるM
- NoScriptっぽいインターフェースに改造&調整
- それなりにまともな動作をしているようなので公開
解説
上記リンク内にも書いてある通り、UserJavaScriptを有効にしたままサイト側のscriptをブロックすることができる。
使い方もNoScriptとほぼ同じ。右下のアイコンにマウスを乗せると許可しているドメインとブロックしているドメインが表示されるので、クリックで切り替えることが可能。
なお、常に許可したいドメインは設定ファイルに書くことになる。
まだブロックが甘い箇所があるが、そこそこ動いているようなので公開することにした。もし不具合が出るようであれば、メニューの一番上の項目をクリックすることでスクリプトの動作自体を止めることができる。
ドメインについて
一応NoScript同様にホスト名(www等)を取り除いたものを扱うようにした。例えばニコニコ動画なら、nicovideo.jpを許可するだけで
- www.nicovideo.jp ← webページ
- res.nicovideo.jp ← スクリプト等
- tn-skr[num].nicovideo.jp ← サムネイル
と、一気に許可することができる。逆にwww.nicovideo.jpだけを許可したいという場合には対応できない。url-prefixも同様で、次回実装する予定。
Info
- 投稿日
- 2008年4月26日
- タグ
- opera、userjs
- このエントリの固定リンク
- http://diary/log/1758.html
- ブックマークに追加する
-
- コメント
2008
0426
Tagsoperauserjs
黒⇒黒⇒黒⇒白だから、恐らく4個目。例によって例のごとく断線。
基本的に片耳にしか装着しないので寿命が倍になってても、大体半年~1年で死亡確認となっている。まあ、安いからいいやーと思ってAmazonでポチった矢先。
音楽を聴く>外して保管>次の日聴く>なぜか断線してる(;´_`;)>修理で交換させる …
ヘッドホンスレ/KOSS/The Plug - wiki@nothing
修理に出す。そういうのもあるのか!
・・・いや、気が付かない自分がアホなだけだが。言われてみれば保証書とか入ってたなーと思いつつ、目の前には隻腕且つ断線のKOSSが。片方断線したら邪魔になるので切り落としていたんだけど、これって当然保障対象外だよなぁ。なんてこったい。
というわけで、次からのKOSSは改造しないで両方断線したら修理に出すようにしよう。
Info
- 投稿日
- 2008年4月20日
- タグ
- misc
- このエントリの固定リンク
- http://diary/log/1757.html
- ブックマークに追加する
-
- コメント
2008
0420
Tagsmisc
クソ忙しいのに斑鳩買ったりドリルランド買ったりデッドラ買ったりしてしまった。積んだ物が崩せずさらに積み重なっていく悪循環に徐々にハマっているのが分かるのが怖い。
相変わらずオープニングの曲がかっこええ。雑誌にも画面写真が幾つか出ていたが、初代と比べると、DSとは思えないほど綺麗になっている。
アトラスネットの日記も更新。
ディレクター金田のカドゥケウス日誌 Vol.11
絶対アンジュは人魚の肉を食べてる。
神ゲーの廉価版が5月29日に登場。難易度調整が素晴らしいので初心者でもオススメ。鈴木司郎や加山雄三も絶賛。
このいかにもタッチペン強制スタイルは鋼の季節と同じ匂いがする・・・
やはり、XBLAのタイトル飽和は問題なんだな。タイトルが飽和することでゲイツチェックが遅れ、リリースも遅れる。さらにXBLAはインターフェースがショボイので満足なフィルタリングも行えず、良作がクソゲーの中に埋もれてしまっている。
ゲイツもそれを分かってて移植を制限することでタイトル飽和を避けようとしていると思うけど、それ以前にオリジナルでも満足のいく品質のものが少ないのが問題なので、まずはゲームの質をチェックするようにしてくれ。そんなだからドリラーオンラインのようなゲームが当たり前のようにリリースされてしまう。そして信用を一気に失ってしまうんだ。
「Wiiで2本作ってます! タイトルの内容については……すみません、カンベンしてください(苦笑)。
罪と罰だよな!?罪と罰であってくれ!
Info
- 投稿日
- 2008年4月20日
- タグ
- misc
- このエントリの固定リンク
- http://diary/log/1756.html
- ブックマークに追加する
-
- コメント
2008
0420
Tagsmisc
偏執的な書き方はともかく、Stylishを使って記述から投稿までを解説したようなサイトは見たことがないので、こちらも覚書として自分の手法を紹介する。
なお、ここから先は偏執的ではない。
Stylish専用プロファイルの作成
Firefoxに導入する拡張を絞り、広告ブロック等も行わないようにすることでwebページへの影響を最小限に抑える。これにより素のwebページを弄ることができるようになるので、ユーザースタイルシートを導入した際の他ユーザーとの差異を小さくすることができる。
別プロファイルを起動できるようにする。
複数の Firefox を同時起動するを参考に、
C:\Firefox\firefox.exe -no-remote -P "Stylish"
このような感じでショートカットを作成。初回はプロファイル編集ダイアログが表れるので新規プロファイルを作成する。間違っても通常使うプロファイルに設定してはいけない。
右クリックメニューからStylish専用プロファイルを起動する
このままでは、「ユーザースタイルシートを作成したいページのURLをコピー⇒専用プロファイル起動⇒URLをペースト⇒開く」といった手順が必要になるので、簡略化するべくJSActionsを利用して、右クリックから起動できるようにする。
JSActionsの導入については三軒隣の斜め向かい:JavaScript Actionsにて詳しく説明されているので、参考にすると良い。
無事にフォルダの設定まで完了したのなら、以下のスクリプトを「Stylish専用プロファイルで開く.js」とでも名前をつけてscript_set/globalに保存する。
// 現在のページまたはリンク先をStylish専用プロファイルで開く
jsa_execStylishProfile( );
function jsa_execStylishProfile(){
// Firefoxのパス
var fxpath = "D:\\Firefox\\firefox.exe";
// プロファイル名
var prof = "Stylish"
var docURL = ( _jsaCScript.context.onLink )
? _jsaCScript.context.link.href
: window.location;
_jsaCScript.exec( fxpath, ' -no-remote -P ' + prof + ' ' + docURL );
}
Firefoxを再起動後、適当なページで右クリックメニューから「Actions/Stylish専用プロファイルで開く」と選択すれば、見事に専用プロファイルが起動するようになる。
好みのテキストエディタでスタイルを書く
StylishのスタイルシートエディタはFirefox標準のtextareaなので非常に使いづらい。そこでuserChrome.jsを利用して、好みのテキストエディタで編集できるようにする。導入についてはuserChrome.js - Mozilla Firefox まとめサイトを参照してほしい。
userChrome.jsを導入したら、次にuserChrome.jsの話題8 Stylishのエディットウインドウに外部エディタ起動ボタンを追加する(改1)を参考にstylish0.5_edit.uc.jsをchromeフォルダに保存する。
うまくいけば、StylishのスタイルエディタにEditerというボタンが表れるので、これを押すことで外部エディタが起動するようになる。
webページをキャプチャする
実際に作成したユーザースタイルシートをuserstyles.orgに投稿する場合、スクリーンショットがあると導入の指針になるので、可能なら作成していく。
webページのキャプチャにはFirefoxの拡張の一つ、Screengrab!を利用する。
Screengrab!を導入すると、ステータスバーのアイコンからwebページのキャプチャが行えるようになる。saveは画像ファイルとして保存、copyはクリップボードに格納する。それぞれのサブメニューは以下のとおり。
- Complete Page/Frame…
- スクロール領域も含めた、ページの全てをキャプチャする
- Visible Portion…
- 現在表示している部分のみをキャプチャする
- Selection…
- 選択した部分をキャプチャする
チートシートを用意する
CSS3 セレクタ チートシート
CSS3のセレクタは強力なものが多く、その幾つかはFirefox2.xでも利用可能。こちらのチートシートにはFirefoxだけでなくOperaの対応状況も載っているので、両ブラウザで使えるユーザースタイルシートを作成する際にそばに置いておくと重宝する。
その他拡張機能の導入
- Firebug
- 消したい要素をクリック一つで判別できるだけでなく、CSSがどのように適用されているかも知ることができる。Stylishとの相性はグンバツ。神拡張。
- Web Developer
- 必須というわけでは無いが、機能の一つにウインドウを指定サイズでリサイズできるというものがあるので。他で代用できるなら入れる必要はあまり無い。
その他、webページに影響を与えない拡張なら必要最小限に抑えて導入していく。
ユーザースタイルシートのバックアップ
プロファイルフォルダ内にあるstylish.rdfがStylishの本体なので、コピーするなりしておく。
userstyles.orgに投稿する際の注意
- 投稿したスタイルは削除できない
- 投稿したスタイルの名前は50byteまで
- 他とする重複タイトルは登録不可能
- スクリーンショットは75KByte以下且つGIFかPNGのみ
- スクリーンショットは横幅が300pxになるまで縮小される
- Editページのobsoletion formから投稿したユーザースタイルシートを検索に引っかからなくなるようにできる
画像の一括リサイズ
キャプチャした画像は75KB以下でないとアップロードできない上、横幅が300px以上だとサーバーで汚く縮小されてしまうので、GIMPを利用して一括縮小してしまう。
一括変換プラグインで一度に複数画像を処理するを参考にプラグインを導入すれば、容易に一括リサイズが可能になる。
Info
- 投稿日
- 2008年4月20日
- タグ
- css、firefox
- このエントリの固定リンク
- http://diary/log/1755.html
- ブックマークに追加する
-
- コメント
2008
0420
Tagscssfirefox
StylishとはFirefoxの拡張のひとつで、ユーザースタイルシートの作成と管理を助けてくれるもの。
userstyles.orgには大量のユーザースタイルシートが投稿されていて、Stylishを導入しているなら現在開いているサイトのユーザースタイルシートが無いか確認したりすることができる。
このStylishを使って去年あたりから細々とユーザースタイルシートを投稿してきたので、ここらで自分流のスタイルシートの書き方とかについていろいろまとめてみようと思った。
なお、一度でも使ったことがあるなら分かるが、かなり偏執的なレイアウトにしてしまうので、合わない人にはとことん合わないということを注意しておきたい。
どのようなサイトに向けて作成するか
基本的には訪問頻度と文章を読む上でのレイアウトの酷さ。レイアウトの酷さには以下の点が挙げられる。
- 無駄にデカいサイトロゴ
- サイドバーが多い
- サイドバーが縦に長い
- 画像が多い
- 文字が小さい
- 行間が狭い
- 文字間が狭い
- リンクに下線が引かれていない
- 適度に改行されていない
- 段落と段落の間が詰まっている
- 数世代先の色使い
などなど。そこまでレイアウトが酷いサイトにはそうそう出会わないが、文字が小さいサイトが非常に多いので、今まで作成したユーザースタイルシートの大半は文字を大きくするついでにレイアウトも変えてしまったサイトだ。
どのようなレイアウトにするか
可読性と速さを追求したレイアウトにしたい。
まずは可読性。自分の中で理想的なのが、スタイルシートを全く適用させない状態で本文の幅を40文字前後にして中央寄せにしたもの。さらに行間と文字間を広げ、文字も大きくすることで可読性を向上させる。文字を大きくするのは単に視力が弱いから。
次に速さ。可能な限り広告の画像やコンテンツの背景画像等を極力読み込まないようにし、1カラムのシンプルなレイアウトに仕上げる。こうすることでブラウザのレンダリング負荷を下げ、無駄なファイルリクエストを減らし、1秒でも速くページの読込と表示が完了するようにする。
読みやすいレイアウトの基礎作り
body {
font-size : 112.5% !important; /* 18px */
margin : 0 auto !important; /* 中央寄せ */
padding : 0 !important;
background-color : #f0f0f0 !important;
color : #111 !important;
width : 40em !important; /* 最大幅40文字分 */
max-width : 100% !important; /* 横スクロールバーが出ないように */
border : 0 !important;
}
フォントサイズを大きくし、文章の幅を最大40文字に。背景色と前景色を読みやすい色に固定する。
* {
background-image : none !important;
float : none !important;
text-align : left !important;
letter-spacing : 1px !important;
line-height : 1.5 !important;
min-width : 0 !important;
text-indent : 0 !important;
white-space : normal !important;
}
背景画像は文章の邪魔になることが多いので消去。floatによる段組レイアウトも必要無し。文字間と行間を広げることで可読性を上昇させる。
あらゆるレイアウトを崩す
#container
, #container div {
font-size : 100% !important;
position : static !important;
background-color : transparent !important;
width : auto !important;
height : auto !important;
border : 0 !important;
margin : 0 !important;
padding : 0 !important;
}
それなりに構造がまともなサイトであれば、レイアウトはdivにclassやidを振ってCSSで調整しているのが大半なので、大元のノード及び子孫全てのdivに対してこのスタイルを適用することで、ほとんどのサイトで1カラム化が完了する。
最後に調整
#container * {
font-size : 100% !important;
position : static !important;
background-color : transparent !important;
width : auto !important;
height : auto !important;
}
グローバルセレクタだけでは優先順位の関係上適用されなかったもの(言い換えれば、サイトオーナー側でよく設定されているもの)を、今度は大本のノードの子孫全てというセレクタで再設定する。これでほとんどのサイトは陥落する。
本当はグローバルセレクタでレイアウトを一気に設定したいが、そうするとFirebugでの表示に不具合が生じるので、仕方なくこのような形になっている。
上記だけでも多くのサイトが理想のレイアウトに近くなるが、いくつか邪魔な要素が残るはずなので、classやidを指定して消していく。これらの作業は大体10分前後で完了する。
こうして完成したユーザースタイルシート群は「DestroyAllLayouts」シリーズと名付けることにした。ネーミングに関しては、デストロイオールヒューマンズというゲームタイトルの語呂が良かので拝借した記憶がある。
なんでもかんでも消せばいいと思っているのか?
最近のエントリ一覧や関連のあるエントリ一覧は残したいと思っているが、サイドバーに組み込まれていたり、残すことで他の必要ない要素も残さなければならないようなサイトは泣く泣く消している。
何が必要かは個人によって差があるが、以下についてはできるだけ残したいと思っている。
- サイトロゴ兼トップページへのリンク
- 前後の記事へのリンク
- コメント
- 最近のエントリ
- 関連のあるエントリ
崩せないサイトもある
tableレイアウトを多用していたり、そもそもHTMLが破綻しているようなサイト。数年以上前からサイトに手を加えずにそのまま運営している羅列方ニュースサイト等に多い。
このようなサイトはCSS3のセレクタをもってしても通用しない構造をしていたりするので満足にレイアウトを変更できない。隣接セレクタを利用した力技でなんとか対処しているのが現状。
mixiにいたっては心が折れた。
作成したユーザースタイルシート
下記リンクからどうぞ。OperaでもUserJavaScriptとして利用できるが、対応しているセレクタの関係上、うまく適用されないことがたまにある。
まだまだ試行錯誤の段階なので、上記テンプレートはユーザースタイルシートを作成する度に少しずつバージョンアップを重ねている。
そのため、初期に作成したものと最近のものでは仕上がりがかなり違うので、暇を見て修正している最中だ。もし、インストールしたユーザースタイルシートがおかしいと思ったら、しばらく経ってからインストールし直すと正常に動作するかもしれない。
suzusaki | userstyles.org
Info
- 投稿日
- 2008年4月20日
- タグ
- css、firefox
- このエントリの固定リンク
- http://diary/log/1754.html
- ブックマークに追加する
-
- コメント
2008
0420
Tagscssfirefox
明日売りの雑誌より。
続編きたぁぁぁぁぁああああああ゛あ゛あ゛あ゛あ゛あ゛あ゛あ゛!!!
DS⇒Wii⇒Wiiときて再びDSにカドゥケウスが戻ってきた! 月森とアンジュはそのままで再びタッチペンで手術ができると思うと嬉しくてたまらない。
日本不遇
累計本数だけ見ればヒットしているタイトルだが、リンク先の売り上げを見ると一目瞭然。大体海外では日本の10倍以上売れている。というか、日本が海外の10分の1しか売れていない。
最新作NEW BLOODの初動にいたってはオプーナ以下。さらにはホリデーシーズンとはいえ、既に完成していたものをわざわざ2ヶ月遅らせて日本で発売するなど、続編は絶望的、仮に出ても海外だけじゃないかと思っていたが・・・この発表は実に嬉しい。
Info
- 投稿日
- 2008年4月20日
- タグ
- game
- このエントリの固定リンク
- http://diary/log/1753.html
- ブックマークに追加する
-
- コメント
2008
0420
Tagsgame