CSSのメディアクエリでcalc()が使用できるの知ってた？

2024/06/12 9 users Calc CSS メディアクエリ 比較 多く

CSSのメディアクエリでcalc()が使用できるのを知ってましたか？ これは6/6,7に開催されたCSS Day 2024で共有されたときに、多くのビジターが驚いたとのことで、私も知りませんでした。 メディアクエリは比較...記事の続きを読む 続きを読む

CSSのスクロール駆動アニメーションを1回だけ実行し、終了フレームに留まらせる実装方法 -runOnce

2023/10/17 65 users スクロール アニメーション 上下 要素 CSS

スクロール駆動アニメーションは、ビジターがスクロールするとそれに連動して要素がアニメーションします。スクロールに連動するということは、上下に繰り返しスクロールするとアニメーションも繰り返し実行されてしまいます。 スクロール駆動アニメーションを1回だけ実行し、アニメーションの終了フレームに留まらせる... 続きを読む

効果的な言葉を使えるようになりたい！ 広告コピーから学ぶ言葉の伝え方、言語化のロジックがよく分かるライティングの教科書 -伝わる短文のつくり方

2022/10/14 21 users 付箋 短文 プレゼン 見出し ロジック

Webサイトやスマホアプリ、メール、メッセージなどに使用する短い文章は、一瞬で伝えられることが重要です。ビジターに効果的に伝わるコピー、仕事で付箋に書く連絡、プレゼンに使用する見出し、商品のコピーなど、短文コピーのライティングについて「言語化のロジック」が身につく教科書を紹介します。 コピーライター... 続きを読む

これでもう、グラデーションにできてしまう濃淡の縞に困らない！バンディングをおさえるJavaScriptライブラリ | コリス

2019/09/17 61 users ハンティング コリス 濃淡 グラデーション モニター

制作時の最適なモニターや最適な照明環境で美しいグラデーションを作成しても、ビジターの環境ではバンディングと呼ばれる濃淡の縞ができてしまうかもしれません。 Webページの背景などに使用するグラデーションにできてしまうバンディングをおさえ、滑らかに表示するためのJavaScriptライブラリを紹介します。 js-noisy... 続きを読む

これを見逃したら絶対損！ノンデザイナーズ・デザインブック 20周年特別PDFは内容豪華で、応募者全員がもらえる | コリス

2018/05/07 541 users ノンデザイナーズ コリス 非売品 デザインブック 実施

まずは、ノンデザイナーズ・デザインブック 20周年、おめでとうございます！ 当ブログのビジターも多くの人が、お世話になっていると思います。 そんな20周年を記念して、日本人デザイナー陣が執筆した特別PDF「The Non-Designer's Design Book Missing Pages 2018（非売品）」のプレゼント企画が実施中です。 応募者全員がもらえる超太っ腹企画！ 続きを読む

デバイスやビジターを選ばずに、HTMLとCSSとJavaScriptを使った最適な実装方法が身につくオススメの本 | コリス

2017/11/02 39 users コリス インクルーシブ JavaS CSS 包括

インクルーシブとは直訳すると、包括、全てを含むこと。Webデザインにおいて、ビジター・デバイスなどあらゆるものを排除せずに全てを受け入れるようにすることです。 デスクトップやスマホなどデバイスを選ばずに、健常者やお年寄りなどビジターを選ばずにアクセスできるよう、HTMLとCSS、そしてJavaScriptを使った最適な実装方法が身につくオススメの一冊を紹介します。 HTML, CSS, JavaS... 続きを読む

Sassの教科書 改訂2版が刊行！大幅にパワーアップして、新機能や実務に役立つテクニックがいっぱい！ | コリス

2017/09/29 15 users Sass コリス 刊行 実務 インストール

Sassの教科書が大幅に内容を強化し、改訂2版として刊行されました！ 当ブログのビジターも多くの人が愛用したと思いますが、改定前のを持っている人も、もちろん持っていない人もSassをもっと使いこなしたい人にかなりオススメの一冊です。 Sassのインストールは初心者に分かるように優しく、よく使う基本的なテクニックは丁寧に、さらに高度なテクニックは詳しく、基本から実践までこの一冊で完璧に身につけること... 続きを読む

ヤバイ便利すぎる！Googleが提供するすべてのアプリ・サービスを1クリックで利用できるChromeの機能拡張 | コリス

2017/06/02 690 users コリス YouTube アドセンス アナリティクス ヤバイ

先日、ビジターの方から教わったのですが、これがまた便利すぎるので紹介します。 Googleの検索をはじめ、トレンド、アナリティクス、アドセンス、ドライブ、カレンダー、YouTube、ニュース、Googleフォント、翻訳な ...記事の続きを読む 続きを読む

ブログのタイトルや見出しを効果的にする！キャッチコピーを書くための基礎テクニック | コリス

2017/03/10 42 users ソーシャルサービス コリス コピーライティング 文言 見出し

ブログやサイトのタイトル・見出しの文言は、非常に大切です。 ビジターはそこにある言葉を見て、興味を引かれれば、コンテンツを読んでみようという気になります。また、ソーシャルサービスでも記事のタイトルだけ掲載されることが多く、その言葉が強い印象を与えるほど、興味を引かれます。 ユーザーの興味を引くキャッチコピーを書くための基礎テクニックを紹介します。 コピーライティングの上達方法 キャッチコピーを書く... 続きを読む

最近のWebデザインで採用されているレイアウトやコンポーネントが豊富に揃ったPhotoshopとSketchの素材 -Baikal | コリス

2015/09/07 36 users Baïkal コリス Sketch コンポーネント レイアウト

縦長ページ、マガジンスタイル、カード型レイアウト、ランディング、コマース、ブログ、ポートフォリオなど、最近のWebデザインで見かけるレイアウト、ヘッダやフッタ、エレメントのバリエーションが豊富に揃ったコンポーネントベースのUI素材を紹介します。 しかも、商用利用できる全揃いセットをコリスのビジターにプレゼント！ 勉強にもよし、そのまま使ってもよしの素材です。 Baikal – Component ... 続きを読む

これからのWeb制作に役立つ、69個の有益で大切なポイントのまとめ -69 Website Design Tips | コリス

2015/08/26 139 users コリス ユーザエクスペリエンス 明度 Web制作 ターゲット

Web制作のデザイン、ユーザエクスペリエンス、コンテンツ、制作・開発、そしてこれから必要もの、避けておきたいものをまとめた「69 Website Design Tips」を紹介します。 ターゲットとなるビジターを調査するのが重要 カラーは2, 3色をベースに、多色が必要なら明度に変化をつける ロゴは、デザインされた高品質なものを使う コンテンツが魅力的でも読めないテキストでは意味が無い 要素が減っ... 続きを読む

使えるフォントのバリエーションを増やそう！人気の高いかわいいデザインフォント -Ian Mikraz | コリス

2015/07/06 30 users Bootstrap デザインフォント 有料フォント コリス

フォントのストックが増えると、デザインで表現できる幅が広がります。 かわいいデザインの有料フォントをコリスのビジターにプレゼントします！ 6 Premium Fonts Bundle 今回は当ブログのアフィリエイト還元のプレゼント企画で、提供はgreedeals様。 greedealsでは、WordPressやBootstrapのテーマをはじめ、アイコンやフォントなどの有料素材をセットや限定特価で... 続きを読む

10歳を迎えるNGINX、ユーザ数は過去4年で400%増 - TechCrunch

2014/10/17 37 users nginx TechCrunch 本誌 HTTPキャッシュ

オープンソースのWebサーバNGINX（＋ロードバランサ、HTTPキャッシュ、リバースプロキシサーバ）が今月で10歳になり、その商用バージョンNGINX Plusは同じ月に最初の誕生日を迎える。その記念として同社は最近の利用状況の数字を公表し、また本誌はCEO Gus Robertsonに取材することができた。 同社によると、最近の12か月でNGINXのユーザは54%（約1.5倍）増加し、ビジター... 続きを読む

酒で破滅する男の闇映画「荒野の千鳥足」公開初日は劇場でビール飲み放題！ : 映画ニュース - 映画.com

2014/09/14 29 users 千鳥足 グランド マーティン 陽炎 賭博

［映画.com ニュース］　日本未公開の異色映画「荒野の千鳥足」の公開を記念して、東京・新宿シネマカリテでは公開初日に劇場でビールが飲み放題となることが決定した。 マーティン・スコセッシ監督をして「すさまじいほどに不快な映画」と言わしめた衝撃作。陽炎が立ちのぼるオーストラリアの砂漠で賭博や酒におぼれる男たち。ただのビジターだった故ゲイリー・ボンドさん演じるジョン・グラントが、“つい魔が差して”酒と... 続きを読む

ヒートマップテストで判明した19点の超重要データ | SEO Japan

2014/08/25 354 users SEO Japan 導線 データ アイトラッキング マウス

先日、アイトラッキングに関する記事を配信した所、予想以上の人気がありました。アイトラッキング以上に簡単に実施できるのが、マウスの導線を追うヒートマップテスト。様々なASPサービスも提供されており、低価格で導入できますよね。今回の記事では、数多くの公開事例や調査を通してヒートマップテストで会得した19のデータを紹介します。 — SEO Japan ヒートマップは、ビジターの行動を分析する上で大いに役... 続きを読む

プレゼンや企画書で使える！インフォグラフィック用のベクター素材を配布します（コリス限定） | コリス

2014/01/28 163 users コリス クリエイティブチーム プレゼン コリス限定 日頃

海外のクリエイティブチーム「freepik.com」とのコラボで、ビジターのみなさんに日頃の感謝を込めて、コリス限定の素材を配布します。 freepik.comは、海外のウェブ制作系ブログSmashing MagazineやSix RevisionsやWeb Designer Depotでもお馴染みで、そのブログだけのオリジナルの素材を配布するコラボをしています。日本ではコリスが初！今回はその第三... 続きを読む

[CSS]アイデアが面白い、ボタンに次々とメッセージを表示するスタイルシート -Story Button | コリス

2013/08/27 70 users コリス ボタンクリック CSS トリック a要素

ボタンをホバーすると、表示メッセージを次々に変更するスタイルシートのデモを紹介します。 Story Button こういうボーナス的なトリックって、面白いですよね。 気がついたビジターだけが楽しめたり、ボタンクリックへの背中を一押しするようなメッセージを入れるのもいいかもしれません。 実装は、簡単です。 HTML a要素で実装したボタンに、メッセージの数分のa要素を量産します。 デモでは、10のメ... 続きを読む

ウェブでも紙でも商用利用無料！コリス限定のホビー系アイコン素材150種類を配布します！ -Celebrations Icon Set | コリス

2013/07/31 284 users コリス クリエイティブチーム freepik コリス限定 日頃

海外のクリエイティブチーム「Freepik」とのコラボで、ビジターのみなさんに日頃の感謝を込めて、コリス限定のアイコン素材を配布します。 先日Twitter@colisscomでどんなアイコンが欲しいか希望を聞き、Freepikの中の人と相談し、アイコンを作成していただきました。 Freepik.comは、海外のウェブ制作系ブログSmashing MagazineやSix RevisionsやWe... 続きを読む

Photoshopで文字をよりシャープにクリアに見せるこつ -1px未満のこだわり | コリス

2013/07/29 411 users コリス Dribbble コツ Photoshop やり取り

dribbbleに投稿されたデザインで、コメントのやり取りがちょっと興味深いものなので紹介します。 簡単に意訳すると、 ビジター「デザインきれいだな、文字周りの処理に秘訣とかあるの？」 オーナー「文字をクリアにみせるために、Photoshopでこういう風にやってるよ。」 という感じです。 Site テクニックの紹介の前に、まずは文字周りを実寸大にしたものから。 Site -実寸大画像 カラーのコン... 続きを読む

効果的で収益性の高いキーワードを見つける3ステップ | SEO Japan

2012/07/17 28 users SEO Japan 収益性 高いキーワード 3ステップ SEO

やれソーシャルだ、コンテンツマーケティングだといってもSEOの基本はキーワードリサーチから、ということで、今回は効果はもちろん収益性まで加味したキーワードプランニングの方法を3ステップに分けて解説してくれた記事をQuickSproutから。 — SEO Japan 毎月、グーグルからビジターを100万人獲得したいだろうか、それとも1000人で十分だろうか？恐らく100万人を望む人の方が多いはずだ。... 続きを読む

WordPressで求人掲示板を運営するなら、WPJobBoardプラグインで決まり | ブログヘラルド

2012/06/07 15 users ブログヘラルド WordPress ＢＬ ライティング 各自

私は付加価値をもたらすサービスを全面的に支持している。個人的には、ウェブサイトのビジターが成功する上で必要なツールを与えていれば、彼らは再びサイトに戻って来てくれると確信している。そのため、テクノロジーレポート、フリーランスのライティング、もしくは関連するウェブサイトを運営し、読者が各自の分野における求人の最新情報を知りたがっているなら、強力な求人掲示板を提供してもらいたい。 1年以上前から、Bl... 続きを読む

パターンの背景をウェブデザインで効果的に使うための13のテクニック | コリス

2011/10/02 86 users パシ テクスチャ コリス 多用 ウェブデザイン

下記は各ポイントを意訳したものです。 はじめに ビジターを知る コンテンツは明確に コンテンツの強調に暗い背景を 限られたエリアのみにパターン パターンを全体に サイトのテーマに則したパターン シンプルなデザインには軽いパターンで パターンの多用に注意 パターンで視線を誘導する パターンをテクスチャと組み合わせる 異なるパターンを組み合わせる デザインにはフレッシュさを 洗練されたデザインに はじ... 続きを読む

USJのハロウィーン・ホラー・ナイトが凄いｗｗｗｗｗｗ。 ＠速報

2011/09/05 5 users USJ ナイト ディズニーランド 凄いｗｗｗｗｗｗ ゾンビ

大阪のユニバーサル・スタジオが今年、恐ろしいイベントを開催する！ その名も、ハロウィーン・ホラー・ナイト！ 100体のゾンビがパーク内を占拠し、ビジターを驚かせるという内容だ。 ディズニーランドでは体験できない新しいイベントに注目したいところである。 今後、このような海外らしさを展開して他のテーマパークとの差別化を図ってほしい。 公式サイト：http://www.usj.co.jp/USH2011... 続きを読む

ウェブデザインをワンランクアップさせるデザインテクニック『奥行き』の使い方 | コリス

2011/06/21 404 users コリス ウェブデザイン 奥行き インターフェイス おわり

あなたのウェブデザインをワンランクアップさせる『奥行き』を使いこなすための5つのデザインテクニックを紹介します。 下記は各ポイントを意訳したものです。 はじめに リアリスティックなインターフェイス ラッピングとリボン 遠近法 オーバーラッピング シャドウ おわりに はじめに デザインに『奥行き』を与えると、ウェブサイトをユニークにし、ビジターに忘れがたい印象を与えることができます。それが抽象的な方... 続きを読む

やはりTwitterとFacebookはRSSを殺しつつある（TechCrunchのビジターに関してはそう言える）

2011/01/04 204 users Twitter Facebook TechCrunch 動態

今朝（米国時間1/3）載せた”TechCrunch 2010 In Review“（2010年TechCrunch総まとめ（WordPress調べ））には、昨年の本誌のWeb上の動態を示す重要データがいくつかある。全体的におもしろいデータだが、しかし一部の人たちが気づいたように、昨年の本誌の最大のリファラーだったFacebookの名前がどこにもない。しかも、RSSリーダーのGoogle Reade... 続きを読む