短いCSSを書くだけで要素を特定の位置に固定できるCSSの「position: sticky」。ちょっとした工夫で実現できるおもしろい使い方をデモで解説します。 スクロールに応じてページ要素を固定表示できるposition: stickyが便利で面白い使い方ができそうなので実験してみました。仕様がまだ草案（Working Draft）の段階で、将来、細かい部分に変更がないとは言い切れませんが、Ed…
渡辺 竜
「明日のウェブ制作に役立つアイディア」をテーマに「Rriver」というブログを運営。アメリカの大学を卒業後、1998年に東海岸のボストン近郊でウェブ制作を開始。2001年に帰国後、東京のウェブ制作会社に勤務。その後、事業者側に移り現在は組織のウェブ担当者として日英バイリンガルウェブサイトの運営に携わる。
CSS Gridで使えるrepeat()関数の「auto-fill」「auto-fit」の違いを理解すると、柔軟なレスポンシブ Webデザインが実現できます。わかりにくい両者の違いをデモで確認しましょう。 CSS Gridって本当に便利だなぁと思う今日この頃ですが、そのなかでも特に注目しているのがrepeat()とminmax()です。この2つのCSS関数を使うとグリッドレイアウトの構築が楽になる…
渡辺 竜
「明日のウェブ制作に役立つアイディア」をテーマに「Rriver」というブログを運営。アメリカの大学を卒業後、1998年に東海岸のボストン近郊でウェブ制作を開始。2001年に帰国後、東京のウェブ制作会社に勤務。その後、事業者側に移り現在は組織のウェブ担当者として日英バイリンガルウェブサイトの運営に携わる。
スクロールに気の利いた動きを加えたいときに便利なJavaScriptのライブラリー「ScrollReveal」を紹介します。 シンプルなスクロールアニメーションを実装したいときに使えそうなライブラリを見つけたのでご紹介します。「ScrollReveal」というやつです。 無意味にたくさん動くアニメーションはUIやユーザの情報消費の邪魔をするので好きではないですが、単調なページをより魅力的に見せるた…
渡辺 竜
「明日のウェブ制作に役立つアイディア」をテーマに「Rriver」というブログを運営。アメリカの大学を卒業後、1998年に東海岸のボストン近郊でウェブ制作を開始。2001年に帰国後、東京のウェブ制作会社に勤務。その後、事業者側に移り現在は組織のウェブ担当者として日英バイリンガルウェブサイトの運営に携わる。
レスポンシブWebデザインの実装に欠かせないメディアクエリを使わずに、CSS GridとFlexboxでレスポンシブなレイアウトを実装する方法を紹介します。 レスポンシブなレイアウトにはメディアクエリが欠かせないわけですが、CSS GridやFlexboxを使えばメディアクエリなしでもレスポンシブなレイアウトが可能です。メディアクエリが全くいらなくなるということはないと思いますが、CSS Grid…
渡辺 竜
「明日のウェブ制作に役立つアイディア」をテーマに「Rriver」というブログを運営。アメリカの大学を卒業後、1998年に東海岸のボストン近郊でウェブ制作を開始。2001年に帰国後、東京のウェブ制作会社に勤務。その後、事業者側に移り現在は組織のウェブ担当者として日英バイリンガルウェブサイトの運営に携わる。
Web制作ですっかり定番となったメディアクエリを使ったレスポンシブ Webデザイン。JavaScriptで実装している機能をメディアクエリと連携させるためのちょっとしたテクニックを紹介します。 テーブルタグがCSSに変わり、レスポンシブデザインは心躍るコンセプトの1つです。レスポンシブデザインはメディアクエリで閲覧中の機器の画面幅、高さ、向き、解像度、アスペクト比、色深度などを把握し、応じたスタイ…
Copyright © 2017, Craig Buckler All Rights Reserved.
Craig Buckler
イギリス人のWebコンサルタントで、1995年にIE2.0向けにはじめてのWebサイトを製作。それ以降、Webの標準化とアクセシビリティ向上、HTML5の優れた事例を紹介・提唱してきました。SitePointでは1,000以上の記事を書いています。Twitterのアカウントは@craigbuckler。
手作業で作るにはあまりにも面倒なのが、テーブル（表組み）ですよね。そこで、 WordPressで使えるテーブルプラグインをタイプ別に厳選して紹介します。 テーブル（表）は、Webサイトの情報を整理して分かりやすく表示するのに最適な表現方法です。WordPressにはとにかくたくさんのテーブルプラグインがあるので、どれを使えばよいかは悩ましいところです。 本記事はWordPressテーブルプラグイン…
Copyright © 2017, Katie Keith All Rights Reserved.
Katie Keith
イギリスのWordPress代理店、Barn2 Media社の運営責任者です。2009年に同社を共同創業してからはWordPressに関する執筆活動をしながら、クライアントのWebサイト運営を助けています。イギリスの田舎町の自宅からほど近いDartmoor国立公園を、夫と娘と一緒に散歩するのを楽しみとしています。
すっかりおなじみになった「レスポンシブWebデザイン（RWD）」。その言葉の定義は（提唱者であるEthan Marcotteの本来の定義は別として）日本でもたびたび議論になりますが、海の向こうでも再び盛り上がっているようです。 「レスポンシブ（Responsive）デザイン」は、いまではとてもなじみがある言葉です。しかし、その正確な意味と印象は、本当に一致しているのでしょうか。「レスポンシブ（Ad…
Copyright © 2017, Daniel Schwarz All Rights Reserved.
Daniel Schwarz
フルタイムのデザインライター、デジタルノマドです。デザインやコードに関する執筆以外には、自身が立ち上げたクリエイティブスタジオ「Airwalk Studios」で作業することもあります。ロンドン出身の24歳。
