Twitter ブログパーツ（Badgesカスタマイズ）と素材 - WEBデザイン BLOG
気楽につながりが作れて、リアルタイムにちょっとした情報交換やおしゃべりができるのが魅力のTwitter、もっと自分に近い仲間を増やしてゆくには、今使っているブログにも情報を表示するようにすれば、もう少し早くネットワークが広がって行くのではないかと思ってTwitterのbadgeをカスタマイズし、提供されているAPIを使ってもう少しリアルに、そしてコンパクトに表示できるようブログパーツとしてカスタマイズしました。 今回は、そのカスタマイズの仕方と使っている素材を紹介・提供します。実際にこのブログにて表示しているTwitterブログパーツです。 情報取得には、JSONフォーマットを使って情報を表示します。 今回紹介するブログパーツはCSS設定ができる。javascriptライブラリーjQueryが導入・設定できることが必要となってきます。 表示する情報について API Documentatio
スタイルシートスイッチstyleswitchソース-WEBデザイン BLOG
javascriptを使ってのスタイルシートスイッチソース元を紹介。 スタイルシートの切り替え・文字サイズの切り替え・ブラウザの表示幅を検知して表示を変更するものなどいろんなものがあります。スクリプトの参考に。ついでに個人的にスタイルシートの切り替えを導入しているサイトを少し紹介。
styleswitcher.js-スタイルシート切り替えjavascript - WEBデザイン BLOG
アクセシビリティを考慮したWEBページを作成するときに役立つのがA List Apart: Articles: Alternative Style: Working With Alternate Style Sheetsが紹介しているstyleswitcher.js。 アクセシビリティガイドラインにも「ガイドライン2. 色だけに依存しない」という項目があり、 2.1 色によって表現されている全ての情報は、その色を再現できない環境でも得られるようにしておく（たとえば、前後関係やタグ付けなどによって）。 [優先度1] (チェックポイント2.1) 2.2 前景色と背景色の組み合わせは、色の識別が困難な人やモノクロ画面を使用している人などに対しても十分なコントラストを与えるようなものにする。 [対画像：優先度2 、対テキスト：優先度3] (チェックポイント2.2)（引用：ウェブコンテンツ・アクセシ
Firefoxでちょっと使えるショートカットとブックマーク - WEBデザイン BLOG
自分でFirefoxのwallapaperなんか作ってみようかとおもいましたが、探せばいいのがありますね。今回はよくあるVistaのマーケティングで使われるデザインパターンを意識してこんな感じのアイキャッチを作ってみました。日々、最新のデザインパターンを作っておかないといざって時に作業に時間かかちゃいますからね。 作業効率の向上＝ ショートカット操作＋オリジナルブックマーク＋ブックマーク設定 作業効率を向上させるためには、ショートカット操作は欠かせないです。今回紹介するちょとしたオリジナルのブックマークや設定＋ショートカットを使えば以前よりも早く作業できるようになるかと思います。 よく使うショートカット ［ CTRL ］+ ［ W ］ ウインドウを閉じる ［ CTRL ］+ ［ T ］ 新規タブ開く ［ CTRL ］+［ SHIFT ］+ ［ T ］ 前回閉じたタブを再び開く ［ CTRL
CSSデザインコンテストに参加してみて感じ思ったこと-WEBデザイン BLOG
ＧＷに画像の使用を極力控えてかっこいいCSSデザインをやってみように参加してみました。 今回のエントリーはこちらシンプルなさゆりふりかけスタイル マークアップの制限があって難しかったですね。特に"大会の参加要項"のブロックで"部門別のルール"の枠組みでのコンテンツとマークアップの絡みが面倒に感じました。内容的には同じ位置づけに感じましたが、マークアップは <h6>画像使用の制限</h6>と<p>画像は一切使用してはいけません。</p>となっている部分で、マージンが取れなかったとい点ぐらいです。 驚いたのは、自分が参加した際にはなかったエントリーでほとんど同じような成形をされていた方がいたのが驚きました。Tripletほとんど似ています。びっくりです。自分も今回の参加の狙いは、他の方のウィークポイントで差をつけようと思ったのですが、この方も同じような点に気をつけられていたのでびっくりしました
WEBデザイン BLOG: WEBデザイナーが知っておくべきFireFox Extensions 20
deliciousにて20 FireFox Extensions That Every Web Designer Should Know Aboutというエントリーを見つけた。WEBデザイナーが知っておくべきFireFox Extensions 20 WEBデザイナー志望のわたくしとしては逃せない気になるエントリーでしたので、早速確認。 Web Developer Toolbar こちらのエクステンションは、さすがに使っています。CSSコードの書き換えやW3Cの検証などもでき、重宝しています。 AspellFox フォームなどの書き込みにおいて右クリックでスペルチェックをしてくれるエクステンションのよう。とりあえずパスで。 RankQuest SEO Toolbar 以前昔に入れていましたが、ツールバーの面積が大きくなりすぎるのもあり、使用頻度も低いことにより無効にしているのでパス。SEO
WEBデザイン BLOG: メジャーサイトロゴのフォントスタイルがズラリ
Skype - 世界中どこでも無料通話はHelvetica Rounded Boldのフォントを使っているんだ。こんなエントリーがいくつかあると便利ですね。ほんとにクライアントのロゴを使う際に、データーが頂けないときは、マシンに入っているフォントライブラリーの出力集から似たようなものを探してトレースしていた頃を思い出しました。ある程度フォントスタイルがわかると探すのにも楽なんだよね。 今じゃ国内企業ロゴデーターベースサイトがいくつかあったり、CDなんかのストックデーターが出回っていて楽になったけど。最近のIT関連のサイトロゴなんかは、こんなデーターベースがあるといいんじゃないのかな。ロゴ制作にも役立ってくれるとも思うし、制作前のインスピレーションにもいいかと思う。このエントリーブックマークかデータで保存ですね。The Logos of Web 2.0 | The FontShop Font
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
