BWW New HP
- HTML / CSS / JavaScript
- BWW
高1~高3の間に所属していたFRCロボコンチームの新ホームページをHTML, CSS, JavaScriptを使用して1から制作しました。 https://bww8231.fuji3.info
技術面
ホスティングサービスには表示速度や維持費の観点から静的サイトであるGitHub Pagesを採用し、HTML, CSS, JavaScriptのみを直接使用して制作しました。
ページ速度改善のために、画像の遅延読み込みやWebP画像の切り替え処理実装といった対策を行いました。 画像の遅延読み込みには標準実装のObserver APIを使用し、独自実装によって外部との通信量を抑えました。
デザインはプロトタイピングツールのAdobe XDを使用して作成しました。
おまけ
ホームページで使われている2つの動画は自作したものになります。(小学生の時から趣味で動画編集をやってました) DJI Pocket 2で撮影した映像をPowerDirectorとFilmoraで編集しています。
リンク
使用技術
言語 ・・・ HTML, CSS, JavaScript フレームワーク、ライブラリ ・・・ Anime.js, Modernizr ツール ・・・ GitHub Pages, Adobe XD