Nefert

最適化完了ー

2008年05月11日 14:08

意外と時間がかかってしまいましたが、一応最適化完了です。
HTMLの方はそれほど弄ることなく、結局CSSの編集が大部分となりました。

HTMLの主な変更点としては･･･
1. 個別ページでは<body>にページにあわせたクラスが追加されるように。これにより、例えばトップページ・過去ログ・検索ページごとでベースカラーを変える、といったこともできるようになりました。
2. entry-bodyの内部にentry-body-containerを設定。overflowに関する設定がやりやすくなりました。

CSSの主な変更点としては・・・
1. backgroundプロパティを細分化。画像を差し替えたいときに変更が容易になりました。
2. MacIEでコメントが表示できないというバグへの対応。言い訳するとブラウザ側のバグのせいです！
3. その他、誤字や重複する記述などを修正。

ついでに、スタイルシート切り替えスクリプトも変更しました。これでSafariなどでもスタイルシートを切り替えることができるはずです。

最適化とはいったものの、結局HTMLの構造が複雑（入れ子の多用など）になっててどうしようも有りません。全てのCSSが一つのHTMLを共有するという形になっているので、表現の柔軟性を持たせるためには仕方ないのですが、どうにかしたいものです…

コメントをする・見る: Comment(0)
トラックバックする・見る: Trackback(0)
カテゴリー: Template

最適化をしたい

2008年04月29日 23:58

今使っているベースHTML・CSSはもう一年以上前に作ったもので、その間何ヶ月もテンプレートに関わっていなかった期間もあるため、自分で書いたソースにもかかわらず詳細を把握しきれていませんでした。
そんなこともありちょっとソースコードを見直してみたのですが、自分があまり使わない部分の手を抜いていたり、ツギハギだらけだったりで結構汚いソースになってました。
ということで、ここらでベースHTML・CSSの一新を図りたいと思います。こういうのはテンプレートの数が少ないうちにやらないと後々もっと大変なことになりそうなので…(´ω｀；)
個人的に、トップページと個別ページの差を作りやすいベースHTMLにしたいなと思っていますが、できるかどうかはわかりません。あともうちょっと他の人にも理解しやすいHTMLにしなきゃとも思ってますが、こちらもできるかどうかは（以下略）。

コメントをする・見る: Comment(0)
トラックバックする・見る: Trackback(0)
カテゴリー: Daily

コメントでの絵文字使用の不具合修正

2008年04月28日 02:28

公開中のすべてのテンプレートで、コメントで絵文字を使おうとした際、一部絵文字をクリックすることができないという不具合がありました。
（InternetExplorer6では通常使用できる模様。Firefoxなどで不具合発生）
そのため、公開中のすべてのテンプレートを更新しています。
更新内容は次の通りです。

修正前

div.comment ,
div.trackback {
    padding-bottom  : 1.5em;
    width           : 100%;
    overflow        : hidden;
}

修正後

div.comment ,
div.trackback {
    padding-bottom  : 1.5em;
    width           : 100%;
}

テンプレートによって細かい記述は違いますが、要するに「overflow」に関する記述を削除しました。
昔書いた部分が問題の原因になっていたようです…。

コメントをする・見る: Comment(0)
トラックバックする・見る: Trackback(0)
カテゴリー: Template(Fix)

大失敗

2008年04月27日 12:33

共有に登録申請しておいたAmarisなのですが、さっき登録文を修正しようと思い共有申請のページを開いて元の登録文をコピーしようとしたところ、手元が狂い、まさかの「削除」クリック。何という失態('-'；)

明後日あたりには登録されるペースだったので激しくショックです。
先にSuspireを登録申請しておいたので次に登録されるのはそっちになりました。むむー。

コメントをする・見る: Comment(2)
トラックバックする・見る: Trackback(0)
カテゴリー: Daily

ソースコードのHTML化(08/05/01更新)

2008年04月26日 22:14

NefertではソースコードやらHTMLやらCSSやらの表示には、ソースコードHTML化コンバーター「唐辛子」を利用しています。
「唐辛子」はソースコードをコピー&ペーストして変換ボタンを押すだけでOKという手軽さと、変換後はCSSファイルで見た目を調整できるという自由度が魅力。ソースコードを見やすくするスクリプトを使う方も多いですが、あんまりゴテゴテさせたくなかったのでこちらを使うことにしました。

Nefertで使っているソースコード用CSSはこんな感じです。

pre.code {
    border          : 1px dotted #aaa;
    background-color    : #f5f5f5;
    background-image    : url("http://blog73.fc2.com/r/rimse/file/code_background.png");
    background-repeat   : no-repeat;
    background-position : left top;
    padding         : 30px 2% 25px;
    width           : 95%;
    font-size       : 12px;

}
@media screen {/* この中をMacIEは無視する */
pre.code {
    overflow        : auto;
    *overflow-x     : auto;
    *overflow-y     : hidden;
}
}
pre.code.html {
    background-image    : url("http://blog73.fc2.com/r/rimse/file/html_background.png");
}
pre.code.css {
    background-image    : url("http://blog73.fc2.com/r/rimse/file/css_background.png");
}
pre.code.javascript {
    background-image    : url("http://blog73.fc2.com/r/rimse/file/javascript_background.png");
}
pre.code span.tag       { color: #00f; }
pre.code span.attr      { color: #000; }
pre.code span.value     { color: #900; }
pre.code span.str       { color: #090; }
pre.code span.num       { color: #090; }
pre.code span.keyword   { color: #00f; }
pre.code span.rem       { color: #909; }

ソースコードのカラーリングは唐辛子標準のものを使用。
手動でpreのclassにhtml、css、もしくはjavascriptと記入すれば、上部の文字が「HTML」、「CSS」、「Javascript」になります。指定無しだと「CODE」。
もし使いたいよーという方がいらっしゃいましたらご自由にどうぞ(*＾-')ｂ→source.css

コメントをする・見る: Comment(0)
トラックバックする・見る: Trackback(0)
カテゴリー: HTML/CSS

Nefert

最適化完了ー

最適化をしたい

コメントでの絵文字使用の不具合修正

大失敗

ソースコードのHTML化(08/05/01更新)

Design Select

Product

Information

Recent Entries

Recent Comments

Recent Trackbacks

Archives

Categories

メールフォーム

RSSフィード

Search

Bookmark

Credit

Nefert