CSSでスクロールが連鎖するのを回避する古い方法とoverscroll-behaviorを使った新しいテクニック

2021/11/11 144 users モーダル 終点 連鎖 CSS ナビゲーション

スクロールの連鎖（スクロールチェーン）とは、ページ上にスクロールするコンテンツがあり、そのコンテンツをスクロールして終点に到達するとメインのコンテンツもスクロールしてしまう現象です。 モーダルにスクロールがある場合、スマホのナビゲーションにスクロールがある場合、固定サイドバーにスクロールがある場合... 続きを読む

デザインの引き出しを増やしておこう！最近のWebサイトで見かけるデザインの新しいテクニックのまとめ | コリス

2017/07/06 100 users 半年 テクニック コリス 新しいデザイン 使い方

新しいデザインを見かけるとワクワクしますよね！ 2017年も半年が過ぎ、さまざまな新しいデザインを見かけるようになりました。最近のWebサイトで見かけるデザインのテクニックとその使い方を紹介します。 3 Essential Design Trends, July 2017 3 Essential Design Trends, June 2017 3 Essential Design Trends,... 続きを読む

今どきのウェブサイトをつくろう！差がつくHTML/CSSコードスニペット27個まとめ - PhotoshopVIP

2016/02/16 709 users ウェブデザイン PhotoshopVIP 今どき レイアウト

新しいテクニックを活用した、最先端のウェブデザインから学ぶ、今後のウェブ制作に活用したい素敵なHTML/CSSコードスニペットをまとめています。 コピー&ペーストで利用できるお手軽なCSSアニメーションやホバーリンクなどに加え、インパクトのあるレイアウトを実現できる本格的なアイテムやプラグインが揃います。スマートフォン端末ユーザーがさらに増えると予想される2016年、レスポンシブデザインやSVG形... 続きを読む

新しいスキルを効果的にモノにする6つのコツ ｜ ライフハッカー［日本版］

2015/07/05 130 users ライフハッカー コツ 新しいスキル pico 日本版

原文筆者のダスティン・コーツ氏は、フィードバックと自己評価を通して、キャリア目標の達成を支援するツール『Pico』の創設者です。今回は、コーツ氏が教える、新しいスキルを効果的に学ぶための6つのコツをお届けします。 プロフェッショナルな世界で目標を達成することは、いかに新しいスキル、新しいテクニック、新しい情報を学んでいくか、にかかっています。また、そうして身につけた知識は、人生全般においても活用で... 続きを読む

レスポンシブコーディングのスニペットいろいろ - やっぱりWebが好き - Writing Mode

2015/03/03 358 users コーディング レスポンシブコーディング スニペット 立場 自身

コーディングを自身でやることは少なくなってきたけれど、勘が廃れないように今でも時々デザインしたり、コーディングしたりってのも大事にしてます。たまにデザインやコーディングをするのは気分転換にもなるし、新しいテクニックを知っておくことだってまだまだ大切だと思うし。 今の僕は、作る仕事はできる限り任せる立場だと思うので、あくまでもやり過ぎない程度に、って考えてますけど。というわけで、最近覚えたスニペット... 続きを読む

新しいテクニックを学ぼう！最新PSデザインチュートリアル、作り方まとめ 2014年6月度 - Photoshop VIP

2014/07/01 186 users Photoshop Vip

毎月Photoshopの新しい使い方やデザインテクニックを活用した作り方、チュートリアルをまとめています。今回は2014年6月版まとめです。 海外デザインブログGraphic Design Junctionで、あたらしいテクニックを学ぶのにぴったりなPhotoshopデザインチュートリアル、作り方をまとめたエントリー「New Photoshop Tutorials to Learn Excitin... 続きを読む

[CSS]ウェブデザインの可能性を広げる10のスタイルシート | コリス

2012/07/25 635 users max-width Media コリス ウェブデザイン CSS

ウェブサイトを制作する際、特にCSSの新しいテクニックにはデザインの可能性を広げるのに役立つものがたくさんあります。 すべてのウェブ制作者が知っておくべき10のスタイルシートを紹介します。 @media screen and (max-width: 960px) { } 「@media」は単に印刷用ページのためだけではありません。最近のウェブサイトで多く見かけるレスポンシブデザインや可変レイアウト... 続きを読む

Photoshop VIP ☞ これぞマジック、Photoshopのすごいチュートリアル、使い方30個まとめ 2012年4月版

2012/05/07 548 users Photoshop Photoshopチュートリアル

Home　>　 まとめ　>　チュートリアルまとめ　>　これぞマジック、Photoshopのすごいチュートリアル、使い方30個まとめ 2012年4月版 不定期となりますが、新しく公開された、Photoshopチュートリアルをまとめてご紹介しています。 海外デザインブログdesignrfix.comで、最近公開された新しいテクニックを利用した、Photoshopチュートリアル50個をまとめたエントリー... 続きを読む

[CSS]画像置換「-9999px」のパフォーマンスを改善した新しいテクニック | コリス

2012/04/16 970 users コリス 見出し HTML 見出し要素 テクニック

テキストで実装した見出しなどを画像に置換するテクニックで「-9999px」が有名ですが、そのパフォーマンスを改善するテクニックを紹介します。 画像置換：-9999px 改善したテクニック 画像置換：-9999px -9999pxを使った画像置換のテクニックは、下記のようになります。 HTMLは見出し要素で実装します。 HTML <h3 id="sample06">見出しのテキスト</h3> 「te... 続きを読む

Photoshop VIP ☞ Illustratorのすご技を体感、デザインチュートリアル30個まとめ 2012年3月度

2012/03/06 625 users Illustrator Photoshop ＨＯＭＥ 体感

Home　>　 まとめ　>　その他まとめ　>　Illustratorのすご技を体感、デザインチュートリアル30個まとめ 2012年3月度 デザイン制作でもよく利用されているグラフィックツール、Adobe Illustrator。 Photoshopとの互換性もあり、組み合わせて利用することで、よりデザイン表現の幅を広げてくれるツールです。 海外デザインブログDesignBeepで、新しいテクニック... 続きを読む

Photoshop VIP ☞ 2012年に流行りそうなWebデザイントレンド厳選10個まとめ

2011/12/23 634 users Photoshop Vip Design Ledger

2011年もあとわずかとなりましたが、今年はWebデザインに関する新しいテクニックやアイデアなどがたくさん登場した年でもありました。 海外デザインブログWeb Design Ledgerで、2012年に流行しそうなWebデザインのトレンド10個をまとめたエントリー「Web Design Trends in 2012」が公開されていたので、今回はご紹介します。 既に利用され始めている手法、トレンドか... 続きを読む