Firefoxを最強のwebサイト統合開発ツールにするアドオンまとめ。
現在Internet Explorerの強大なシェアに最も肉薄しているブラウザであるFirefoxですが、ご存知の通り様々なジャンルのアドオンが那由他に存在しています。 特にWeb制作者にとっては便利すぎて手放せないようなモノも数多く、その有用性はAdobe製品群とも並ぶほど。 そんなワケで今回のエントリーでは、素晴らしいアドオンの中でも、特にWeb制作に効果的なモノを選りすぐりしちゃってみました！ 今回ご紹介するアドオンをフル装備すれば、恐らくそんじょそこらの有料開発ツールと同等以上のポテンシャルを秘めたWeb開発統合ツールが完成するんじゃなかろーかと。 ブラウザを思いのまま颯爽と操る後ろ姿、プライスレス☆ html/cssコーディング Codetch DreamWeaver風のWYSIWYGなHTMLエディタ機能を追加するアドオンです。 作成したHTMLをバリデートチェックする機能も搭
メールの文字化けを解読するWebサービス3選
（12.02/07 14:00PM 追記） 拙作の文字化け解読webツール、しれっと開発しました。 「もじばけらった」 → 解説はコチラ 昨日のエントリーで紹介しようと思ってたサイトが華麗に閉鎖されてたのでｗ、急遽予定を変更してお送りしますよ、と。 ところで皆様、たまーに文字化けしまくってるメールとか届きません？ 一見して迷惑メールとか不要な内容だと分かるならともかく、クライアントさんや上司からのメールだとスルーする訳にもいかないし、かといってそもそも読めないし。 そんな時に便利なのが、今回ご紹介する「文字化けを解読するWebサービス」です！ 文字化けって一言で言っても原因は色々あったりしますので、一つのサイトで解読できなかったとしても、この3サイト全部回ればいずれかは解読してくれると思いますよー。 メールの文字化けを解読するWebサービス エンコードマニアックス - 各種エンコードやハッ
Firefoxの検索バーで、Google検索の検索結果を「ウェブ全体から検索」にする方法
Firefoxの画面右上にある、様々な検索エンジンから一発で検索できる、いわゆる「検索バー」。 いちいちそのサイトに飛ばなくても、思ったその場で検索できるという便利な機能、皆様もお世話になっているんじゃないでしょーか。 ですが、検索バーにデフォルトで登録されている「Google検索」は、通常の「ウェブ全体から検索」ではなく、「日本語のページを検索」での検索結果になるという、ささやかながら結構面倒な仕様になっております。 とはいえこの仕様、実はカンタンに「ウェブ全体から検索」に改造できるんです！ というワケで今回のエントリーでは、Firefoxの検索バーでGoogle検索の検索結果を「ウェブ全体から検索」にする方法をお届けしちゃいますよー♪ FirefoxでGoogle検索の検索結果を「ウェブ全体から検索」にする方法 設定ファイル「google-jp.xml」から、ある部分を削除するだけ！
商用利用可 + クレジット記載不要 + バックリンク不要のフリーアイコン19選
webデザインにおいて、サイトの雰囲気や方向性はもとより、その個性すらも大きく左右する存在の「アイコン」ですが、その重要度と需要からか、世界中の多くのデザイナー方が、高品位なアイコンをフリー素材として公開・提供してくださっています。 特に海外のデザイナーブログなどでは定期的にフリーアイコンを発表していたりして、webデザイナーの方もお世話になったコトがあるのではないでしょーか。 しかしながら、実際にそのアイコンを利用するには、商用利用が禁止されていたり、クレジットやバックリンクが必須だったりと、なかなかどうして目的に沿うライセンスのモノを見つけるのも難しかったりします。 なので今回のエントリーでは、「使用料が無料」という前提の中で、まず「商用利用も可能」で、さらには「クレジット（著作者名）の記載が不要」で、なおかつ「バックリンクも不要」という、webデザイナーならいくらでも持っていたいフリ
クロスブラウザの表示確認ツール決定版!!「Spoon Browser Sandbox」
Web制作者にとって、作成したサイトの画面表示をクロスブラウザで確認するというのは、言うまでも無く絶対に必要な作業です。 現在の主要ブラウザと言えばInternet Explorer、Firefox、Opera、Safari、Google Chromeの5つかと思いますが、それぞれ一つのブラウザをとっても様々なバージョンが存在し、それら全てを一台のPCで共存させるとなると、そのための知識を集めたり、複雑な設定をしたりと、面倒を避けては通れません。 そこで今回ご紹介するのが、昨年度「Xenocode Browser Sandbox」から大幅バージョンアップを遂げた「Spoon Browser Sandbox」です！ コレ、Xenocodeというアプリケーション仮想化技術により、たった1つのexeファイルだけで、なんとIE6・7・8、Firefox2・3.0・3.5、Opera9・10、Saf
いろんなエディタのzen-codingプラグインをまとめてみました
先週くらいから爆発的な注目を集めている、HTML/CSSショートカット用ライブラリ「zen-coding」。 「zen-coding」とは、カンタンな記述で構造化されたHTML/CSSが生成されるという、コーダー感涙の超絶便利なライブラリです。 その便利さ、コーディングが驚くほど簡略化されるというコトで、AptanaやDreamWeaverをはじめ、WordPressやCodaにもzen-codingプラグインが続々と登場しております。 そこで今回のエントリーでは、そんなzen-codingの各種エディタ用プラグインをまとめてみました。 まだ触ったコトの無いコーダーさん！もし自分の愛用エディタのプラグインがあったら、ぜひ騙されたと思って導入してみてください♪ zen-codingとは 先ほども書きましたが、zen-codingとは「カンタンな記述で構造化されたHTML/CSSが生成される」
デザイナー必見のオススメFlickrグループ7選+2
web2.0時代の代表的なサイトの一つ、Flickr。 ほとんどの画像がCCライセンスで公開されているので、デザイナーにとってはかなり重宝するサイトの一つであり、実際にアカウント取って活用されてる方も多いんじゃないでしょうか。 そんな画像共有サイトとして不動の地位にあるFlickr、総数43億枚以上（!!）もの画像の中には、綺麗なwebサイトのキャプチャーやアイコン・ロゴなどといったweb関連のものも数多くあります。 もちろんグループとしてジャンル別に分類されているものもありますが、そこは相手も43億、グループだけ取っても膨大な量ですし、さらに同じようなジャンルのグループでも質自体はそれぞれでマチマチだったりします。 なので今回のエントリーでは、質・量ともに素晴らしく自信を持ってオススメできるFlickr内のweb系グループを厳選してご紹介しますよ。 新しい画像も随時更新されるような活発な
htmlSQLよりアツい!?jQueryみたいにセレクタでHTMLをparse(解析)する「PHP Simple HTML DOM Parser」
htmlSQLよりアツい!?jQueryみたいにセレクタでHTMLをparse(解析)する「PHP Simple HTML DOM Parser」 今週はてブでも大人気を博した記事「真面目にエロサイトを作ってみた【プログラマ編】｜ASTRODEO」や、IDEA*IDEAさんでも紹介されていた、PHPでHTMLをparseするライブラリ「htmlSQL」ですが、解析するHTMLを指定するにはSQLちっくな書き方をするので、SQL自体に触れる機会の少ない方には手を出しにくいシロモノです。 SQLわかんないです＞＜ もっとカンタンにparseしたいぉ☆ってゆー方に全力でゴリ押ししたいのが、今回紹介するMITライセンスのPHPライブラリ「PHP Simple HTML DOM Parser」です！ PHP5で書かれたこの「PHP Simple HTML DOM Parser」の最大の特徴は、解析し
CSS基礎文法最速マスター
最近ネット界隈で流行中の「基礎文法最速マスター」シリーズ。 Parlから始まったこのシリーズですが、いまやPHPやRubyをはじめ、JavaScriptからVBA、果てはjQueryに至るまで、かなりの数の言語が「基礎文法最速マスター」シリーズ化されています。 そこでワタクシもどーにか便乗してやろーと画策しまして、得意分野のCSSについてまとめてみたいと思います。 まぁCSSはプログラム言語とは呼びませんが、プログラマさんなんかは結構苦手意識のある方も多いようなので、ちょっとでも参考になればと思いますー。 CSSの基礎 CSSとは 一言で言えば、(X)HTMLでマークアップされたページの見栄えをコントロールするためのものです。 CSSを使う事で、(X)HTML側ではページの内容や構造だけの記述に留める事が出来るので、検索エンジンにも優しく、デザインの変更も容易になる（と言われてますが、実際
ウェブデザインにアクセントを加える画像加工のテクニック7選
レイアウトもばっちり、配色構成もＯＫ、いざガシガシとデザインを組んで行ってはみたものの、何か物足りない。。。 そんなまとまりすぎたデザインに、ピリッと印象的なアクセントを加える7つのテクニックをお届けしちゃいます！ どれもカンタン、ひと手間ちょいと加えるだけでデザインが引き締まるコト間違いなし!? そんなこんなで今回のエントリーは、いまいちインパクトの足りないウェブデザインにアクセントを与えるテクニックをご紹介してまうでー。 ウェブデザインにアクセントを加える画像加工のテクニック 1.1pxのドロップシャドウ これは文字と背景色の兼ね合いが少し悪い（視認性があまり良くない）場合に文字を少し目立たせたり、単純に文字にパキッとした印象を付加したりしたい場合に使えるテクニックです。 ポイントは「はっきりとした色差で、くっきりと1px」って感じで、Photoshopならドロップシャドウで「距離1、
IT関連のポータルサイトをまとめてみた
何か個別で調べ物をしてる時なんかには、その情報に特化した個人ブログのエントリーはとても役に立ちますが、もっと受動的な感じで情報を吸収したい時、業界全体の大きな流れに触れていたいって時には、やはりポータルサイトからの情報ってゆーのが新鮮で確実。 とはいえなかなか「IT ポータル」とかで検索しても、バッチリお好みのポータルサイトには辿り着けなかったり。 んな感じで今回のエントリーは、「IT関連のポータルサイト」をガツッとまとめてみちゃいました。 ご存知のサイトもそーじゃないサイトもあるかと思いますが、どれもかなり優良かつ有用な情報を扱っているポータルサイトさんなので、是非一度覗いてみたらいいと思うクリスマス。 寂しくは無い。無いんじゃあっ！！！ IT関連のポータルサイトまとめ ITpro 日経BP社が運営する、IT全般の最新ニュースや業界内の話題などを中心に取り扱っているサイトです。 マネジメ
バージョンアップされたjQuery1.4で、新たに導入されたメソッド一覧
以前からアナウンスがあったようですが、更なるパフォーマンスの向上と新機能を引っさげて、遂に先日jQuery1.4が正式に公開されました！ 最近のJavaScruptライブラリではダントツ一番人気のjQuery、今回のバージョンアップではhtml()やattr()をはじめ、css()やaddClass()などなどDOM操作でよく使うメソッドを中心に最適化・高速化された模様です。 また、新機能もかなり豊富なようで、全てのeventをlive()できるようになったり、delay()やunwrap()といった新しいメソッドが追加されたりしてます。 そんなワケで今回のエントリーは、バージョンアップされたjQuery1.4で新しく追加されたメソッド16個を、カンタンではありますがご紹介したいと思います。 jQuery1.4で新たに導入されたメソッド一覧 1..clearQueue() まだ動かされてい
ITキヲスク | IE6の頻出CSSバグいろいろと、それに対処するハック術
CSSコーディングにおいて最も忌むべきもの、それはIE6。 「ホントに仕様書読んで作ったのか？」と疑いたくなるほどのオリジナリティ溢れるCSS解釈は、IE6の絶大なシェアとも相まって、一層容赦ない問題となりました。 世には様々なハック術や回避方法が出回るも、それ自体がIE6のバグを利用したモノだったりして、IE立てればOpera立たず、みたいな状況に脳ミソとろけた経験のある方も多いのではないでしょーか。 今回のエントリーでは、そんなIE6で頻出するCSSバグと、それを対処 / 回避するハック術なんかを取り上げてみたいと思います。 これでもうIE6なんざ怖くない!? IE6の頻出CSSバグと対処ハック術 1.横方向のmarginが倍になっちゃうバグ。 恐らく最も引っかかるであろう、この凶悪なバグ。 このバグに見舞われてしまう条件はものすごくカンタンで、「floatさせた要素に、floatした
脱・初心者のための厳選Photoshopショートカットキー16選
おおよそ全てのWEBデザイナーにとって、相方とも呼べる必携アプリケーションの一つ、Photoshop。 WEBデザインにおけるグローバルスタンダードであるPhotoshopですが、その操作感は非常に独特でクセがあり、ベテランデザイナーがショートカットキーなんかを駆使して高速で作業を進めていく中、新米の初心者デザイナーさん達はツール一つ選ぶのにマウスカーソルを動かしてツールをクリックして操作して、またツールを選びにマウスを動かして、、、。 しかしながら、実際に作業工程内で良く使うツールや操作なんかって結構限定されてたりして、逆に言えばその辺りの手順を高速化できれば、コレかなり作業時間を短縮できますよね。 というコトで今回のエントリーでは、まだショートカットに馴染みきれていないPhotoshop初心者ちゃんの方が、絶対に知っといて損のないショートカットキーを16個、厳選してご紹介します。 この
グラフを超キレイに生成するJavaScriptライブラリ「gRaphaël」
一見してflash製かと見紛うくらいに美しいJavaScriptのグラフ生成ライブラリを発見したので、華麗にご紹介。 円形グラフをはじめ、縦バータイプ、折れ線グラフ、ちょっと変わったドット型グラフまでキレイに生成してくれるという魔法のようなライブラリ「gRaphaël」でございます。 Ajaxな感じのhoverアクションも搭載されていて、自動比率計算機能なんかもあって、ルックスのみならず実力も兼ね備えている模様。 そんな訳で今回のエントリーでは、カンタンキレイなJavaScriptのグラフ生成ライブラリ「gRaphaël」を、使い方の説明も兼ねてご紹介しちゃいますよー♪ グラフを超キレイに生成するjsライブラリ「gRaphaël」 実際の使い方（円形グラフの場合） まずはhtmlのhead部分にて「raphael.js」と「g.raphael.js」、そして円形グラフ用スクリプト「g.pi
WordPressの無料テーマ紹介エントリーまとめ（総テーマ数916以上!!）
最近では日本でも主流となりつつあるCMS、WordPress。 「かゆいトコロに手が届くプラグイン群」に加え、「豊富でハイクオリティーな無料テーマがたくさんある」という点が、人気の一翼を担っていることに疑う余地はないでしょう。 さて、国の内外を問わず、さまざまなブログで取り上げられている、この「WordPress無料テーマ」、ワタクシもコトあるごとにブクマしてたんですが、あまりにその数が多すぎて、「あのテーマってどこで掲載されてたっけ？」という事態に直面しました。 なので今回のエントリーでは、今まで蓄えてきた「WordPressの無料テーマまとめエントリー」を一挙大放出しちゃおうと思います。 無料テーマをお探しの方をはじめ、自作テーマ作成の際のアイディア帳なんかにも使えるかと思います☆ WordPressの無料テーマまとめエントリー集 それでは、各エントリー内で実際に紹介されているテーマの
あまり知られてないけど強烈に便利な、おすすめショートカットキー厳選16個+α
PC上で行う様々な操作を格段に効率良くするWEB屋必携の必殺技、ショートカットキー。 天下の発明と言っても過言じゃないほどの、便利極まりないショートカットキーの数々ですが、あまりに多すぎる一覧とか見てもなかなか使いどころが分からなかったりしますよね。 なので今回のエントリーでは、個人的にめっちゃ便利だなーと思うショートカットキー、実際に活用してて作業効率が上がったと実感しているおすすめのショートカットキーのみを厳選してお届けしたいと思います。 手に慣れるまでは少し時間もかかりますが、それでもなお全力でおすすめしちゃうほどのミラクル☆エクスペリエンスをお試しあれ♪ 【各種エディタ】 「 Shift + Space 」 ⇒全角入力時でも半角スペースを入力。 日本語で文字を入力してて、文字間調整や整形のために半角スペースを使いたい時ってありますよね。 そんな時、イチイチ半角/全角を切り替えずとも
新型RSS、PubSubHubbub（パブサブハバブ）を簡単に実装する方法
RSS/Atomの更新情報をほとんどリアルタイムで受信できるという、Google発の新規格「PubSubHubbub（パブサブハバブ）」。 早口言葉のようなネーミングが洒落っ気満載なこのPubSubHubbubですが、情報送信側がこれを実装するコトで、仕組み的に数分～数十分のタイムラグが生じてしまうのが常のRSS/Atomフィードを（RSSリーダーがPubSubHubbubに対応していれば）リアルタイムで受信者の手元に届くように出来ます。 日進月歩なWEBの世界、何事も早ければ早いに越したことはありません。 という感じで今回のエントリーは、「PubSubHubbubを実装しようぜ!!」の巻でございます。 PubSubHubbubを簡単に実装する方法 最も基本的なパターン 自前でRSS/Atom生成プログラムを運用しているような場合は、ちょっとメンドーですが手作業でいくつかPubSubHub
和風テイスト溢れる純日本的デザインのウェブサイト27選
数年前からWEBのみに留まらず、様々なデザインに取り入れられているテイスト、「和風」。 独特の配色やレイアウトからなる「和風テイスト」ですが、いざ取り入れようと思ってもなかなかアイディアが出てこなかったり。 なので今回のエントリーでは、日本的なデザインが素晴らしい和風WEBサイトをガッツリまとめてみました。 眺めて感性を刺激するも良し、和風WEBサイト構築のネタ元にするも良し☆ 純日本的デザインのウェブサイト27選 1.多田屋 2.櫻山（おうざん） 3.花咲かZ【ズィー】 4.Japan.illbe.net 5.にっぽんと遊ぼう | NIPPON TO ASOBO 6.はなみち舎 7.和三盆本舗 8.第五十六回全日本剣道選手権大会 9.【華鳥風月】 10.葵山葵 AOIWASABI 11.間人温泉郷 昭恋館 よ志のや (吉野家) 12.そらいろ - きょうの、日本の天気 13.日本舞踊 宗
WEBデザイナーなら一度は読んでおきたい、デザインの基礎的な知識と作法
「神は細部に宿る」といいますが、「木を見て森を見ず」という言葉もまた確かな格言であります。 常に自問自答しながら進んでいくコトこそが、WEBデザイナーにとって一番の課題であるというのも、あながち間違っていないだろうと思います。 しかしながら、その自問自答の切り口すら見当たらないという場合もあって、それは時間と共に正解も不正解も見失っていき、そりゃもう脳内大惨事となっていくのです（経験談）。 なので今回のエントリーでは、「デザイン」そのものに関する情報をまとめてみました。 WEBデザイナーとしての知識や素養であったり、心留めておくべき作法や着眼点といったものを持つための助力となれば幸いです。 デザインの基礎的な知識と作法 デザイン講義シリーズ creamuさんがデザインの専門学校か何かの授業で学ばれたコトを、惜しげもなく公開なさっています。 「デザインとは何ぞや!?」という観念的な部分から入
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
