スマートフォン向けのWebサイトやWebアプリを中心に、「SVG」がいま再注目されています。単なる画像フォーマットを超えて、最近ではさまざまな表現に広く活用されるようになりました。 SVGの概要から基本的な使い方、Web制作での活用方法までをじっくり解説。CSSによる装飾やJavaScriptとの連携など、すでに使っている人がもっと使いこなすためのテクニックも紹介します。
アート・エンタテインメントの業務を多く扱う「骨董通り法律事務所For the Arts」の弁護士による、著作権とそれにまつわる法律関連の連載です。クリエイターが気になる法律問題についてわかりやすく解説しているので、ぜひ参考にしてください。 文:弁護士 永井幸輔(骨董通り法律事務所 for the Arts) ケース:クライアントからの依頼で、旅行情報誌の表紙のアートワークを制作することになった。メインビジュアルには紅葉の山の風景写真を使いたいが、手元に使える写真がなかったため、インターネットで探して利用することにした。著作権を侵害しないよう適法に写真を使うためには、どうすればよいだろうか。 今回は、著作物の「利用」の側面についてお話ししましょう。 自身で発表するかクライアント・ワークであるかを問わず、制作物に他人のアートワークを使用することも少なくないのではないでしょうか。既存の作品には、
レスポンシブWebデザインでは要素を可変にするために数値を%で指定することが多いですが、%指定の仕様を理解してないとハマることがあります。自分もそのような経験があったので備忘録としてまとめました。 要素の幅と高さの%指定 レスポンシブWebデザインのように、ある要素の幅を一定の比率を保ったまま可変するようにするには、通常、値を%で指定します。この時の値は、 求める要素の幅÷親要素のコンテンツ幅×100% の式で求められます。 例えば求める要素の幅が20px、親要素のコンテンツ幅が200pxの場合は、10%となります。 また、ここで言うコンテンツ幅とはmargin、padding、borderを含まない幅です。 同様に高さを%で指定する場合は、 求める要素の高さ÷親要素のコンテンツの高さ×100% となります。 marginとpaddingの%指定 左右のmargin、paddingを%で指
jQueryとCSS3を使ったアコーディオンメニューを作ってみましたので、作り方を紹介します。かなり長くなりますが、お役に立てばうれしいです。 色々事情があってIEでご覧になっている方のためにスクリーンショットも載せておきます。カテゴリー3にマウスを乗せているところです。 それではコードを解説していきます。 HTML まずはHTMLです。無駄に長いですが一応載せます。 <ul id="accordion"> <li><a href="#">カテゴリー1<span class="arrow rotate"></span></a> <ul id="active"> <li><a href="#">サブカテゴリー1</a></li> <li><a href="#">サブカテゴリー2</a></li> <li><a href="#">サブカテゴリー3</a></li> </ul> </li> <l
mon cifaka Online Store / 洋菓子専門 CHEZ Tani (シェ・タニ) / 浜松のビジネスホテル|HOTEL day by ...他...全9件
先週末の土曜日、「CSS Nite LP, Disk 14 / Photoshopper meets Fireworks」が開催されました。イベントにご来場下さった皆様、そして関係者の皆様、大変お疲れ様でした。 まずは、この場を借りてお礼を。ありがとうございました(深々)。 さて、当日はFireworks特集となるイベントでしたが、ボクの担当は他の登壇者の皆さんの内容とはちょっと毛色が異なるカラーマネジメントの話でした。「FireworksのTipsやテクニックなどを知りたい方が多いんじゃなかろうか、今回の内容に関して大丈夫かな?」と思っていたのですが、予想以上に良い反応をいただいておりホッと胸をなで下ろした次第です。 とはいえ、プレゼン自体はボロボロだったので、その反省や参加いただいたお礼をこめて当日伝えきれなかったことをこちらのエントリーにまとめてみました。 #前もって書いておきますが
宗教になった効果測定 昔、Webデザインは直感・経験・感性のみで作られていました。しかし、低価格・無料のデータ解析ツールが登場したことにより、より多くのサイトがデータ解析をサイトの成果測定に利用するようになりました。従来はページビューという大まかな数でしか価値を測定することが出来なかったわけですが、その場にいる利用者の姿も徐々に見えてくるようになりました。現在はページビューだけでなく滞在時間、訪問頻度、コンバージョンなど様々な要素を効果測定要素として取り上げるようになりましたし、それらを基に改善のプロセスが組まれるようになってきました。 ビジネスを考える上において、直感・経験・感性に行き過ぎていた従来の Web デザインは不十分な存在でした。そこで効果測定を積極的に取り入れようという動きが生まれたわけですが、今度は効果測定が『宗教化』してしまい本質を奪ってしまう場合も出て来ています。 効果
前々回、前回に引き続き、ヘルプコンテンツの効果的な見せ方についてご紹介します。 ヘルプコンテンツは、すべての項目を羅列した「よくあるご質問」のようなページを持つだけでは不十分です。 以前の実践メモでは、疑問が発生したタイミングで「その場で」参照できるよう、主要な導線となるページ内に、ヘルプ内容を露出する方法を推奨していました。 今回は、ヘルプ内容を露出する際の、具体的な2つの注意点をご紹介します。 ヘルプの隠れた役割 置くだけでは不十分?ヘルプ活用3つのポイント そこで、実際に皆様のサイトで主要導線上にヘルプ内容を露出させる際の注意点を、以下の2つにまとめています。 注意点1. 同一ウィンドウでヘルプページに遷移させない ヘルプが掲載された別のページに「同一ウィンドウで遷移させる」(ページが完全に切り替わる)という方法はお勧めできません。 ページが完全に切り替わると、もとのページに戻るため
43 Best jQuery Carousel Sliders, Plugins, Tutorials and Examples Nowadays mostly designers & developers use sliders or carousels in their blog or website and jquery make this very easy to be used. jQuery has overpowered Flash in a lot of web uses becoming a very powerful tool for web designers. In web design a carousel is an element giving visitors easy access to several content items. It is typic
Each of these free web-based tools and apps have been built by web designers for web designers. They all offer a time-saving solution to some of those monotonous or even complex CSS tasks you may need to perform from time to time. Without needing to install anything, all you have to do is bookmark, and save them for that day when required. From assessing your website’s accessibility to generating
ファイルが見つかりません あなたがアクセスしようとしたページは見つかりませんでした。移動、または削除された可能性があります。トップページから改めてお探し下さい。
2018年10月11日 Webデザイン, インスピレーション, 色彩 前回の記事「WebデザイナーにおすすめのEvernote活用術」で紹介したように、私はEvernoteに素敵なデザインをストックする際、使われているテーマカラー別にタグをつけて分類しています。気がつけば各色のデザインストックが増えてきたので、その中でも厳選した5サイト×10色の合計50サイトを紹介します。単色をデザインに使う時のポイントも一緒に読んでみてくださいね! ↑私が10年以上利用している会計ソフト! 追記:リンク切れサイトを削除したため、数が減ってます… テーマカラーをメインに取り入れる時のポイント 「配色に自信がなくても!Webデザインが好きになる配色ツールと使い方」でも紹介したとおり、きれいな配色でもベタ塗りしただけではデザインの魅力が半減してしまいます。特に今回のようにテーマカラーを使う面積が広ければ広いほ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く