Web制作のTipsをまとめています。

Web制作

Thumbnail of post image 160

Bracketsのftp接続には、eqFTPを使っていたのですが、どこかのバージョンで使えなくなってしまいました。

今は、DLもできなくなってしまいます。

代わりにFTP接続をするプラグインにBrackets ...

Web制作

Thumbnail of post image 150

テキストエディタ おすすめでググると、

検索結果がえぐい。。。

テキストエディタを15個種類比較するとか大変すぎるので、普通の人は多分あんまり参考にならないと思います。

この記事では、5年ぐらいコー ...

Web制作

Thumbnail of post image 141

ブログやメディアを運営しててある程度PVがあるなら、Googleアドセンスを設置しておくだけでお金をちょっとは稼ぐことができます。

Googleアドセンスは、配置の仕方で収益が大きく変わるため、稼ぐための配置をしないとあま ...

Web制作

Thumbnail of post image 123

htmlを楽に作るため、Pugの基本的な使い方を解説します。

筆者は先日までejsでhtmlを作っていましたが、Pugに乗り換えました。

Pugの基本的な書き方
Pugでhtmlを作るのに知っておくと便利な使い ...

Web制作

Thumbnail of post image 049

htmlで静的Webサイトを作るなら、全てテキストエディタのベタ打ちで作れないこともないのですが、効率悪くかなり時間がかかります。

だから、cssにはSass。htmlやejsやpugなんかがあったりするのですが、、、

Web制作

Thumbnail of post image 100

htmlで画像を表示するimgタグはシンプルなのですが、細かいところをみると色々知っておかないといけないことがあります。

この記事でコーディングに必要なimgタグの知識についてまとめました。

imgタグのaltを埋め ...

Web制作

Thumbnail of post image 035

静的htmlで大量ページを作ったりした時に便利なejsの使い方を紹介します。

ejsのメリット

最初にejsを使うメリットを以下にまとめます。

htmlをパーツ化してヘッダーやフッターなどを別ファイルに作れる
変 ...

Web制作

Thumbnail of post image 148

SEO対策というと、記事のコンテンツが大事みたいな話をよく聞きますが、当然htmlソース側も大事です。

当方が運営している自作のWordPressテーマサイトで月間30万PVほどあります。

その知見から、マーク ...

Web制作

Thumbnail of post image 129

WordPressのver 4.7.1あたりから、aタグで別タブで開くように設定する(target=”_blank”)と、自動で

rel=”noopener noreferrer

Web制作

Thumbnail of post image 193

フリーランスのマークアップエンジニアとしてWeb制作をして4年が経ちました。だいたいWebサイトnコーディングをしています。

基本は一人で完結できるレベルの仕事量しか取らないのですが、希にキャパオーバーしてしまうことがあり ...

Web制作

Thumbnail of post image 083

WordPress引っ越し用の便利なプラグインに、All-in-One WP Migrationがあります。

が、管理画面からファイルがアップロードできないことがたまにあります。

原因はサーバーの設定など色々あ ...

Web制作

Thumbnail of post image 071

WordPress5.0の新エディターGutenbergを使い始めたのですが、昔のエディターでショートカットキーを使いまくっていました。

多分、旧エディターのクラシックエディターで500記事以上書いてると思います。 ...

Web制作

Thumbnail of post image 180

なんだかんだ便利なjQuery。

最近たまに、jQueryが使えないことがあるので、バニラjsで書くことがあります。

バニラjsでモジュール作るために、色々調べて何が使えて、何が便利かわかったので、メモ的にこの ...

Web制作

Thumbnail of post image 188

Gutenbergに慣れるためにテーマを自作テーマからNishikiにしました。

テーマを変更した時、サムネイルサイズが前のテーマのままになっていて変更の仕方にちょっとハマりました。

なのでそのやり方をこの記事 ...

Web制作

Thumbnail of post image 193

タイトルの通りです。

WordPressでアフィリエイトサイトを作るときに便利なプラグインをまとめました。

なくても問題ないのですが、アフィサイトのかゆいところに手がとどくプラグインがいくつかあるので紹介します ...

Web制作

Thumbnail of post image 085

WordPress5.0からデフォルトのエディターがGutenbergになりました。

昔のエディターはプラグイン「Classic Editor」を有効化することで使えるようになるようです。

「昔のエディター使えるから ...

Web制作

Thumbnail of post image 155

Webで生計を立てて4年目ぐらいになります。

最初はatomにひたすらベタ打ちでhtmlを書いていましたが、最近はコーディングが楽になるツールを色々使っています。

自分用のメモと共にコーディングで使っているツー ...

Web制作,フリーランス

Thumbnail of post image 036

フリーランスのエンジニアとして4年ほどリモートでお仕事をしています。今はそうでもないのですが、「昔は仕事がない。。。」、と嘆いていることがありました。

能力には自信があったのですが、仕事を獲得する術がなかったので、結構困っ ...

Web制作,フリーランス

Thumbnail of post image 190

当方はエンジニア歴4年のフリーランスです。

全て独学で勉強したのですが、今思うともっと効率よく勉強できた気がしています。

プログラミングは独学でやることもできますが、独学でやることで損したこともいっぱいあったか ...

Web制作

Thumbnail of post image 085

当方はWeb制作をフリーランスで受託して4年目になります。

新しいホームページを作ることはもちろんなのですが、意外と多いのがホームページのリニューアル。

どんな感じで来るかと言えば、知識ないけど色々調べて頑張っ ...

Web制作

Thumbnail of post image 106

まともなサイト制作のエンジニアなら誰でもSassは一度使ってことがあるかなと思います。

それぐらい有名で、便利です。

で、みんなSassを勉強しようとするのですが、なぜか大掛かりに本を買おうとしている。 ...

Web制作,サーバー

Thumbnail of post image 123

OpenVPNをコマンドラインからインストールすると超面倒なのですが、Vultrなら超絶楽にインストールできることがわかったのでシェアします。

この記事では、VultrでOpenVPNをインストールする方法を解説します。

Web制作

Thumbnail of post image 016

サイト制作を勉強していると、自然とWordPressに興味が出てくるかなと思います。

html/cssだけでも仕事はありますが、WordPressまでできると仕事の数も増え大きい単価のお仕事も取れやすくなります。

Web制作

Thumbnail of post image 099

CSSを変更してもうまくいかないときはありませんか?

実は、それはCSSの優先度がおかしいのかもしれません。

CSSには優先順位がある

実は、CSSが適応される際に優先順位というのがあります。

何かと ...

Web制作

Thumbnail of post image 046

サイト作るときや記事を書くときは、目標としているキーワードの検索数を調べると思うのですが、

新しいキーワードプランナーが絶望的に使いにくい。。。

入れたキーワードに対してちゃんと反応せずに、なぜか別のキーワード ...

Web制作

Thumbnail of post image 156

僕はブログに上げる画像を全てリサイズしています。

Macで画像をリサイズするツールは色々あるのですが、一番おすすめなのはTh-MakerXというアプリ。

無料で使えて、制限なく細かく設定できるため、今ではなくて ...

Web制作

Thumbnail of post image 082

タイトルの通りです。

firebaseには、Cloud Functionという便利な機能がついていますが、初期のメモリは256MBとちょっと少ない。Max 2GBまで上げられます。

また、メモリに追従してCPU ...

Web制作

Thumbnail of post image 113

※2020年追記 Koalaの開発が終了してしまい、ダウンロードが出来なくなってしまいました。。

変わりのおすすめは、Preprosです。有料ソフトですが一応無料でも使えます。

Preprosの詳細記事 ...

Web制作

Thumbnail of post image 111

当方は3年ほどWeb制作で飯を食べているエンジニアです。

普段のコーディングはGulpを使ってある程度、処理を自動化して効率化しています。(常に使っているわけではない)

その甲斐あってか、長めでフルスクラッチの ...

Web制作

Thumbnail of post image 080

当方はWeb制作を3年ほどフリーランスで受託しているエンジニアです。

静的なhtmlやプログラマブルなサイトはもちろんとして、WordPressテーマの制作もよく承っております。

マストなプラグインのインストー ...