Intro 「毎回やるなら bookmarklet にでもすれば?」と言ったら、後輩が「そんな便利なことできたんですね、知りませんでした」と言っていた。 そんな時代にこそ、今更だれも解説しないであろう、bookmarklet という技術についてもう一度書いておく。 Bookmarklet 簡単に言えば、JS を書き、それを Bookmark として登録すれば、クリックするだけで現在のページでそれが動くというものだ。 ブラウザ上で何かを自動化したいと思うなら、最も簡単に実現できる便利な技術だろう。 似たような手法ではブラウザの Extension などもあるが、Bookmarklet の良いところは一切誰にも邪魔されないというところだ。 開発者登録も、ストアへのアップロードも、難解なドキュメントを忖度して煩雑な設定ファイルを書く必要もない。 開発者ツールで、「こんなことできないかな」と試し終

HTML 5.2は2017年12月14日に勧告（Recommendation）され、仕様がRECステージに達しました。これはW3Cメンバーとディレクターの正式な承認を受けたことを意味し、Web制作者として、新しい機能の実装を開始するのに最適な時期になります。 HTML 5.2ではいくつかの新機能と削除された機能があり、記述ルールもいくつか変更され、今までinvalidだったものがvalidになり、新しくinvalidになったものもあります。 すべての変更点はHTML 5.2: Changesで確認することができます。 Web制作に最も影響を与えると思われるいくつかの変更点について説明します。 What's New in HTML 5.2? 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 HTML 5.2の新機能 HTML 5.2

個人で何かを作っていると、広めるときに様々な壁にぶつかる。 「作ること」と「広めること」は二人三脚のようになっていて、切り離せないものだとわたしは思っている。以前こんな記事も書いた。 👉「作る」人は、どうやって「広める」か 作る人は、教育の段階から「作ることだけ」を学んできた人が多い。わたしもそのひとりで、作る技術をひたすら学んできて「広める」方法を知らないまま、いきなり社会という大海原に飛び出した感じがある。 稀に作ることだけをやっていける人もいる。「作る」ということに突出していて「広める」が得意な誰かに見つけてもらえる人だ。だけどそんな人も、広めることの価値や方法を知らないと、変な契約を結ばされてしまったり、トラブルになりかねない。 では、作る人はどうやって広めていったらいいのか。SNSのフォロワー数を増やそうだとか、セルフブランディングをしようとか、SEOを強化しようとか、たくさん

Lightweight, high-performance JS plugin for detecting and manipulating elements in the browser. Github / Docs

ページをスクロールして、指定した要素がビューポートに表示されたかを判定し、アニメーションなどを適用できる超軽量のスクリプトを紹介します。 ビューポートだけでなく、範囲を指定することもできるので、かなり面白いと思います。 単体で動作し、しかも1KBの超軽量スクリプトです。

スロバキアのセキュリティ企業ESETは2017年11月8日（現地時間）、情報の盗難や流出が頻発していることを踏まえ、データベースを安全に保つ5つのコツを公式ブログで紹介した。 以下、内容を抄訳する。 プライバシーやセキュリティの対策に関するアドバイスとして通常取り上げられるのは、強力なパスワードを設定する、データをバックアップする、セキュリティアプリケーションを利用する、システムを最新に保つ、デフォルト設定をそのまま使わない、などだ。 これらは、全てのシステム管理者が考えなければならない基本的な対策だ。だが、保護したいシステムによって、これら以外にも考慮すべきさまざまな問題がある。 データベースに関しては、安全に保つコツとして以下の5つが挙げられる。 1：データベースへのアクセスを制御する データベースのセキュリティを考えると、権限や特権は制限すればするほどよい。厳密なアクセス制御は情報保

インターネット専門職 建設エンジニア 組込･制御ソフトウエア開発エンジニア 経理･財務 マーケティング オフィスワーク事務職 リクルートキャリア（東京・千代田）が15日に発表した2017年12月末の転職求人倍率は1.92倍で、08年の統計公表開始以来最高となった。人手不足が続くのはIT技術者で、企業が人工知能（AI）の活用などに積極的に投資する中、エンジニアの奪い合いが起きている。転職求人倍率は、Webエンジニアなどの「インターネット専門職」が6.45倍、「IoT」導入などにかかわる「組込・制御ソフトウエア開発エンジニア」は5.00倍。ネット業界では、VR（仮想現実）を駆使したゲームアプリや「通販サイトの制作需要が高まっている」（リクルートキャリア）。組込・制御ソフト開発エンジニアは、家電や自動車などあらゆるモノがネットにつながる「IoT」の導入に必要な人材だ。 建物の設計図の作成や施工管

これ以上は長くなるため後述． Chromeは既に，Safariもようやく 上記の通り，Service WorkersがPWAでも最重要な機能の一つである．Chromeでは既に対応済み． しかしSafariが対応しておらず，世間的にはモチベーションの上がらない状況であった（やちまもその一人である）． Safariにおいて，Service Workersの実装状況 No active development が Under Consideration になったのは2015/12/041のことである． 20ヶ月という永遠とも呼べる時を経て，2017/08/032にようやく In Development となったわけであった． だから何なのか SafariにService Workersの実装がなされると，一気にウェブアプリへの移行が進む可能性が大きい． ブラウザの制約が弱まり，ウェブアプリの不採

新しい記事書きました。【font-familyについて本気で考えてみた】 「Chromeでも読みやすい游ゴシックを指定する方法 」の記事で游ゴシックが一部ブラウザで掠れる問題を解決出来たので、font-familyのベストプラクティスを考えてみたいと思います。 本当は「2016年font-familyの決定版」みたいなタイトルにしたかったのですが、執筆時は8月ですしね。2017年も名乗れません。 2020年と書いたのはWindows7のサポートが切れるのがこの年だからです。 目的はどの環境でも出来る限り近い見た目を目指すものではなく、実行環境で最も読みやすいものを目指すものです。MacよりもWindowsに比重をおいています。 -- 追記 -- Chrome58から一時対応しなくなってしまいましたが、游ゴシックをWindows版Chromeでキレイに表示する@font-faceの設定にヒン