主に Mac + Safari にて動作確認を行っています。 お使いの環境で動作しないなどありましたら、最新のブラウザをご利用いただくか、下記お問い合わせ先までお問い合わせください。
Web制作小物ツール - dounokouno.com
主に Mac + Safari にて動作確認を行っています。 お使いの環境で動作しないなどありましたら、最新のブラウザをご利用いただくか、下記お問い合わせ先までお問い合わせください。
2010年度版・とても参考になった国内のWeb制作関連エントリーまとめ
少し気が早いですが、今年も残すところ あと僅かです。ここで、Web制作をする にあたって、個人的に、とても参考にな った素晴らしいエントリーをご紹介します。 基本的にまとめ記事が大好物なので、 まとめのまとめ、という形になってしまい ますがご了承願います。 まぁ、単なる個人的なメモです。今年はお世話になりました、という感謝の意を込めてリンク&トラフィックで返したいのと、自分の復習用リンク集です。来年もたぶんお世話になる記事だと思いますので、備忘録も兼ねて。順不同です。 尚、当ブログのエントリは御礼の場であるこの記事では割愛しています。後日、別記事にてまとめさせて頂きますので、宜しければ御覧ください。 デザイン読み物系が多いです。正月とかで見直す用。 配色パターンからWebデザインを考えるウェブデザインでこれは気をつけたいの35のポイントデザインQRコードの作り方非デザイナーのためのデザイン
HTML5で出来たこのサイトがbいいね！
HTML5で出来たこのサイトがbいいね！って事で、 最近見たものからきょうBuzzってるHTML5のサイトを幾つかご紹介します。 20 Things I Learned About Browsers and the Web 北極のホッキョクグマ | Ring Ring Wonder Christmas kaleidoscope A WORLD OF TWEETS simo 良く出来てるHTML5増えてますね。 カッコbいいね！ o(●´ω｀●)oわくわくしたw その他今日気になった記事＆サービス!! Googleおみせメモ http://www.google.co.jp/hotpot# スティーブ・ウォズニアック：Appleは某日本企業と共同で2004年に携帯を出す寸前だった http://goo.gl/0uo2t Top Trends of 2010: HTML5 http://goo.
[CSS]パンくずの実装はどのようにするのがよいかの考察
パンくずは何要素で実装していますか？ ul要素？ ol要素？ p要素？ パンくずをどのように実装するのがよいかの考察を紹介します。 Exploring Markup for Breadcrumbs [ad#ad-2] 先日紹介したCSS-Tricksの「画像を使用しないでApple風のパンくずを作成するチュートリアル」に寄せられたコメントから考察されたもので、各ポイントを意訳したものです。 パンくずのマークアップの考察のきっかけ -ul要素で同列配置 パンくずのマークアップの考察 -ul要素で親子 パンくずのマークアップの考察 -ol要素で順序づけ パンくずのマークアップの考察 -セパレーターの使用 パンくずのマークアップの考察 -Googleを参考に パンくずのマークアップの考察 -HTML5の使用 パンくずのマークアップの考察 -おわりに パンくずのマークアップの考察のきっかけ -ul
[CSS]画像を使用しないでApple風のパンくずを作成するチュートリアル
階層を区切る三角のデザインが特徴的なApple風のパンくずを同一の色相でカラーリングしたものを実装するチュートリアルを紹介します。 三角の箇所は画像を使用しないで、CSSで実装されています。 Breadcrumb Navigation with CSS Triangles デモページ [ad#ad-2] HTML -マークアップ パンくずはリスト要素で実装します。 シンプルでクリーンに実装するために、各アイテムにはclassを使用しません。 HTML <ul class="breadcrumb"> <li><a href="#">トップページ</a></li> <li><a href="#">第二階層</a></li> <li><a href="#">第三階層</a></li> <li><a href="#">第四階層</a></li> <li><a href="#">現在位置</a></
音楽方丈記
ヘッドフォン出力2系統装備、充電式バッテリー内蔵のポータブルヘッドフォンアンプ M-AUDIO Bass Traveler » ハードウェア(オーディオ) M-AUDIO が2系統のヘッドフォン出力を装備した充電式バッテリー内蔵のポータブルヘッドフォンアンプ Bass Traveler を2016年7月23日に発売予定、市場価格は3,500円前後(税込)。 Bass Traveler は、4極対応のステレオミニジャックのヘッドホン端子を2系統装備したコンパクトなポータブルヘッドホンアンプで、充電式リチウムイオンバッテリーを搭載していてフル充電で約8時間の動作が可能です。 その他、ボリューム調整つまみと2段階の切り替えが可能な低音ブーストスイッチを装備しています。 4極ステレオミニジャックヘッドホン出力端子×2 4極ステレオミニジャック入力端子×1 約8時間動作可能なリチウムポリマーバッテリ
「Ai→Canvas」イラストをHTML5形式に変換する画期的プラグイン 【増田@maskin真樹 | TechWave（テックウェーブ）
[読了時間:1分] 米Microsoftが運営するMixOnlineが10月12日、アドビ・イラストレーターのファイルをHTML5のCANVAS形式にエクスポートできるプラグイン「Ai→Canvas」を公開した。CANVAS形式で表現されたイラストは拡大縮小はもちろんアニメーションを施すことなどが可能になる。 プラグインインストール後、イラストレーターの「書き出し」コマンドを実行するとCANVAS形式を選択できるようになる。書き出されるのはHTMLファイルで、ベジェ曲線はそのままビットマップ画像はファイルとして保存される。対応ブラウザで表示することができる。（以下参照） 上のスナップショットでCANVAS変換したベジェのみで作成されたイラストを以下で公開している。 http://blog.metamix.com/sample/NAOC_LOGO_Illustration.html ソースを
ウェブデザイナーのための実用的なデザインとコーディングテクニック集
Five Useful Design Techniques and Coding Solutions For Web Designers [ad#ad-2] 下記は各ポイントを意訳したものです。 PHPはWordPressでのものとなっています。 1. 複数の項目がある棒グラフのエフェクト 2. ホバー時に追加情報を表示 3. カテゴリごとに異なるカラーを適用 4. ちょっと面白い画像のキャプション 5. ウェブのための印刷風デザイン おわりに -developersではなく、designers 1. 複数の項目がある棒グラフのエフェクト 下記のサイトで使用している棒グラフでは、上：タグの種類と数、下：コメントのついた記事と数、をそれぞれ素晴らしいエフェクトで実装しています。 こういった数値化されたデータは、ユーザーに対して有用なコンテンツの手がかりを提供し、ユーザビリティを改善することに
MdN Design｜総合情報サイト
「leigeber web development blog」で発表されているシンプルなスライドショー（www.scriptiny.com/2008/12/javascript-slideshow/）を実装してみよう。 ［Click here to download the source.］をクリックしてダウンロードしたファイルを解凍し、「compressed.js」（JavaScript本体）、「style.css」、「images」（ナビゲーション用画像）を使用。次に写真素材を準備する。一枚につき、それぞれ大きな写真とサムネールを用意しよう。サンプルでは、大きな写真の横位置が500×334ピクセル、縦位置が横幅成り行き×高さ334ピクセルとしてそろえた。サムネールは、高さ75ピクセルで横幅は成り行きとし、大きな写真は「photos」ディレクトリ、サムネールは「thumbnails」ディ
Webサイトの基本要素 見出し・リスト・引用文のスタイルを整える
2014年8月20日 CSS Webサイトを装飾していく時に無視できない要素、見出し・リスト・引用文。特にWordPressでオリジナルのテーマを作る時は、ブログ用にこれら基本の要素すべての装飾もすると思います。そんな時に使うコードのバリエーションをメモしていたので記事にしました。少し変えるだけで応用できると思うので、ぜひ使ってみてください！ ↑私が10年以上利用している会計ソフト！ 色、フォント、サイズなどを変えるだけで、どんなサイトでも使える見出し・リスト・引用文用のHTMLとCSSコードを紹介します。そのままコピペして使っちゃってください。少しはコーディングの手間が省ける…かもしれません。ちょいちょい使っている画像も保存して使ってもらってもOKです :) サンプル画面内の「HTML」「CSS」タブをクリックでコードが表示されます。IE6, 7, 8, FF, Chrome, Safa
HTML5+CSS3 入門
Webを記述する言語の標準の現状 昨年度であれば、HTMLを記述する授業では自信をもって以下の基準を推薦していました。 HTML (文書の構造を記述する言語) – XHTML 1.0 もしくは XHTML 1.1 CSS (文書の体裁・デザインを指定する言語) – CSS 2 しかしながら、ここ数年で、とくに去年あたりから状況は大きく変動しつつあります。現状の変化を理解するには、ここに至るまでの歴史的な経緯について簡単に理解する必要があります。ここまでの経緯を整理した上で、将来の展望を探りたいと思います。その上で、この授業ではどのような基準にのっとって「正しい」ということを定義するのか決めていきたいと考えます。 HTML (Webサイトの記述言語) の標準化巡る闘争の歴史 AppleInsider: なぜ Apple は HTML 5 に賭けているのか： ウェブの歴史 [Page 2] よ
HTML5でWebページをマークアップするための基礎知識
最近よく目にする「HTML5」という言葉。JavaScriptのAPIやCSS3、SVGなどを含め、急速な広がりを見せつつある「HTML5」の基礎を学べる入門連載です。「HTML5を使うと、何ができるのか」「それを実現するには、どのようなプログラムを書いたらいいのか」をお届けします 5からHTMLの“文法”が変わるって知ってた？ 連載第1回の「Webの3つの問題を解決する「HTML5」とは何なのか」では、HTML5という技術革新の意義、そして本連載の大まかな流れについてお話ししました。連載第2回である今回は、HTML5のマークアップを行うための基礎知識についてお話しします。 HTML5では、その文法が大きく変化しました。「HTMLが、どれほど普及しているか」「根底となる“文法”が変わってしまったら、どれほどの影響があるか」に想像が及ぶ方であれば、非常な驚きと不安を抱かれるかもしれません。
デザイナは要注目！ 明日から語れるHTML5＆CSS3（1/4）- ＠IT
デザイナは要注目！ 明日から語れるHTML5＆CSS3：一撃デザインの種明かし（13）（1/4 ページ） ※本稿では特に断りがない場合、Firefox、Google Chrome、Opera、Safariは2010年7月時点の最新バージョン、IEはInternet Explorer 6/7/8の総称です。 いま世界で一番熱い「HTML5」「CSS3」とは？ 最近、「HTML5」「CSS3」といった言葉をよく耳にしませんか？ これらはWebの表現をもっと豊かにするために策定中の言語です。いままでのHTML 4.01やXHTMLでは実現できなかったことができるようになったり、CSS3はCSS 2.1よりさらにグラフィカルな部分まで表現できるようになりました。 FirefoxやOpera、Safari、ChromeといったHTML5＋CSS3に対応するWebブラウザが増えてきたことで、HTML5
携帯電話用ムービーのHTML
[ 一般 ] iwmrwiki tipsを残しておくための個人wiki 編集 履歴 添付 設定 新規ページ作成 メニュー カテゴリー 最近更新したページ 2005-12-12 携帯電話の位置情報 2005-11-13 CSSメモ 2005-09-02 ブックマークメモ 2005-07-27 携帯電話用ムービーのHTML 携帯電話用HTML参考ページ 携帯電話向けFlash FrontPage CSS参考ページ MenuBar1 MenuBar2 携帯電話用ムービーのHTML ドコモ用（iモーション、着モーション） ダウンロード <a href="（ムービーのファイル）"> 例： <a href="hoehoge.3gp"> <object declare id="（ムービーのID）" data="（ムービーのファイル）" type="video/3gpp"> <PARAM name="co
携帯電話向け動画配信のまとめ(その2) | 村式開墾日記
中川です。 今回は携帯用マルチメディアコンテンツの著作権保護について調べました。 著作権保護に関して 対象ファイルの転送禁止や再生回数制限などについて、キャリアごとの設定方法を調べました。 auの場合 EZムービー(3GPP2形式)の場合 ファイルにコンテンツ保護情報を埋め込むことができます。 以下の設定が可能です。 ・端末上でのみ再生できるようにする ・再生回数を制限する ・有効期限を設定する(何日後、もしくは何年何月何日まで) QuickTimeProでエクスポートする際に、上記の設定項目があるので それらに従うだけで簡単に作ることが出来ます。 DoCoMoの場合 MP4対応iモーションの場合、 ファイルにコンテンツ保護情報を埋め込むことができます。 以下の設定が可能です。 ・端末上でのみ再生できるようにする これもQuickTimeProでエクスポートするとき
携帯サイト 動画再生方法 ( Separate Delivery ) – Tech Diary Blog
Docomo, AU, Softbankの動画再生に関しての調査メモ。 Docomo Docomo端末での再生回数制限や保存不可などの設定方法などを記述 また、Docomo端末ではストリーミング再生も可能なのだけど、公式サイトにはそのことに関しては表記されていない。 ダウンロードの場合は、初期型900は300KBまで後継機901シリーズなどは500KBが限度となっています。 それ以上の大きいサイズの動画となるとストリーミング再生を選択したほうがよいかもしれません。 ストリーミングの場合は2Mまで再生可能になります。最新機種(MobileMP4バージョン7以降?)の場合は10Mまで可能になります。 ■ 本家ドキュメント ( NTT Docomo MP4対応iモーション ) http://www.nttdocomo.co.jp/service/imode/make/content/imotio
ケータイサイトのtableタグの特徴と、5つのデザイン例＆ソース : LINE Corporation ディレクターブログ
※文中のケータイ livedoorのPVに誤りがあり、修正いたしました (2010/9/22) こんにちは、『プチペット』を担当している吉沢です。 Webサービスのケータイ対応がやっと当たり前になってきたかと思ったら、今度はスマートフォンの対応と、モバイル業界の時の流れはものすごく速いですね。 そんな中、ケータイは新しい端末のシェアが増えていく度に、サイトで表現できる自由度が高くなり、単に作るだけではなく、デザインで差をつける時代が来ています。 それが読み取れる世の中の動きとして、たとえばモバイルデザインアーカイブさんは、年鑑が出るくらい書籍・サイト共に人気ですよね。また、ちょっと前に発売された書籍『ケータイサイト解体新書 デザインパターンから理解する実装テクニック』は、いろいろなデザインパターンからHTMLを引けるため、デザインをする上でとても参考になります。 携帯サイト年鑑2010 著
手っ取り早く携帯サイトを作成する時のhtmlテンプレート - webの人 @ryryo
最近phpをいじるがてら、ひさびさに携帯サイトに触れているためメモメモ。 携帯サイトで装飾を入れるとなるとi-cssが云々って話があったりしますが、正直テストサイトでそんな面倒なことをしていられないので、だいたい以下のようなhtmlで作成しています。 とりあえず携帯サイト作りたい時テンプレート <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN" "i-xhtml_4ja_10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Co
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
re-dzine.net situs togel online toto 2023 -
Webサイトをスマートフォン対応してと言われた時に見ておきたいサイトまとめ｜caraldo.net | WebとiPhoneとロードバイクが大好き！