HTML5とCSS3、WordPress、SEO。無料ツールでランクアップ! / いがわ

.

Memo

HTML5とCSS3、WordPress、SEO。無料ツールでランクアップ!

HTML5やCSS3、SEOなどの先端技術を無料ツールで。

今年2021年、5年ほど前に制作したサイトのリニューアルを承った。前回もリニューアルをしたので、2度目のリニューアルだ。ありがたいことに去年からお願いをされていたのだが、私の目の不調により待ってもらっていた。

マイク英会話教室札幌のオンラインレッスンページ。

だいぶ出来上がったので、ちょっと振り返ってみる。

マイク英会話教室札幌さまのサイト >

札幌には約200万人が住んでいる。そのゆえたくさんの英会話教室がある。また、「英会話」や「英語」はいわゆるビッグキーワードだろう。

2021年09月初旬現在、 「英会話 札幌」や、「英語 札幌」などで検索すると、スマホでもパソコンでも順位は8位〜15位。(スマホの方が高順位。) 他の競合サイトは大手もしくはまとめサイトだ。

オリジナリティ性やSEO対策はかなり自分で作り込んだので想定内ではあるが、結果が出ると素直に嬉しい。そして無料ツールやフリー素材には本当に感謝いたします。

※画像はオンラインレッスンページの写真。リンク先はトップページです。


ダークモードとAtom

数年前から急速にダークモードが進んだ。目への負担が全然違う。ダークモードも多くのOSやツールで無料で利用できる。
コーディングは『Atom』が自分にとってしっくりときた。インターフェイスがとても良い。GitHubとの連携もしやすい。

有料の『Coda』も使用しているが、自分が使っているバージョンはダークモードには対応していない。それでもCodaは買取なので毎月の支払いがないのがいい。Atomと併用しているが、FTPはCodaが断然使いやすい。


WordPress。

『WordPress』は非常にありがたい強力なツールだ。自作テーマで作れば完全無料で、お客様側も無料で更新できるオリジナルサイトを作ることができる。

制作者としては専門的な知識が必要だが、仕事なので勉強するのはごく当然だろう。SEO対策にも効果的な使い方ができ、デザインや機能の自由度も高い。

WordPress


PhotoshopやIllustratorなどのAdobe製品。

デザイン制作において、Adobe製品は非常に使い勝手が良い。『Photoshop』や『Illustrator』は特に。ただし、月額で6,000円近くかかるのが難点だ。フォトショ単体やイラレ単体では安いが、単体では足りない。十分な制作費があれば良いのだが、この業界はピンキリだからちょっとした悩みどころとなっている。

Adobe製品。

この2つのソフトに関しては満足できるレベルの無料ツールは見つけられなかった。つい数ヶ月前までは無料で利用できたPhotoshop簡易版のオンラインツールがあったのだが、現在は無くなってしまった。

なので、無料でやる場合、複数のツールとさらにMacデフォルトのツール複数やりくりしている。合計で4つか5つくらい。手間がかかり作業時間は大幅に増えるが、無料ツールには感謝しかない。

繰り返すがPhotoshopとIllustratorは本当に使いやすい。別格だ。


CSS3の新しいプロパティによる画像調整。

cssによるレイアウト

これも非常にありがたい。object-fitについてはまだトリミングの代替とはなり得ないものだが(実際に切り取るわけではないので画像の軽量化ができない)、便利で実用的だ。

色調補正はCSSのfilterプロパティだけでかなりできるようになった。しかも1枚1枚ではなく、複数の画像に対して指定できる。これは嬉しい。


SEO対策。

SEO対策に利用できる無料ツールは『W3C』や『SEOチェキ』、『PageSpeed Insights』、そして前述のWordPressでほとんど補える。これらのツールはWeb業界では歴史があり、無料ツールにたまにある、突然無くなる、突然使えなくなる、ということがまずないのも安心だ。

もちろんSEOについての「基礎」や「知識」、「経験」や「応用」がなければならないが、SEOの勉強さえ、ネット上で独学で可能だ。

コンピュータ言語や、デザインスキル、WordPress、SEO対策というのは、本来、「知的財産」だ。大切にした方が良いでしょうね♪

SEO対策。


Webデザインは実務数年、職業訓練校講師数年、フリーランス数年、計15年以上のキャリアがありますが、一気にがぁっと書いているので「です・ます調」ではありません。(元々はメモ書きでした。) 事実や経験、調査や検証を基にしていますが、万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ訂正いたします。 写真は主にUnsplashPixabayのフリー素材を利用させていただいております。その他の写真や動画もフリー素材やパブリックドメイン、もしくは自前のものを使用しております。

井川 宜久 / Norihisa Igawa
デザイナー、ディレクター、講師、コーチ / 井川宜久

免責事項について

  • 記事ページ(Memosのページ)は当初は文字通りメモ書きでした。その後、修正や更新をしております。
  • 事実や経験、調査や検証を基にしていますが、万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ早急に対応いたします。
  • 一個人のポートフォリオサイトですので、万一損害・トラブル等が発生した場合でも、一切の責任を負いかねます。