STUDIOで作られた世界中のWebサイトを、ジャンルやテイスト別に探せるギャラリーサイト「STUDIOShowcase」ができました。次のアイデアの参考にしてみましょう。
APNGでイラストやアイコンを動かそう!~AdobeAnimateの使い方~ 更新日:2024/08/15 イラストや写真を動かして、Webサイトで見られるアニメーションといえばGIFアニメーションですよね。 ですが、近頃GIFアニメーションに代わる新しいAPNGという形式が現れました! 今回はこのAPNGについてと簡単にアニメーションを作成の過程をご紹介したいと思います。 APNGとはAPNGとはアニメーションPNG、エーピングと読みます。 簡単に言うとアニメーションするPNG画像のことです。 実は、APNGは2004年に作成されたので以前から存在しておりましたが、作成から3年後、公式から仕様に含めないとされていたり、Webブラウザで対応しているのがFirefoxだけだったり…と近頃まで日の目を見なかったものでもあります。不憫。 現在はほかのWebブラウザでも対応できるものが増えてきて、
はじめに Webサイトはページの構造を表すHTML、スタイルを表すCSS、動きを表現するJavaScriptによって構築されています。現在Webサイトの多くが、PRや顧客獲得などのマーケティング目的で活用されており、状況に応じて内容を更新していきたいというニーズがあります。 内容の更新のたびにエンジニアに頼んでHTMLの編集をしてもらうのはコミュニケーションコストもかかりますし、貴重なエンジニアリソースの浪費とも言えます。 これを解消するのがCMSであり、エンジニアの手を借りずとも管理画面からWebサイトの内容を誰でも書き換えることのできるシステムです。 盛り上がりを見せるヘッドレスCMS 「ヘッドレスCMS」は新しいタイプのCMSです。従来型のCMSはコンテンツの入稿画面・データベースに加えて表示面がセットになっていますが、それに対してヘッドレスCMSはヘッド(表示面)がなく、APIによ
これまでスマホサイトの対応をしてきた経験がある方ならご存知の、「電話番号っぽい数字の羅列が電話番号として勝手にリンクになってしまう」やつが、Edgeでも起きます。 実はこれ、IE11でもすでにそんな実装になっていたようなのですが・・・今まで作ってきて、そんな現象見たことありませんでした。 電話番号の形式の認識 実際に最近作ったWebページでも、IE11ではリンクにならずにEdgeだけリンクになったりしていました。 でもまあ、今後もこういったことが起きると思いますので、スマホ対応のときと同じように対策しておきましょう。 <meta name="format-detection" content="telephone=no"> HTMLのhead内にこの記述を仕込んでおきます。 これでオッケー☆⌒d(´∀`)ノ Windows10へのアップグレードが(強制的に)進んできて、クライアントでもWi
お使いのブラウザではご覧いただけません お手数ですが、最新の対応ブラウザ(Chrome/Edge/Firefox/Safari)にて再度ご覧ください。
リンクは、WWW(World Wide Web)の基本ですね。他のサイトへのリンクだけでなく、自己サイト内の各ページやデータ間をリンクさせることにより、 Web ページは単なるテキストファイルとは異なる有機的構造を獲得します。 <IMG> タグで呼び出される画像ファイル、<EMBED> タグで呼び出されるプラグイン、<FONT> タグで呼び出されるフォントデータなど、 タグの多くは広義のリンク機能を持っていますが、普通狭義にリンクと言えば、<A> タグと HREF 属性で指定される Web リソースへのリンクを意味します。 普通は <A href="http://www.umechando.com/"> 電脳レストハウス「梅ちゃん堂」</A> のように HREF 属性を指定するだけで十分ですが、 TARGET 属性を加えてリンク先ファイルを表示するウィンドウ(またはフレーム)を指定したい(
Dropbox helps you create, share, and collaborate on your files, folders, and documents. Learn how to download and install Dropbox.
今回は、初回ということで、この講義ではなにを取り扱うのか、ガイダンスを行います。 昨年度までは、この講義ではAdobe Flashを用いたインタラクティブなアニメーション表現を主に取り扱ってきましたが、今年度からは内容を一新したいと思います。 以前までは、Webブラウザ上でインタラクティブな表現を行う手段は、ほぼFlashで寡占されている状態でした。しかし、最近になってHTML5と、それに付随するJavaScriptやCSS3などの新たな技術によって、Flashに代表されるようなプラグインを用いるのではなく、Webブラウザ自身の機能で高度な表現か可能となりつつあります。 初回の授業では、このHTML5とは一体なんなのかを、主な機能を概観しながら解説していきます。
☆ご注意☆ この記事は 2011年6月5日 に書いたものです。情報が古い可能性がありますのでご注意ください。 私も少しですがこの「1pxのこだわり」を日頃のデザインで使えるようになってきたので、制作方法とともにちょっとまとめてみました。 引き出しのひとつとして、デザイン勉強中の方、参考にしてもらえるとうれしいです^^ デザイン上級者の方々にとっては当然のことだと思うのですが、 最近つくづく思うのが、「1pxで質感が全然変わるよなぁ~」ってとても感じます。 たった1pxでピリッとしまったり、見やすくなったり、しゅっとなったり、、、と、1pxをないがしろにしちゃいけないんですねー… 今回は、私がデザイン制作時よく参考にしている、 デザイン参考集、bookma!さんの中から、色んなサイトを調べてみました。 目次 仕切り線の1px 文字をキリッと見せるための1px 動きのある1px 1pxの枠 仕
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く