Media Queryを使用したレスポンシブWebデザインの構築時にはResponsivepxっていうツールが超オススメです
たまたま見つけたツールが泣きそうなくらい 便利だったのでシェア。Media Queryを使用 したレスポンシブなWebデザインの構築時 にとっても役に立ってくれるツールです。URL を指定するだけで、あとは幅を調整しながら レイアウトの微調整が可能です。ページ推移 も不要なのが大きいですね。 今日ご紹介するResponsivepxは、インタラクティブに指定幅の表示を確認出来るWebサービスです。Media Queryを使用したレスポンシブなWebデザイン構築時に、微調整したいときはかなり効果を発揮しそう。 Kristaliaでテスト。URLを入力するとそのサイトが表示されますので、あとはマウスでバーを動かして好みのサイズに変更するだけ。 MediaQueryを使ったレスポンシブなWebデザインのサイトなら設定値に達した時点でMediaQueryが適応され、レイアウトが変化しますので、微調整
昨日書いた「画像を使わずに見出しを水平線で挟むCSS」をもうちょい工夫してみる
昨日書いた記事は実装のみでしたので、 もう少し工夫してみました。border自体 さほど出来ることは多くはありませんが それでもちょっと素敵な見出しが画像 を使わず作れるのは個人的には結構 嬉しいTipsだったりします。 今日のはクロスブラウザとはいかないものもありますが、画像とjsは一切使用していません。基本的な事は昨日の記事をご覧になってください。 ものすごく使用頻度が高いっていうものでもないですけど日曜日ですし、お遊び的に。 Sample 誰でも思いつくことしかしてませんけどｗまぁ自分用のスニペットです。このブログもですけど、僕はとにかく画像の利用数を減らしたいと考えています。見た目もシンプルなものを好みますし、それがユーザービリティやコンバージョンにも影響を与える事があるのでこういった手法を好むのは一部の人間でしょう。少なくとも多くのデザイナーさんやコーダーさん目線では需要は無いと
無料で手に入るモダンで美しいデザインの白黒カラー系WordPressテーマ17個
たまたま見かけた白黒カラーベースの WordPressのテーマが素敵だったの でご紹介ついでに、モダンで美しいデ ザインのテーマも合わせてご紹介しま す。すべて無料で利用可能です。全部 で17個あります。 コメントは控えます。ぜひデモをご覧下さい。 STUDIO DESSIGN STUDIO DESSIGN / DEMO MINIMAL DESSIGN THEME MINIMAL DESSIGN THEME / DEMO SWISS DESSIGN THEME SWISS DESSIGN THEME / DEMO STYLE DESSIGN THEME STYLE DESSIGN THEME / DEMO Ulap Ulap / DEMO WP-Wordfinder WP-Wordfinder / DEMO Seven Five Seven Five / DEMO Clear Clear
商用利用もOK！新しい、フリーの日本語ゴシックフォント・「フォントポにほんご」
先日御連絡頂きました。商用も OKの貴重な日本語のフリーフ ォントに新たに加わった「フォン トポにほんご」です。カタカナ、 ひらがなも漢字も使えますので ぜひ利用させて頂きましょう。 日本語フォントを作ることがどれだけ大変かを考えると、フリーでしかも商用OKで配布してくれる方を尊敬せずにはいられませんね・・・遠慮なく使わせていただきます！ 柔らかい印象のフォントでかわいいですねー。IPAフォントの漢字もOKですよ。これは即DLですね。 ゴシック系で使いやすい印象です。作成者さんからは 各種ウェブデザインやDTPにもお役に立てるのではないかと思います。 とのお言葉を頂いています。本当に感謝です。ライセンスが明記されたテキストファイルも同梱されていますので詳細はそちらをご確認下さい。 リンク先の下部、「フリーフォント ダウンロード.」でダウンロードできます。 Fontopo
シンプル、ミニマルなサイトを作りたい時に役立ちそうなアイコンやフォント、ギャラリーなどのまとめ
個人的にミニマリズムなサイトが 好みなので自分用の備忘録です。 情報が多いので若干まとめのまとめ という感じになっていますがご了承 下さい。シンプルなサイトを作る時に 役立ちそうなリソースやギャラリーを。 内容はシンプルなアイコン、インスピレーション向上に必須なギャラリー、相性の良さそうなフォントなどになります。 白黒のサイトを作りたいときに役立つもの、という記事と被りますがご了承下さい。 Iconic モノクロながら可愛らしい感じのアイコン103個セット。 Iconic picol 汎用性の高そうなアイコンセット。 picol Token 色々なところで紹介されてるアイコン。28万人中10万人はDLしてるみたいです。人気ですねー。 Token Brightmix icon set EPSファイルで配布されるアイコンセット。丸型にほぼ統一されてます。地球のアイコン凄いですね。。 Brigh
ミニマルやシンプルなデザインの参考になりそうな名刺いろいろ
ちょっと調べ物をしたついでにメモ。 シンプルなデザインの名刺や、ミニ マルなデザインの名刺の例です。 インスピレーション用として残したい ので記事にします。多数あるのです が、特に気になった名刺デザインを 40ほどご紹介します。 という訳で、シンプルデザイン、ミニマルデザインの名刺デザイン例。使用されているロゴがシンプルだから名刺もシンプルになってるだけのような気もしないでもないですが、それはとりあえず気にしないようにしました。順不同です。 Lappin Properties モノグラムなロゴを背景にも並べています。 Lappin Properties papirus 裏表で反転。 papirus Novia 24pt インパクトと色合いが素敵。 Novia 24pt GS Stirling 好みのデザイン。素材も良さそうですね。 GS Stirling T&T 厚さをやや多めに取って色付
AmazonアソシエイトのツールはAZlinkが一番シンプルで使いやすい
Amazonアソシエイトの支援ツール は色々とありますが、僕は結局 シンプルで手軽なものが好きなので Azlinkを使っています。とても便利な ブックマークレットがあるのが個人的に 凄く魅力です。 多機能なサービスでも重かったり、いちいちサイトに行かないと使えないのは結局僕は使わなくなってしまいます。FirefoxのグリモンとブックマークレットがあるAZlinkなら手軽に商品リンクを作成出来るので一番シンプルで使いやすかったです。 AZlinkはブックマークレットで画像付の商品リンクをサクッと作れるWebサービスです。Amazonの商品ページでブックマークレットを使えばリンクコードを発行してくれます。 ブックマークレットが手軽でいい Webサービスサイトに行く→色々入力→リンク作成、という流れが殆どですが、この「Webサービスサイトに行く」が凄く面倒。ブクマしてはいますが、そのブクマを探し
最近出たばかりの素敵なポートフォリオ向けフリーWordPressテーマ・WorkFolio
シンプルで見せ方も好きだったので メモ。ポートフォリオ向けのWPテーマ です。無料で手に入れる事が出来ます が、そうとは思えないクオリティですね。 テーマを切り替えてポートフォリオ のテーマを使うのもいいかも知れません。 ポートフォリオとはいわゆる「制作実績」的なもので、多くの場合、制作物のキャプチャ等を羅列するのが一般的です。このテーマもそういった目的にあったレイアウトになっています。 サムネイルを出すには、カスタムフィールドの名前に「articleimg」、値に画像のURLを入れるとのことです。IE6は無視してるそうですが、cssを頑張ればいけそう。 子ページは普通です。自分でカスタマイズしたいところですね。 シンプルで素敵ですなー。以下よりDL出来ますよ。 WorkFolio
カテゴリやページのリンクにアイコンを付けられるWordPressプラグイン・Category and page icons
WordPressを使ったサイトのサイドバー などに良く表示されているカテゴリーや ページへのリンクに簡単にアイコンを 付けられるプラグイン・Category and page iconsをご紹介します。 ネーミングそのままですね。正直cssで設定するのは面倒な作業だったのでこれは結構需要の高そうなプラグインかも。冒頭のようにカテゴリーやページへのリンクを表示させている方も多いと思いますが、そのリンクの頭にアイコンを加えることが出来ます。 リンクの頭にアイコンを付ける事で可視性が高まり、ユーザビリティを向上させることが可能です。導入も手軽ですが、テーマによっては多少cssに変更を加える必要があるかもしれません。 Category and page iconsインストールCategory and page iconsをダウンロードし解凍wp-content/plugins/内にフォルダごとコ
WordPressでWebサイトを構築するまでの手順リスト - かちびと.net
私的なメモです。WordPressで個人的にWebサイトを構築したり、受注した際の手順リストをメモ。自分用のチートシートです。いつも何かしら忘れている気がするのでいつもやる事をぱっと見で分かりようにリスト化しておきます。※個人的な主観が入っています。 Todoソフト等はあまり使わないので本当に私的なメモですが、これが誰かのお役に立てたら幸甚です。プラグインなども好みが有ると思いますのでご参考までに。。 [note]情報が古くなったので改正版としてアップデートしました。[/note] インストールDB作成WP最新版をダウンロードwp-config.phpをDBに合わせて変更接頭語も変える（wp_ → example_）FTPソフトでサーバーにインストールログインして管理者権限のユーザーを作成作成したユーザー名で再ログインadminユーザーを削除ダッシュボードの不要なコンテンツを非表示にパーマ
WordPressにSBMボタンを加えるプラグイン、SexyBookmarksの日本Ver.をリリースしました
WordPressに簡単に各種ソーシャル サービスのボタンを加える事が出来る SexyBookmarksをGPLライセンスの 元、日本用に変換、リリースします。 著作者はUndolog.comです。 各種ブックマーク、ソーシャルメディアサービスに記事エントリを投稿できるボタンを加える事が出来ます。オンマウスでボタンがセクシーに出てきます。 SexyBookmarksの特徴 セクシーの定義は置いといて、以下が対応ソーシャルサービスです。 設定画面にYahoo!とGoogle以外のソーシャルサービスへリンクを貼ってありますので 概要をご覧下さい。管理画面は以下のような感じです。 ※WP2.7、WP2.6で動作確認 ※UTF-8での配布となります。 ※日本のソーシャルサービスなのでmoファイルは作成しませんでした。 ファイル内を直接日本語に変えてあります。 インストールSexyBookmarks
WordPressプラグインContact Form 7のメールフォームのデザインカスタマイズ
WordPressのプラグインのContact Form 7というメールフォームプラグイン を利用しているのですが、デザイン カスタマイズのチュートリアル記事的な ものがなかなか見つからなかったので 変更ついでに覚書します。 まずはContact Form 7インストール方法から。ご存知の方はここは飛ばしてください。 Contact Form 7のインストールContact Form 7をダウンロードし、解凍wp-content/wp-plugins/以下にフォルダごとコピーしアップロード管理画面で有効化設定画面でフォーム作成[note]ダウンロードのページに使い方も記載されていますが、ミblogさんの記事が分かりやすいです。[/note] メールフォームのスタイリング僕の方法は多分正しくないと思いますが参考になれば幸いです。Contact Form 7のphpファイルの変更はしていません
クライアントに頼まれやすい機能を補えるWordPressプラグインいろいろ
中小企業、店舗系のWeb制作が 個人的に最も多いので、そういった クライアントさんに頼まれやすい機能 を加えるWPプラグインのメモです。 大規模なWebサイトではまた別の需 要が出てくると思います。 羅列した全てのプラグインを入れる訳ではなく、「よく頼まれる機能」を補うプラグインをあげています。順不同。 WP-Add-quicktag 今更便利さに気がついた、という感じですが、最近よく使っています。基本的にはマークアップを補うプラグインなんですが、定型文の挿入に凄く便利なのでお勧め。こちらで設定してあげればクライアントさんはワンクリックで挿入できます。複数登録も可能なので重宝しますね。 addquicktag Ktai Style 携帯サイト作って欲しい！予算無いけど！みたいな要望があったとき、というか中小規模サイトの案件では多いのでKtai Styleは必須プラグインです。予算無いなら断
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ブラウザ対応表とかでよく見かけるようなチェック表をサクッと生成するWebサービス・Compare Ninja - かちびと. net