HiGash.Net ホームページへ戻る

Home [Blog]

IMGのalt属性・title属性について考える(前編)

IMGのalt属性・title属性について考える(前編)

alt属性が空なら、CSSで背景画像として扱うべきなの?CommentsAdd StarTRANS [hatena]

HTMLをマークアップしている時に、IMGのalt属性に何て書こうか悩むことってありますよね。

「この画像に意味(ふさわしい代替テキスト)なんて無いしaltは空にしとくか」っていう人は珍しくないと思うのですが、最近 「alt属性が空なら、CSSで背景画像として扱うべきなの?」 という面白い記事を発見したので、ちょっとalt属性や背景画像について自分なりに整理してみることにします。

Read More...

Share & Bookmark
このエントリをFacebookでシェアする
このエントリをTwitterでつぶやく
このエントリをはてなブックマークに追加
Delicious
livedoorクリップ
Yahoo!ブックマーク
Buzzurl

押さえておきたいWordPressプラグインまとめ[2008年10月版]

押さえておきたいWordpressプラグインまとめ[2008年10月版]

プライベートで知人のブログを作ることになり、久しぶりにWordpressを弄る予定です。

WordPressで思い通りのサイトを作るために重要になってくるのが何と言ってもプラグインです。
Wordpressには「なんて便利なんだ!」と思うプラグインがたくさんあります。反面、「なぜこれが標準で実装されてないんだ?」と突っ込みたくもなるけれど、まだまだWordpressは発展途上だということなのでしょうね。

今回のエントリーはそんなWordpressのプラグインについて、個人的に重宝しているものや、いつか使ってみようとメモっておいたものをまとめてみました(Wordpress標準のAkismetとWP Multibyte Patchは除きます)。

Read More...

Share & Bookmark
このエントリをFacebookでシェアする
このエントリをTwitterでつぶやく
このエントリをはてなブックマークに追加
Delicious
livedoorクリップ
Yahoo!ブックマーク
Buzzurl

テキストをハコ組みする際のdivを計算して作ってみる

テキストをハコ組みする際のdivを計算して作ってみる

グラフィックデザインにおける文字組みはWebのように閲覧環境に左右されることがなく、トラッキングやカーニングによる文字間隔の調整もしやすいので、Webよりもずっと細かくデザイン設計ができます。
当然エディトリアルデザイン(雑誌や書籍などの編集デザイン)の場合はその傾向が顕著で、書籍や雑誌の誌面はかなり緻密に計算して文字を組んでいます。

グラフィックデザインでは “級(Q)・歯(H)” という単位を使って文字の大きさや文字間・行間などを設定します。QとHは写植時代からの日本固有の単位で、 1Qと1Hどちらも0.25mm です。
印刷物で文字の単位というと、一般的なのはポイント(pt)ですがプロのグラフィックデザイナーはあまりポイントでは作業しないと思います。 メートル法を長さの単位の基準にする以上、メートル法で端数となってしまうポイント(1pt=0.352778mm)では厳密な計算ができないから です。

Read More...

Share & Bookmark
このエントリをFacebookでシェアする
このエントリをTwitterでつぶやく
このエントリをはてなブックマークに追加
Delicious
livedoorクリップ
Yahoo!ブックマーク
Buzzurl

Google Chromeでは input type=”search” が効かない?

Google Chromeでは input type=

先日ベータ版がリリースされたGoogleのWebブラウザ Google Chrome 。残念ながらまだWindows版しか公開されていないため、Macユーザーの僕はBoot Campで試しに触ってみた程度なのですが、第一印象としてはなかなか速そうですね。キビキビ動く感じがします。

Apple Safariと同じWebKitをレンダリングエンジンにしているものの、描画にSafariのような強い個性はありません。外観もとてもシンプルでいかにもGoogleらしい。ぼちぼちシェアを獲得するのではないかと思うので、Webデザイナーにとっては頭の痛い話ですがまたひとつ表示の確認を迫られるブラウザが増えそうです・・・。

今回のエントリーはそんなGoogle ChromeのユーザーエージェントやCSSに関して、まだベータ版ではありますが少しばかり調べた情報をまとめてみることにします。

Read More...

Share & Bookmark
このエントリをFacebookでシェアする
このエントリをTwitterでつぶやく
このエントリをはてなブックマークに追加
Delicious
livedoorクリップ
Yahoo!ブックマーク
Buzzurl

僕がCSSによる “画像置換” を使わなくなった3つの理由

僕がCSSによる “画像置換” を使わなくなった3つの理由

今更聞き飽きた感のある方も多いであろうネタですが、Webデザインの仕事をするうちに思い直した “画像置換” に関する僕個人の見解。

まず、 画像置換(Image Replacement) とはそもそも何かというと、その名の通り、CSSのbackgroundプロパティを使って、テキストを画像に置き換えてしまおうというもの。広く普及しているCSSの基本テクニックと言えるでしょう。

当サイトもページ上部のグローバルナビなどでこの手法を用いていて、以下のようなHTMLとCSSで画像置換を行っています。

Read More...

Share & Bookmark
このエントリをFacebookでシェアする
このエントリをTwitterでつぶやく
このエントリをはてなブックマークに追加
Delicious
livedoorクリップ
Yahoo!ブックマーク
Buzzurl

Page Top