タグ

ブックマーク / hyper-text.org (10)

  • gulp 4.0 が正式リリース、v3 からの移行に伴う gulpfile.js ファイルの修正点 | WWW WATCH

    gulp 4.0 が正式リリースされましたが、v3 から v4 へのバージョンアップに伴い実施されたいくつかの修正が原因で、v3 環境で使用していた gulpfile.js ファイルがそのままでは正常に動作しなくなりました。v4 移行のために行った gulpfile.js ファイルの修正点をまとめます。 つい先日ですが、gulp 4.0 が正式リリースされ、記事執筆現在、npm install gulp すると gulp 4.0.0 がインストールされるようになっています(今まではプレリリース扱いということで、npm install gulp@next と指定しなければ 4.0 はインストールされませんでした)。 Version 4.0 Now Default - gulpjs gulp changelog - gulpjs/gulp そこで早速ですが、試しにテスト環境作って gulp

    gulp 4.0 が正式リリース、v3 からの移行に伴う gulpfile.js ファイルの修正点 | WWW WATCH
    kathew
    kathew 2019/04/24
  • CSS filter プロパティで 「半透明ガラス」 効果を再現してみる

    2つ前の記事、「Chrome Canary が dialog 要素に対応、ダイアログボックスの表示が簡単に」 で、::backdrop 疑似要素に色々スタイル当てて遊んでたとき、::backdrop 疑似要素に対しては半透明の白いレイヤーになるようにスタイル当てて、その上で、CSS filter プロパティを使って画面全体をぼやかしたら、iOS 7 (Windows Aero ...) とかで使われてる、所謂 「半透明ガラス」 っぽい効果が出せるんじゃね? と思ってやってみました。 実際に iPhone の Safari で表示してみた例が下記の画像です。 ただし、dialog 要素や ::backdrop 疑似要素を使っちゃうと、現時点では Chrome Canary で、さらにフラグを立てないと動作しないっていう、ほとんどの人が試せない状態になってしまうので、今回は div 要素を J

    CSS filter プロパティで 「半透明ガラス」 効果を再現してみる
  • 改めて今の技術でやってみたら面白そうな CSS コーディングの大会

    もう 6年近く前の話なんですが、JamGraffiti さんが企画した CSS コーディングの大会、「画像の使用を極力控えてかっこいい CSS デザインをやってみよう大会」 を今さら思い出したので懐かしさついでに紹介。今の技術でやったらまた新しい発見があるかも。 2007年の 4月とかの話なので、もうかれこれ 6年近く前の話なんですが、JamGraffiti (@ichi23)さんが企画した、「画像の使用を極力控えてかっこいい CSS デザインをやってみよう大会」 ってのがありましてですね。 簡単に言えば 「css Zen Garden」 なんかと同じで、「同じ XHTML 文書に対してみんなで CSS 書いて、どんなデザインができるか遊んでみようぜ」 っていう試みなわけです。 と言っても、css Zen Garden が盛り上がってたのだって 2006年とか、所謂 Web 標準の啓蒙がと

    改めて今の技術でやってみたら面白そうな CSS コーディングの大会
  • Google Chrome アプリケーションショートカット

    Google Chrome をインストールして試していますが、軽快ですね動作が。Firefox 使いの私としては、かなり Firefox アドオンに依存している関係上、ブラウザを乗り換えるというところまでは行きませんが、Google Chrome にはアプリケーションショートカットという機能がついているので、Gmail 等、特定の Web アプリケーションの使用時には Google Chrome を使うという使い分けがいいかもしれません。 Google Chrome をインストールして試していますが、軽快ですね動作が。 Firefox 使いの私としては、かなり Firefox アドオンに依存している関係上、ブラウザを乗り換えるというところまでは行きませんが、Google Chrome には 「アプリケーションショートカット」 という機能がついているので、Gmail 等、特定の Web アプ

    Google Chrome アプリケーションショートカット
  • HTML5 におけるアウトラインに関して簡単解説

    HTML5 におけるアウトラインに関して簡単解説 HTML5 で重要なアウトラインに関して、なるべくわかりやすく簡単に解説してみます。 最近、ヨモツネットさんで 「HTML5 でのセクションの誤用にご注意」 なんて記事が出てたり、ちょうど HTML5 Doctor でも 「Document Outlines」 と題してアウトラインの解説記事が上がってたりするので、この 「アウトライン」 について簡単にまとめてみようと思います。解説って言うほど偉そうなものではありませんがなるべくわかりやすく書いてみようかと。 アウトラインを理解することは、HTML5 でマークアップする際にとても重要になりますので覚えておくとよいと思いますよ。 アウトラインとは? アウトラインとは見出し、フォームタイトル、テーブルタイトル、その他ラベル付けされた要素によって生成される文書構造のこと…なんて書くととても難しそう

    HTML5 におけるアウトラインに関して簡単解説
  • HTML5 でやりがちな間違い

    HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 Avoiding common HTML5 mistakes : HTML5 Doctor 翻訳といっても要約みたいな感じですので、書いてあることをそのまま日語にしたものではあり

    HTML5 でやりがちな間違い
  • 個人的に使っている Web サービスまとめ | WWW WATCH

    日常的に使用している Web サービスをまとめて紹介 & 主要な使い道なんかを書いてみたいと思います。常用中のサービスとしては、そんなに珍しいサービスを使っているわけではないので掘り出し物はないと思いますが、同じサービスでも人によって使い方というか重視する点なども違うと思いますので何かしら参考になれば。 ちょっと個人的なネタですが。仕事柄、何か面白そうな Web サービスがリリースされると、とりあえずアカウントだけは作って色々試してみるわけですが、中にはそのままハマって使い続けるものもあれば、当然ながらあまり使わずに放置ってものもあります。 その中でも特に日常的に使用している Web サービスをまとめて紹介 & 主要な使い道なんかを書いてみたいと思います。常用中のサービスとしては、そんなに珍しいサービスを使っているわけではないので掘り出し物はないと思いますが、同じサービスでも人によって使い

    個人的に使っている Web サービスまとめ | WWW WATCH
  • AMN パートナーブロガー Twitter リスト

    AMN (Agile Media Network) さんから AMN パートナーブロガーの Twitter アカウント一覧が公開されたそうです。私も参加させていただいている関係でこのリストに入っていますが、有名ブロガーさん目白押しですので、Twitter でフォローする人を探すときにも役に立つかもしれませんよ。 AMNパートナーブログのTwitterアカウント一覧 最近、各所で話題になっているTwitterというつぶやき共有サービスですが、AMNパートナーブログのTwitterアカウントのリストが欲しいという要望を頂いたので作成してみました。 AMNアカウントを入れた85ブログの中で、60人がすでにTwitterを使っているというなかなか興味深い結果になっています。 AMNパートナーブロガーのTwitterリストを作ってみました。 : Agile Media Network リストのおかげ

    AMN パートナーブロガー Twitter リスト
  • 常用中 Firefox 3 アドオンのまとめ

    1年に 1回は書いているこのネタ、懲りずに私が個人的に日常利用している Firefox アドオン(+ Greasemonkey ユーザースクリプト)を挙げてみました。Firefox 3 対応のアドオンのみを集めています。 1年に 1回は書いているこのネタ、懲りずに私が個人的に日常利用している Firefox アドオン(+ Greasemonkey ユーザースクリプト)を挙げてみました。Firefox 3 対応のアドオンのみを集めています。 アドオンはあんまり数多くインストールすると結構重くなるので注意してくださいね。その場合は、インストールしても、使うとき以外は無効にしておくなど工夫しましょう。メモリてんこ盛り PC ならあまり気にならないと思いますが。 今回は数が多いので大まかにグループ分けして紹介してみます。あと、特定のアドオンに依存しているものもありますので、その辺はまとめています。

    常用中 Firefox 3 アドオンのまとめ
  • エイプリルフールネタ 2009

    年に一度のおバカ祭りの日が今年もやってきました。Web 上でも色々なところでこれに便乗してネタを披露しているサイトが数多くあります。ざっと見かけたものだけまとめてみました。 Yahoo! Japan 「エヴァ実写ドラマ化計画」 なんてニュースが…… トップページにもさりげなく載ってるのでこれはだまされる人多そう。 ニコニコ動画 「4/1ニコニコ動画史上最速バージョン "βββ" スタート!」 をはじめ色々と面白そうなネタが。「オバマ・トルシエ・田代 緊急生放送3立て!」 なんてのも。 スラッシュドット・ジャパン 「エイプリルフール中止のお知らせ」 なんてタレコミが上がってますが…… Impress Watch 毎年手が込んでます。「Impresso Watch Headline」 で様々なおもしろネタが。 Watch いたちWatch 窓の社(やしろ)eco Maccrosoft、次期

    エイプリルフールネタ 2009
    kathew
    kathew 2009/04/01
    ガチャピンかっけえええ
  • 1