『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。
前回までの記事で簡単なレイアウトを作成して、xhtmlとHTML5でマークアップしたものからHTML5の新要素の説明を行い、アウトラインを確認してみました。最終回となる今回はxhtmlとHTML5のCSSをほとんど変えずに同じレイアウトになるように作成してみたいと思います。 HTML5でCSSを設定する場合は新要素に対応していないブラウザに対してどうするのか。まだ確定していないHTML5の要素が変更になった場合を考慮して、スタイルの設定を考えた方が後々の大きな修正を回避できるのでベターです。ただ今回のレイアウトはほとんど同じCSSを使うということで作成するので、多少気になる部分もあるかと思いますが、ひとつの例として見ていただければと思います。 解説:(有)ムーニーワークス 林 豊/田崎一成 前回まででアウトラインを確認したそれぞれのマークアップしたページのサンプルこちらにあります。 ●HT
「HTML5 でコーディングしたら SEO (検索エンジン最適化) 的に有利になりますか?」 っていう質問、たまに聞かれるんですけが、それに対する答えとして私がまとめて書こうと思っていた内容をすべて言ってくれてしまっている記事が Impressive Webs で投稿されましたので、便乗して簡単に訳しつつ紹介してみようと思います。 「HTML5 でコーディングしたら SEO (検索エンジン最適化) 的に有利になりますか?」 っていう質問、たまに聞かれるんですけどね。 個人的には "SEO のために" HTML5 にするか XHTML にするかなんて悩んでる暇があったら利用者に役に立つコンテンツの 1つでも考えた方がいいよと思うわけですし、聞かれたときはそのように答えているわけですが、折角なので簡単に考えをまとめて Blog に書いておいてみようかなと思ってダラダラと書き始めていたら、自分が
WEBマスターが知っておくべき5つの.htaccess 2007年7月10日 5 htaccess Tricks Every Webmaster Should KnowというWEBマスターが知っておくべき5つの.htaccessという記事を見つけました。僕も知らなかったのがあったので翻訳してご紹介したいと思います。 リニューアル中にアクセスしたユーザーを特定のページにリダイレクトする サイトをリニューアル中、もしくはテスト中にサイトにアクセスしたユーザーを特定のページにリダイレクトすることができます。123.123.123.123のところにサイトのIPアドレスを記述して、サイトにアクセスしたユーザーを403エラーページのpage.htmlにリダイレクトすることができる記述になります。page.htmlは事前に準備する必要があります。 order deny,allow deny from a
先日から提供が開始されたAdobe Creative CloudのCCシリーズ。 とりあえず色々インストールしてみました。 まだそんなにガッツリと使い込んではいないのですが、Photoshop CCでぐっときた機能をご紹介。 透過pngで書きだしたい画像に乗算やオーバーレイや焼きこみカラー...などなど、描画モードが「通常」以外のものが使われていること、ありますよね? 書きだしてから 「あれ...なんかデザインと違う...まさか...。あーやっぱり乗算だったー(泣」 っていうこと、ありますよね?(私だけですか...) 自分でちょちょいと修正できるときはいいんですけど、どう考えても無理な時とか、あまりに色々なところに乗算などを使われていると、 「次からはできればもうちょっと気をつけていただけるとありがたいです!」 と言いたい。 がしかし、なんで描画モード変更しちゃいけないの?と言われるとうま
2007年1月。私がブログを始めた同じ月にミャンマーの青年が個人でも商用でも無料で使えるFreeFlashTemplateというサイトをオープンさせました。Flashのテンプレートを無料で提供というスタイルですね。 とても素晴らしいソースとして、結構使われた人も居るかもしれません。ある程度広告収入と言う方法で軌道に乗せたNetDNAは、その一年後2008年に、FreeCSSTemplateというサイトも同時に発足。 そして現在。総テンプレート数が335個。 改めてこのサイトを見ると、かなり優れたものが多いので、だいぶ前に紹介した気がしないでもないのですが(他のブログでみただけかも)、再度ご紹介したいなと思います。 とりあえず使う前の注意 個人、商用問わず利用可能です。作品を複製、頒布、展示、実演することができます。二次的著作物を作成することができます。本作品を営利目的で利用することができま
While I was coding the Elemin Theme (a responsive WordPress theme that I recently designed), one of the challenges that I faced was to make the embedded videos elastic. Using the max-width:100% and height:auto trick works with native HTML5 video tag, but it doesn’t work with embed code using iframe or object tag. After hours of experimenting and Googling, I finally found a trick on how to achieve
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 ul.tab { margin: 0; padding: 0; border-bottom: 2px #ddd solid; } ul.tab li { float: left; margin: 0 0 0 5px; position: relative; bottom: -2px; list-style-type: none; border: 1px #ddd solid; border-top: none; border-bottom: 2px #ddd solid; } ul.tab
第6回 岡山WEBクリエイターズのセッション1で発表したスライド内容を全文掲載。第6回 岡山WEBクリエイターズ セッション1『WEB標準デザイン、はじめの一歩 ~デザインからマークアップまで~』 岡山WEBクリエイターズ勉強会でお話した内容を、スライドとともに全文掲載しています。 テキストはあくまで原稿そのままですので、実際に喋った内容とは幾分異なる場合があります。 スライドのPDFをダウンロード 講師概要 SKPRODUCT代表。 デザイン、コーディング、PHPによるシステム構築、ActionScriptを使用したFlashなど、WEB制作全般を行うWEBアーキテクトです。 岡山の大手企業・学校などを中心にWEBサイトと独自に開発したCMSフレームワーク『SEED』の提供を行っています。 本日は、WEB標準デザインはじめの一歩です。 WEB標準というと、技術的なことを想像される方
Improve your website's usability. With jOrbital menu. Group objects with similar functionality into one button. Save space and give users more interaction. Move your mouse over the share button to see what I mean. Overview Web design involves the structure of the website including the information architecture (navigation schemes and naming conventions), the layout or the pages (wireframes or page
こんにちは。笹亀です。 最近、工事中であった周りの建物の完成が近くなってきており、 周りの景色がいままでと違う景色に変わってしまいなんだか少し寂しさを感じております。 2/24(明日)に噂によると新MacBookProの発表があるということらしく、 こちらは発表までとても待ちどうしくてしかたありません! さて本日はjQueryのライブラリでヘルプページを作成する方法をご紹介致します。 ヘルプページをいちから作成するというのは手間と労力がとても掛かってしまうものです。 今回ご紹介するライブラリを使用すると下記の画像のようにWebシステム内にヘルプ情報を簡単に組み込めてとても手軽にヘルプページを作成することができます。 それでは実際にヘルプページを作成してみたいと思います。 1.まずは実装に必要なjQueryとヘルプライブラリのJSをダウンロードします 下記からダウンロード可能です。 http
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く