タグ

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

  • 軽量で、シンプルなCSSフレームワーク・Atatonic

    結構前からあるみたいですけど、なかなか 良かったのでメモがてらご紹介。軽量で シンプルなCSSフレームワークです。有名 なフレームワークは使いやすく、高性能 な傾向ですが、結局無駄が出てしまうので 場合によってはこういうシンプルなもの が役に立ったります。 ちょっと触って良さそうだったので忘れないように、みたいな記事です。軽量なCSSフレームワークで、中身もシンプルだったので好みでした。最近はレスポンシブ対応ばかり目に行ってるので、こういうのも試しておきたいです。あんまり時間無いですけど・・ 一応HTML5にも対応してました。タイポグラフィに目を向けたCSSフレームワークで、罫線に沿ったテキストコンテンツを実装出来ます。 一応触ってみましたけど、結構悪くなかったです。個人的な感想ですけどw 柔軟性を考慮したCSSフレームワークは便利なんですけど、理解するのが面倒なので僕程度ならこれくらいで

    軽量で、シンプルなCSSフレームワーク・Atatonic
  • WordPressのテーマのカスタマイズに役立つコードスニペットを探せるWebサイトいろいろ

    少し増えてきたので自分用にまとめてみます。 WordPressでテーマをカスタマイズしたい時 にサクッと探せると楽なんですが、その コードスニペットを探せる、というサイトが いくつかあるのでご紹介します。WPユーザー の方は一度ご覧になってみては如何でしょう。 というわけでちょっと個人的なメモです。WPスニペットを保管してるサイトのまとめ。お手軽なWordPress Tipsっていうカテゴリで記事をよく書いてるんですけどそのネタ元なので英語OKな方はこちらから探してみては如何でしょうか。 この手のサイトのコードは古い可能性もよくあるのでCODEXで非推奨のコードでは無いかどうか合わせて確認しておくとより良いかもしれません。 WP-Snippets 数は多くないけど需要のあるTips多め。最近リニューアルしてちゃんとカテゴリ分けしてくれました。単純な単語をタイトルにしてくれているので英語が苦

    WordPressのテーマのカスタマイズに役立つコードスニペットを探せるWebサイトいろいろ
  • スマートフォンにも対応可能・ウィンドウサイズに応じてレイアウトを自動調整する軽量jQueryイメージスライダー・FLEXSLIDER

    スマートフォンやiPadなどのタブレットはもちろん、 様々なウィンドウサイズにも自動でレイアウトを 調整するレスポンシブなjQueryスライダーのご 紹介。FLEXSLIDERは4KBと軽量で、実装も 手軽なので覚えておくと重宝しそうです。マーク アップも簡単なのでiPhone向けサイトの構築 時に導入を検討したいですね。 以前もレスポンシブWebデザイン対応のスライダーをご紹介しました(Blueberryというスクリプトです)が、こちらは加えて軽量なスクリプトで表示も速いようです。 見た目はシンプルなスライダーですが、iPhoneiPadのようなウィンドウサイズの狭いデバイスにもレイアウトを自動で調整してくれます。スクリプトも4KBと、とても軽量なのでMediaQueriesとうまく併用したいところですね。 iPhoneでの表示。自動で幅を調整しています。 iPadの幅だとこんな感じ。

    スマートフォンにも対応可能・ウィンドウサイズに応じてレイアウトを自動調整する軽量jQueryイメージスライダー・FLEXSLIDER
  • jQuery Mobileを使う際に知っておくと役立ちそうなTipsや情報のまとめ

    jQuery Mobileに関して少し整理したいので まとめました。JQMを使うときに知っておくと 便利そうなTipsとか情報とか。いくつか自分 の記事も含まれているのが若干アレなんです が、ご了承ください。内容はコードのみ、では なく、参考サイトなど一貫性無い感じですが。 整理するのが下手なもので一貫性に欠ける内容で申し訳ないですけど、jQuery Mibileを使ったWebサイト構築時のちょっとしたTipsや役に立つ情報などのまとめです。 ページ移動にAjaxを使わないようにするプラグインの前に記述。リンク単位でならマークアップでrel=”external”を、フォームはdata-ajax=”false”を加える。 <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> <script type="text/

    jQuery Mobileを使う際に知っておくと役立ちそうなTipsや情報のまとめ
  • WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α - かちびと.net

    以前書いたWordPressWeb制作する際 の手順リストが少し古い情報込みだったり するので改正版を書きます。先日、WPも 3.2のリリースを迎えましたので、手順リスト もアップデートすることにしました。多少考え が変わっているので内容も少し変更有ります。 以前のリストの改正版です。加えて他の情報も一緒に載せておく事にしました。 【2011・07・11】 WordPressインストール サーバーを用意(PHP5.2.4 以上 / MySQL5.0 以上) DBを作成 WordPressをダウンロードし、解凍 wp-config-sampleをwp-configにリネームし、内容をDBに合わせて変更 プリフィクス(接頭語)を変更する(wp_→foodblog_) FTPソフト等でサーバーにアップロード サイト名やパスワード、IDを決める(adminは避ける) 作成したユーザー名でログイン

    WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α - かちびと.net
  • tumblrで画像収集するのに向いてそうな、無料のテーマ・51個まとめ(と、少しだけ特徴をメモ - かちびと.net

    tumblrで画像収集するのは割と当たり前 ですが、後で見返すときに見にくいテーマ だと見る気がしないのでいろいろ試して いましたが、せっかく試したのでついでに 画像収集に向いてそうなtumblrのフリー のテーマをご紹介します。 というか変えたい時に探してるんですけど、いちいち面倒なのでメモしたいんですが、せっかくなのでここにリンク集作ってシェアしようかなと思った次第です。 簡単ではありますが、特徴をメモ書きしています。Lightboxが付いてるとか、自動で次のページを読み込むとかリキッドレイアウトとか。 全てをちゃんと確認したわけではないので、参考程度に。順不同、全部で51個ありました。 キャプチャはテスト用で作ったものです 全部無料です 環境次第でカラム数が変わるものもあります 長くなってしまって見る気がしないので1カラムは省いています。 Themanati 3カラムのリキッドレイア

    tumblrで画像収集するのに向いてそうな、無料のテーマ・51個まとめ(と、少しだけ特徴をメモ - かちびと.net
  • iPhoneやAndroid等のタッチデバイス向けイメージギャラリー用JSライブラリ・PhotoSwipeなかなか良いですぞ

    PhotoSwipeはタッチデバイス専用のJSライブラリ。iOS(iPhone/iPad)は勿論、AndroidBlackBerryにも対応出来るそうです。また、jQuery依存型も非依存型が用意されているのも自由さがあっていいかなと。 [note] jQuery Mobileは昨日、サンプル配布したので宜しければ合わせてどうぞ。[/note] PhotoSwipeサンプル with jQuery Mobile 以下、iPhoneiPadでのキャプチャです。 iPhoneでのキャプチャです デフォルト サムネを幅に自動で合わせてくれます。 ランドスケープ ランドスケープ時でもサムネイルを自動で拡大し、幅を合わせてくれます。 画像の閲覧 単体表示はサムネイルをタップします。左右フリックで進んだり戻ったり。 ナビゲーションもある 単体、ランドスケープ。タップすると下部にナビゲーションバーが

    iPhoneやAndroid等のタッチデバイス向けイメージギャラリー用JSライブラリ・PhotoSwipeなかなか良いですぞ
  • インスピレーションを刺激させたい時に大抵見てまわるWebサイト集

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

    インスピレーションを刺激させたい時に大抵見てまわるWebサイト集
  • HTML5を使ってWordPressをiPadに最適化するプラグインOnswipeを試した→結果:なかなか(・∀・)イイ!!

    iPadでアクセスしたときに、WordPressiPad向けに最適化してくれるプラグイン Onswipeを試してみましたが、思いの外 良かったのでご紹介。ページ推移もフリ ックで出来る雑誌風レイアウトに自動で 変換してくれますよ。 OnswipeはHTML5を使って、WordPressを自動で雑誌風のレイアウトにしてくれるプラグインです。WordPress.comでも既に導入されており、プラグインとしても配布されています。 人気のFlipboardライクなインターフェースにしてくれると聞いて試してみましたが、なかなか良かったので備忘録がてらご紹介します。 使い方はすごく簡単で、基的には有効化してフォントや色を選ぶだけです。試しにWPデザインギャラリーでテスト。 Before 可変式のグリッドレイアウトなので何もしなくても一応はちゃんと表示されていました。 After ご覧のようにマガ

    HTML5を使ってWordPressをiPadに最適化するプラグインOnswipeを試した→結果:なかなか(・∀・)イイ!!
  • サムネイル付きで関連ポストを実装してくれるWordPressプラグイン・Wp-Thumbie

    なかなか便利なプラグインでしたので ご紹介します。サムネイル付きで関連 記事を実装してくれるプラグインです。 方法はいくらでもあるのですが、カスタ マイズ出来ない、という方も多いと思い ますので、プラグインで実装出来れば 楽ですよね。 おそらく、精度を重視するか、ビジュアルを重視するか運営者によってニーズは変わると思います。このプラグインは後者向けとなりそうです。精度を重視するのであれば、YARPPやWordPress Related Post for Japaneseが良さそうです。両者ともカスタマイズや他プラグインとの組み合わせでサムネイルを実装することも可能です。 こちらは導入すれば自動でサムネ付きの関連ポストを実装してくれる手軽なプラグインです。方法を調べたり、カスタマイズしたりする必要もありませんが、レイアウトの調整が必要なら、cssを加える事になります。 オプションもそれなりに

    サムネイル付きで関連ポストを実装してくれるWordPressプラグイン・Wp-Thumbie
  • クライアントに頼まれやすい機能を補えるWordPressプラグインいろいろ

    中小企業、店舗系のWeb制作が 個人的に最も多いので、そういった クライアントさんに頼まれやすい機能 を加えるWPプラグインのメモです。 大規模なWebサイトではまた別の需 要が出てくると思います。 羅列した全てのプラグインを入れる訳ではなく、「よく頼まれる機能」を補うプラグインをあげています。順不同。 WP-Add-quicktag 今更便利さに気がついた、という感じですが、最近よく使っています。基的にはマークアップを補うプラグインなんですが、定型文の挿入に凄く便利なのでお勧め。こちらで設定してあげればクライアントさんはワンクリックで挿入できます。複数登録も可能なので重宝しますね。 addquicktag Ktai Style 携帯サイト作って欲しい!予算無いけど!みたいな要望があったとき、というか中小規模サイトの案件では多いのでKtai Styleは必須プラグインです。予算無いなら断

    クライアントに頼まれやすい機能を補えるWordPressプラグインいろいろ
    core311
    core311 2010/08/31
    [][plugin]
  • jQueryプラグインを探す際にだいたい見て回る巡回サイトまとめ

    cssやプログラミングjQuery探し 個人的にjQuery関連のブクマ が分かりにくくなってきたので 整理も兼ねてシェア。プラグ インを探す時にだいたい巡回 しているサイトをまとめます。 個人的にjQuery関連のブクマ が分かりにくくなってきたので 整理も兼ねてシェア。プラグ インを探す時にだいたい巡回 しているサイトをまとめます。 かなり情報が多くなってきたjQuery。使いやすいし、知識の無い僕でも簡単に使えるので重宝してます。そんなjQueryですが、多すぎて探すのも大変ですね。以前ご紹介したサイトも兼ねて、ブックマークの整頓がてら、順回しているサイトをご紹介します。 codrops jQueryと言えば個人的にここを思い浮かべます。情報も新しく早い。英語OKならRSS購読推奨です。 codrops css-tricks こちらはWebデザイナー目線で情報を配信しています。有益j

    jQueryプラグインを探す際にだいたい見て回る巡回サイトまとめ
    core311
    core311 2010/06/18
  • Web制作時に色(カラー選定)で困った際に役立ちそうな13のツールやサービス

    Webサイトの制作時にいつも 時間がかかるのがカラー選定 で、少し困っているのでもう少し 時間を短縮したいと思い、使って いるツールも含めていろいろご紹介。 いろいろ有りすぎるので使いやすいと思ったサービスに厳選しています。順不同。使いやすさとか好みもあると思うので参考程度に。。。ネタ帳さんのwebサイト作成時にサイトカラーを決められない人の為のwebサービスいくつかという記事も凄く参考になりますよ。 原色大辞典 色のリファレンス国内サイト。国内にも同じようなサイトは沢山ありますが個人的にここが一番見やすくて使いやすいです。 原色大辞典 colr.org 写真からスキームを作成してくれます。手持ちの画像をアップロードしてスキーム作成も可能ですが、flickrからランダムで呼び出したり、ピッカー機能があったり、タグ付け出来たりと多機能ですが、UIがシンプルで使いやすい。動作も軽いので重宝しま

    Web制作時に色(カラー選定)で困った際に役立ちそうな13のツールやサービス
    core311
    core311 2009/12/07
  • 個人店等がWebサイトを使って収益を上げる為に行うブランディングTips

    地域の小さなお店や経営者がWebサイトを使って集客を行う際に する事、Tipsを挙げてみます。あくまで一例ですが、Webサイトの 露出から集客(コンバージョン)に至る為の施行をリストにしてみました。 今日の記事はターゲットが地域依存性の高い業種にしています。 普段から良く書くSEOの記事ではなく、個人が行うブランディングのヒントです。 内容はかなり泥臭い方法になっていますので、クール且つスマートに仕事したいモテモテな貴方は今すぐ立ち去るがいい。 SEO効果は付加価値として付いてくるでしょう。 1・サイトマップ送信xml形式のサイトマップをGoogleYahoo!に送信し、より確実にクロールをして貰います。これはWebマスターの基です。個人的にはxml-sitemaps.comが最も使いやすい印象です。sitemapの記述法に関してはGoogleのヘルプをご覧下さい。 いきなりブランディ

    個人店等がWebサイトを使って収益を上げる為に行うブランディングTips
    core311
    core311 2009/07/29
  • 1