mixiがリニューアル後使いにくくなって。。

 一部に非常に評判が悪い 10月1日以降のmixiですが、反応をみていると大きく2つに分類できそうです。


・慣れない、色が嫌い、などの主観的感情系
・機能的に退化したことを嫌う、実務的系


私は後者の面で今回のリニューアルを苦々しい思いで見ている一人ですが、それは主にこんなもの:
・トップページで自分の過去日記が直近の1つしか見えなくなってしまった。それなりに高めの頻度で日記を書いて、2,3個前の日記にコメントを付けたりする私にとってはコメントするための手間が増えてしまった。
・全体的にスカスカな感じになって、1ページに入る情報量が少なくなってしまった。スクロールしないと行けないシーンが増えた。
・3カラム、2カラムを今まで選択できたのに、強制的に3カラムオンリーになってしまった。ブラウザの横幅はそれほど普段広げておかないので、3カラム目はほとんど見えない。


 もちろんシステムとしては今まで成長に併せて「つぎはぎ」的に開発してきたものを一気にきれいにしたり、直近の日記には日付でなく時刻が出るようになったりなどの、細かいようで実は高く評価すべきリニューアルだったわけですが、それと引き替えにユーザが失ったものは非常に大きかったと思います。


ということをブツブツ言っていたら、あきやんさんが リニューアル後のmixiを2カラム/750px幅化するユーザースタイルシートを書いてみたというエントリーで、FireFox用のスタイルシートを公開してくださいました。
私は普段は FireFox を使っていないのですが、そのエントリーで紹介されている Stylish アドオンとともに FireFox を使ってみたところすっかり気に入ってしまい、ゴリゴリ慣れない CSS をいじり始めてしまいました。半日つぶれました。今は反省している
でもできあがったもの(あきやんさんの公開されたものを多少修正した後、自分好みの行間設定などをしたもの)には非常に満足しています。2カラム化もできたし、1ページの情報量も増えたし。


主にこんなことを追加でやりました:
・行間を詰める
・アイコン画像を小さく


あとはトップページに自分の最新日記タイトル一覧を出せれば最高だけど、これは別途リクエストを投げて結果を加工しないと取れない情報だから難しいでしょうね、、、


■トップページ
オリジナル                               変更後


■マイミク最新日記一覧
オリジナル                               変更後



自分用なので細かいところは気を配っていないとか(ずれているとか)、根尽きて荒削りだったりしますが、それなりに満足した出来になりました。
あきやんさん、素敵な情報をありがとうございます。
http://www.akiyan.com/blog/archives/2007/10/mixi2765px.html


以下修正後の CSS を張っておきます。

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("mixi.jp") {

/* 全体を中央揃え */
body { margin:0 auto !important }
body { width:750px !important }

/* ロゴ非表示 */
h1 { display:none; } 

/* 広告バナー非表示 */
p.adBanner { display:none !important }

/* 右カラム非表示 */
#bodySub { display:none }

/* ヘッダの背景を透過色に */
#headerArea { background:transparent !important }

/* ヘッダエリアの幅調整 */
#headerArea { width:780px !important }

/* ヘッダの高さを自動に */
#headerArea { height:auto !important }

/* 運営者からのお知らせをきゅうきゅうに */
#bodyMainArea div.information h2 {top:10% !important } 
div.information div.contents ul { padding:0px 0px 0px 20px;line-height:1.1 !important }

/* コンテンツエリアもきゅうきゅうに */
dl.contentsList01  {line-height:1.2 !important} 
#bodyMainArea div.heading02 {height:18px !important;line-height:18px !important}
#bodyMainArea div.heading02 ul {margin-top:-2px !important}

ul.entryList01  {line-height:1.1 !important} 
ul.entryList01 li {padding:2px !important}
ul.entryList01 li dl {padding:0 2px !important}

/*---- BodyContents ----*/
#bodyContents #newFriendDiary,
#bodyContents #newComment,
#bodyContents #newBbs,
#bodyContents #newBbsComment,
#bodyContents #newVideo,
#bodyContents #newAlbum,
#bodyContents #newPlaylist,
#bodyContents #newReview,
#bodyContents #myUpdate{
padding-bottom:2px  !important 
}


/* 検索フォーム非表示 */
div.searchForm01{ display:none } 

/* 自分の写真を小さく */
div.contents01 img { width:36px }

/* マイミクアイコンを小さく */
table.iconListTable td a:link,
table.iconListTable td a:visited,
table.iconListTable td a:hover,
table.iconListTable td a:active,
table.iconListTable td a:focus{
width:16px !important; height:16px !important;}

/* 本文エリアの幅調整 */
#bodyArea { width:750px !important }

/* グローバルナビゲーションの幅調整 */
#globalNavigation { width:750px !important }

/* グローバルナビゲーションのmikly・動画・フォトボタン非表示 */
#globalNavigation ul.contentsNavigation li.mikly { display:none !important }
#globalNavigation ul.contentsNavigation li.movie { display:none !important }
#globalNavigation ul.contentsNavigation li.photo { display:none !important }
#globalNavigation ul.contentsNavigation li.music { display:none !important }

/* ヘルプ・ログアウトボタン非表示(disabled) */
/* #globalNavigation ul.utilityNavigation li.help { display:none } */

/* ローカルナビゲーションの幅調整 */
#localNavigation { width:750px !important }

/* ローカルナビゲーションのレビュー・ミュージックボタン非表示 */
#localNavigation li.review { display:none }
#localNavigation li.music  { display:none }
#localNavigation li.video  { display:none }


/* ローカルナビゲーションのプルダウンボタン非表示 */
/* #diaryPullDownButton { display:none !important } */
#videoPullDownButton { display:none !important }
#photoPullDownButton { display:none !important }

/* フッター幅調整 */
#footerArea { width:750px !important }

/* フッターナビゲーションマージン調整 */
#footerArea ul.footerNavigation01 li { margin:0 2px !important }


/* 「最新情報」ヘッダの非表示 */
#mymixiUpdate div.heading01 { display:none }

}

/* コミュニティページ専用スタイル */
@-moz-document url-prefix("http://mixi.jp/view_community.pl") {

/* 入退会ボタンを表示 */
#localNavigation li.music  { display:inline !important }
}

追記:GREE用。ずいぶんラフ(いいかげん)なつくりですが。

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("gree.jp") {
div.box_content#rectangle {display:none !important;} 
div.box_content img {width:24px !important; height:24px !important;} 
ul.thumbs img {width:16px !important; height:16px !important;} 
ul.thumbs li a.panel span.name { top: 20px !important; }
ul.thumbs li a.panel {	height: 32px !important; padding-top: 3px !important;}
table.recent_list td.icon img {width:12px !important;}
table.recent_list td.str {line-height: 1.1 !important;}
div.space#pr {display:none;line-height: 0.5 !important;}
div#mainul#tools {line-height: 0.5 !important;}
div#header_logo img{width:60px; height:25px}
div#header_ad {display:none !important;}
div.box .box_more {padding: 5px !important;line-height: 1.1 !important;}
#notifier {line-height: 1.0;padding: 1px 10px;font-size:80%}

div#maincol-content td.name img {width:15px;height:15px;}
div#maincol-content tr {line-height: 1.0;}
}