デスクトップ向けページの横幅をまとめた一覧表です。188の企業や組織について、業種ごとにまとめました。 レスポンシブWebデザインのページ(表中の赤字)は、「ブレイクポイントの最大値」と「コンテンツの横幅」のうち、大きい方を採りました。 2015-07-18
作成:2014/05/7 更新:2014/11/01 Web制作 > ギャラリーサイトやECサイトなどで、最近よく見かけるデザインやエフェクトなど、制作前に知っておくと助かる、「どっかで見たことあるけど何だっけ?」といった感じのjQueryプラグインや最近のトレンドなるものをまとめました。ページにちょっとした工夫を凝らしたいとき、動きのある仕掛けでキャンペーンサイトを作りたいときに。 エンジニア速報は Twitter の@commteで配信しています。 もくじ メニュー 1.フィーチャーリスト 2.スティッキーヘッダー 画像エフェクト 3.マウスオーバーで画像にキャプション 4.イメージビューア 5.ズームインエフェクト 6.ブラーエフェクト スクロール 7.Infinite Scroll(無限スクロール) 8.画像シーケンス 9.横スクロール 10.フリック機能 レイアウト 11.画面全
僕の日本人クリエイター専用シェアハウス『Frog House』の住人の一人が、BCITという名門IT系専門学校へ通っているんですが(彼のような日本人クリエイター留学生の話は来月のセミナーでしたいと思ってます)、そこの課題にどうやら自由な発想でワイヤーフレームを作ってこいみたいな課題が出たらしく、先日『ワイヤーフレーム作る時に使ってる物や参考になるサイトは無いか』と聞かれたので、こりゃ住人に良いカッコするチャンスと思ったから書く、という不純な気持ちで書いています(笑) でも、思っても見たら今までワイヤーフレーム系のネタで書いた事も無いし、良い機会なので、僕が知ってるワイヤーフレームを描く時に便利そうなツールやサイトを、この機会に全部まとめておこうかなと思います。 制作ツールは勿論のこと、素材サイトや確認ツール、なんか色々独断と偏見からワイヤーフレーム描く時便利そうって思える物ばかり紹介する(
星の数ほどあるたくさんのjQueryのプラグインから、目的にあったものを探すのはなかなか大変ですよね。そんな時に役立つ便利なサイトをまとめました。 まずは手前ミソで自分がまとめたものから。 これは本当に多大な労力と実際の動作確認もしているので自信をもってオススメできます。 jQueryのプラグイン100選 -2013年総集編 日々チェックしているスクリプトから厳選して一年単位でjQueryのプラグインをカテゴリごとに選出しています。プラグインの半分近くは個別に記事も書いてあります。 jQueryのプラグイン100選 -2012年総集編 jQueryのプラグイン100選 -2011年総集編 jQueryのプラグイン100選 -2010年総集編 jQueryのプラグイン100選 -2009年総集編 jQueryのプラグイン100選 -2008年総集編
こんにちは、ライターの内藤です! 前回の記事(美しいWebデザインをタイプ別に!見ないと損する目的別厳選Web見本サイトのまとめ)ではWebデザインのタイプ別にわけた見本サイトのまとめを行いました。 今回はその続編として、スマホ・タブレット最適化サイトのデザインまとめをご紹介致します。 目次 ※もちろん順番に読む必要はありません。 スマホ専門デザイン見本 部品別に見られるサイト その他スマホサイトの部品作りの参考になるサイト スマホサイト素材になるキット フリック用JavaScriptプラグイン スマホ対応の無料WordPressのテーマ スマホサイト制作参考 スマホ専門デザイン見本 iPhoneサイトデザイン集のiPhoneデザインアーカイブ http://iphonedesignarchive.jp/ 登録数が半端ないです。 カテゴライズは業種別のみですが、年月アーカイブがあるので、い
いくつか知っておいた方が、必要な時に 探しやすいと思ってメモします。Webサイト のデザインをヘッダーやフッターなど、 パーツ別に収集しているギャラリーサイトが いくつかあるのでまとめます。 そんな大量に有るわけではないですけど。パーツのデザインはいつも迷うのでこの手のギャラリーはいくつあっても結構重宝しますよね。 ブブンデザインアーカイブ 国内でおそらく唯一のパーツ別デザインギャラリーです。ナビゲーションやフッターなどで探せて、収集しているサイトも国内メインなので参考になるのでは。 ブブンデザインアーカイブ MephoBox ヘッダーやフッター、ナビゲーションやフォームデザインだけでなく、404やカレンダーなど全てのコンテンツをカテゴリにしてパーツデザインを収集しています。おすすめ。 MephoBox Pattern Tap こちらもナビゲーションやボタン、フォームデザインなどに分けてデ
LEADING BRANDS TO DIGITAL WE ARE A DATA-DRIVEN MARKETING AGENCY FICCはデータに基づく論理的なマーケティングを提供するデジタルエージェンシーです。 消費者に価値あるコンテンツと体験を届けるため、戦略立案から施策実行まで一貫して提供しています。
PhotoshopのPSDファイルをそのままFireworksで開くとビットマップ形式となってしまい、レイヤー情報やベクターデータは破棄されてしまいます。 そこでレイヤー情報やベクターデータを保持したままPSDファイルをFireworksで開くには、Illustratorを使用します。 PSDファイルを一旦Illustratorで開きます。 開いたときに出てくる「Photoshop読み込みオプション」の画面で、「レイヤーをオブジェクトに変換」を選択します。 このファイルをaiファイルとして保存します。 保存したaiファイルをFireworksで開きます。 開いたときに出てくる「ベクトルファイルオプション」の画面で、「レイヤーを保持する」を選択します。 これでPSDファイルをFireworksで開くことができます。 IllustratorのaiファイルをFireworksで開く方法 Phot
先日仕事用のMacBookPro15インチを購入しましたが、自宅で使う際は画面が小さすぎるので27インチのiMacを外部ディスプレイとして使うことにしました。 iMacがケーブル1本でMacBookProやMac miniの外部ディスプレイになります。 Macに搭載されているターゲットディスプレイモードにより、iMacをケーブル1本で他のMacの外部ディスプレイにすることができます。新しい27インチの外部ディスプレイを買うのは勿体ないので、iMacのこの機能を使って外部ディスプレイとして使うことにしました。 対応しているiMacがこちら。DisplayPortかThunderboltが搭載されている以下のiMacならターゲットディスプレイモードを使用することができます。 iMac (21.5-inch, Late 2011), iMac (21.5-inch, Late 2012), iM
離婚回避マニュアルを購入しようとしているなら、こちらのリンクをよく確認したほうがいいです。 このWEBサイトで、女性が書いた男性のための離婚回避マニュアル~妻と絶対に離婚したくないあなたへ~の購入によって一体何ができるのかを、よく理解してから購入されることをおすすめします。 また、レビューや口コミが掲載されていれば、それもよく確認しましょう。 次の女性が書いた男性のための離婚回避マニュアル~妻と絶対に離婚したくないあなたへ~に関した情報も購入の参考になるかもしれません。 販売商品名称:女性が書いた男性のための離婚回避マニュアル~妻と絶対に離婚したくないあなたへ~ 教材説明:画期的な究極の離婚回避マニュアルをご紹介します。絶対に離婚したくない夫に徹底的な女性目線でお伝えする、離婚回避バイブルです。市販のマニュアルの多くは、男性が男性目線で書いたものであり、「妻の感情」をまったく無視しています
しかしこのTime Machine、バックアップ中はMacが結構重くなってしまうのです。4コアのCPUを搭載しているiMacに外付けハードディスクを直付けしているような環境ならそんなに気にならないのですが、MacBook Airから無線LAN経由でTime Capsuleへバックアップしている場合などは、かなり重くなります。重すぎて作業が快適にできません。 そこでオススメしたいのが、今回紹介するTimeMachineEditorです。 ダウンロード こちらのページからダウンロードすることができます。 設定 TimeMachineEditorを起動すると、設定ウィンドウが表示されます。設定のタイプは「インターバル」と「カレンダー」の2種類。 インターバル 「インターバル」では、バックアップの間隔を指定することができます。Macの標準だと1時間おきになってますので、そんなに頻繁にバックアップし
PDFにちょっとした修正を入れたり、EPSファイルにして印刷に使いたいときなど、体裁そのままにアウトライン化したいことがある。 フォントが埋め込まれたPDFをアウトライン化するにはAcrobat Professionalを使う方法があるが、透明のオブジェクトを作って云々と少し手間がかかる。そこでIllustratorを使用した方が簡単にできるが、あまり紹介されていないようなのでその方法を書いておきます。バージョンはCS以降で可能。 【概要】 フォントが埋め込まれたPDFを単純にIllustratorで開く(ファイルメニュー > 開く…を使う)とレイアウトが崩れたり、埋め込まれたフォントが再現されなかったりしてしまうことが多い。 「開く」ではなく、PDFを「配置」することでレイアウトの崩れを防いでアウトライン化することができる。 【方法】 Illustratorで新規ドキュメントを作成。 フ
こんにちは。島津です。 今回は、テーブルの列の幅指定に関する話題です。 表組みを使う時、内容やデザインにしたがって 列の幅サイズを指定することはよくあると思いますが、 colspanによるセル結合と組み合わせて使った場合に 実はちょっとした落とし穴があります。 とりあえずサンプルをご覧下さい。 ▼スクリーンショット ※上がWindows Firefox3、下がWindows Internet Explorer7です。 (htmlコーディング) <table> <tr> <th class="col01">商品No.</th> <th class="col02">商品名</th> <th class="col03">価格</th> <th class="col04">概要</th> </tr> <tr> <td class="col01">01</td> <td class="col02">
1月に体壊して入院していたので、その間に結構アプリを買い漁っていて、Macアプリがこんなにも毎日感動を与えてくれるのか!と改めてMacアプリケーションの素晴らしさを実感してました。 普段仕事ではWindowsなのであまりマニアックなアプリは知りませんが、プライベート仕事するには十分な、主にWebディレクター、デザイナー向けのアプリを紹介したいと思います。 ブラウザ、FTP、メーラーなどは特に言及するまでもないと思うので省略します。またメジャーどころが多いので、マニアックさには期待しないで下さい。 まとめたのは以下の項目です。 費用・見積もり作成 アイデア発想 アイデアメモ・日記 情報収集 制作スケジュール管理 個人スケジュール管理 制限時間管理 タスク管理 デザインクリップ 画面キャプチャー撮り スクリーン採寸 ワイヤーフレーム作成 作業効率アップ クロスブラウザチェック ソース差分チェッ
html5Web フォントは「Web サイトにオリジナルのフォントを埋め込む」ための技術です。現行のブラウザーは全て Web フォントに対応している状況です。そんな状況であるため、絶対にコピペできない文章を作ったったwwww は Web フォントに依存したコンテンツでしたが、特別な配慮はせずに公開しました。しかし、公開後、Web フォントが適用されなかった複数の方から「コピペできるんだけどどういうこと?」「意味が分からない」というコメントがよせられました。そこで、Web サーバーのアクセスログを解析して「Web フォントに対応していない環境」がどの程度あったのかを調べてみました。4種類のフォーマット一口に Web フォントといっても、フォントのフォーマットは WOFF・TTF・EOT・SVG の 4 種類あります。今後は WOFF フォーマットが標準になっていくのですが、現在ではサポートし
おヒマな方へ Macを使うディレクターが抑えておきたい便利ツールまとめ こんにちは。企画部のこんどうです。 今日は、普段使っているツールの中でも、 これは便利だなあと思うものをあらためて紹介したいと思います。 Quicksilver 言わずと知れたユーティリティソフトウェア。 アプリの起動やフォルダを開くのを、キーボードだけで簡単シンプルにできる。 finderをひらいて検索してみたいな操作が省けて超速い。 Trigger機能も便利過ぎて泣けてきます。 http://www.blacktree.com/?quicksilver KeyRemap4MacBook テキスト入力時のカーソルの移動をとても速くできる。 これやるともう前の状態に戻れない。もう亀にはなりたくありません。 http://pqrs.org/macosx/keyremap4macbook/ The Hit
はてブたくさんついちゃいました(・∀・) お久しぶりの意匠子です。 先日のHTML5に関する記事がとんでもないブクマ数ついちゃいました。 今の世の中はHTML5旋風吹き荒れてますね! このような最新情報を集めるのもデザイナーの大事なお仕事! そこで今回は知らないと人生を損しているであろうデザイナー必見のサイトをまとめました! 続きをどうぞ! まずは鉄板サイトから!! Webクリエイターボックス チュートリアル系の記事が豊富。 まぁWebデザイナーはほぼ100%見てるいると思って間違いなし。 コリス Webデザイナーやマークアップエンジニアで、 このサイトを知らないのはモグリと思われてしまうくらい有名なサイト。 CSS3やJavaScriptの話題が豊富。ちなみに某りすこさんとは関係ありません。 ホームページを作る人のネタ帳 Webデザインを学ぶ人はみんな一度は見たことがあるぐらい有名なネタ
OSがWindowsであろうと、ubuntuであろうと、共通のサービスを受けることができるのがウェブアプリケーションです。 ウェブデザイナーの中には、自宅ですでにubuntuを利用している人も多い。また、Mac、Windowsと、各自それぞれの使いやすい物を利用していると思います。 今回はこうしたウェブ開発を仕事としている人が利用しそうなツールをまとめてみたいと思います。 スケジュール管理 Googleカレンダー もはや説明不要のスケジュール管理システム。 ドラッグによる複数日数のスケジュール投稿は、なにかと連日作業になるウェブ製作にぴったり。 また、タスク管理も結合されたため、細かい作業などの記入も可能。なにより複数人での予定の共有もできるのが便利です。 メール Gmail もう使っている人も多数いるかもしれませんが、Googleが提供するGmailはかなり強烈なアプリケーションです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く