ウェブ制作

スポンサーリンク
ウェブ制作

使い勝手の良い背景スライドショーのjQueryプラグイン「Vegas Background SlideShow」

ウェブページのバックグラウンドでスライドショーをさせるためのjQueryプラグインはいくつかありますが、その中でもなかなか使い勝手の良いのが「Vegas Background SlideShow」。 トランジションが24種類と多く用意され、...
ウェブ制作

CSS3を使った様々なアニメーションのスニペットを紹介するサイト「AniCollection」

CSS3を使ったアニメーションを一覧で確認できて、目玉アイコンのクリックでコードスニペットを見られるサイト、「AniCollection」。 また「+」アイコンをクリックすれば複数のアニメーションをまとめてCSSなどを生成できるのがすごく便...
ウェブ制作

ウェブ制作にいろいろ役立ちそうなスニペットを集めたサイト「CodeMyUI.com」

ウェブ制作でちょっとしたときに役立ちそうなスニペットを集めたサイト「CodeMyUI.com」。 CSSを使ったちょっとした装飾からイメージスライダー、イメージギャラリーと様々な用途で使えるコードを判りやすいサムネイルで一覧表示させてるので...
ウェブ制作

ユーザーエージェントによってスマートフォンとPCを振り分ける方法3つ

いまどきはPC版とモバイルデバイス版のサイトを分けずにレスポンシブデザインで作ってワンソースマルチユースなものを作るべきなんでしょうけど、もろもろの事情でワンソースにできない場合もあると思います。 ということでユーザーエージェントによってス...
ウェブ制作

バッジ画像のまとめ「100+ Best Free Badges Vector & PSD」

ウェブ制作に限らずちょっとしたアクセントをつけたいときに重宝するバッジ画像ですが、100以上の素材が集められていた記事があったので紹介。 100+ Best Free Badges Vector & PSD » CSS Author 僕の場...
ウェブ制作

各種テンプレートやCMSのテーマなどを集めたギャラリーサイト「Template Stash」

WordPressやBootstrap、各種テンプレートやテーマを集めたギャラリーサイト「Template Stash」。 「Hand-picked templates & themes.」なのだそうで、手動で集めたからクオリティが高いもの...
ウェブ制作

ランディングページを集めたギャラリーサイト「LAPA – Inspiration Landing Pages Gallery」

ランディングページを集めたギャラリーサイト「LAPA - Inspiration Landing Pages Gallery」。 見ているだけで勉強になるし、Tumblrを利用して公開しているのでフォローしとけば安心ですね。 ただこうやって...
ウェブ制作

【素材】ウェブサイトのトップページ向けの動画素材を集めたサイト「Coverr」【動画】

背景一杯に動画を表示させるウェブサイトって最近増えてきましたね。 ああいうのを作りたい場合、予算と時間があれば自前で撮影できますが、そうじゃなかったり、あるいはちょこっとサンプルで作ってみようという時に役立ちそうなサイトをご紹介。 Cove...
ウェブ制作

ナビゲーション・メニューを集めたギャラリーサイト「NavNav」

良い感じのナビゲーション・メニューを集めたギャラリーサイト、「NavNav」。 見ているだけで勉強になるし、Tumblrを利用して公開しているのでフォローしとけば安心だし、CodePenで動きとソースを確認出来るものが多いので便利だし、ナビ...
ウェブ制作

404ページのデザインギャラリー「404 not found」

世界中の良い感じの「404 Not Found」ページを集めたギャラリーサイト、「404 not found」。 ネタに特化しているもの、ユーモアとセンスでニヤリとさせるもの、いろいろあるので眺めているだけで楽しいし勉強になります。 Bes...
ウェブ制作

さまざまなデバイスのディスプレイ仕様を確認できる「Device Metrics」

モバイルやらPCやらはてはスマートウォッチやらいまどきのデバイスのディスプレイの多彩さにはもはやついて行けないんじゃないかと不安に思う昨今ですが、そんなデバイスたちの仕様を一覧表示し、それぞれの細かい仕様を確認出来るページをGoogleが用...
ウェブ制作

【Web Design】デバイスの種類別など細かく分類されて使い勝手の良いデザインギャラリーサイト「Crayon」

なかなか使い勝手が良かったので紹介。 「Marketing Design Search Engine | Crayon」はウェブサイトのデザインギャラリーサイトなんだけど、デバイスの種類別やCMSの種類別、ページの機能別などいろいろなカテゴ...
ウェブ制作

【Design】ポスターやフライヤーなどが中心のデザインギャラリー「Baubauhaus」

最近みつけたデザインのギャラリーサイトを紹介。 印刷物系のデザインやイラスト、ファッション、写真などが中心のデザインが集まってます。 たまに印刷関係の仕事を受けるとすぐに煮詰まってしまうので、これを見て刺激を受けて引き出しを増やしておこうか...
ウェブ制作

【Web Design】ブラウザウィンドウの縦幅100%毎にスクロールさせる方法

ブラウザウィンドウの縦幅100%で背景画像を固定してスライドさせながらスクロールさせるエフェクト、って説明しづらいけどアップルなんかがよく使ってる見せ方ですね。 ああいう見せ方を簡単にできないかなと思って探してみたら良い感じのを見つけました...
Mac

【Mac】MAMPのエラーでポート番号を変更できない場合の解決方法

先日MAMPをアップデートしバージョン3.0.7.3にしたんですけど、いつものように「設定 > ポート」から「WebとMySQLのポートを80と3306に設定」しようとしたらエラーが出て設定できなくなってしまいました。 ちなみにエラーは下の...
Mac

【Mac】YosemiteにアップグレードしたらMAMPが起動しなくなった場合の解決方法

先日仕事用のMacをYosemiteにアップグレードしたんですが、MAMPからApacheが起動しなくなってしまいました。 最初はMAMPのバージョンが低いままだったからかと思いMAMPのアップデートをしたけどそれでも起動せず。 いろいろグ...
Adobe CC

【Photoshop】Font AwesomeのアイコンをPhotoshopで使える機能拡張「Font Awesome PS」

Webフォントでアイコンを楽に使えるFont AwesomeのアイコンをPhotoshopで呼び出してベクターデータとして使えるようにする機能拡張です。 キーワード検索機能もついてるのでサクッと探してサクッと使えて非常に便利。 FontAw...
ウェブ制作

自分のためのメモ

フリーランスも知っておかないといけないデザイン料金の相場まとめを読んだ。 僕はフリーランスで10年以上やってるけど、実のところ自分で料金を決めたことってほとんどないような気がする。 相手と話をして、相手の予算を聞いて、その上でその金額で何が...
ウェブ制作

サイトがFacebookで表示された際にどのように見えるかをテストできる「OGP画像シミュレータ」

OGPで画像で指定されたサイトのサムネールがFacebookでどのように表示されるかをテストできるサイト。 せっかく作っても正方形で表示されたり横長で表示されたりするので思ったのと違う事って多いと思うんだけど、このサイトを使えばその辺あらか...
ウェブ制作

オープンソースの写真管理システム「Lychee」をロリポップにインストールしてみた

レスポンシブ・ウェブデザインに対応したPHP製の写真管理システム「Lychee」が便利そうなので使ってみました。 ちなみにインストールしたのはロリポップ!。 サーバーにインストールする前にMac上に構築しているローカル環境で試したらすんなり...
ウェブ制作

ローカル環境にインストールされているフォント一覧を表示するサービス

ローカル環境にインストールされているフォントの一覧を任意の文字で作ってくれるウェブサービス。 ちゃんと日本語のフォントにも対応しているのが嬉しい。 フォント数が多い環境だと下の方の「LOAD MORE」をクリックするとさらに読み込んで一覧を...
ウェブ制作

【CSS】2014年版、CSSでのフォント指定

ここ最近僕が使ってるCSSのフォント指定。 Mac OS X Mavericks(10.9)とWindows 8.1で游ゴシックと游明朝がプリインストールになったので、それの対応と、古いブラウザへの対応を含めるとこんな感じかな、と。 ゴシッ...
Adobe CC

Adobe CS2をWindows 7機にインストールしてみた

唐突にAdobe CS2の無料ダウンロードが始まってお祭り騒ぎですね。 ただし「弊社が不特定多数の皆様に対して無償でソフトウェアを提供することが目的ではございません。」ということであくまでAdobe CS2のライセンスを持っている人が対象で...
スポンサーリンク