技術的な視点から千葉のホームページ制作会社を見比べてみてわかったWEB業界の未来

2010年代前半に栄華を誇った「jQuery」
あると便利だけど、その分スパゲティのようなソースコードになりやすくメンテナンス性に乏しいのも特徴です。
多くのプラグインがあるのも特徴で、その数は相当なものとなります。

ですが、現在では多くのフレームワークをはじめとした技術進歩があった都合で、
jQueryはモダンなweb開発には不要とまで言われています。
その理由については以下となります。

動作が遅い

jQueryの特徴として、ソースコードを記述する際に「$関数」をかませる必要があることです。
そのため、バニラと比べて不要な処理が発生するので動作が重くなる傾向にあります。

ライブラリが重い

jQueryライブラリは軽量ではありません。
1系のバージョンだと90KB以上あり、旧ブラウザの対応を廃したSlim版でも70KB近くあるため読み込みにも時間がかかります。

前述したメンテナンス性の悪さも含め、デメリットは以上になります。
肝心のメリットに関しては「学習コストの少なさ」が特徴で、jQueryを使用した記述はできるけど、バニラでのjavascriptが書けないといった人をこれまでにかなり見てきました。
その他のメリットに関しては、昨今のフロントエンドの技術進歩もあり、jQuery単体でのメリットは殆どありません。またプラグインに関しても、多くの代用が効きます。

ということで、
jQueryを使用していない千葉の制作会社は5社中 0社でした

当社の場合、後のメンテナンス性を考慮してjQueryを廃止し、Vue.jsのフレームワークとバニラでの記述。
webpackによるバンドルとbabelを使用した旧ブラウザへの対応を行なっております。
結果的にページ速度のスコアは高くなり、ユーザービリティ向上につながりました。

もはや、業界標準とも言える「sass」「less」「scss」などのメタ言語が流行して大分経ちました。
cssでのスタイルシートの作成は効率が悪く、メンテナンス性にも乏しいのが現状です。

また、sassなどのメタ言語の場合、変数や四則演算など簡単な計算など行えるため、複雑な処理やアニメーションなど簡易的に行えるようになっています。学習コストは低いですが、トランスコンパイルという処理が中間に入るため、フロントエンド周りの技術が必須となります。

さて、千葉の制作会社でどの程度使用されているか見ていきましょう。
これに関しては、判定条件が憶測となりますので「圧縮化の有無」や「sourcemap」の有無で確認していこうと思います。

ということで、
メタ言語を使用している千葉の制作会社は5社中 1社でした

ちなみに当社の場合、scssを使用しています。
案件規模によりトランスコンパイルのツールは異なりますが、主にgulpをはじめとしたnode.jsのパッケージやwebpackを用いております。
ファイルの圧縮や旧ブラウザへの対応など、トランスコンパイルの設定によって簡単に行えます。

ページ速度は今やSEOの評価基準だったり、ユーザービリティに影響され、WEBでの集客に欠かせないものです。著しくページ速度が遅いと直帰率が増え、集客につながらずユーザーへの不満を発生させる要因ともなるため、この項目ができていないと「ユーザーに不親切な作り」ということにもなります。

今回はGoogleの提供する「pagespeed insights」を用いて、ページスコアを計測しようと思います。
評価基準はPCは90スコア、モバイルは80スコアを基準としてそれ以下の場合、基準値以下として記載します。

ということで、
ページ速度がPCは90スコア、モバイルは80スコアをクリアしている制作会社は5社中 0社でした

ちなみにモバイルが10スコア台という制作会社が5社中3社あり、
ページ速度が非常に心許ない結果となっています。

当社は以前計測した際にPCは99スコア、モバイルは84スコアとなっておりました。
ページ速度改善方法は、下記の記事をご覧ください。
速さが足りない!! ホームページの速度を上げて閲覧を快適にするWordPress構築方法

alt属性は画像の代替テキストとして、画像読み込み前の表示されたり、
ページの音声読み上げなどユーザービリティは勿論ですが、SEO的な視点からも重要な項目のひとつとなっています。ホームページ制作においては、基本の中の基本というくらい重要な知識で、記載されていて当たり前というレベルです。

ということで、
altタグが適切に入っている制作会社は5社中 1社でした

正直、この結果は非常に残念です。
千葉県内の多くの制作会社が、alt属性を軽視しているという結果です。

僕は学生時代にWEB制作の教師から、「alt属性だけは必ず入れろ」と口煩く言われていました。
学校課題でも「alt属性がないと減点」となり、非常に重要な項目であると認知しています。
プロの環境でこのような状況ですので、千葉のWEB制作の未来は明るくないという面持ちになりました。

いかがだったでしょうか。
今回、様々な千葉の制作会社のコーポレートサイトを調査してみた結果

jQueryやsassなどのメタ言語の使用有無は、案件により異なるため一概に良い悪いの判断は出来ませんが、
ページスピードや、alt属性などクリティカルな部分があまり出来ていないことが、少々残念な結果となりました。

モバイルで10スコアの結果だったり、alt属性も適当に記載されていなかったりと、
ユーザビリティを蔑ろにしている企業が多かったのは事実であり、千葉のWEB業界全体がそのような風潮であることも事実に近しいと感じています。その中で私たちWebkidはかなりのコストを承知でページ速度を調整したり、なるべくaltタグの見落としがないよう努力しています。

今回の記事を通して、ユーザーに見てもらうための工夫や使いやすさをきちんと提供するという前提がなされていないのに対して、「集客に強い」「成果が出る」などの謳い文句を安易に使ってもいいものなのかと疑問に思ってしまいました。

ホームページを作りたい人の大半はWEBの知識がない人が殆どで、内部のソースコードに興味がありません。
依頼者が確認できないところで手を抜くのは、正直どうなのかなって感じます。

長くなりましたが、業界全体の発展を祈りつつ、今回の記事は終わりといたします。
フロントエンドのたくとでした。