タグ

ブックマーク / kachibito.net (147)

  • 美しいフォームデザインを実装する事が可能なjQueryプラグイン・Ideal Forms - かちびと.net

    チェックボックスやラジオボタンなど、フォーム周り のデザインを美しくする事が出来るjQueryプラグ イン・Ideal Formsのご紹介。スタイルもいくつか 用意されており、フレームワークとして使えるよう です。デザインテーマもいくつか用意されている ので好みで選ぶことも出来ますね。 ボタン、セレクト、ラジオボタンやチェックボックス等のフォームデザインを変更できます。デザイの変更はcssのみで可能なフレームワークタイプなのでノンプログラマーな方でも気軽に使えそうですね。IE6以外は対応しているようです。 フォームのデザインをガラッと変えることが出来ます。よりデザインに統一感を出せそうですね。 テーマも用意されている Ideal Formsはフレームワークとしても利用出来るように、cssでデザインが変更できる作りになっています。現在は3つのcssファイルがテーマとして用意されていますのでそ

  • 商用OK・無料でクレジット表記もリンクも不要!日本人の人物写真素材サイト・モデルピース - かちびと.net

    これはかなり重宝するのではないでしょうか。 日の人物写真素材が無料で商用OK,更に クレジット表記やリンクも不要のサイト・モデル ピース。人物写真は基的にどれも有料か、 あっても日人ではなかったりですが、こちら は無料ですし、国産のサービスなのでモデル さんはみんな日人です。 お友達のまさとさん(@makavelicom)に教えてもらいました。ご紹介するモデルピース以外にもいろいろまとめられてるのでチェックしてみてください [note]激安で日的な写真素材、レンポジサイト一覧[/note] 無料・商用OK・リンクもクレジット表記も不要で解像度も高いです。こんないいサイトがあったとは知りませんでした。足成とは別の選択肢としてかなり重宝しそうです。 日人の人物写真を専門に扱っていて、無料ながら商用OK、リンクもクレジットも不要とのこと。ありがたい。 数もかなり豊富 数が少ないかと思

    商用OK・無料でクレジット表記もリンクも不要!日本人の人物写真素材サイト・モデルピース - かちびと.net
  • HTML5やCSS、jQueryなど、Web制作に関する日本語スライドを集約したSlideFinderが便利っぽい - かちびと.net

    結構便利だったのでシェア。Web制作 に関する日語スライドを集約している フォロワーさん作のWebサービスです。 話題のHTML5やCSSiPhoneの事や jQueryからPHPRubyと幅広くサポート してあります。 人気のスライド共有サイト、SlideShareで日語のスライドのみを集めています。スライドはその場でLightbox風にポップアップして見れます。英語が苦手な方も探す手間が省けるのでは。 @deeekiさん作のWebサービスです。クックパッドエンジニア向け「第2回 開発コンテスト24」に応募する予定だったようで、数時間で作成されたみたいで見た目はシンプルですね。 カテゴリもHTML5やjQuery、PHPiPhoneWordPressなど多岐にわたりサポートされていますので全Web屋さん向けと言えそうです。 日語のスライドのみを集約 集められたスライドは全

    HTML5やCSS、jQueryなど、Web制作に関する日本語スライドを集約したSlideFinderが便利っぽい - かちびと.net
  • WordPress:「IE6はもういいだろ」って思うけど、諸事情で切れない時はプラグインでIE6だけテーマを切り替える - かちびと.net

    WordPress:「IE6はもういいだろ」って思うけど、諸事情で切れない時はプラグインでIE6だけテーマを切り替える - かちびと.net
  • WordPressを使ったWebサイトでfunctions.phpによく書いてるやつ - かちびと.net

    お問い合わせ頂いたので記事にします。 WordPressのfunctions.phpは便利なの はよく分かりますが、結局何が出来るの か分からないのでこんな事できる、という のがあれば教えて欲しいとのことでした。 僕も詳しくないので僕も教えて欲しいんです が、一応書いてみます。 基的にfunctions.phpはちょっと機能を追加したい、という時に使うものだと思うのでデフォルト機能やプラグインで済むならそうしたほうがいい気がしますのであまり拘らなくてもいいかと思います。 それでも、やはりお仕事ではよく追加する機能はありますのでそれをご紹介します。 ※ウィジェットは割愛しますね カスタムポストタイプ add_action( 'init', 'create_post_type' ); function create_post_type() { register_post_type( 'exa

    WordPressを使ったWebサイトでfunctions.phpによく書いてるやつ - かちびと.net
  • インスピレーションを刺激させたい時に大抵見てまわるWebサイト集

    インスピレーションを向上させたい 時に僕が見てまわるWebサイトを ご紹介。というか基的に殆ど閃く 事は皆無に等しいレベルでナンセ ンスな人間なのでドーピング的に 綺麗なものを見るようにしています。 というわけで、発想力の有る方には全く役に立たないエントリーです。個人的には勉強を兼ねたWebデザイン、フォトグラフィのためのインスピレーション向上が目的ですが、「発想力を上げる」というのは様々な業種の方にも通ずるものがあるのではないかと思っています。 パッと見、一貫性の無いまとめですが、どのサイトからもアイデアを貰ったことがあるのでそういったWebサイト集になります。順不同。 Dribbble 世界中のデザイナーの作品が見れるサイトです。新しく作ったコンテンツを公開してくれます。色やカテゴリで探せますが、どれも素敵なのでダラダラ見てるのも楽しいです。 Dribbble We heart it

    インスピレーションを刺激させたい時に大抵見てまわるWebサイト集
  • [jQuery] プラグインを使わずに少しのコードを使ってテーブルのセルを分かりやすくハイライトする

    IE6ではtd.hover:hoverが効かないので濃くなりません。IE6はもういいんじゃないかな。 JavaScriptjQuery体と以下のコードで動作します $(function(){ var overcells = $("table td"), hoverClass = "hover", current_r, current_c; overcells.hover( function(){ var $this = $(this); (current_r = $this.parent().children("table td")).addClass(hoverClass); (current_c = overcells.filter(":nth-child("+ (current_r.index($this)+2) +")")).addClass(hoverClass); }, fu

    [jQuery] プラグインを使わずに少しのコードを使ってテーブルのセルを分かりやすくハイライトする
  • カスタマイズやプラグイン等、今年に入ってブクマしたWordPressの関連記事まとめ・国内編 - かちびと.net

    信じがたいですが、もう3月も終わりそう ですね。なんでしょう、このスピード感。 災害の影響もあってか、凄く時間が過ぎる のが早い気がします。さて、今年も1/4が 終わろうとしてるのでWordPress関連で ブクマした記事をまとめました。取りこぼし てないか、確認がてら如何でしょう。 というわけで今年に入ってブクマしたWordPress関連の記事・国内編です。海外編があるか分かりませんが今日は国内のみの記事に絞っています。 尚、プラグインのまとめ記事的なものはあまりブクマすることは無いのでここにも有りません。ご了承下さい。表題にもあるようにカスタマイズ関連記事ですが、そうでないもの僅かにあります。適当ですみません。順不同です。 WordPressでのページ表示高速化の色々まとめ バージョンが上がるに連れてパフォーマンスも向上してる気がしますが、それでも早いにこしたことないですよね。ほとんど

    カスタマイズやプラグイン等、今年に入ってブクマしたWordPressの関連記事まとめ・国内編 - かちびと.net
  • 「Webデザイン用のフリー素材をシェアしよう」がコンセプトのWebデザイナー専用コミュニティ・Designmoo - かちびと.net

    無料でハイクオリティなPSD素材や フォント、テクスチャなどWebデザイン に欠かせないリソースを無料でDL 出来るコミュニティサイト・Designmoo のご紹介。コミュニティに参加せずとも 使わせてもらえますのでリソースサイト として覚えておくといいかもしれません。 「あなたの役に立つか分からないけど、よかったらリソースをシェアしよう」とのこと。フォントやテクスチャ、PSD素材やブラシなど多くのWebデザイン向け素材が無料で手に入ります。メンバー登録も不要ですよ。 メンバーになるには招待が必要みたいですが、素材のダウンロードは誰でも登録不要で出来るみたいです。 いくつかピックアップ Dyslexia 可愛らしいビットマップフォント Dyslexia 4 minimalistic notice styles ポップアップを優しい色合いに。 4 minimalistic notice st

    「Webデザイン用のフリー素材をシェアしよう」がコンセプトのWebデザイナー専用コミュニティ・Designmoo - かちびと.net
  • Twitterのつぶやきを、3行のコードでWebサイトやブログに表示させる

    お問い合わせを頂いたのでついでに ご紹介。Twitterのウィジェットのような ものをお探しだったようですが、現在の 公式のウィジェットではなく、色々とcss でカスタマイズ出来るようにしたいとい うご希望でした。Twitterの投稿を表示す るだけなら3行もあれば実装出来ます。 タイトルはやや釣りに近いです。知らない方向け。 Webクリエイターボックスさんで表示されてるような感じにしたい、というご希望でした。なぜ僕に質問して頂いたかは謎ですがお答えさせて頂きます。 ウィジェットやjQuery、RSSを使って~等、色々と方法はありますが、自分で表示もデザインしたい、シンプルでいいというのであれば3行もあれば表示させる事が出来ます。 APIキーを取得して~等の面倒な手順も要りません。 [note]statuses/user_timeline/ユーザーのアカウントID.jsonの形式のjson

    Twitterのつぶやきを、3行のコードでWebサイトやブログに表示させる
  • 関東在住なので、念のため最悪の事態を想定して出来る限りデータをバックアップした

    東京都内に住んでいます。ずっと続いて いた余震とそれに伴う地震速報は、かなり 落ち着きを見せており、良いのか悪いのか 僕も街も少し安堵すら感じています。しかし、 まだマグニチュード7クラス以上の余震が 起こる可能性が70%もある、とのことで心身 ともに緊張状態は続きます。 今日も朝から余震がありました。いつのまにか東北関東大震災に名前変えられてますし、最悪の事態を考え、念のため出来る限りのデータのバックアップを取っておきました・・・ 最低限のリスク管理をWeb屋はデータさえ残ってればどこにいても仕事できます。被災してもい扶持を得られやすい環境にあります。そういう意味でデータは命。それを保存できるならすべきだと思います。最低限出来るリスク管理がデータのバックアップ。 もちろん、仕事に関わるデータの保存はすでにされていると思いますが、1箇所に依存するのも危険かもしれません。こんな時です。複数

    関東在住なので、念のため最悪の事態を想定して出来る限りデータをバックアップした
  • フォームのバリデーション用jQueryプラグインいろいろ+α

    個人的なメモ。普段さほど使うことが 無いので、必要な時に探すのに時間 掛からないようにまとめておきます。 沢山ある必要はさほど無いのですが、 勉強用も兼ねていろいろと数を揃えて おきました。 お問い合わせフォームのユービザリティ向上として導入されるバリデーション用のjQueryプラグインのまとめと、その他Tipsやフォームデザイン周りの情報をちょろっと。一応動作だけIE6、7でも確認しています。 exValidation 安心(?)の国産プラグインです。複雑なフォームにも対応できるのでとりあえずこれを覚えておけば安心ではないかと思います。 どんなフォームにも使えるjQueryのフォームバリデーション exValidation jquery.validate.js Validationの日語Ver.です。シンプルなので使い勝手いいですね。日付の確認用プラグインも派生していますので合わせて。

    フォームのバリデーション用jQueryプラグインいろいろ+α
  • jQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみる - かちびと.net

    人気のJavaScriptライブラリ、jQueryもかなり 情報が増えました。僕の様に知識が無くても 簡単に動きのあるWebサイトや、更なるユー ザビリティの向上を可能にしてくれましたが、 いつまでもコピペではいずれ困る事になります。 その前にそろそろ基礎から学んでみませんか。 という訳で、jQuery事始め。さほど知識が無い僕が書くのも微妙なんですが、一緒に学んでいきましょう、という事でご了承下さい。内容は基礎中の基礎です。 いつまでもコピペに頼っていては、何か問題が起こったときに対応できませんし、そもそもコピペするならjQueryである必要はありません。 でもjQueryはすごく便利なので、ちゃんと使いこなしたいところですよね。この記事が、誰かが勉強し始める切欠になれば幸いです。 jQueryを使うには まず、jQueryを利用するには体を読み込む必要があります。方法は2つあって、

    botp
    botp 2011/02/24
    STEP2までは行くんだけど、STEP3からがダメでコピってしまう。いい機会だから見ながらやって覚えたいな
  • CSS3 関連情報・総まとめ

    css3の情報がかなり増えてきたので 一旦まとめておきます。基的にはIE が非対応なので、実用はまだまだこれ からという印象でしたが、iPhoneiPad の普及や、IEにも対応させることが可能 なライブラリの出現でかなり実用性が 上がったように思います。 そういうわけで、ブックマークしておいたcss3関連の情報をまとめて整理してみることにしました。重複した情報は出来る限り削いだつもりです。 ※jQueryなどのJavascriptや、HTML5と組み合わせたTips等の情報は出来る限り割愛しました。 リファレンス / 専門サイトまずは基と教科書になりそうなサイトを抑える W3C / 公式です。セレクタ一覧CSS3リファレンス / 日語のリファレンスサイトWebkit CSS Properties / Webkit対応プロパティの一覧。iOSも有りCSS Infos / css1~

    CSS3 関連情報・総まとめ
  • 頻繁に使用している便利なお役立ち系ブックマークレット・19個 - かちびと.net

    個人的によく使っているブックマークレットのご紹介。どれも便利で役立つので手放せないものになっています。Web制作をしている人なのでそれ系に偏っているかも知れませんが、多少でも参考になれば幸いです。ほとんど有名なものだとは思いますが・・・ というわけで、便利なお役立ちブックマークレットをいろいろとご紹介。手軽なのが素敵ですよね。以前書いてから大分経ちますので改めてエントリーしますが、少々Web制作系に偏っています。順不同です。 CSS構成を一目で確認出来るXRAY 何かと便利なXRAY。クリックした要素の詳細を教えてくれます。Web屋さんはご存じの方も多いのでは。 XRAY 今見ているページをiPhoneで「後で見る」KeepItWith.Me 最初の設定がすごくストレスだったのですが、設定後の便利さが感動したのでご紹介。PCで見ているページでブックマークレットを使って自分のiPhoneに送

  • パクリ記事に関して一応書いておきます - かちびと.net

    アルファなブロガーの方々から僕のような普通のブログにまで紹介頂いて恐縮なので一応個人的な考えを書いておきます。一応僕も地味に被害にあったのでパクリに関する個人的な考えを。参考にする必要もないし、この考えに賛同を求める訳でもなく、議論をしたい訳でも無いし、反論等も無いので特に論点合わせて無いです。 まずは、リンクまでしていただいたWebクリエイターボックスさんとホームページを作る人のネタ帳さんに御礼申し上げます。事の詳細は以下をご参照下さい。 無断転載パクリブログ事件のまとめ 当は解決してない記事パクリ問題と今後の対策 パクリブログ管理人( @partnerzu )の開き直り 「パクられてるよ」と教えてもらったとき ネタ帳さんの記事が丸々コピペされてる、という旨のPostがTwitterで流れてきて、その後、Yamadaさんから僕の記事もコピペされてるよ、と教えて頂きました。Webクリエイ

    パクリ記事に関して一応書いておきます - かちびと.net
  • Webデザインやプログラミングなどの勉強に良さそうな国内のブログ記事やWebサイトいろいろ - かちびと.net

    いよいよ2011年がスタートしました。 今年も去年同様、勉強することが 沢山あります。まだモチベーションが そこそこあるうちに勉強になりそうな 国内の記事をリンク集にしました。 迷ったときに見てみようかなと思い ます。 より最適な方法というのはあると思いますが、まずは扉を叩かない事には何が悪いかも分かりません。ということで、内容に拘らず、否の意見をスルーしてここに色々まとめさせて頂きました。 勉強したい気持ちはあるけど出来ない理由は「何を始めればいいのか分からない」という方も、何が出来るのか、どういった勉強法で出来るようになるかが分かればやる気が起きるかも知れません。 5分で分るシリーズ 以前も流行ったんですね。Web関連以外も含めてここにまとめられています。 5分で分かる PHP を知らない人が PHP の便利さを学べる記事を書いたよ 5分でわかる Ruby を知らない人が Ruby

    Webデザインやプログラミングなどの勉強に良さそうな国内のブログ記事やWebサイトいろいろ - かちびと.net
  • 写真、イラスト、ロゴやパッケージなど様々な「デザイン」のギャラリーサイト・Designspiration

    見やすいし、センスも素敵だったので ご紹介。ロゴやフォトグラフィー、イラスト やタイポグラフィーなど、様々なデザイン をギャラリー化しているWebサイトです。 Designspirationは総合的なデザイン ギャラリーサイトなので良いインスピレー ションも得られるかも知れません。 シンプルでとっても見やすいし、表示も重くないので良さそう。ギャラリーはいくつあっても困らないので助かります。 ミニマルデザインでとっても見やすいです。カテゴリはロゴ、写真、イラスト、ポスター、パッケージ、ファッション、ブランド、タイポグラフィなど様々。Webデザイン以外を揃えた感じです。 そう、Webデザインだけ無いんですよ。Webデザインのギャラリーは若干乱立状態な印象ですし、あえて外した感じもします。 こちらはパッケージのカテゴリです。それぞれのカテゴリにはそれなりの数が揃っていますので見ごたえもありそう。

    写真、イラスト、ロゴやパッケージなど様々な「デザイン」のギャラリーサイト・Designspiration
  • 検索するエンジンやサイトを自由に決定、追加可能なChromeエクステンション・Search Center

    以前にも似たようなChromeエクステンション をご紹介しましたが、より使いやすい拡張 がありましたのでシェア。検索したいサイト や使いたい検索エンジンを自分好みに決め られ、追加できるエクステンションです。 基的に検索可能なサイトならなんでも追加 出来ます。 以前ご紹介したUniversal Searchと機能はまったく同じですが、使い勝手は今日ご紹介するSearch Centerのほうが上でした。というわけで乗り換え。 Universal Searchよりもワンステップ少ないプロセスで検索出来る、という感じ。サジェスチョンも出てくれます。 ショートカットでらくらく検索 Ctrl+Qのショートカットキーも使えます。キーワードをドラッグしてショートカットキーを使えば上画像のように検索ボックスがドロップダウンします。 グループ化も出来る 検索対象のサイトをグループ化出来るので多くなってもゴ

    検索するエンジンやサイトを自由に決定、追加可能なChromeエクステンション・Search Center
  • 全画面をスライドとして使うダイナミックなナビゲーションを構築する2KB以下の軽量jQueryプラグイン

    全画面をスライドギャラリー風にするダイナミック なナビゲーションをjQueryを使って実装するサン プルです。透過処理が必要ですが、IE6、IE7の 両問題児でも問題なく動いてくれますので、実践 でもプロモーションなどに利用できるっぽいですね。 スライドするとロゴが平行してスライドする事で視差 効果も出しています。 クロスブラウザ対応なので使いどころも出て来るかもしれませんね。ダイナミックに動いてくれますのでプレゼンテーションやポートフォリオ、キャンペーンなどに使うのも面白そうです。 Awesome Scrolling Navigation 全画面がスライドします。背景に画像を指定しているのでテキストなんかも入れられるっぽいですね。試していませんけどこれは結構使えそうです。 動作確認していただくと分かるかと思いますが、左上のロゴ部分も微妙なスライドをして視差効果を出しています。 マークアッ

    全画面をスライドとして使うダイナミックなナビゲーションを構築する2KB以下の軽量jQueryプラグイン