HTML5+RDFaについて
このブログをHTML5に変更してみました。最近流行のFacebookのOGP（Open Graph Protocol）も設定しました。 HTML5に変更した理由は、OGP（Open Graph Protocol）を設置したときにvalidなHTMLにしたかったからなのですが、そもそもproperty属性はHTML5の属性ではなく、RDFaの仕様のようでした。勉強不足ですいません・・・。OGPを設置するにあたってHTML5にする必要はないようです。 ただしOGPを設置する場合、html要素に「xmlns:prefix」というネームスペースに対応した属性を設定する必要があります。FacebookのOGPに対応する場合は「prefix」に「og」を設定します。この設定はhtml5とかxhtmlには依存しません。 <html lang="ja" xmlns:og="http://ogp.me/ns
フェイスブックの「いいね」ボタン,(W3Cエラーを回避する方法)
フェイスブックの「いいね」をWebページにつける(W3Cエラーを回避) フェイスブックの「いいね」ボタンをWebページに付けてみました。しかし、HTML4やXHTMLなどではW3C Markup Validation Service のチェックで文法エラーとなるので、Javascriptを使って回避しました。HTML5ではエラーにはなりません。 フェイスブックの「いいね」ボタンの設置方法 フェイスブックの「いいね」ボタン(likeボタン)はフェイスブックのページだけでなく、普通の ウェブページ楽天 (ホームページ)にも付けることができます。 ウェブページの情報発信やアクセスアップに良さそうなので、早速ウェブページに付けてみました。ただ表示させるだけなら、やり方は簡単です。 フェイスブックの「いいね」ボタンの生成ページからコードを作成することができます。iframe版を作成してください。 ボ
Movable Type(MT)で生成しているXHTML文書にOGPを導入｜Blog｜Skyward Design
Movable Type(MT)で生成しているXHTML文書にOGPを導入 Posted by Hideki at 2011年5月15日 14:00 タグ： Movable TypeXHTMLマークアップ研究ノート このサイトのコンテンツ、沖縄旅日記「Shimalog」の個別記事ページに、OGP(Open Graph Protocol)（及びmixiチェックボタン・ツイートボタン）を導入してみました。導入にあたっては、小粋空間さまの「HTML5+RDFaについて」の記事を参考にさせて頂きました（RDFaに関するリンクが大変参考になりました）。現在の文書型は「XHTML 1.0」で、導入後もValidなXHTML文書になるよう配慮することを目指してみました。 MTテンプレートにOGPの追加 このサイトはMovable Type 5で運用しておりますので、個別記事ページのMTテンプレートに下記
jQueryで簡単に作れるマウスオーバーでアニメーションするボタン５種
jQueryで簡単に作れるマウスオーバーでアニメーションするボタン５種 ちょっと前まではマウスオーバーといえば画像の切り替えくらいでしたけど、最近ではアニメーションで切り替わるマウスオーバーも増えてきましたね。 ということでこの記事ではjQueryを使用して、わりと簡単に作れるマウスオーバーアクションをご紹介します。 投稿日2010年10月24日 更新日2012年03月05日 ナビゲーションはテキストにしないとseo的にあれだよとか言われていますが、コーポレートサイトではまだまだ画像を使用されていることが多いと思います。なので、今回は画像ナビゲーション限定です。（テキストでもあまり変わらないと思いますが……） 縦型+テキストタイプのナビゲーションはこちらの記事をご覧ください。 「jQueryで作るマウスオーバーアニメーションするテキストタイプの縦型ナビゲーション10種」 htmlと画像の準
jQueryでローテーションバナーを設置（ECサイトトップページ） | ハカセの研究室
最近は楽天などでもよく見るjQueryを使用したスライドバナー。 仕事で必要になり色々あさって見たのだが、中々実用的かつ良いのが見つからない。 せっかくなので、足跡を残しておこうと忘備録的に記事にしてみた。 最初に候補にしたのはこれ この記事を見て一目惚れ [JS]かなりかっこいいアニメーションを使ったスライドショーを実装するチュートリアル | コリス 「jmpress」 本家サイト かっこいいデモ＆チュートリアル 動きはカッコイイし、ある程度カスタマイズも可能（僕のような低スキルでも？…） しかし残念ながらIE未対応。知識がある人なら対応出来るのか？泣く泣く断念。 次に見つけたのがこの記事から jQueryのスライドショーとイメージギャラリーのチュートリアルサイトまとめ｜aqua create（アクアクリエイト） 「THE LOF JSIDERNEWS PLUGIN」 ※元記事
有効なWikiNameではありません - PukiWiki
2024-02-19 RecentDeleted 2023-01-02 モリサワ基本2書体 2022-12-11 「Adobe InDesign CS2を選択する25の理由」の評価 2022-11-23 文字クラス 2022-06-16 第37期DTPエキスパート認証更新試験問題/印刷の再現技術 2022-05-27 ご意見など 2022-05-17 このWikiについて 2022-02-25 CS Acrobat 7新機能ガイドについて 2021-12-20 planetdtpconfig 2017-08-04 抗菌印刷.com 2017-07-07 紙製什器.com 2016-09-09 エフ・ビー・エム やまもと印刷工業（東京営業所） パッケージファクトリー 2016-02-04 自動化 2015-09-15 第39期DTPエキスパート認証更新試験問題 2015-09-06 第36期
フリーランスのweb屋な人が、見積や注文書、請求書を発行する際のポイント。 | たけろぐ
要所要所で追記してます。 フリーランスのweb屋な人が、仕事をする時の書類の流れとポイントをまとめてみました。 ざっくり言うと、 見積書発行→注文書発行→お客さんが注文書返送→納品→請求書&納品書発行 という流れです。 「ここまで書いちゃう？」的にけっこう書いてるので、 「そんなんわかってるよー」て方も、確認の意味も含めてご一読あれ。 ちなみにうちは「見積兼注文書」として発行しています。 また、後述しますが、納品書まで出すことはあまりありません。 書類の送付方法について まず基本的な、でも間違えると面倒な部分から。 各書類の送付方法は、 ・原本郵送 ・FAX ・PDF どれが可能なのか確認しましょう。 見積書や注文書と請求書で異なる場合があるので、必ず両方確認してください。 注文書はFAX・PDFでよくても、請求書は原本という所がたまにあります。 また、請求書を送る場合は、現実的に郵送のみ
Webサイトの基本要素 見出し・リスト・引用文のスタイルを整える
2014年8月20日 CSS Webサイトを装飾していく時に無視できない要素、見出し・リスト・引用文。特にWordPressでオリジナルのテーマを作る時は、ブログ用にこれら基本の要素すべての装飾もすると思います。そんな時に使うコードのバリエーションをメモしていたので記事にしました。少し変えるだけで応用できると思うので、ぜひ使ってみてください！ ↑私が10年以上利用している会計ソフト！ 色、フォント、サイズなどを変えるだけで、どんなサイトでも使える見出し・リスト・引用文用のHTMLとCSSコードを紹介します。そのままコピペして使っちゃってください。少しはコーディングの手間が省ける…かもしれません。ちょいちょい使っている画像も保存して使ってもらってもOKです :) サンプル画面内の「HTML」「CSS」タブをクリックでコードが表示されます。IE6, 7, 8, FF, Chrome, Safa
素人っぽいデザインから脱却するための12のデザインチップス | webox blog
クオリティを上げるためにはちょっとした「こだわり」がとても大事です。 定期的に話題になるネタで恐縮ですが、素人っぽいデザインにならないように個人的によく使ってる小技をまとめました。 上のものほど、簡単で多くのデザインに使える小技になります。 1pxのボーダーを使う 1pxの効果を使うのと使わないのでは、デザインの質に大きな違いが生まれます。 ある意味Webデザインでは一番重要な要素かもしれません。 定番です。たった1pxのボーダーをつけるだけでシャープな印象になります。 ただ塗りつぶしただけ、グラデーションを入れただけのボタンでは、のっぺりとした感じになりやすいですが、1pxのボーダーを上部に入れるだけでシャープな立体を表現できます。 正確には1pxでなく2pxですが、こうして黒系のボーダーと白系のボーダーを並べることで、明確にかつシャープに仕切りを表現できます。 1pxのドロップシャ
これからWebデザインの勉強を始めたい方のためのまとめ
これからWebデザインやコーディングの勉強を始めたい方、またはWebデザイナーになったばかりの方向けのまとめ記事です。 「無料で始められる…」とか「本を買わなくても…」などのテーマにしようか迷ったのですが、無料ではじめられる記事としては、既にネタ帳さんの以下のようなエントリ↓がありますので、ここでは純粋に私がおすすめしたい記事、本、サイト、ソフトなどを有料無料に関係なく紹介したいと思います。 Web制作の為の無料Webサービス・ツール40*ホームページを作る人のネタ帳 デザイナーからデザインの基礎や原則を学べるエントリーまとめ（webデザイナ向け）*ホームページを作る人のネタ帳 あと、渋谷でWebデザインスクールを開講しています。 詳しくはこちらの記事 をご覧下さい。 デザイン基礎 年末年始にWebデザインを学び直すための3つのステップ いきなり手前味噌で申し訳ないですが、これからWebデ
[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary
これはもう何年も前から気になってることなのですが。 何故、昔からずっと見出し画像などの文字組みや文字詰めの甘いWebサイトが多いのでしょうか。 私はデザインについて偉そうに言える立場でないのは分かっていますが、折角全体的なデザインや背景、写真、Flashなどの動きはとても美しく、文章構成のしっかりしたサイトなのに、ただ一点文字詰めだけが甘いというサイトがあまりにも多くて、そういうサイトが減る様子もないのがずっと気になっています。 私は以前、ファッション雑誌やビジネス誌の組版（MacのInDesignやQuarkXPressを使って印刷用のデータを作る仕事。DTPとも言う）の仕事をしていて、見出しは言うまでもなく、本文の文字詰めが少し甘いだけでもものすごく怒られたものですが、Webデザインの世界ではそういうのはあまり怒られることがないのでしょうか。 私は、見出しやタイトル画像における文字組み
![[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary](https://cdn-ak-scissors.b.st-hatena.com/image/square/e6e22153e1233d79c8da8733fc112f935fe5ee4a/height=288;version=1;width=512/https%3A%2F%2Fi0.wp.com%2Fstocker.jp%2Fdiary%2Fwp-content%2Fuploads%2Ftypographic-1-1.png%3Ffit%3D500%252C250%26ssl%3D1)
９．売れるランディングページデザインの１０の特徴
ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. ランディングページのデザインは、インターネットの技術の向上に合わせて変遷している。それに伴い、高いコンバージョンを見込めるレイアウトも、めまぐるしく変わっている。 しかし、結局、どのビジネスも最終的には似通ったデザイン/レイアウトに落ち着いていく。 なぜなら、結果を出すランディングページデザイン/レイアウトには、ある一定のルールのようなものが存在するからだ。そして、そのルールに則ってランディングページを作ると簡単に高い数字が出せる。 つまり、ゼロからデザインを考えるのではなく、既に結果が出ることが証明されている成果保証済のレイアウトやデザインを使う方が、遥かに簡単で結果が出やすいのだ。 そこで、近年非常に良く見られるランディングページのレ
色と人の感覚とウェブデザインのはなし | バニデザノート
前回は空白のお話をしましたが、 今回は色のお話です。 空白・ホワイトスペースの扱いと、色の扱いはとてもよく似ています。 また、ホワイトスペースだけでなく、色も一緒にコーディネートすることで よりわかりやすくウェブデザインを行うことができるようになります。 空白・ホワイトスペースよりも、人間の「目」と、「モニタ」というスペックに関わる部分ですので あくまでも筆者の考え方として参考にしていただけると嬉しいです。 あったかく感じる色 色覚といって、色には人に与える印象があります。 これは、誰もがそう感じるというものではないのですが、 （それこそ、育った環境から、目のスペック、その人の精神的な部分に至るまでゆらぎがあり・・） 「ほぼ多くのひとが感じる」というレベルで、感じ方をある程度グループ分けすることができます。 たとえば、このグループは「暖かい」「活動的」「元気」なイメージがあります。 もうす
【 バナーデザイン・アーカイブ ★★★ 】 - 様々なバナーのデザインを一覧でチェック！
バナーデザインをまとめたサイトです。様々なバナーのデザインをサイズや色から選んで一覧でチェック！バナー作成の参考にご活用ください！
1年目デザイナーに読ませたい配色の考え方を学べる記事
配色センス0でも大丈夫！？服、インテリア、デザイ... / Webサイト制作において、私なりの色選定の考え方... / 色と人の感覚とウェブデザインのはなし - バニデ...他...全10件
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事
Loading...
WEB and more... | GALLERY 作品集・人 | 株式会社C4メディア
見出しデザイン.com -Webデザインの“見出し”を集めたサイト-
基礎からわかるホームページの配色