2018.05.31スポンサーリンクどうも、東田ダダーンです。パララックス(視差効果)等同様、サイトに印象を与える動画コンテンツ。メリット、デメリットありますが、当サイトのトップでもフリー素材の動画を使用しています。僕がWEB制作を始めた頃(2012年頃)は、JavaScript等でちょっとした動きを出すぐらいで、動画なんて重いもん実装するもんじゃないと思ってました。実装できるなら実装したいと思うわけです。ブランドとかのイケイケな背景に動画を使ってるような目がチカチカするようなサイトを見ると、チカチカさせてぇーと私は思うわけです。そんなオカダカズチカな僕ですが、当サイトで使ってるフリー動画素材も含め、おススメサイトを紹介していきます。僕もレインメーカー(お金の雨を降らしたい)になりたいな。Vids動画圧縮サービス「VideoSmaller」まとめ・あとがきMixkit無料で商用利用もOK、画質やクオリティも良いです。それだけでも、神様なのですが、だいたい無料の動画素材だと風景とかが多いのに対し、Mixkitは人が出てる素材が多いのが特徴的で素敵だと思います。毎週、10の動画が新しく追加されていくとのこと。use.mixkit.coMazwai当サイトのトップページで使ってる動画はこちらのサイトより使わせてもらいました。サイトの右上にある一覧表示に切り替えないと、重たくて見れないとき見れないです笑でも、どんな動画素材があるのか、ついつい先を見てしまうサイトです。オシャレな動画が多く、WEBサイトの背景に適してる動画が多いです。商用利用も可能とのことでありがたいです。ダウンロードする際に欲しいところだけ編集も可能なので、無駄をなくしてすぐ素材として使えます。音が入ってる動画もあるので、その際は動画の編集、videoタグを使う際はmutedを忘れないように。急に音楽がかかると昔のサイトを見てるようなチョメチョメ。now.mazwai.comCoverr商用利用OKで、「Coverr」という名前だけあってWEBサイトの背景に適している動画素材が豊富です。どこで使うの?というような、デザイン的に使うのは微妙と思う動画も多いですが、高い場所から撮影した街並み(ミニチュアっぽく見える感じですかね)の素材などオシャレな素材も多いです。使い勝手もよく、こういう動画のサイトなど重たくなりがちだと思いますが、個人的に見やすく待たせれる部分が少ない気がします。ストレスフリーで素敵です。Videosこちらも商用利用可能な動画素材サイトです。オシャレな風景など、クオリティも高いと思います。ダウンロードまでもわかりやすく、使いやすくありがたいです。https://videos.pexels.com/videos.pexels.comDistill個人的にサイトの感じが好きですwwこちらも商用利用OKの動画素材サイトです。動画少ないですが、左側のアイコンから探せるのが便利です。Vids風景の動画多く、オシャレかつ黄昏てしまうような動画が多いです。ダウンロードはワンクリックとは行かず、動画プレーヤー経由でのダウンロードです。サイト自体がオシャレなので、動画関係なしに勉強になります。VideoSmaller動画のファイルサイズをオンラインで小さくする、動画をオンラインで圧縮する、画質の劣化なしにMP4動画サイズを小さくする、動画を縮小する。www.videosmaller.com動画を使う用途によると思いますが、WEBサイトで使うとなると、やはりサイズを小さくしないといけないですよねぇ。素材をダウンロードすると、そのままだと100MBぐらいしたりします。理想は5MBぐらいにはしたいですよねぇ!でも、いちいちソフトをダウンロードしたりするのめんどくさい!と言うときに便利なWEBサイト上からサイズを軽くしてくれる「VideoSmaller」を使えば簡単にできます。5MBはけっこう荒くなるかもしれませんが、それに近いぐらいサイズを軽くできます。(設定にもよりますが)まとめ・あとがき上記、紹介したサイトについて、個人的な感想で紹介してます。自分で動画を用意するとなると、撮影も大変ですが、編集も必要になる事が多いと思います。そんな動画素材をフリーで用意してくれるというのは、本当にありがたいです。素材シェアするTwitterFacebookはてブPocketLINEPinterest東田ダダーンをフォローするこのブログを購読する当ブログから更新通知を受けてもいいという方はリンクより更新通知の許可をしてください。東田ダダーンが更新された際、更新した旨、通知されます。Tipsインデックスカバレッジって何よ?サイトマップxmlのエラーどうも、東田ダダーンです。カバレッジ」の問題が新たに検出されました』とのこと。数年前からよく目にするようになった、WEBサイトからの通知、いわゆるプッシュ通知。当ブログでもプッシュ通知ができるサービス・プラグイン「Push7」を使ってみました。Tips令和にも残そう、懐かしい90年代WEBデザイン。令和、平成も残りわずかですね。そんな新しい時代に突入する昨今(元号、関係あるのは日本だけやけど)、あえて懐かしいデザインで作成されたサイトを集めてみました。Insights」で計測した結果をもとに、ページ速度を上げるためにやった事をまとめました。コメントをキャンセルメールアドレスが公開されることはありません。*サイト上に表示された文字を入力してください。miniで照明の色を、声を使って操作する方法2019.12.142019年を振り返る【アクセス数が増えたとか、個人的アレコレ】2019.12.012020.01.14PROFILEアラサー、産まれたばかりの娘、フロントエンドな東田ダダーンです。東田の中のヒガシダを目指し、玩具のレビューやWEB技術記事、子育てブログを更新しています。雑記、雑記、雑記ブログでございます。RANKINGページ遷移時にアニメーションを入れる方法【ライブラリなし】2019.07.252019.12.06CSSの疑似要素before、afterを使って三角形等の装飾する2018.09.042019.09.06PWAをワードプレスで実装してみて感じた事。先っちょだけでも、フォローお願いします。miniで照明の色を、声を使って操作する方法2019.12.142019年を振り返る【アクセス数が増えたとか、個人的アレコレ】2019.12.012020.01.14PROFILEアラサー、産まれたばかりの娘、フロントエンドな東田ダダーンです。東田の中のヒガシダを目指し、玩具のレビューやWEB技術記事、子育てブログを更新しています。雑記、雑記、雑記ブログでございます。RANKINGページ遷移時にアニメーションを入れる方法【ライブラリなし】2019.07.252019.12.06CSSの疑似要素before、afterを使って三角形等の装飾する2018.09.042019.09.06PWAをワードプレスで実装してみて感じた事。先っちょだけでも、フォローお願いします。タイトルとURLをコピーしました。