UXとはUser Interfaceの略称で体験という意味となります。

UXはユーザーが商品やサービスを通じて得られる体験のことを言います。

今回ですとWebサイトなどのサービスを楽しむことだけでなく、他サイトと比べて使いやすいなどの品質に関わることもUXに含まれます。

UIとはUser Interfaceの略称となります。

UserはWebサイト・サービスやアプリケーション・ソフトウェアなどの利用者のことを言います。


Interfaceは境界面という意味で、２つの異なるシステムやプログラムを結びつける備品やプログラムなどを言います。

SPAを使用したWebアプリやWebサイトは、操作箇所以外は読み込みがされません。

例えるとWebサイトの一部を操作した場合は、SPAで実装していないWebサイトなら一部を更新した際にページ全てが再度読み込みが行われます。

ですが、SPAで実装しているWebサイトであれば操作した箇所以外は更新されないため、更新速度がSPAで実装していないサイトよりも圧倒的に早くなります。

上記の様にユーザーがストレスフリーな動作をすることがSPAの利点です。

SPAで実装できる操作はネイティブアプリの代用として使用できます。

携帯端末だとプッシュ通知やホーム画面からのアプリ起動などの、スマホアプリ特有の機能も実装可能となっています。


ネイティブアプリをリリースするためには、ストアの審査を通さなければなりません。

そのため、非常に手間がかかるのでSPAで実装したWebアプリをネイティブアプリの代用として使用します。

Webページの運用において、動作性の向上は非常に重要になります。

表示速度が遅くなることにより、検索エンジンからの評価が落ちたり、ページの表示速度が１秒でも遅くなることで※コンバージョンが低下するというデータもあります。

そのため、WebサイトなどをSPAで実装することにより、動作速度を大幅に速くすることができます。

従来のWebサイトなどだとローディング画面やページ遷移はブラウザにより制御されていました。

そのため、ブラウザに依存している部分に関しては独自性を持たせることができませんでした。


SPAはユーザーの操作箇所に対して読み込みを行います。

そのため、ブラウザの動作に縛られることがなく、幅広いUIの設計をすることができます。

ですので、SPAを実装することによりページ遷移やローディングなどの、ブラウザに依存していた部分に関しても独自の開発をすることができるようになりました。

最近だとReactやVueなどのJavaScriptのフレームワークが豊富にあるので、比較的に初めて学習する人でも表現が簡単になっています。


このようにWebサイトにおいて、上記のメリットは全てユーザーの体験に関するものとなっています。

今後のWeb開発はSPAでの開発が主になっていくのかなと思います。

SPAはクロスサイトスクリプティング攻撃を受けやすく、※XSSを使用した場合はハッカーがスクリプトをウェブアプリに導入させることが容易になります。

また、SPAはユーザーに対して機密データを公開する可能性が高くなります。

SPAはWebブラウザから多くのリソースを必要としています。

SPAで開発をするためには、ユーザーは最新機能をサポートする最新のブラウザを使用する必要があります。

また、SPAのほとんどのタスクに関してはブラウザがタスクの実行をしています。

※SEOでの評価に関しては、Webサイトのページ数が多いほど順位付けの際にプラスに働きます。

SPAでは１つのページのみしか読み込まないため、検索での順位付けの際にマイナスになってしまいます。


※について以下にまとめます。

SEOとはSerch Engine Optimizationの略称であり、検索エンジンの最適化という意味になります。

検索ユーザーが求める有益なコンテンツを提供し、検索エンジン似た悪しくページ内容を評価されるように技術的にWebページを最適化することを指します。

具体的に言うと、検索した際に有益なサイトごとに表示することを言います。

XSSとはCross Site Scriptingの略称となっており、今回の様にXSSと表示されることがあります。

XSSとは、Webサイトの脆弱性を利用して、マークアップ言語であるHTMLに悪質なスクリプトを埋め込む攻撃となります。

具体的な例をいうと、ブログ、掲示板、サイト内検索などユーザーからの入力内容を元にWebページを生成するサイトなどは、クロスサイトスクリプティングの対象になりやすいです。

上記のサイト内などで入力フォームにユーザーが情報を入力・送信する際に、埋められていた悪質なHTMLスクリプトが実行され攻撃されます。