アフィリエイトは難しい。アルバイトのように作業内容が決まっているわけでもなければ、やればやった分だけ成果が出るわけでもない。 だが、軌道に乗りさえすれば本当に有り難いものだ。24時間365日働いてくれる不労所得製造マシンとなるのだから。月数万でも人生にそんなチートがあれば心強い。 なにしろアフィリエイトで辛いのは成果が出るまで。成果が出るまで頑張れたなら、少なからずコツもつかめて生涯使える財産（ノウハウ）が身につくだろう。しかし、実際はほとんどの人が成果を出す前に脱落してしまう。そういった所が“アフィリエイトで月1万以上稼げている人は全体の5％以下”という数字に現れているのだろう。 そんな中、最近ではアフィリエイトで成果を出している方々がHOW TO系の記事を書く事が増えてきている。内容は様々だが、いずれも実際に成果を出している方の記事だけあってサイト作成の際非常に参考になる。 そういった

それで、「そんなにいいのかな？」と半信半疑でインストールして、使ってみた瞬間、惚れました。 プログラミングをする人にとって、Sublime Textは、「恋に落ちるエディター」とよく言われていますけど、WEB開発者にとってBliskは「恋に落ちるブラウザ」といっても過言はないのではないかと思います。 以下では、そう思うに至った理由について述べたいと思います。 この記事は、2016年7月9日に書いたものです。2016年11月1日にversion 1.0.125.166が出たことにより、機能の一部が有償プランに加入しないと利用できなくなりました。ですので、無料で利用する場合は、30分で機能制限がかかったりするようになったのでご了承ください。 Blisk（ブリスク）とは Bliskは、WEB制作者がサイトの動作確認をする上で、便利な機能がデフォルトで備わっているWEBブラウザです。 現在は、Wi

イラストレーター「みふねたかし」さんによる、利用無料イラスト素材集サイト「いらすとや」。かわいい絵柄で人気のサイトです。 pixivやTwitter上でも、その絵柄を真似した画像がいくつか投稿されています。 僕も描きたくなったので、自分のTwitterプロフィール画像を「いらすとや」風なイラストにしてみました。 どのようにこのイラストを描いたかを説明します。Adobe Creative Suite CS6の利用を前提にしています。 Adobe Illustratorを使います。 参考に、僕が作成した.aiファイルを置いておきます。 以下のようにするとよいでしょう。 目はにっこり笑ったものか、女性のまつげ線がついたものにする。より「いらすとや」テイストだと認識してもらいやすくなる。 髪の毛は縦ストライプにする。これも、「いらすとや」テイストだという記号として機能する。 ほおの赤みを忘れない。

Sassのコンパイルや画像の最適化、ブラウザーのリロードなど、面倒な作業を自動化できるタスクランナー。WordPressテーマの開発でも威力を発揮しそうです。設定が面倒でしょ？ と思っていた人も、これをきっかけにはじめてみたら？ Webサイトのコードは複雑化する一途で、繰り返しの作業が生じるのがごく当たり前になっています。しかし、世の中にはより優れた、効果的な開発プロセスがあるはずです。 このチュートリアルでは、Gulpを使ってWordPressのテーマ作成を自動化する方法と、ワークフローの自動化でテーマ作成のプロセスを改善する方法を紹介します。 なぜワークフローの自動化が必要なのか ワークフローを最適化することは、開発プロセスにおいて非常に有益で、取り組む価値があります。その理由をいくつか挙げます。 カスタムツールで、繰り返しの多い、つまらないタスクをすべて省ける ほかの重要なコアとなる

普段のWebブラウジングはSafariを使っているのですが、システム開発となるとGoogle Chromeに切り替えています。そのようにWebブラウジングと開発でブラウザを使い分けている人も多いのではないでしょうか。 今回紹介するBliskは、まさにWebシステム開発に特化したWebブラウザとなっています。フロントエンド開発などに役立ちそうです。 Bliskの使い方 Bliskのメイン画面です。左側にスマートフォンでの表示例が出ています。 デバイスは自由に変更できます。 横向きにもできます。 表示を見比べながら開発できます。なおスクロールを同期させる機能もあります。 ディレクトリを指定してファイルの更新があったら再読み込みする機能があります。 BliskはChromiumをベースとしているのでDevToolsはGoogle Chromeと同等のものが使えます。さらに今後各デバイスの枠（画面

ここ最近知人に教えるととても喜ばれるので、エントリでも紹介。人を選ぶアドオンだとは思いますが、その道の人には大変役に立つアドオン「Launch Clipboard」です。 Launch Clipboard :: Add-ons for Firefox https://addons.mozilla.org/ja/firefox/addon/7273 やれることはとてもシンプルで、クリップボードに張り付けたデータの中からURLを取り出して、それをタブで開いてくれるアドオンです。URLだけを丁寧に抽出する必要はなくて、適当にコピーしてもURLだけを認識してタブで開いてくれるのが超絶便利。また、URLは「http」形式のテキストと、「<a href=」で始まるリンクタグの両方を使い分けられるのもこれまた便利。 具体的な使い方の例を出すと、たとえばExcelでまとめてあるURLをタブで全部開きたいと

メールやチャットなどでやりとりしたテキストメッセージに複数のURLが表記されていて、すべて閲覧の必要があることがたまにあります。 1つずつページを開いていくのは時間が掛かりますし、あまり数が多いとポチポチクリックして手が痛くなったりしますよね。 そんなとき、クリップボードにコピーしたテキストの中から、URLだけを一気にタブで開く方法があります。 Firefoxの場合はアドオン、Chromeの場合は拡張機能を使って出来ますので、その方法を説明していきます。 Firefoxで複数URLを一気に開く方法 「Multi-Link Paste and Go」というアドオンを使います。 まずはMozillaの公式アドオンサイトで「Multi-Link Paste and Go」をダウンロードしてインストールします。 このアドオンはインストールしてすぐに使用可能で、Firefoxを再起動する必要がありま

説明 Contact Form 7 は複数のコンタクトフォームを管理できてその上フォームとメールの内容を簡単なマークアップで柔軟にカスタマイズしたりもできます。Ajax によるフォーム送信、CAPTCHA、Akismet スパムフィルタリング等々サポートしています。 ドキュメントとサポート contactform7.com では使い方や FAQ など、Contact Form 7 に関する詳細な情報を提供しています。もし FAQ やその他のドキュメンテーションにあなたの疑問の答えを見つけられなかったなら、そのときは WordPress.org のサポートフォーラムをチェックしましょう。既存のトピックを見ても問題解決できなかったなら、新しいトピックを作成してください。 Contact Form 7 はあなたの支援を必要としています 無償配布するプラグインの開発とサポートを継続することはとても

gulp-sassで自動でSass/SCSSからcssファイルを生成する - 人生リアルタイムアタック の続き。完全上位互換のつもり。 前回は gulp-sass の導入だけだったので、この記事では gulp / Sass (SCSS) 周り全般について述べたい。 構成 以下のディレクトリ構成を例にする。 ./test ├── css │   └── // cssファイルの生成先 └── assets │ └── sass │ └── **/*.scss └── index.html Node.jsは LTSのv4.4.5 がインストール済みで、$ npmコマンドが利用可能になっている前提。 package.jsonをつくる 最初に、Node.jsのパッケージ管理ファイルであるpackage.jsonを生成する。 package.jsonはコマンドで生成できる。 $ npm init -y

フロントエンドのお仕事として、HTMLやCSS、JavaScript のコーディング回りを行っていると、以前に比べてやらなければならないことが増えてきていました。そのため、細々した作業でも、自動化して効率よく開発をすすめないと、時間がかかってしまうことが多いです。 そんなときに活用できるのが、今回使い方を紹介する gulp です。 gulp.js このエントリーでは、gulp が使えるように、gulp とはどういうものなのかの簡単な説明から、導入の基礎部分までを書いておきます。コピペでしか使ったことがない！という人や、誰かのコピペに頼って使っていたような人も、今後の活用していくための参考に利用してもらえたら嬉しいです。 gulp とは？ gulp.js は Node.js 製の毎回行うような作業を自動化してくれるツールです。よく様々なサイトでタスクランナーとして紹介されていますが、正確には

Not your computer? Use a private browsing window to sign in. Learn more about using Guest mode

みなさんこんにちは、フォノグラム デザイナーのニッキーです！ 突然ですがみなさんは、自分で書いた手書きのイラストをデザインに使用する際どうやっていますか？ 私は描いたイラストをスキャンしてIllustratorで「ライブトレース」機能を使ってシェイプ化したり… もしくはスキャンしたイラストをそのままペンツールでちまちまトレースしていました。 そんな私だったのですが…神アプリを見つけてしまいました。 もうイラレで人力トレースは不要の時代になったのです！！パスを引く時代は終わったのです！ もし私と同じような工程でイラスト作成をしている方がいたら、ぜひスマホアプリ「Adobe Capture」を試していただきたいです！ Adobe Captureでらくらくベクター化！ Adobe Capture CCって？ Adobe Capture CC Adobe Capture CCモバイルアプリでは、1

gulpから黒画面のコマンドを叩いて実行 gruntでlivereloadxを実行ってのはあったけど、gulpはなかったので載せてみた。 var gulp = require('gulp'), exec = require('child_process').exec; gulp.task('livereloadx', function(){ exec('livereloadx -s -p 8000'); }); gulp.task('livereloadx', ['livereloadx']); 最低限必要な記述。 node.js,livereloadx,gulpは別途コマンドラインでインストールしておいてください。 child_processを使うことで、gulpから黒画面のコマンドを叩いて実行させることが出来ます。 gulpfile.jsが存在するディレクトリでlivereloadxコ

ブラウザ上でWeb制作作業を行うことも多くなってきましたが、拡張機能は揃ってますか？DevToolsしか使っていないという方にはこの記事はまさにおすすめ。便利な拡張機能を使って、効率良くWeb制作をしましょう！ FireFoxを使っているかたは、FireFoxの無料アドオンまとめも合わせてチェック！ Chromeおすすめ拡張機能まとめ 25本 Web Developer 定番のWeb開発ツール。javascriptのオンオフや画像の非表示など多くのことができます。 Web Developer Checklist Web開発にやるべきことのチェックリストを作れる拡張機能。タスク一覧が表示されるシンプルなチェックリストです。 Page Ruler コンテンツのサイズをドラッグ＆ドロップで測定できるChrome拡張機能。Webサイトのサムネイルの大きさや、コンテンツの間隔などを測定するときに使っ

難しい知識なしで使える＆高セキュア なリモートデスクトップツール。 自動生成される専用の ID / パスワード を入力するだけで、任意のコンピュータに接続できるようにしてくれます。 テキストチャット / ボイスチャット / ビデオチャット、ファイル / フォルダ の転送、複数人にデスクトップの様子を公開できる Web 会議、VPN 接続... などの機能が付いています。 TeamViewerは、簡単に使えるデスクトップ共有ツールです。 自分のパソコンから外部のパソコンを遠隔操作できるようにするリモートデスクトップツールで、ネットワークに関する難しい知識（ファイアウォール、IP アドレス、NAT 等々）を全く必要とせずに使えるところが最大の特徴。 “ 操作する側 / される側 ” の両者が「TeamViewer」を持っている必要がある... という条件は付いてくるものの、とにかく簡単に使うこ