10/11金 WEB上に公開したコードそのものをWEBブラウザでチェックする方法。

作業することは？

自分のサイトを作る
自分のフォルダの直下のindex.htmlは自分のサイトのトップページ

指定のページのコードを使って
http://www.css-designsample.com/csslayout/technique-3.html

まず、B   [確認参照]　WEB第10回 5/27　の手順でメニューをつくる

つぎにA  [確認参照]　WEB第11回 5/31　の手順でindex.htmlを作る

BをAに埋め込む

完成したらindex.htmlをサイトのトップページにアップロードする。

その動画↓
http://j.mp/20130927mov

これをダウンロードして見る事↑
18MBあります。

---

10/11金 WEB上に公開したコードそのものをWEBブラウザでチェックする方法。
http://wayohoo.com/より引用

Safariでソースコード（HTMLやCSS）をみる方法。

Safariでソースコードを見る方法です。

SafariのメニューバーのSafariをクリックして「環境設定...」をクリック

詳細タブの一番下にある「メニューバーに”開発”メニューを表示」にチェック。

するとメニューバーに開発が追加され、ウェブページのソースが見ることが可能になります。

右クリックからも見れます。
ソースコードをみるためのショートカットキーは「command + option + U」です。

こんな感じで。

ちなみに別ウィンドウアイコンをクリックすれば

このように広々とソースコードを見ることも可能です。

要素の検証がとても便利。

便利なのが要素の検証です。

たとえば、イメージ画像のHTMLやCSSを知りたいときは、そのイメージを右クリックして要素の検証をクリックします。

するとこのようにそのイメージのHTMLとそのHTMLに使われているCSSを覗くことが出来ます。

※注意: CSSを見る際には上の部分をクリックしましょう。

ちなみにCSSの値を変えればブラウザにそれを反映させることもできます。これは、ウェブサイトのコーディングをするときにホント使える機能だと思います。

Safariでユーザーエージェントを変更する方法

SafariのメニューバーのSafariをクリックして「環境設定...」をクリックします。

詳細タブの一番下にある「メニューバーに”開発”メニューを表示」にチェックをいれます。

するとSafariのメニューバーに開発という項目が現れるので、そこからユーザーエージェントに飛び、各ブラウザを選択できます。つまり、ここをいじればIEにも、Chromeにも、Operaにもなることができます。

ためしにiPhone版のSafariにしてみました。このようにMacからもスマートフォン向けサイトのチェックができるので、レイアウト調整の時に非常に便利です。