CriCri

クリエイティブになりたいクリクリ工房

カテゴリー「テクニカルデータ」の記事一覧

« PREV
| HOME |
NEXT »

2024.04.20 [PR]
2009.09.26 HTML + CSSを一新しました
2009.04.05 コメント投稿者のメールアドレスについて
2009.02.02 使用 Java Script
2009.02.02 使用HTMLと表示確認データ

[PR]

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

HTML + CSSを一新しました

初心者クラス脱出を図るためにずっと勉強していましたが、2009年9月公開の「桔梗」からHTMLとCSSを一新しました。
仕様が変わったのに伴って、目に見える変更が出てきていますので、ここで報告しておきます。

コメントフォームに使われているテーブルタグを取っ払いました。これに伴って、テンプレート編集エディターではフォームの変更はできなくなりました。フォーム部分のカスタマイズはCSSにじかに書きこんでください（フォームブロックの背景は、今までどおり編集エディターが使えます）
他の部分はだいたい編集エディターに対応しています。エディターを使っても変化しないところは、CSSに書きこんでください。
その時の気分で変わることがあるかもしれませんが、IE6とIE7でもユーザー側で文字の大きさを変更できるようにしました。IE8はまだ有効なハック（特定のブラウザに言うことを聞かせる術）がないため、ズームで画面自体を大きくする方式にしています。
主要なリンクにタイトルを入れました。リンクの上にマウスを持っていくと、そのリンクに関する案内が出ます。ブログのタイトルに持っていくと、「ブログのトップへ」という案内が出ます。
すでに取り入れてはいましたが、カテゴリーとアーカイブ検索ページに加えて、キーワード検索ページにも記事リストが出ます。
コメント投稿者のメールアドレスを非表示にしました。メールアドレスがある場合は、コメント一覧リストの投稿者名にリンクが表示されますので、そちらで確認してください。
記事内のアクセサリーをCSSで指定してあります。どのタグがデザイン指定されているのかは、CSSの記事ブロックを見てください（HTMLタグが分かる人向け）

[1回]

書くのが遅すぎるんですけど（汗）、コメント欄の投稿者のメールアドレスについて説明しておきます。

コメントフォームには投稿者のメールアドレスと、HPのURLを記入する場所があります。
リンクがある所は色が違うのですが、メールアドレスのリンクが貼ってある投降者名の色は変わりません。
これには意味があります。

投稿者のアドレスがはっきり分かってしまうと、そちらにスパムメールが舞い込む可能性が高くなるため、パッと見にはリンクされていないように見せています。
ブログ管理者はいろいろなテンプレートのプレビューを見ているので、ここにリンクが来ることを知っているはずですよね。

マウスを投降者名の上に持っていくと、リンクがある場合は色が変わります。
この動作をしないとリンクがあるかどうか分らないのが短所ではありますが、コメントをしてくださる皆さんをスパムメールから守るためですので、ご協力をお願いいたします。

追記：
2009年9月公開の「桔梗」より、メールアドレスは非公開に変更しました。
コメント一覧の投稿者名に、アドレスがある場合はリンクが付きますので、そちらで確認してください。

[1回]

使用 Java Script

Java Script はお借りしているものと、自前工作品があります。
お借りしているのは下記のとおりです。サイトリンクはプラグインのテクニカルリンクにあります。
他のカスタマイズ用スクリプトも紹介されてていますので、参考にしてください。
私の工作品は、あちこちのサイトのスクリプトを参考にしています。

Customize in Ninja Blog様

►プラグイン開閉

►プルダウンメニュー

ニンブロラボ様

►追記開閉

Leigeber様
►ドロップダウンメニュー (IE8でバグが発生しました)

Java Script ライブラリー JQuery
►ドロップダウンメニュー（Droppy）
►ドロップダウンメニュー（multilebel Dropdown menu）

自前工作品（保障はしませんが、使用はご自由に）

►画像のループ文
►プラグインの切り替え

[0回]

使用HTMLと表示確認データ

2009年9月　更新
2011年7月　更新

表示確認環境は次の通りです

記述HTML : XHTML 1.0 Transitional
OS : Windows 7、Windows XP、Windows 用 Mac
ブラウザ : IE6、IE7、IE8、IE9、Firefox、Opera、Safari、Google Chrome
モニター : 1024×768、1440×900

各ブラウザはIE6、IE7を除いて、常に更新しています。
古いバージョンでのサポートはしていませんので、お使いのブラウザを常に最新版にされることをお勧めします。

忍者のプレビューはXHTML+Safari の条件が重なると表示崩れを起こすバグがあるので、Macご使用の方はFirefox で表示確認されることをお勧めします。

[1回]