改行コード

しろうさぎのwebnotebook

改行コードを「CR LF」から「LF」に変更と指示が。。。

何のことだろう？？

改行コードとは？

コンピュータは文字をすべて文字コードという数値で処理します。
改行を表すのに用いられるコードが改行コードです。
改行コードはOSによって異なります。


OS コード表記 16進表記 10進表記
Macintosh 0D 13
Windows 0D 0A 13 10
UNIX 0A 10


MacとWindowsマシンでは改行コードが異なります。
MacではCRコードが、Windows（MS-DOS）ではCRコードとLFコードが2個1組で、改行を表しています。
さらにUNIXではLFのみで強制改行を実行します。

どうして変更するの？

HTMLファイルであれば、どの改行コードであってもブラウザが適切に処理してくれるのですが、CGIスクリプトはOSに適した改行コードでないと、エラーになってしまいます。

例えば、Windowsで作成したCGIスクリプトをUNIXのサーバーに転送する際は、改行コードを から に変換してする必要があります。

設定方法

Dreamweaverの場合は、
[環境設定] - [コードフォーマット]で改行タイプを変更します。　

target="_blank"を使わずにjqueryを使って別窓でリンクを開かせる

jquery

外部へのリンクにtarget=_blank属性を付けることはアクセシビリティの観点から望ま しくなく、別ウインドウで開くかどうかはユーザーが判断すべき。。。


ということで、
classと付けて、別ウインドウで開くようにしてみよう！


■jquery

$(function(){
        $('.blank').click(function(){
        window.open(this.href, '_blank');
        return false;
        });
});


■HTML

<a href="URL" class="blank">別ウインドウで開く</a>

オプション

■jquery（アイコン付）

$(function(){
        $(".blank").append('&nbsp;<img src="img/blank.gif" border="0" />');
        $(".blank img").css("vertical-align","text-top");
        $(".blank").after('&nbsp;');
        $('.blank').click(function(){
        window.open(this.href, '_blank');
        return false;
        });
});

サイト丸ごとダウンロードできる「Website Explorer」

解析したサイトから、ファイルを指定して、またはフォルダごとまとめてダウンロードすることがでる。
トップレベルフォルダを指定すればサイトの丸ごとダウンロードが可能。


指定したWebサイトの階層構造を調査できるソフト。URLを指定して[開始]ボタンを押すと、そのWebページのリンクを順にたどり、指定したURL以下の階層にあるフォルダ構造を調査することができる。


■ダウンロード
Website Explorer（ウェブサイト・エクスプローラ）

対応OS：Windows 95/98/Me/NT/2000/XP/Vista

サーバー名の取得

PHP

$_SERVER変数

ヘッダ、パス、スクリプトの位置などの情報を有する配列。

$_SERVER["SERVER_NAME"];

サーバー名取得



■PHP

変数名 = $_SERVER["SERVER_NAME"];

で取得する
↓
こんな感じ。。。

<?php
$svName = $_SERVER["SERVER_NAME"];
?>


■HTML

<a href="https://<?= $svName; ?>/mailmagazine/form.php">メルマガ会員登録</a>

iモードHTMLシミュレータII

ドコモの携帯電話によるWeb表示をPC上で確認「iモードHTMLシミュレータII」

「iモードHTMLシミュレータII」は、
ドコモの携帯電話によるHTMLおよびFlashの見た目や動作を確認できるソフト。

Windows XP/Vistaに対応するフリーソフトで、（株）NTTドコモのWebサイトからダウンロードできます。


■ダウンロード
iモードHTMLシミュレータII | サービス・機能 | NTTドコモ
http://www.nttdocomo.co.jp/service/imode/make/content/html/tool2/

iPhoneページの設計ポイント

iPhone

ページサイズ

・ページサイズは横幅320pxを基準に設計
・デスクトップ･･･740〜960px前後で想定して設計するのか一般的
・iPhone･･･横320px × 縦480px
向きをかえると 横480px × 縦320px
・iPhoneは通常縦表示のときの横幅320pxを基準にしてページ設計する

画像サイズ

・画像のサイズも横幅320pxまで
・サイトの幅が320pxなので、画像サイズも横幅320px以内に収める
■ファイル形式の制限

ファイルの種類 制限
GIF,PNG,TIFF 3メガピクセル(width×height≦1024px×1024px×3)
JPEG 32メガピクセルまで
HTML,CSS,JavaScriptなど
個別のファイル		 10メガピクセルまで

・ファイルサイズだけでなく、大きさ（ピクセル数）が制限の対象になるので要注意！
・ファイルサイズを小さくすれば、それだけページ表示速度が向上する

文字サイズ

・文字サイズ（font-size）は、デスクトップよりもやや大きめの14px〜16px
が読みやすい

行間

・文字サイズの1.4(140%)〜1.6(160%)倍程度で指定
・文字量が多きときなどは、font-size:14px, line-height: 1.4;程度に調整して、スクロールする手間を減らすこともできる。。。

ページの左右の余白

・コンテンツの左右の余白に10px程度あける
・窮屈感･･･スペースを空けると窮屈にも見えず丁度いいバランスになる
・きれいに見せる

ナビゲーションリンク

・ボタンやリスト型のリンクの場合、縦幅を44px前後にするとタップしやすくなるとされている
・ページによっては大きすぎることもあるので、縦幅をやや小さくしたり、リンクの周囲の余白を広げたりするのもよい

ページの余白や、ナビゲーションリンクの高さについての情報

・Appleの「iPhoneヒューマンインターフェスガイドライン」を参考に。。
・アプリケーション開発者の資料だけど、webページのレイアウトの参考にもなる。。。

ユーザビリティとは（Usability（使用性））

しろうさぎのwebnotebook

定義

国際規格のISO 9241-11では、ユーザビリティを「特定の利用状況において、特定の利用者によって、ある製品が、指定された目標を達成するために用いられる際の、有効さ、効率、利用者の満足度の度合い」と定義している。


有効さ（Effectiveness）
利用者が、指定された目標を達成する上での正確さ及び完全さ


効率（Efficiency）
利用者が、目標を達成する際に正確さと完全さに関連して費やした資源


満足度（Satisfaction）
不快さのないこと、及び製品使用に対しての肯定的な態度


利用の状況（Context of use）
利用者、仕事、装置（ハードウェア、ソフトウェア及び資材）、並びに製品が使用される物理的及び社会的環境