HTML5でアニメーションやりたい。 [プログラミング]
Flashがほぼ使用禁止になって、HTML5に移行すると言われてから久しい。まぁFlashがほぼ生き絶えた訳だが、きっちり代替物とはなっていないような気がするHTML5。確かに同じようなことはできるんだろうけど、そもそもFlashのようなキラーアプリが出てきたとは言えないだろう。何にしろ同じことをしようとするとしんどい。基本GUIでの操作じゃなくてコーディングってのが一番問題だろう。
HTML5で扱えるようになった表現は増えたんだろうけど、Flashのようにお手軽に扱う規格がなくなってしまっている現状は変わってないですよね。ただ単にムービーを表示したいだけとかなら、埋め込むのはそんなに難しい話ではないんだろうね。だけど、ちょっと気の利いたことをしようとすると、Flashほど楽にはできなくなっているんじゃないだろうか。
Flashは回線が細い時でも面白いものを提供できた。でも、今はなんでもYoutubeに上げるとかしないといけなくなってしまった。スマホから動画を上げられるとか、お手軽にできるようなことも増えたんだけども、草の根でやられていたことも減ってしまった気はする。何かみんなで作ったものをお互い楽しむ、ということが根こそぎやられてしまった感はある。
今、新年早々エラーでブログに書いたものが飛んでしまった。前はFirefoxのバックボタンで書いていたものが復活できていたのだけれど、バックさせるとログインをさせるページが出てきて、書いてあったものが消える仕様になってしまっていた。So-netブログからSSブログと名前が変わって、ブログを切り離した時からログインの方法が変わってしまい、指摘したんだけど始めは変わっていませんよとか言い出す始末で、相変わらずのSo-netサポートだなと思ったりもした。
なんか書く気なくすんだよね、向こう側のエラーで消えると。というか、保存の時点でエラーとかあり得ないでしょw。エラーが出てても保存できている時もあったりするしね。本当に意味がわからない。早く元のSo-netブログに戻って欲しい。
色々書いて思い出すのも面倒なのだけれど、草の根でやっているってことの大事さみたいなことを書いていたと思う。それ自体、HTML5から脱線していたから書き直すことはしないんだけども、なんか書いていたことが消えるのってどっと疲れが出るよね。元々大してことは書いていないんだけど、それだけにリカバリをしないという徒労感というか。
HTML5はHTMLと言っておきながら、JavaScriptの存在感がありすぎる気はしますね。それとアニメーションに関してはCSS3がわりと大きな役目をしているようですね。それがかなりFlashのようにお気楽にアニメーションを許していないように思えます。ただFlashもGUIでできる部分と、スクリプトで書かないといけない部分があったので、そう考えれば切り分けはいくらかあっても仕方ないとは思うのだけれど。
あまり詳しくは調べてないのでなんとも言えないんだけど、基本動作がCSSであってJavaScriptで操作するみたいなところもあるみたい。ただ、そこまでの連携をやっているところはあんまり見かけられなくて、どっちかっていうものがほとんどみたいな気がします。具体的に何がやりたいのかってのがないと、作るサンプルも作りにくいってのもあるのかな。
そもそもCSSがそこまで重く見られていなかったというのもあるんじゃないかと。そもそもCSSの存在意義は表示方法をHTMLから引っぺがす事にあったから、アニメーションを付けるという目的自体が元々CSS自体にはなかったんじゃないか。CSSの歴史は知らないけど、文字や絵の表現方法として発展してきて、アニメーションも表現の一つだからCSSに入れちゃえという方向性になったのではないかと邪推しています。
ただ、HTMLからもJavaScriptからも違うファイルでアニメーションの設定をされてもなぁ、ということもあると思います。やっぱりファイルが違うのは面倒というのもあるし、ブログでやろうとすると埋め込みの技術も他に使わなくてはならない場合もある。そもそもCSSファイルを作るのが面倒くせーという人も多いかと思います。特にプログラミングなんかでやっていると、デザインなんてやっている暇あるかよという状態になるのが普通でしょう。
HTML5でアニメーションをやりたい、ってのは割と前から考えてはいました。というかFlash代替の製品がHTML5で出てくると思っていました。だけど、決定的な製品やライブラリが出てきた訳じゃありません。だからこそ、自前でどこまでできるのか試してみたいというのもあります。できればGUIで作るFlashもどきを作ってみたい気はしていました。ただ面倒なんだよねw。
とりあえずCSSでどこまでできるのか、JavaScriptでやらないといけない部分はどこからなのか、ということは押さえておかないといけないとは思っています。前も言ったのかもしれないですが、やりたいという気持ちはあるのです。でも皆がやれていない理由がやっぱりあって、それは自分が必要なことができてしまったら、そこで終わってしまうという状態にあるからなんだろうな、と思います。特にGoogleで単発の知識が得られやすいようになって、その傾向は強くなったんでしょう。
まずはCSSがどこまでできるのかが知っておきたい。
https://www.webdesignleaves.com/pr/css/css_basic_07.html
わりと網羅されている感があるページ。どんなことができるのか、そのソースがどうなのかがわかるのはいいと思う。やれることを見せられるだけとか、ソースだけのサイトとかほんと勉強にならないんだよなぁ。
こことかみたいに動画GIFとか貼ってもらっても、動くという説得力がないというか。
https://qiita.com/soarflat/items/4a302e0cafa21477707f
やっぱコーディングして実際に動く実感というのを得られないってのはあまり良くない。それは自分のローカルでやってくれというのだろうけど、やっぱWebの技術はホームページ上でやるってのが筋でしょう。まぁQiitaみたいなサイトだとファイルを上げたり埋め込んだりすることが難しいから仕方ないんだろうけど、そういうのはブログやCMS全体に言えることだしねぇ。
上のサイトのリンク先だけど、こういうのは見ていて面白い。
https://projects.lukehaas.me/css-loaders/
CSSでここまでできるんだと感心してしまう。
意味はなくても、面白いものからやっていくのも手かなぁ。
https://q-az.net/javascript-word-jamping/
文字もぴょんぴょんできるんだねぇ。なんかJavaアプレットの頃を思い出したよ。JavaアプレットもFlashもブラウザの枠内でしかやれなかったけど、HTML5はそうではないんだよね。その点では制限が取れてはいるんだけど、逆にその自由が面倒さに拍車をかけていて、選べることは必ずしも幸せに繋がらないんだよね。それは人間の営み全体で言えることなんだろうけど。
HTML5で扱えるようになった表現は増えたんだろうけど、Flashのようにお手軽に扱う規格がなくなってしまっている現状は変わってないですよね。ただ単にムービーを表示したいだけとかなら、埋め込むのはそんなに難しい話ではないんだろうね。だけど、ちょっと気の利いたことをしようとすると、Flashほど楽にはできなくなっているんじゃないだろうか。
Flashは回線が細い時でも面白いものを提供できた。でも、今はなんでもYoutubeに上げるとかしないといけなくなってしまった。スマホから動画を上げられるとか、お手軽にできるようなことも増えたんだけども、草の根でやられていたことも減ってしまった気はする。何かみんなで作ったものをお互い楽しむ、ということが根こそぎやられてしまった感はある。
今、新年早々エラーでブログに書いたものが飛んでしまった。前はFirefoxのバックボタンで書いていたものが復活できていたのだけれど、バックさせるとログインをさせるページが出てきて、書いてあったものが消える仕様になってしまっていた。So-netブログからSSブログと名前が変わって、ブログを切り離した時からログインの方法が変わってしまい、指摘したんだけど始めは変わっていませんよとか言い出す始末で、相変わらずのSo-netサポートだなと思ったりもした。
なんか書く気なくすんだよね、向こう側のエラーで消えると。というか、保存の時点でエラーとかあり得ないでしょw。エラーが出てても保存できている時もあったりするしね。本当に意味がわからない。早く元のSo-netブログに戻って欲しい。
色々書いて思い出すのも面倒なのだけれど、草の根でやっているってことの大事さみたいなことを書いていたと思う。それ自体、HTML5から脱線していたから書き直すことはしないんだけども、なんか書いていたことが消えるのってどっと疲れが出るよね。元々大してことは書いていないんだけど、それだけにリカバリをしないという徒労感というか。
HTML5はHTMLと言っておきながら、JavaScriptの存在感がありすぎる気はしますね。それとアニメーションに関してはCSS3がわりと大きな役目をしているようですね。それがかなりFlashのようにお気楽にアニメーションを許していないように思えます。ただFlashもGUIでできる部分と、スクリプトで書かないといけない部分があったので、そう考えれば切り分けはいくらかあっても仕方ないとは思うのだけれど。
あまり詳しくは調べてないのでなんとも言えないんだけど、基本動作がCSSであってJavaScriptで操作するみたいなところもあるみたい。ただ、そこまでの連携をやっているところはあんまり見かけられなくて、どっちかっていうものがほとんどみたいな気がします。具体的に何がやりたいのかってのがないと、作るサンプルも作りにくいってのもあるのかな。
そもそもCSSがそこまで重く見られていなかったというのもあるんじゃないかと。そもそもCSSの存在意義は表示方法をHTMLから引っぺがす事にあったから、アニメーションを付けるという目的自体が元々CSS自体にはなかったんじゃないか。CSSの歴史は知らないけど、文字や絵の表現方法として発展してきて、アニメーションも表現の一つだからCSSに入れちゃえという方向性になったのではないかと邪推しています。
ただ、HTMLからもJavaScriptからも違うファイルでアニメーションの設定をされてもなぁ、ということもあると思います。やっぱりファイルが違うのは面倒というのもあるし、ブログでやろうとすると埋め込みの技術も他に使わなくてはならない場合もある。そもそもCSSファイルを作るのが面倒くせーという人も多いかと思います。特にプログラミングなんかでやっていると、デザインなんてやっている暇あるかよという状態になるのが普通でしょう。
HTML5でアニメーションをやりたい、ってのは割と前から考えてはいました。というかFlash代替の製品がHTML5で出てくると思っていました。だけど、決定的な製品やライブラリが出てきた訳じゃありません。だからこそ、自前でどこまでできるのか試してみたいというのもあります。できればGUIで作るFlashもどきを作ってみたい気はしていました。ただ面倒なんだよねw。
とりあえずCSSでどこまでできるのか、JavaScriptでやらないといけない部分はどこからなのか、ということは押さえておかないといけないとは思っています。前も言ったのかもしれないですが、やりたいという気持ちはあるのです。でも皆がやれていない理由がやっぱりあって、それは自分が必要なことができてしまったら、そこで終わってしまうという状態にあるからなんだろうな、と思います。特にGoogleで単発の知識が得られやすいようになって、その傾向は強くなったんでしょう。
まずはCSSがどこまでできるのかが知っておきたい。
https://www.webdesignleaves.com/pr/css/css_basic_07.html
わりと網羅されている感があるページ。どんなことができるのか、そのソースがどうなのかがわかるのはいいと思う。やれることを見せられるだけとか、ソースだけのサイトとかほんと勉強にならないんだよなぁ。
こことかみたいに動画GIFとか貼ってもらっても、動くという説得力がないというか。
https://qiita.com/soarflat/items/4a302e0cafa21477707f
やっぱコーディングして実際に動く実感というのを得られないってのはあまり良くない。それは自分のローカルでやってくれというのだろうけど、やっぱWebの技術はホームページ上でやるってのが筋でしょう。まぁQiitaみたいなサイトだとファイルを上げたり埋め込んだりすることが難しいから仕方ないんだろうけど、そういうのはブログやCMS全体に言えることだしねぇ。
上のサイトのリンク先だけど、こういうのは見ていて面白い。
https://projects.lukehaas.me/css-loaders/
CSSでここまでできるんだと感心してしまう。
意味はなくても、面白いものからやっていくのも手かなぁ。
https://q-az.net/javascript-word-jamping/
文字もぴょんぴょんできるんだねぇ。なんかJavaアプレットの頃を思い出したよ。JavaアプレットもFlashもブラウザの枠内でしかやれなかったけど、HTML5はそうではないんだよね。その点では制限が取れてはいるんだけど、逆にその自由が面倒さに拍車をかけていて、選べることは必ずしも幸せに繋がらないんだよね。それは人間の営み全体で言えることなんだろうけど。
タグ:HTML5
Twitterまとめ投稿 2020/01/12 [Twitter]
carbonhydratこういう表示設定にしてリプ飛ばしている人がたまにいるんだけど、どういうつもりなんだろう。リプするくらいなら隠す必要もないのに。そんなに酷いこと書く奴だとも思えないんだが、無駄な秘匿性高過ぎw https://t.co/2hI3tWLXMl01/11 07:59 carbonhydratRT @osaka_seventeen: 宮崎駿がどれだけえげつないかは、たとえば「天井の梁がまっすぐに描かれていない」というところにも現れている。あれは「現実に忠実」なのではなく「人間の視覚として脳に結ばれている像に忠実」なのだ。どこか懐かしく安心する景色を描くアニメーターと…01/11 09:37 carbonhydratRT @a2see: Slack(ビジネスチャット)がメールみたいに無意味なマナーで汚染されてしまわないように、先手を打って置いた方がいいのかなと思っています。 例えば、最近新規でやり取り始めたお客様はSlack初とのことだったので、こんな風に「これは敬意と信頼を前提とした簡…01/11 09:39 carbonhydratRT @mitanin_bot: 「サザエ(政子)とカツオ(義時)が手を組んで、マスオ(頼朝)の死後に、波平(初代執権・時政)を磯野家から追い出す。しかも義時はタラちゃん(源実朝)を滅ぼしてしまう。フグ田(源)家が滅亡して、磯野(北条)家の鎌倉時代ができるというすごいドラマ」な…01/11 09:45 carbonhydratRT @kanenooto7248: 子供を凄まじいレベルのオタクに育てたいならば「アニメゲームマンガを禁止する」ことに尽きる。これをやられた子供は俺の知る限りほぼ100%で凄まじいレベルのオタクになった。01/11 17:35 carbonhydrat@miraihack ちょっと前だと氷のブロックを入れる冷蔵庫はあったみたいです。ガス式の(燃やす)冷蔵庫もあったようですよ。私も実物は見たことがなく、映画とかアニメ知識ですが…01/11 17:38 carbonhydrat確かに見栄えは良くなるんだけど、漫画の本質的な面白さとはほとんど関係しないという。 https://t.co/M5HLrsjQpN01/11 17:58 carbonhydratチャラい男にヤラれるだけのサークルに入れられる。クソみたいな男らだな。というかそういう言動を集団になると途端にし始めるクズがいるんだよな。ほんと滅びろw https://t.co/H41L9Zx0um01/11 18:05 carbonhydratRT @pentaxxx: またぞろ「ゲーム脳」の亡霊が復活しそうな勢いだな。 こういう雑な依存症対策には徹底抗戦しかない。あと自民党香川県政会の大山一郎議員は、いうまでもなくIR推進にも反対なんだろうな。そうじゃなきゃダブスタだ。https://t.co/RTdNUHPxis01/11 18:23 carbonhydratRT @rei10830349: 陰キャに対して「いつまで毒親/イジメ/スクールカーストを引き摺ってるんだよwもう拘るな」みたいな言説が時々流れてくるけど、イギリスの7〜11歳の間に虐められた7771人のコホート研究によれば、50歳の時点でも元イジメられっ子は心身の健康や社会性…01/11 18:26 carbonhydratRT @gre_goriy: 香川県が「ゲームは一日1時間まで!」って規制法案だしたそうだがそれに対して思う事は 「 労 働 は 一 日 8 時 間 ま で を 徹 底 さ せ て か ら や れ 」 ということでしかない。 労働とかには残業だとかの時間外ルール認めておいて…01/11 18:28 carbonhydratRT @IkedaKiyohiko: 特攻隊は犬死です と書いたらリプライがたくさん来てびっくりしています。勘違いしている人が多いようですが、犬死とは決して侮蔑の言葉ではありませんよ。何の役にも立たずに無駄に死ぬことです。私は特攻隊の遺品が展示してある太刀洗博物館に行ったことが…01/11 18:28 carbonhydratRT @Asuka_SGP: 日本の訳のわからない税金と詐欺のような年金もSingaporeには無いのです。 それと私が今、貯金してる銀行では金利が2.5%あります。 日本国民は国にダマされて貧乏になりました。全ては日本国民の無関心と無知が作った狂った社会だと強く思います。そ…01/11 18:31 carbonhydratRT @Dgoutokuji: 菅官房長官がついに、渋々、ようやく「桜名簿扱いは違法だった」と認めた。廃棄を記録に残さなかったのは「担当者の問題に対しての意識が少なかった」とし、「詳細は内閣府に」の一点張りで、また官僚のノラリクラリが始まるのだ。「違法」としてまで名簿を出したく…01/11 20:06 carbonhydratTwitterのGIFってどうやって取るのやろか。デベロッパーツールで見てみてもGIFそのものがなさそうなんだよね。他の形式のものに変換しているのかな。01/11 20:47
2020-01-12 05:01
コメント(0)