国内の良デザインなWeb制作会社を専門に掲載しているWebデザインギャラリー・「魅せるWebデザイン」 - かちびと.net
珍しいなー、と思ったのでご紹介。日本の Web制作会社さんのコーポレートサイトを 専門に収集しているWebデザインギャラリー 「魅せるWebデザイン」です。まだ数が多い 訳ではありませんが、なかなか見ないタイ プなので良い刺激になるかもですね。 こういうデザインギャラリーは珍しいですね。地域別になっているので同じ地域なら交流相手を見つけたりも出来るかも。良い刺激になりそうなギャラリーサイトかもですね。 シンプルで見やすいです。どうしても東京が多くなっちゃいますけどまだサイト開設して間も無さそうなので自社サイトに自信がある方はコンタクトを取ってみては如何でしょう。 僕もギャラリーサイトを運営していますが、一人で探すのはなかなか難しいのです。 例 福岡のcoralqualia（コーラルクオリア）さん 広島県のアクシスさん 福岡、大分のCONDENSEさん などなど。まだまだ数は少ないですけど、
10KB以内、レスポンシブWebデザインである事が条件の軽量Webサービスのコンテスト・10K Apartの中で面白かったもの10個 - かちびと.net
面白そうなコンテストが開催されているよう だったのでメモがてらご紹介。10KB以下で、 しかもスマートフォンやiPadなど様々なデバ イスで閲覧してもレイアウトを崩さないレス ポンシブWebデザインであることが条件の Webアプリコンテスト・10K Apartからいくつ か面白かったものを選んでみました。 モバイルでも使える軽量Webサービスのコンテスト、みたいな感じですかね。なかなか面白いものが揃っていました。開発者さんは参考にされては如何でしょう。 条件は画像やcss、jsなど全て合わせて10KB（圧縮可）以内に収めること、様々なデバイスでもレイアウトを崩さないレスポンシブ設計であることなどがあげられています。コンテンツは結構APIありきになってます。当たり前かもですがｗ 現在120以上のも作品がエントリーされていますが、この中で個人的に気に入ったものを10個ほどご紹介します。順不同。
css3のtransitionプロパティでアニメーションサンプルをいろいろ作ってみた - かちびと.net
css3のアニメーションプロパティ、transitionがとても面白いので何となくアニメーションのサンプルを色々と作ってみました。まだ対応ブラウザは少ないですが、将来の為に予習してみたのでシェア。 css3のtransitionプロパティは変化を与えるプロパティです。アニメーションを実装できるプロパティはtransitionとanimetionがあり、後者のほうが「アニメーション」としての位置付けっぽいのですが、今回は何となくtransitionを使用しました。 プロパティ：-webkit-transition 対応ブラウザ：webkit系(GoogleChrome、Safari等) JavaScript：未使用 （※ソース閲覧の部分はjsを使っています） 一応アニメーション以外（角丸など）は-mozも入れています。 サンプルなので「-webkit-transition: *s ease-
jQuery MobileでGoogleMap APIを使ったサンプルがMITライセンスで公開されてた - かちびと.net
なかなかいいサンプルだったのでシェア。 jQuery MobileでGoogleMap APIを使った サンプルがオープンソースで公開されて いました。ストリートビューなども表示する ことが可能です。興味の有る方はチェック してみては。 スマフォにGoogleMapを表示させるのに、Google Maps JavaScript API V3が必要みたいですが、これをスマフォ対応を簡略化するjQueryプラグイン、jQuery Mobileで使おう、というもの。 jquery-ui-map GoogleMap APIをjQuery Mobileで使ったサンプルです。jquery-ui-mapというプラグインも使用しています。このサンプルはMITライセンスでソースが公開されていますよ。 以下、デモのキャプチャです。 iPhone iPhoneでの実装状態です。 ランドスケープ時も自動で横幅をあ
jQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみる - かちびと.net
人気のJavaScriptライブラリ、jQueryもかなり 情報が増えました。僕の様に知識が無くても 簡単に動きのあるWebサイトや、更なるユー ザビリティの向上を可能にしてくれましたが、 いつまでもコピペではいずれ困る事になります。 その前にそろそろ基礎から学んでみませんか。 という訳で、jQuery事始め。さほど知識が無い僕が書くのも微妙なんですが、一緒に学んでいきましょう、という事でご了承下さい。内容は基礎中の基礎です。 いつまでもコピペに頼っていては、何か問題が起こったときに対応できませんし、そもそもコピペするならjQueryである必要はありません。 でもjQueryはすごく便利なので、ちゃんと使いこなしたいところですよね。この記事が、誰かが勉強し始める切欠になれば幸いです。 jQueryを使うには まず、jQueryを利用するには本体を読み込む必要があります。方法は2つあって、本
WPで作られた国内のサイト専門ギャラリー・WPデザインギャラリーを作りました - かちびと.net
宣伝です。WordPressで作られた 国内のサイトを専門に集めたサイト を作りました。WPデザインギャラリー と言います。まんまですね。。折角 作ったのでシェアしたいと思います。 作った、という程の物ではないんですが、一応リリースです。WPで作られている国内サイト専門のギャラリー。よかったら使ってください。 一応コンセプトなんですが、WPでWeb制作をする時のインスピレーション向上用、という用途で作りました。海外にもWPサイトのギャラリーはあるのですが、日本と海外では受け入れられるデザインに差異を感じていましたので、国内専門にしました。 個別ページです。キャプチャは出来る限り全体を撮っています。メモ的に一言感想を書いていますが、気にしないで下さい。僕自身、読み返したら内容よく分からないです。 掲載されているサイトに関して 掲載されているサイトは「良いデザイン」に限りません。掲載基準を W
携帯サイトを作る時に役立ちそうな情報まとめ - かちびと.net
ちょっと必要に迫られたのでメモ。 どうもTwitterやってるとiPhoneや Androidなどのスマートフォンの 話題ばかりなので忘れそうですが、 携帯サイトはビジネスには必須 ですので備忘録として記事に。 以前にも何度かまとめ記事が話題に上がっているので今更感も否めませんが自分のブログにあったほうが探しやすいのでメモします。 予備知識 モバイルサイト構築前に知っておきたいユーザビリティ10のポイント ファーストビューの重要性、色の大事さ、リンク操作に関して記載されています。 モバイルサイト構築前に知っておきたいユーザビリティ10のポイント 携帯サイト（html）の制作に入る前に確認しておきたいチェック項目 サンプルを元に解説してくれているので分かりやすいです。 携帯サイト（html）の制作に入る前に確認しておきたいチェック項目 携帯サイトの作り方 5年前の情報なので参考程度に。今は随
シンプル、ミニマルなサイトを作りたい時に役立ちそうなアイコンやフォント、ギャラリーなどのまとめ - かちびと.net
個人的にミニマリズムなサイトが 好みなので自分用の備忘録です。 情報が多いので若干まとめのまとめ という感じになっていますがご了承 下さい。シンプルなサイトを作る時に 役立ちそうなリソースやギャラリーを。 内容はシンプルなアイコン、インスピレーション向上に必須なギャラリー、相性の良さそうなフォントなどになります。 白黒のサイトを作りたいときに役立つもの、という記事と被りますがご了承下さい。 Iconic モノクロながら可愛らしい感じのアイコン103個セット。 Iconic picol 汎用性の高そうなアイコンセット。 picol Token 色々なところで紹介されてるアイコン。28万人中10万人はDLしてるみたいです。人気ですねー。 Token Brightmix icon set EPSファイルで配布されるアイコンセット。丸型にほぼ統一されてます。地球のアイコン凄いですね。。 Brigh
WordPressでWebサイトを構築するまでの手順リスト - かちびと.net
私的なメモです。WordPressで個人的にWebサイトを構築したり、受注した際の手順リストをメモ。自分用のチートシートです。いつも何かしら忘れている気がするのでいつもやる事をぱっと見で分かりようにリスト化しておきます。※個人的な主観が入っています。 Todoソフト等はあまり使わないので本当に私的なメモですが、これが誰かのお役に立てたら幸甚です。プラグインなども好みが有ると思いますのでご参考までに。。 [note]情報が古くなったので改正版としてアップデートしました。[/note] インストール DB作成 WP最新版をダウンロード wp-config.phpをDBに合わせて変更 接頭語も変える（wp_ → example_） FTPソフトでサーバーにインストール ログインして管理者権限のユーザーを作成 作成したユーザー名で再ログイン adminユーザーを削除 ダッシュボードの不要なコンテン
国内の商用利用可能なWeb制作に使えるフリー素材配布サイトまとめ - かちびと.net
日本のWebデザインってあまりトレンド というのは無いような気がします。なんと言うか 見易さとか実用性メインでデザインは結構 シンプルだったりしますし、日本人に合ってる のかもしれないですね。そんな訳で日本人の 感性で作られた商用利用もOKの国内の Web素材配布サイトをまとめてメモしておきます。 僕自身がいいと思ったサイトを厳選してご紹介します。順不同。 サイトごとに利用規約が若干違うので重要な部分はメモしますが、ご利用の際は必ずご自身の目で利用規約ページをご確認下さい。問題が起きても当方は責任負いかねます。利用規約ページがある場合はそのページにもリンクを貼っておきます。 デザイン素材.com アイコンがメインでファイルはPNG。ネットショップ素材が中心で使いやすいデザインが沢山あります。 加工、商用OK、印刷物、ソフトウェアでも可能、Webデザイナーも利用可能。再配布、２次配布は不可。
モバイルサイトのWebデザイン15選
携帯、モバイルサイトの デザインってどうなってるのか 少し興味が沸いたのでモバイル サイトのキャプチャを取って アーカイブとしてまとめている モバイルデザインアーカイブさん から15のモバイルサイトで好きな デザインを15個厳選しました。 個人的なギャラリーとなっていますが、共感して頂ければ幸いです。キャンペーンサイトのデザインなどもあるので現在は確認出来ない事もあります。 FAT ONLINE SHOPPING 余計な情報を入れず、一番伝えたい事は画像にしてTOP絵にしています。 FAT ONLINE SHOPPING AEON Lake Town シンプルですが、画面の小さいモバイルサイトで情報を絞り込むのはかなりいいのでは。Ｆｌａｓｈで操作も軽快でした。 AEON Lake Town MOS BURGER モスバーガーのモバイルサイト、凄くいいですね。メニューも見やすいし、色使いもか
あの企業のロゴの秘密いろいろ
僕がお世話になっている マーケッターの2upさんから 情報頂きました。面白かったので 記事にします。有名なブログの Six Revisionsで様々なロゴが どのように今のロゴに決まったか を説明していました。 10のロゴの生い立ちが紹介されています。 Big 10 Big10とはアメリカの大学の運動事業だそうで、元々は10校だったのが、ペンシルバニア州立大が1990年に加わって11校になったので以下のように文字内に「11」を隠し文字で入れたそうです。 Goodwill Goodwillは恵まれない方を助ける非営利団体で、笑顔のマークが特徴のようですが、Goodwillの「G」の部分を以下のようにうまく笑顔に見えるように使っています。色を変えて笑顔に見える部分が強調されています。 Sun Microsystems 有名なSUNのロゴ。左側のシンボルが以下のように「SUN」に見えるように工夫
cssのテクニックなどを学びたい時に見ておきたい12サイト - かちびと.net
cssが苦手で嫌いなので 好きになろうと思い、勉強に なりそうなサイトを国内外で 選んで絞ってみました。 同じ思いをしている方とシェア したいと思ったので記事にします。 リファレンスサイトは今回は割愛しました。勉強するなら抑えて当たり前ですしね。国内外合わせて11サイトとおまけが1サイトあります。まずは国内サイトから。 CSS HappyLife 個人的に国内でcssといえばCSS HappyLifeさん思い出します。基本から応用まで幅広く情報を配信。 CSS HappyLife CSS-EBLOG ほぼcss中心に情報を配信してくれています。こちらもかなり勉強になるサイト。サイト自体も見やすいですし、cssで困った時には必ず訪れたいサイトです。 CSS-EBLOG CSS Lecture cssで出来るテクニックを公開してくれています。デモページを用意してくれるのが凄く嬉しい。親切で分か
フリーの細字フォントいろいろ - かちびと.net
少し前に細字のフォントが 必要だったので色々と探して ましたが、その時に見つけた 素敵なフリーの細字フォントを 備忘録的にまとめてエントリーします。 全てフリーですが、ライセンスは 異なりますのでご確認下さい。 細字フォントはいろいろと使い勝手が良いので重宝しますね。全部で17あります。 Caviar Dreams Caviar Dreams Boulder Boulder Champagne & Limousines Champagne & Limousines LT Oksana LT Oksana 和田研細丸ゴシック 和田研細丸ゴシック Two Turtle Doves Font Two Turtle Doves Font Vloderstone Vloderstone Lelim Pro Lelim Pro Nioubes Nioubes Scriptina Scriptina T
個人店等がWebサイトを使って収益を上げる為に行うブランディングTips - かちびと.net
地域の小さなお店や経営者がWebサイトを使って集客を行う際に する事、Tipsを挙げてみます。あくまで一例ですが、Webサイトの 露出から集客（コンバージョン）に至る為の施行をリストにしてみました。 今日の記事はターゲットが地域依存性の高い業種にしています。 普段から良く書くSEOの記事ではなく、個人が行うブランディングのヒントです。 内容はかなり泥臭い方法になっていますので、クール且つスマートに仕事したいモテモテな貴方は今すぐ立ち去るがいい。 SEO効果は付加価値として付いてくるでしょう。 1・サイトマップ送信 xml形式のサイトマップをGoogleとYahoo!に送信し、より確実にクロールをして貰います。これはWebマスターの基本です。個人的にはxml-sitemaps.comが最も使いやすい印象です。sitemapの記述法に関してはGoogleのヘルプをご覧下さい。 いきなりブランデ
Twitter関連ツール・まとめ - かちびと.net
Twitter関連の便利なツールがかなり 紹介されて来ていて、そろそろ混乱 してきたのでまとめます。 リンク先は日本語で解説してくれて いる記事にしています。されていない ツールやサイトは載せていません。 今現在は165個のツールがありましたが、今後追加していく可能性もあります。 TwitterWikiに載ってるサービスは極力載せていないつもりですが、若干被ってるかも。 全てのサービスを試したわけではありません。ＭａｃとiPhoneは持って無いですし。。。 また、リンク先を日本の記事にしたのは、海外のサービスに直接貼っても 使い方が分からなければ意味が無いと思った為です。 なので、リンク先がかなり偏っていますが重ねてご了承下さい。 ※コメント頂いたので１５個追加して180個更に20個追加して200個に育った。 ※8月アップデート＞17個増えて217個 ※9月アップデート＞30個増えて247
フリーのグランジ風フォントいろいろ
WebDesignBoothでグランジのフォント が沢山紹介されていました。グランジは 個人的にかなりツボなので幾つか貰った！ 60以上のグランジフォントが紹介されて いた中、僕のオススメをいくつかご紹介。 [ank]* [ank]* 28 Days Later 28 Days Later A Bite A Bite Acid Label Acid Label Ambulance Shotgun Ambulance Shotgun Antholog Antholog Ascent 2 Stardom Ascent 2 Stardom Bleeding Cowboys Bleeding Cowboys Chicago House_trial Font by The Original 19 Chicago House_trial Font by The Original 19 EpoXY hi
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSS3のtext-shadowを使ったテキスト装飾のサンプル集 - かちびと.net
「Photoshopでこの人を正面に向かせてください。」と言ってしまう気持ちが分かるくらい凄い加工技術 - かちびと.net