表示速度の向上を主題に色々変更

表示速度の向上を主題に色々変更

Start-Point.netをUXの向上を目的にリニューアル

#89 リニューアル

日記

ユーザーエクスペリエンスって響きがかっこいいですよね。JOJOのスタンドの如く。 そいつを向上させるべく、サイトを表(フロントエンド)と裏側(サーバーサイド)の両面からリニューアルしました。 前よりも表示速度がUPしました。ほかにも色々。

公開日:
最終更新日:

商品リンクにアフィリエイト広告を利用しています

サイトマップサイトマップ

サイト全体のリニューアル 2019年11月1日

Start-Point.netのサイトをリニューアルしました。

UXの向上を目的としたリニューアルです。
UXというかサイトの表示速度のUPをしたくて、サイト構造の裏側をガラッと変更しました。

自作のPHPとMySQLで作っているサイトなんですが、PHPをほぼ0から作りなおし、JQueryを極力使わず、ネイティブなJSに書き直し。(めんどくさいところはJqueryのままなんだけど。)

デザインもちょこちょこ修正して、とりあえずまとまりました。

表示速度高速化の結果

ローカル環境と、googleの計測系のタグを入れない状態で、Audits(ChoromeのF12押して → 一番右にある速度とかを計測できるやつ)で100点取れるようにしました。
アナリティクスとか入れるとスコア落ちるんだけど。これはしょうがないでよいのだろうか。

誰もが思っているであろう、Googleのせいで遅くなるのにGoogleは速度を重視するという矛盾。

体感でもかなり早くなったのでよしとします。

PHPの書き直しと、MYSQLの最適化と、Jqueryの排除と、画像のlazy処理(遅延読み込み)の追加などを行いました。
他サイトのものすごい早いところはもっと早いんだけど、CDNやサーバースペックなどもあろうかと思うので一旦、区切りをつけました。

ちなみにAMP対応はやってません。機会があればやろうと思いますが、しばらくやらないと思います。

そのほか変更点

OGP画像を全ページに追加しました。なかなか大変だった。
SNS全盛期にOGP画像がないのもちょっとあれですしね。

合わせてTwitterカードも大きく変更。

日本地図を書き直したり

このサイトの人気コンテンツの日本地図シリーズの日本地図の形がおかしいと前からちょくちょく言われていたのでこれを機に修正しました。

クイズコンテンツの表示方法を変更したり、もっとわかりやすくしたり。
ことわざクイズにフリガナ振ったり、結構時間かかりましたよ。

ちょこちょこリライトしたりもしてます。

やりたいことを1つずつかたずけていきます

今後、このサイトをもっと価値あるものにしていきたいと思っております。
What if の脱Flash化をまずはやっていきたいと考えてます。ずーっと前から考えてはいるんですが。

googleもFlashコンテンツ無視すると言ってますしね。

なにか間違いや表示がおかしいなどありましたら、問合せフォームかツイッターなどでご指摘いただければなるはやで対応します。よろしくお願いいたします。

リニューアルの関連ページ

東京タワー夜桜撮影

東京タワーのオレンジと桜のピンク。夜空をバックに夜桜撮影

東京タワーと夜桜をPentax Q7で撮影。お花見スポット「芝公園」より「増上寺」よりも豆腐屋の前からの景色が最高でした。

デッサンのススメ

気分転換にデッサンをすると集中力があがる

WEBデザイナーとして、デザインの基礎を学んだほうがいいんじゃないかという負い目はあるんですよね。 すぐには変わらないけど。

20170103

2017年の連休が終わる1日前に思うこと

2017年1月3日。今年の連休はもう終わってしまう。そんなもの悲しい夜に思ったことをだらだらと書いてみました。

心の会計

心の会計 自作マンガ 私の目から見た日常

会社で仕事しているときに思いがけずの差し入れなんかをもらうと嬉しいですよね。その嬉しかった時の話をマンガにしました。

邦楽インストバンド

ぜひ聞いてほしい邦楽インストバンド5選

歌のないミュージックを奏でるアツいインストバンドを5組紹介します。 Youtube付きだから音も聞けますのでぜひ聞いてほしい

胸の形

第4話 胸の書き方について 私の目から見た日常

女性の絵を書いていたら、胸の形とその先にある風景を書かねばならんわけですが、正直良くわからないんですよね。

Amazonプライム動画をみて通勤する楽しみ

通勤時間を楽しく過ごすナショナルジオグラフィックとアマゾンプライム

長距離通勤のデメリットである通勤に時間がかかるということを逆に有意義に過ごすことで人生を豊かにする方法の提案です。

TVを見なくなった話

TVを見なくなった話 私の目から見た日常

子供のころはよくTV見てました。それは娯楽の選択肢が少なくて、刺激の強いものがテレビのバラエティだったのが大きいのかも。

自己肯定感

自己肯定感と自己啓発 私の目から見た日常

自己否定と自己満足の繰り返しで人は成長すると思いますが、そのバランスが崩れると自分のやってきたことが無駄に思えて着たりしますね

F氏の隣人

F氏の隣人 私の目から見た日常

マンションに住んでますが、両隣の住人の方とは交流がなく、名前も顔も家族構成も知りません。わかっているのは1つだけ。

将棋を覚えなおす

将棋を覚えなおして死ぬまでには父親に勝ちたいと思った話

将棋って面白いんですよ。弱ければいろいろと覚えることがあって、戦法を覚えることで強くなっていくことを実感できますし。

制作日記

制作日記 漢字クイズにコンテンツ追加

2017年1月29日までに行った主な更新履歴と今後の目標について。 やりたいことをどんどんやっていきたいと思います。

浅草夜桜

スカイツリーも見える浅草寺の夜桜は朱色の社が良く似合う

浅草にある浅草寺に夜桜を撮りに行きました。よく晴れた空と満開の桜に加えて、朱色に染まる社と満月とスカイツリー。

SNSでこの記事をシェアできます

ブログ デイリーアクセスランキング

ミルクチョコレート
1位

ミルクチョコレート

ミルクチョコレートの割れチョコはどれも外れがないと思います。ベースのチョコレートがおいしいから満足度も高いチョコたちです

リニューアル
2位

リニューアル

前回のリニューアルはスマホ対応がメインだったのですが、今回はUXの向上ということで主に表示速度の改善に努めました。

運動会
3位

運動会

子供の運動会にα7Ⅲで初参戦!望遠レンズを買おうか迷ったのですが、本体とセットのズームレンズ1本で運動会を撮影してきました。

SDカード
4位

SDカード

SDカードのせいかイマイチ不明なのですが、撮影した写真データが破損するという事象が発生しまして、新しくソニーの純正SDカードを購入しました。

SEL24F14GM作例
5位

SEL24F14GM作例

2019年に買った商品で一番満足度の高かった商品がSONYの広角レンズSEL24F14GMでした。

WI-1000X 30日後レビュー
6位

WI-1000X 30日後レビュー

ソニーのブルートゥースイヤホンWI-1000Xを購入し約1ヵ月使ったレビューです。スペック紹介や使用感オススメ音楽紹介など。

東京タワー夜桜撮影
7位

東京タワー夜桜撮影

東京タワーと夜桜をPentax Q7で撮影。お花見スポット「芝公園」より「増上寺」よりも豆腐屋の前からの景色が最高でした。

お江戸深川さくらまつり
8位

お江戸深川さくらまつり

2019年3月27日に東京の門前仲町駅近くで夜桜撮影をしてきました。お江戸深川桜まつりと銘打って、街をあげて夜桜をライトアップしてくれています。

価格設定のテスト
9位

価格設定のテスト

安物買いの銭失い、なんて言葉がございますが、私はありえないくらい安い商品を見つけてしまうとすぐに買ってしまう愚かな消費者です

淹れたてコーヒー
10位

淹れたてコーヒー

買ってきたコーヒー豆をキャニスターに移す瞬間の香りが好きです。 なんとも言えない香ばしいいい香りが。

カテゴリ一覧

オススメ商品レビュー

オススメ商品レビュー

世の中にある比較サイトや、いかがでしたか系サイトが嫌いなんです。使ってないのにえらそうなこと言うなと。なので体験談です。

WEB制作

WEB制作

WEBサイトを作れますと一言に言っても色々な技術があるわけですよ。アウトプットの形は一緒でもいろいろこだわりがあるんです。

カメラ

カメラ

2018年4月に購入したソニーのミラーレス一眼「α7Ⅲ」に関連する記事一覧ページです。 作例集やカメラグッズレビューなど。

美味しいもの

美味しいもの

食に関してはあまりこだわりがないんですけどね、こだわりがない分美味しいと思ったものは本当においしいと思ったものなんですよ

Amazonプライム動画

Amazonプライム動画

Amazonプライム会員なら無料で利用できるAmazonプライム動画から、いろいろな動画をみたレビュー記事のまとめページ

旅LOG

旅LOG

家族旅行やおでかけした際の旅ブログです。夏休みの家族旅行(4人家族)で訪れた観光名所の感想などを記しています。

プロフィール

プロフィール

Start-Point.netの管理人のプロフィール紹介を兼ねた、自分の中のルールや決め事やエピソードなでお書いていきます

日記

日記

日記と言っても色々な日記があるわけで、記録的な日記や心理描写を色濃く描いた日記などをまとめたページです。

thanks

thanks

自分を表現することって意外と難しいんですよね。照れがあったり、間違ったこといってないかとよくわからない何かと戦ったりして。