プログラマが1ヶ月でWebデザイナーに転身する方法 - やねうらおブログ(移転しました)
サイトを構築していると、プログラマはWebデザイナーと共同作業をしなければならない。 しかし高度なRIAを実現しようとすると思っているようにWebデザイナーに素材を作成してもらうだけでもとても骨の折れる作業だ。 そこで、一層、「すべてのプログラマはWebデザイナーになればいいんじゃね？」と思った。 今回は、私の実体験に基づき、「プログラマが1ヶ月でWebデザイナーに転身する方法」というのを考えてみた。 ■ HTML,CSSを覚えよう まず、HTMLとCSS。いくら私でもW3C( http://www.w3.org/ )のすべてに目を通せとは言わない。 ブラウザ間で挙動が違うのでそれぞれのタグがどのブラウザで使えるのか一覧がまず欲しい。手軽なのは詳解HTML & CSS & JavaScript辞典。このハンドブックは見やすいのでお勧め。また、よく使うタグに関してはすべて覚えよう。覚えている
とってもお手軽なFavicon作成ツール『Favikon』 | 100SHIKI.COM
これが決定版じゃね？とってもお手軽なFavicon作成ツール『Favikon』 November 14th, 2007 Posted in 画像・映像管理 Write comment これは便利。 Faviconをブラウザ上で作れるツールがFavikonである。もちろん、こうしたツールは他にもある。 ただ、Favikonは「画像のこの部分をFaviconにしてね」をブラウザ上で手軽に指定できる点が特徴である。 他のツールは画像のFaviconにしたい部分を切り出してからアップロードすることが多いが、Favikonではこの手順は不要になるのだ。 範囲の指定は直感的で、移動やら拡大・縮小をしながら、自分のイメージどおりのFaviconを作っていくことができる。もちろん、ダウンロードする前にプレビューもできるので、自分の気に入った画像ができるまで何度でも試すこともできる。 サイトやブログを持って
Forgot the Milk. - これは楽しい！10秒でWeb2.0風のボタンをサクサク作れちゃうボタン・ジェネレータ・サービス | My cool button
My cool button というサービスが楽しいです！ Web2.0風ボタンをオンラインで簡単に作成、ダウンロードすることができます。シンプルなボタンならものの10秒で完了しちゃいます。しかも、クオリティが高い！しかも、自作アイコンも取り込める手の凝りようです。 ちなみに、ためしにこんなの作ってみました。（どれもサクサクってできちゃいます） ぜひ、一度遊んでみてください。ただボタン作ってるだけで楽しくなっちゃいます。 My cool button タグ [webservice] [webdesign] 同じカテゴリーのおすすめ記事 Gmailよりも巨大なファイルを送れる７つのサービス - Forgot the Milk. gooラボからダラ見型の新検索サービス「goo空とび検索」公開 - Forgot the Milk. これはすごい！201の動画サイトをリストアップした究極のオンライ
「左上の魔術師」理論
Web業界のデザイン手法として、密かに流行し始めている「左上の魔術師」理論。 サイトとしての「見栄え」よりも、ユーザーの「目の動き」に着目したWebデザイン手法として注目を浴びています。 今回は、まず始めにWebサイトのデザイン別にユーザーの「目の動き」を解説します。 そして、実際にミリオン単位でユーザーを獲得しているサイトを考察することで、「左上の魔術師」理論を解説したいと思います。 1.カラム別Webサイトデザイン 2.昔はたくさんあったWebサイトデザイン 3.ページ単体を見に来たときのユーザーの目の動き 4.サイト全体を見たくなったユーザーの目の動き 5.ミリオン単位でユーザーを獲得しているサイトのデザイン 6.左上の魔術師とは 1.カラム別Webサイトデザイン 現在のWebサイトの多くは、「1カラム型」、「2カラム型」、「3カラム型」のどれかで構成されています。 このうち「2カラ
photoshop- 1ピクセルラインで質感を高めるテクニック - WEBデザイン BLOG
下記の画像はこのサイトのトップページの画像です。両者の違いは、1ピクセルのラインが入っているか、いないかの違いです。左の画像はピクセルラインあり、右側はラインなしです。（画像クリックすると原寸表示されます。） ピクセルラインを入れることで、立体感を演出することができ、さらに質感を高めることができます。 さらに拡大した画像も下記の画像をクリックすることでご覧いただけます。
AJAXで配色を決める無料サービス「Accessibility Color Wheel」
カラーホイールの中にマウスを入れるとリアルタイムでプレビューの色が変わります。「Foreground」がテキストの色、「Background」が背景色、「Invert」をクリックするとテキスト色と背景色が入れ替わります。また、「Bigger」を押すとカラーホイールがさらに大きくなり、「Smaller」を押すとカラーホイールが小さくなります。 Accessibility Color Wheel あと、ページの下部にあるのは色覚障害の人が見た場合の配色になっています。 なお、このカラーホイールの元になったのはこちらの無料サービスです。こっちもおもしろい。 4096 Color Wheel Version 2.1
CSSとHTMLをリアルタイムに書き換えてプレビューできる「rendr」 - GIGAZINE
「CSS」タブをクリックして、中のコードを書き換えると、リロードせずにそのままリアルタイムにページ全体を再レンダリングしてくれます。「Markup」タブをクリックすればHTMLコード自体を書き換え可能。元に戻すには「clear markup and css」をクリック。 Firefoxの拡張である「greaseMonkey」バージョンもあるので、自分のサイトで同じようなことができるようになり、CSSデザインの試行錯誤が楽になります。 詳細は以下から。 rendr http://gregtaff.com/rendar2.html greaseMonkey版はキャッシュが有効な場合に、ローカルキャッシュのHTMLファイルを直接書き換えてリアルタイムプレビューするというモノになっています。 インストールするにはgreaseMonkeyをインストールした状態で上記ページの「greaseMonkey
オンラインでPhotoshop級の画像加工ができる「nexImage」 - GIGAZINE
DHTMLやAJAXを使いまくったオンライン画像加工サービスです。 レイヤー機能や自動でコントラストを調整する機能などがあり、シャープやぼかし、グレースケール、ガンマ値補正、ネガポジ反転といった代表的な各種フィルタも使用可能です。切り抜き、回転、反転、リサイズ、なんでもできます。 また、ちゃんと「元に戻る」機能があり、何段階でも戻ることが可能です。これは安心。 編集するためにアップロードした画像は最後に自分のパソコンへダウンロードして保存可能。ファイル形式も幅広く、JPEG・GIF・PNG・BMP・TIF・PICT・PCX・TGA・PCD形式で保存できます。JPEGは圧縮率の指定が可能で、GIFは色数指定やディザリングの指定もできます。 というわけで、実際にデジカメで撮影した画像で「nexImage」を使ってみました。 nexImage :: The ultimate online ima
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WEB制作者のための32個のブックマークまとめ（part2）*ホームページを作る人のネタ帳
Web担当者Forum