大学祭)のWEBページを公開しました。告知サイト今年は私達が中心となって芸工祭を作り上げる年です。WEB部署では芸工祭告知用サイト(http://geikousai-ncu.com)と適部署チャート(http://geikousai-ncu.com/chart)を制作・公開しました。・下級生への部署配属のサポートができるようなサイトにしよう、と制作を始めました。コンテンツが少ないので見やすさ?というよりも、インパクトを大事にして、今年の芸工祭をイメージ付けられるように、SVGのアニメーションや背景に動画を流す、など割と今流行りのものを取り入れたデザインにしました。制作中のあれこれ–fullpage.jsそして、とっても使ってみたかったfullpage.jsを導入しました。(パララックスはそんなに今風ではないかもしれませんが.....)現在のページから、スクロールを「上」にしたか「下」にしたかどうかでアニメーション等を加えることができます。多用はしてないですが、もっと動きのある楽しいサイトを作るときにはすごく使えるなーという印象です!やってみたい(^v^)fullpage.jsは、今回のような中身の少ないサイトにはピッタリだったかもしれません。1ページに綺麗に収まってると見やすいような気がします。–Youtubeの埋め込みそれから今回とっても悩みに悩んだYoutubeの埋め込みについて。部署の紹介を今年は動画にすることにしたのですが、それをiframeで埋め込むと本当に重い。1つ埋め込むごとに6つのエラーが発生する。(解消できないらしい..?)これを18個くらい埋め込んでいたので、とてつもなく重く、TOPのアニメーションが全然表示されない......という悩みを持っていた方はたくさんいるようで、色んなサイトさんを参考にさせてもらいました。Youtubeをそのまま埋め込むのではなく、サムネイルを表示しクリックした時点でiframeに埋め込むという処理をしました。おかげでアニメーションがさくさく動きます...ありがとうございます...参考にさせて頂いた記事はこちらです。–z-indexそして効いたり効かなかったりするz-index。(ちゃんとやればちゃんと効きます)CSS再入門さんで詳しく説明してあり、とっても参考にさせてもらいました。level)という概念について全く気にしたことがなかったので非常に参考になりました...おかげさまでz-indexの不具合を解消できました!!–様々なお詫びIEで動画とsvgが、Androidでもsvgが表示されません..と、いうかsvgは対応したつもりができてないので原因解明をしないといけません;;ちなみにModernizrを使ってsvg→pngに変換しているつもりです。理解できてないので要勉強です.....youtubeの再生を止めずにモーダルウィンドウを閉じると、再生が止まらない...これも色々試してみてるのですがどうもうまくいかない!もう少ししたら直ってるはずです!(6/29)色々試してみたら直りました!!1サムネイルをクリックするとiframeが追加される2モーダルウィンドウを閉じるときにiframeがremoveされるというのをもっと簡潔に書いてみたらできた...難しく考えすぎてたみたいでした。北千種キャンパスにて芸工祭です!ぜひぜひお越し下さい。今回制作したWEBページは仮なのでもっと進化すると思います。そちらもお楽しみに〜〜!適部署チャートもぜひやってみてください(^v^)WEB部署のメンバーがつくってくれました!Androidでは見れない模様.....ちなみに私はWEB部署でした。・Webデザイン力を上げる。Webトレースをやってみよう!-手順編-・Webデザイン力を上げる。Sans」を使ってみた。(3)PopularWebデザイン力を上げる。Sans」を使ってみた。17,570ビューイラレで縦横固定の一括リサイズmemo15,357ビューWebデザイン力を上げる。Webトレースをやってみよう!-メリット編-9,544ビューイラレでギザギザをつくる。ついでに角丸もつくる。自分用のメモだったり、学んだことだったりを記事にします。UNITEDのいちメンバーとしても活動中。故郷熊本にちなんだLINEスタンプをつくりました。【ポートフォリオサイトはこちら】PopularWebデザイン力を上げる。Sans」を使ってみた。17,570ビューイラレで縦横固定の一括リサイズmemo15,357ビューWebデザイン力を上げる。Webトレースをやってみよう!-メリット編-9,544ビューイラレでギザギザをつくる。ついでに角丸もつくる。自分用のメモだったり、学んだことだったりを記事にします。UNITEDのいちメンバーとしても活動中。故郷熊本にちなんだLINEスタンプをつくりました。