CSSが苦手なWebデザイナーが知っておきたい、デザインに関係するCSSのテクニックのまとめ
Webデザイナーはデザインの知識やテクニックだけでなく、どのような実装テクニックがあり、何が実現可能なのか知っておくことで、さらに素晴らしいデザインを作りだすのに役立たせることができます。 Webデザイナーにとって、CSSは難しく感じるかもしれません。しかし全部を覚える必要はありません。デザインに関わるいくつかの有用なCSSのテクニックを紹介します。 20 essential CSS tricks every designer should know イラスト: Girls Design Materials 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 1. 絶対位置への配置 2. 全称セレクタ（*） 3. すべてのスタイルを上書き 4. 左右の中央に配置 5. 天地の中央に配置（テキストのナビに） 6. ホバーエフェクト 7
2行追加するだけでWebサイトを高速化するInstantClick.io - atskimura-memo
Before visitors click on a link, they hover over that link. Between these two events, 200 ms to 300 ms usually pass by (test yourself here). 引用：InstantClick — JS library to make your website instant リンクにマウスオーバーしてからクリックするまでには200msから300msほど時間がかかるそうです。実際このテストページでクリックしてみるとMacのトラックパッドだとさらに遅く500msくらいかかってました。 InstantClick.ioはその間に裏でリンク先ページをロードして勝手にリンクをpjax化してしまうという高速化ライブラリです。 やってることはRails4のturbolinksと似てます
あなたのコンテンツがつまらないことを示す20の危険信号 ｜SEO Japan by アイオイクスSEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
コピーブロガーから誰もが不安に思うことがある話題を。自分の書いた記事が評価されているのか、つまらないと思われているのかは、アクセス数とは別に気になる話題ですよね。そんな時にちょっと気になるこの記事を。 — SEO Japan 認めるのだ・・・あなたがずっとそうではないかと思っていたことを。 あなたは書いて書いて書いて、それを好きだと言ってくれる人も少しはいるが、結果が残せない。トラフィックはポツポツとあるだけ、リンクはめったに得られず、コメント欄は朝食中のナイトクラブほどの活気しかない。 そして疑問に思わずにはいられない・・・ トラフィックが雪だるま式に増えてくるのを我慢強く待つ必要があるだけなのだろうか？ あるいは、あなたのコンテンツが本当につまらないもので（その結果、Copyblogerの最初のルールを破っている）、みんなあなたのデリケートな芸術心を傷つけないように優しくしてくれている
新人Webデザイナに贈る！ 美人/タレント素材の創り方
新人Webデザイナに贈る！ 美人/タレント素材の創り方：一撃デザインの種明かし（11）（1/3 ページ） 顔写真を使ったWebコンテンツ制作の基礎知識 新人Webデザイナの皆さんも研修を終えて、そろそろ制作現場で実作業に入り始めていることと思いますが、いかがでしょうか？ 現場の大変さが分かりかけてきているかと思います。 そんな新人さんのために今回は、いま話題の“美人”“美女”を扱ったWebキャンペーンのコンテンツや、タレントを使ったウキウキワクワクするコンテンツの写真素材作りの基礎、そして現場で使えるテクニックをお送りします。 Webキャンペーンの今昔 数年前までのWebキャンペーンは、CMや紙面の広告の、あくまでも“おまけ”として展開されていました。そのため、Web制作の多くの場面では、CMや紙面の広告に使われた写真や素材を流用できました。 しかし、最近では逆に、「Webを中心にCMや紙
Flash Lite制作 作業効率化＆ファイル容量軽量化テクニック | デベロッパーセンター
コミュニティーリソース Flex cookbook* (コードの共有) CSS Advisor (ブラウザ別バグ修正) Exchanges* (コンポーネントの共有) Adobe Labs* ユーザフォーラム RSS フィード* Flex バグベース* ユーザグループの検索* ユーザグループについて* Adobe Community Experts (ACE)* デベロッパーイベント* ブログ MXNA* (ブログアグリゲータ) Adobe ブログ* 携帯向けFlashコンテンツには、ファイルサイズの制限があります。この問題は、入門者からベテランまで、すべての携帯向けFlashコンテンツ制作者がぶつかる壁だと言えます。本記事では、swfファイルの容量を軽くするためのコツを紹介しましょう。コンテンツと制作作業そのものを合理的・効率的に見直すことがテーマとなります。コンテンツや表現を削ってしま
ドロップシャドウとグラデーションの使用を的確にするためのチュートリアル
なんとなく目立たせるためにドロップシャドウを適用したり、ちょっとさみしいのでグラデーションを加えたりしていませんか？ Web designer Depotからドロップシャドウとグラデーションをウェブデザインで的確に使用するためのチュートリアルを紹介します。 Drop-Shadows and Gradients: Be Consistent in Your Visual Metaphors 下記は、各ポイントを意訳したものです。 ドロップシャドウとグラデーションの役割 ドロップシャドウとグラデーションの使用の注意点 使用は、より繊細に よくある間違いと解決方法 おわりに ドロップシャドウとグラデーションの役割 ドロップシャドウとグラデーションは、スペースに錯覚を生じさせるための基本的なテクニックです。 Mac OS Xのドックを例にとると、輝いたテーブルの上に各メニューのアイコンが浮き上がっ
WordPressのコーディングテクニック10 – creamu
Smashing Magazineで、WordPressのコーディングテクニックが紹介されています。 これは自分的にもタイムリー。ざっとご紹介しますね。 エントリーごとのスタイルを変える post_class()を使って、「.henry」「.sticky」「.category-tutorials」「.tag-wordpress」といったクラスにCSSを指定できるようにする。post IDでは例えば「#post-876{} 」にCSSを適用できる 関連するエントリーをサムネイル付きで表示する PHPの画像リサイズスクリプトであるTimbThumbを使って、画像を40 x 40pxにリサイズ トップページの見せ方を変える 新着3件のエントリーを、他と違ったデザインで見せるテクニック 複数のループを使う WPの標準機能である「rewind_posts()」を使って、1番目のループをリセットし、2
AERA的キャッチコピー作成術 : LINE Corporation ディレクターブログ
モバイルでニュースを担当している小島です。 ふだん私は、ニュースに見出しを付ける業務を担当しています。12文字という字数制限で見出しを考える際には、半角カナにできるところは半角カナにして文字数を削減したり、語順を入れ替えて半角スペースを入れる余地を確保したりという、細かい作業が不可欠になってきます。 そして、そのような場面で要求されるパズル的な感覚は、ダジャレ作りにも応用できるのではないかと考えています。そこで今回は、『AERA』の表紙や中吊り広告などで見かける“ダジャレ”キャッチコピーの作り方について書こうと思います。 なお、モットーとしては、爆笑を誘うよりも「誰がうまいこと言った」と言われることを目標としております。華やかな笑いは、プロの芸人に任せようではありませんか。 頭の中に「五十音表」はあるか ダジャレの基本はゴロ合わせです。まず、比較的難易度が低いものとして、声に出したときに違
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【性交率１００％】ベッドに連れ込むテクニック！まとめ | ライフファックちゃんねる弐式
[CSS]簡単にCSS3の新しいプロパティを楽しめるチュートリアル