さくらの VPS + CentOS7 で 俺専用 Mastodon インスタンスを立ててみた話 | WWW WATCH

2017/04/17 122 users VPS マストドン nullkal Mastodon 自腹

Mastodon （マストドン） が先週の頭、4月10日くらいから日本でも急激に話題になって、 @nullkal 氏が自腹で mstdn.jp インスタンスを立ててくれた辺りからはもう一部でお祭り騒ぎになっていました。 で、いい機会だし、ちょっとお勉強を兼ねて自分専用の Mastodon インスタンスを立ててみようと週末に思い立ち、土曜日の空いた時間でやってみたら 2～3時間で比較的簡単に立てられ... 続きを読む

5分でわかる正しい Web サイト常時 SSL 化のための基礎知識 | WWW WATCH

2015/06/18 979 users SSL 基礎知識 サイト常時 https 正しい Web

5分でわかる正しい Web サイト常時 SSL 化のための基礎知識Web サイトを常時 SSL 化する場合に、最低限知っておかなければならない知識や、注意点、実際の設定方法まで、ひと通りまとめてみました。メリットやデメリット、証明書の種別からリダイレクト設定などについても解説しています。 HTTPS をランキングシグナルに使用しますと Google が公式に発表したあたりから、Web サイトの S... 続きを読む

ページ内リンクはスムーズスクロールしなくても一瞬点滅すればいいんじゃないかという実験 | WWW WATCH

2015/05/15 261 users 一瞬 実験 瞬時 ページ内リンク 親切心

タイトルが （謎） な感じですが...... ページ内リンクでページ上部に移動させたりするとき、最近は所謂スムーズスクロールってやつを実装するのが当たり前になっていますよね。パッと瞬時に画面が切り替わってしまうと、ページ内で移動したことがわかりにくいので、スクロール処理を入れることでわかりやすくしてあげましょうって言う、親切心から採用されるケースが多いと思います。 実装方法は JavaScript... 続きを読む

Google が言う 「モバイルフレンドリー」 とは？ モバイルフレンドリーテストツールで色々試してみた | WWW WATCH

2015/03/02 333 users モバイルフレンドリー Official シグナル web

先週ですが、Google が Official Google Webmaster Central Blog で、2015年 4月 21日 （米国時間） から、モバイル検索の順位決定時に、その Web サイトが 「モバイルフレンドリー」 かどうかを重要なシグナルとして利用すると発表しました。 Finding more mobile-friendly search results ： Official... 続きを読む

5分でわかる正しい Web サイト常時 SSL 化のための基礎知識 | WWW WATCH

2015/01/22 717 users SSL 基礎知識 サイト常時 https 正しい Web

HTTPS をランキングシグナルに使用しますと Google が公式に発表したあたりから、Web サイトの SSL 対応、特に Google が推奨している Web サイトをすべて HTTPS で配信する、所謂 「常時 SSL 化」 についての話を聞いたり、実際にクライアントから相談されたりするケースが増えてきました。 そこで、いい機会だしその辺に関する情報をまとめておこうかな～ と思って書いてみ... 続きを読む

position: absolute; の指定で要素が上下左右中央配置になる理由 | WWW WATCH

2014/08/06 433 users CSS バシャログ いまどき block要素 上下左右中央

人様の人気エントリーに乗っかる感じで恐縮ですが、「CSSで block 要素を上下左右中央寄せにする、イマドキの方法。 ： バシャログ。」 という記事が話題になっていたので、なんでその指定で上下中央配置になるのか補足してみます。 詳しい話は下記のリンク先をご覧ください。 CSSでblock要素を上下左右中央寄せにする、イマドキの方法。 ： バシャログ。 何でこういうことを書くかというとですね、例え... 続きを読む

jQuery 公式 Blog 「jquery-latest.js を使用するのをやめろ」 | WWW WATCH

2014/07/03 400 users jQuery アナウンス web バージョン 本番環境

jQuery 公式 Blog は、7月 3日付けで投稿された 「Don't Use jquery-latest.js （jquery-latest.js を使うな）」 と題された記事内で、今後、jquery-latest.js のバージョンを 1.11.1 で固定することと、本番環境 （公開している Web サイト） で jquery-latest.js を読み込むのをやめてくれというアナウンスを... 続きを読む

5分でわかる Swarm の使い方と Foursquare の変更点 | WWW WATCH

2014/05/16 105 users foursquare SWARM ロケーションベース 移行

ある場所への、所謂チェックインを共有するロケーションベースのソーシャル・ネットワーキング・サービスとして人気の Foursquare は日本でも使っている人が多いと思います。 今月 1日ですが、その Foursquare が大きな方向転換をし、Foursquare アプリから主要機能だったチェックイン機能を削除、この機能を独立したチェックイン専用アプリ 「Swarm」 に移行、従来の Foursq... 続きを読む

Web デザイナーさん向け Grunt を使った コーディング作業の効率化、はじめの一歩 | WWW WATCH

2014/01/24 462 users Grunt CSS はじめ HTML コーディング作業

Grunt の導入記事なんか珍しくもないし、色々な方がわかりやすい記事を過去にも書かれていているので今さらではありますが...... とはいえ、まだ使ったことがない人もいるだろうということで、「Grunt って何ですか？」 とか「使ってみたいけどよくわからない......」 なんていう Web デザイナー （主に HTML や CSS を書くフロントエンドな人） さん向けに、初めて Grunt を... 続きを読む

Google タグマネージャで Web ページに読み込む JavaScript を管理してみる | WWW WATCH

2013/11/27 101 users Google タグマネージャ web JavaScript

Google タグマネージャ （Google Tag Manager） をこの Blog 内の各ページで読み込んでいる JavaScript コードの管理に数ヶ月前から使い始めていますが、結構使いやすくて便利なのと、ページの表示速度的にもいい結果が出たので紹介してみます。 Google タグマネージャ公式サイト 機能 ： Google タグマネージャ Google タグマネージャとは？ Googl... 続きを読む

Surface Pro 2 買った ～とにかく軽くてバッテリーもちのいいモバイル PC を求めて～ | WWW WATCH

2013/11/09 238 users スペック MacBook Pro バッテリーもち ノート 米国

今までノート PC が必要な状況では、MacBook Pro を持ち歩いてまして。ところが、その重さ （2kg くらい） に最近は持ち歩くのがつらくなってて、もっと軽いノート PC にしたいな～と思ってたんですが、そんなタイミングで、Surface 2 / Pro 2 が米国で発売されて、十分なスペックと、何よりその軽さにこれは日本で発売されたら検討しようと思ってたんですよね。 で、先月末ですが、... 続きを読む

Chrome などで保存したパスワードが丸見えだから危険とか言われている件について | WWW WATCH

2013/08/13 411 users Chrome 丸見え パスワード ギズモード・ジャパン 自身

ソフトウェア開発者の Elliott Kember 氏が自身の Blog に「Chrome's insane password security strategy」 というタイトルで指摘する記事を書き、日本ではギズモード・ジャパンで翻訳記事が上がったことで話題になった、「Google Chrome では設定画面からブラウザに保存してあるパスワードを簡単に見ることができて、マスターパスワードの設定も... 続きを読む

CSS と jQuery で作るスクロールにあわせて回転するロゴ | WWW WATCH

2013/07/22 108 users jQuery transform tumblr CSS ロゴ

Tumblr のスタッフ Blog を見てたら、ロゴ （正確にはロゴの周囲の部分） がスクロールにあわせて回転してて、ちょっと面白かったのでサンプルを使って実際にどういう風に実装されているかを解説してみようと思います。 結構仕組みは簡単で、jQuery の scrollTop() を使ってスクロール位置を取得し、その値を CSS の transform プロパティに都度突っ込んでいくっていう感じ。... 続きを読む

CSS Flexible Box を使ってみよう | WWW WATCH

2013/07/13 115 users ウインドウサイズ CSS モジュール レイアウト 18日付け

CSS3 のモジュールとして策定されている CSS Flexible Box は、CSS によるレイアウトを実現するための仕組み。 レイアウトのための CSS プロパティは他にもありますが、CSS Flexible Box は特にスクリーンサイズや可変するウィンドウサイズなどに柔軟に対応した、その名の通りフレキシブルなレイアウトが可能です。 現在最新の仕様書は下記。2012年 9月 18日付けで勧... 続きを読む

IE11 でユーザエージェント文字列から 「MSIE」 が消えた件 | WWW WATCH

2013/07/04 358 users MacBook Pro プレビュー版 とおり 進化 MSIE

先月末に Windows 8.1 のプレビュー版が公開され、早速手持ちの MacBook Pro に入れてみたっていう話は先日書いたとおりですが、Internet Explorer 11 （IE11） については細かく触れなかったのでまとめておこうと思います。 IE11 になって機能追加やレンダリングエンジン周りの進化もかなりありましたが、それとあわせてユーザエージェント文字列が大幅に変更された結... 続きを読む

Pure を使って 5分でレスポンシブな Blog テンプレートを作る | WWW WATCH

2013/06/09 282 users pure フレームワーク CSS ウソ Yahoo

Pure は Yahoo! が公開した CSS フレームワークですが、試しに使ってみましょうということで、自分で書くスタイルは極力少なくして、簡単に Blog のテンプレートっぽいものを作ってみました。 さすがに 5分はウソです すいません。でも簡単でしたよ。 Pure ： A set of small, responsive CSS modules that you can use in eve... 続きを読む

Twitter カード 7タイプの使い方をカード種別ごとに解説するよ | WWW WATCH

2013/06/01 328 users Twitter Facebook 仕様 Blog 採用

Twitter Cards （Twitter カード）、この Blog でもかなり前から指定して使っていますが、7種類のカードから選択できたり、それぞれに指定できる値が異なってたりしてわかりにくいっていう声を聞きましたので （公式な日本語ドキュメントも今のところないし）、簡単に各カード種類別の仕様をまとめてみました。 Twitter Cards は、Facebook や Google+ などが採用... 続きを読む

それは robots.txt の問題じゃなくて... | WWW WATCH

2013/05/28 172 users robots.txt 不正アクセス キーワード た件 お詫び

なんか robots.txt がホットなキーワードになっていたので今さら知ったのですが、通信機器レンタルサービスの会社さんがクレジットカード情報をど派手に流出させたた件で、サイトに設置されていた robots.txt が色々と残念な件について話題になっていました。 robots.txt ： はてなブックマーク 不正アクセスによるお客様情報流出に関するお知らせとお詫び ： エクスコムグローバル株式会... 続きを読む

HTML5 勧告候補に main 要素が追加、hgroup 要素は予定通り削除 | WWW WATCH

2013/04/29 210 users hgroup main 勧告候補 HTML 要素

ちょっと前に 「hgroup 要素が HTML5 の勧告候補 （Candidate Recommendation） から削除されるようです」 って記事を書きましたが、実際に削除されたみたいですね。 ついでに、すでに HTML 5.1 Nightly にはすでに追加されていた、main 要素が、HTML5 勧告候補の方にも追加されたようです。 HTML5 W3C Candidate Recommen... 続きを読む

CSS で作る Tumblr モバイルアプリ風メニュー | WWW WATCH

2013/04/20 325 users tumblr Tumbler CSS Tumblr for

1年くらい前に 「CSS で作るスマートフォン向け片手操作メニュー」 って記事書いたんですが、同じようなのをまたやってみたので紹介。 Tumbler の Android アプリ （Tumblr for Android） の新規投稿の UI がカッコよかったんで、これを CSS と超簡単な JavaScript （jQuery 使用） で再現してみました。実際のサンプルは下記に。 CSS で作る T... 続きを読む

はてブが使いにくければ User CSS 書けばいいじゃない | WWW WATCH

2013/03/08 115 users はてブ サムネイル 文句 リニューアル後 はてなブックマーク

はてなブックマーク （はてブ） のリニューアル後、確かにさらーっと一覧を眺めたい場合には見づらくなりましたよね。サムネイル邪魔だとか、色々ありますけども、サービス提供側も色々理由があってデザインを直してるんでしょうし、デザインが大幅に変わったあとは今までのに慣れてた関係もあって使いづらいわ～的なお話が出てくるのは仕方ないこと。 で、文句言っても元のデザインに戻るわけじゃなし、どうしても見づらいって... 続きを読む

jQuery Core 1.9 アップグレードガイド 日本語訳 | WWW WATCH

2013/02/18 214 users ベータ版 正式版 移行ガイド jQuery 2.0 beta

ちょっと話題としては乗り遅れた感が漂いますが、先月末に jQuery 1.9 の正式版、および jQuery 2.0 のベータ版がリリースされました。 jQuery 1.9 final, jQuery 2.0 beta, Migrate final released ： Official jQuery Blog これに際して公開された、jQuery 1.9 への移行ガイド 「jQuery Core... 続きを読む

カーシェアリング （タイムズプラス） を半年間使い倒してみた | WWW WATCH

2013/01/16 625 users カーシェアリング Wikipedia 趣旨 Blog 普段

普段のこの Blog の趣旨とはかなりずれるんですが、カーシェアリングってのをここ半年間使い倒してて、折角なので半年間ヘビーにカーシェアリングを使ってみた私の感想などをシェアしちゃおうかなと思います。どうせなんで具体的な利用金額も公開しちゃう。 カーシェアリングって何？ カーシェアリングってのは、Wikipedia によると下記のようなサービスらしいです。 カーシェアリング（英: carshari... 続きを読む

Microdata を使ってみよう。サンプルソースで学ぶ Microdata | WWW WATCH

2012/12/07 102 users Microdata サンプルソース タイトル 通り 詳しい解説

HTML5 Advent Calendar 2012、7日目の記事です。なんか軽い気持ちで書いてみますとか言ってしまったんですが、緊張しますね... さて、タイトルの通りなのですが、HTML Microdata （マイクロデータ） について簡単に触れてみようかなと思います。この辺の話題に関して、Microdata とは何かとか、詳しい解説はすでに色々な方が書かれていますのでそちらを見ていただく （... 続きを読む

Webkit に最適化されたサイトを IE10 に適応させるためのガイド | WWW WATCH

2012/11/21 177 users スラッシュドット WebKit Microsoft 手前 主張

スラッシュドットで 「Microsoft、「WebKitはWeb標準を破壊している」と主張」 なんてストーリーが上がってて、なんぞやと思って大本の記事を見に行ったんですけど、そしたらそれが 「Webkit しか対象にしてない Web サイトを IE10 でもきちんと動作させるためにやっといた方がいいことガイド」 っていうお役立ちコンテンツだったってことで、がんばって最後まで読んだ手前、ついでなので... 続きを読む