2011-01-01から1年間の記事一覧
SOY JOY / 大塚製薬 http://www.otsuka.co.jp/soy/大豆を主原料とした機能性食品 「SOY JOY」 の広告サイト。 発売当初は、 「 低GI食品 」 であることを強調し、栄養学を軸にした広告を繰り広げた「SOY JOY」。 近年では、健康問題、食糧問題、環境問題など…
CSS3のモジュール 仕 様 概 要 Selectors セレクタ CSS Color 色指定 CSS Namespaces ネームスペース CSS Backgrounds & Borders 背景とボーダー CSS Multi-column Layout 段組 Media Queries メディアクエリ CSS Marquee マーキー CSS Ruby ルビの書式 CSS …
パンダカフェサイト作成時のポイント ☆左上が最重要スペース、中央に重要なものは置かない。 視線の移動……左→右、上→下 【チラシの例】 中央に置くのは、客引きのため投売りする商品。☆メインのグローバルナビゲーションは動かさない。 （書体ゴシック系。明…
WHITE WONDER CHRISTMAS / ISETAN http://www.isetanspecial.com/wonder/クリスマス期間限定の伊勢丹スペシャルサイト。 クラウス・ハーパニエミ氏の 『 ホワイトワンダーエデン 』 の世界で、 しばし浮世の憂さを忘れる。講座棚卸的ソース也。 今年のクリス…
HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>Crossfader</title> <style type="text/css"> <!-- *p2* { margin: 0; padding: 0; } div#container { width: 400px; margin: 50px auto; } img { border: none; } ul { list-style: none; } --> </style> <script src="js/bsn.js"></script> …</meta></head></html>
Webデザインについて ☆心理効果 （「どう見えるのか？」 「どう解釈するのか？」を常に念頭に置く）☆書体はできるだけ多く入手する。 （アドビのオープンタイプをはじめ、あらゆるもの）☆いま求められているｗｅｂデザインは手書き風のもの （どういうつくり…
テキストに影をつける（授業の復習） Never say no to Panda!HTML5 <html lang="ja"> <head> <meta charset="UTF-8"> <title>テキストに影をつける2</title> <link rel="stylesheet" href="html5reset.css"> <style> body{ text-align:center; } section{ background-image:url(images/pandaShadow.jpg); width:500px; height:340px;…</link></meta></head></html>
フローティング ブロック リキッド（バリエーション） 写真を差し替え 左右を広げてみた フローティング ブロック リキッド HTML5 <html lang="ja"> <head> <meta charset="UTF-8"> <title>フローティングブロック</title> <link rel="stylesheet" href="css/base.css"> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> </link></meta></head></html>
ポラロイド風ギャラリー1 HTML5 <html lang="ja"> <head> <meta charset="UTF-8"> <title>ポラロイド風ギャラリー</title> <link href="css/style.css" rel="stylesheet"> <script src="http://www.google.com/jsapi"></script> <script src="js/script.js"></script> </head> <body> <div class="polaroid"> </div></body></html>
やっと、おかずup。 HTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>1224okazu</title> <link rel="stylesheet" href="css/base2.css" type="text/css"> </link></meta></head></html>
![はてなブックマーク - HTML5 ： HomeWork [ 基礎 ▲ 演習 ] カラムレイアウト](https://b.hatena.ne.jp/entry/image/https://takahashijunko.hatenadiary.org/entry/20111225/1324825096)
おかず作成中
![はてなブックマーク - HTML5 ： HomeWork [ 基礎 ▲ 演習 ] カラムレイアウト](https://b.hatena.ne.jp/entry/image/https://takahashijunko.hatenadiary.org/entry/20111224/1324758814)
パンダのイメージを払拭!? 記憶に残るCM。 Buddy Hollyが、優しくせつなげに歌う 『 True Love Ways 』 の一節、 " ♪〜 just you know why 〜♩ 〜" に、秘められたxxx。 くれぐれも 「 NEVER SAY NO TO PANDA! 」 。
【演習A10】 <html lang="ja"> <head> <meta charset="UTF-8"> <title>演習問題10</title> </head> <body> <h1>ページ内の別の箇所にリンクしてみよう</h1> <p>このページの内で移動しよう。</p> <p><a href="#pafe">パフェの写真はこちら</a></p> <p><img src="images/cake2.jpg" width="360" height="360" alt="ベリーのソースがたっぷりとかかり、ミントの葉が添えられたチーズケーキです。"></p>…</body></html>
![はてなブックマーク - HTML5 ： HomeWork [ 基礎▲演習 ] テキスト修飾（ 1222 のつづき）](https://b.hatena.ne.jp/entry/image/https://takahashijunko.hatenadiary.org/entry/20111223/1324605589)
【演習A08】 ※choromeで表示。 <html lang="ja"> <head> <meta charset="UTF-8"> <title>演習問題08</title> </head> <body> <h1>HTMLソースを表示してみよう</h1> <p> やってみよう！5で作成したHTMLソースの一部を表示しよう。 </p> <pre><p>100<sup>2</sup>は、10,000になります。</p></pre> </body> </html> pre…………プログラムコード、HTML、アスキ…
![はてなブックマーク - HTML5 ： HomeWork [ 基礎▲演習 ] テキスト修飾（ 1221 のつづき）](https://b.hatena.ne.jp/entry/image/https://takahashijunko.hatenadiary.org/entry/20111222/1324569572)
【演習A02】 <html lang="ja"> <head> <meta charset="UTF-8"> <title>演習問題02</title> </head> <body> <h1>読書メモ</h1> <p> 宮沢賢治作品を読みました。 </p> <cite>オツベルと象</cite> <p> 牛飼いが話す物語で、 <q>オツベルときたら大したもんだ。</q>というフレーズが印象的だった。 </p> <blockquote> <p>「まあ、よかったねやせたねえ。」みんなはしずかにそばにより、鎖と銅をはずし</p></blockquote></body></html>…
![はてなブックマーク - HTML5 ： HomeWork [ 基礎▲演習 ] テキスト修飾 （1220 のつづき）](https://b.hatena.ne.jp/entry/image/https://takahashijunko.hatenadiary.org/entry/20111221/1324486877)
【演習A01】 <html lang="ja"> <head> <meta charset="UTF-8"> <title>演習問題01</title> </head> <body> <h1>日記</h1> <time datetime="2011-05-03" pubdate="pubdate">2011年5月3日</time> <p>今日は、夏休みに行きたい旅行先をピックアップした。</p> <p> 別府温泉<br> 大分県別府市 </p> </body> </html> datetime……日時の表記を日本語にしてよいことに pabdate ……投稿日が …
![はてなブックマーク - HTML5 : HomeWork [基礎▲演習]テキスト修飾](https://b.hatena.ne.jp/entry/image/https://takahashijunko.hatenadiary.org/entry/20111220/1324395615)
WordPress Plugin ☆全てのWordPress使いが導入を検討すべき１５のプラグイン http://kachibito.net/wordpress/15-should-consider-the-introduction-pl☆WordPressでブログを作ったら入れるべき27個のプラグイン http://www.authority-site.com/2010/04/wordp…
[ Feu （ フー ） ] http://denko.panasonic.biz/ebox/lighting/feu/index.htmlPanasonic 電工の B 向けサイト。 （第32回日本 B to B 広告賞※経済産業大臣賞受賞） 新しい明るさの単位 「 Feu 」 について多面的に説明している。私たちはこれまで、明るさを…
"フー" とは……？ レポート作成中。 ちなみに、この "フー" ではありません。 ↓
※ safari で 表示。 HTML5対応ブラウザ用 <html lang="ja"> <head> <meta charset="UTF-8"> <title>講師記録1219付の課題</title> </head> <body> <h2>講師記録1219付の課題</h2> <p>【問題】<br> 聖徳太子（しょうとくたいし）を<br> 「しょうとく」と「たいし」に<br> わけてルビを表示しなさい。 </p> <p> 【答え】 </p> <p> <ruby> 聖徳<rt>しょうとく</rt>太子<rt>たいし</rt> </rudy> </p>
[ KoUBOU ] http://www.koubou-d.com/グラフィックデザイン会社のサイト。 ページ移行や文字の動きが、実にエレガント。 作品集やブログもきっちりしていてみごたえあり。特に面白い表現をしているのがMAP。「古地図風表現」→「現代的表現」→「GoogleMap」と…
20 THINGS I LEARNED ABOUT BROWSERS AND THE WEB ※参考サイト http://www.20thingsilearned.com/ja-JP/home HTML5 対象ブラウザ WIN Chrome4 Firefox3/3.6 Opera10/10.5 Safari4 IE6/7/8 Mac Chrome5 Firefox3.6 Opera10 Safari4 HTML5 で実現すること Web…
パンダが気になる今日この頃。 メモとして。 味の素のボトルに、赤いパンダの顔がついているわけ。 [ 日経BIZアカデミーの記事 ] http://www.nikkeibp.co.jp/article/column/20111116/290719/?ST=career&P=1※ご参考…「アジパンダーズ」のサイトはこちらから…
SEO Pitshu （エスイーオー ピッシュ） ☆Yahoo!・Googleの各検索サイトで、キーワードで検索した結果、ホームページが何番目に表示されるかの出現順位を調査するSEOツール。http://siterepair.ddo.jp/seoexamine/ranking_form.html 上位表示のわけ 表示は、…
jQuery 「 横スクロール&LightBox 」 課題サイトにアップしました。 ☆背景の画像は、熱帯魚の水槽に敷く"サンゴ砂"の写真をPhotoshopで加工。 （フィルター→アーティスティック→塗料） （イメージ→色調補正→明るさコントラスト）html <html lang="ja"> <head> <meta charset="UTF-8"> <title>横スライド：サンプ</title></meta></head></html>…
concrete5 ☆「concrete5（コンクリートファイブ）」はページの中に「テキスト」や「画像」などの「ブロック」を積み重ねてページを構築していくコンセプトを持つ、WEBサーバーにインストールして使用するホームページ制作・運用する CMS （コンテンツマネー…
☆jQueryでタブパネルを作るチュートリアル http://ascii.jp/elem/000/000/468/468664/☆「Fumy RSS & Atom Maker」 http://www.nishishi.com/soft/rssmaker/☆jQueryでタブ作り http://jqueryui.com/download☆jQuer lightbox http://leandrovieira.com/project…
いちから 文字表示 文字リテラル 改行処理 数値リテラル エスケープシーケンス
PHP★演習問題 【課題001】 1500円の商品に消費税込みの金額を明示するには、いくらと書けばよいかPHPで表示させなさい。 <html lang="ja"> <head> <meta charset="utf-8"> <title>1212基礎演習１＿課題001_税込み価格</title> </head> <body> </body> </html> 【課題002】 「あなたは、山田一郎ですね。」と「あなた…
[ マチトキ ] http://machitoki.jp/ GMO系列の運営によるショッピングモールサービス 「カラメル」 で2010年の年間ルーキーショップ賞を受賞したショッピングサイトが、この「マチトキ」。 オンラインショップというと、一般に画一的なデザインが多いが、こ…
