ファイルのチェックアウト・チェックイン機能

Dreamweaver

Dreamweaver CS3,CS4

Dreamweaver ファイルのチェックアウト・チェックイン機能

同じサイトを、複数人で管理していると、そのうちだれかがアップロードしたものを、古いファイルで上書きしてしまう、という問題が発生します。
メールで連絡、などにしていても、限界があるので、バージョン管理ソフトをなるべく使いましょう。

ホームページ編集ソフトとして定番のDreamweaverにも、簡単バージョン管理機能があります。
シンプルなので、ぜひ使いましょう。

語句の意味

チェックイン…これからこのファイルを編集しますよ、ということ(ホテルのチェックインと同じです。)
チェックアウト…最後にそのファイルを編集した人はだれか、ということです。

方法

  1. Dreamweaverにて、サイトの定義をします。
  2. 手順は、ヘッドメニューの「サイト」→「新規サイト」をクリック
  3. 各項目は、ウィザードに沿って入力します。
  4. 「ファイルのチェックイン/チェックアウト」を有効にします。

すると、「ファイル」パネルなどで、最後に編集したユーザーを、チェックアウトユーザーとしてDreamweaver上で参照することができます。
また、サーバーへアップロードする際、
「このファイルは○○によってチェックアウトされています。
上書きしますか?」
と警告が出ますので、間違って上書きすることを防ぐことができます。

他のソフトで作成したファイルを、自分の名前でチェックアウトする

他のソフトで作成したファイルで、誰かのチェックアウトを上書きしようとしても、ファイル自体はアップロードしてくれますが、チェックアウト名だけ上書きしてくれない場合があります。
その場合は、自分でファイル上で右クリックし、「チェックアウト」を選択してチェックアウトしましょう。

ファイルのダウンロードをHTMLだけで実装

HTML5

ファイルのダウンロードをHTMLだけで実装

ファイルをダウンロードさせるスクリプトは下記のサイトさんで紹介されているように、PHPなどを使ってやる方法を使っていました。

http://thr3a.hatenablog.com/entry/20131017/1381974853

ですが!↓のサイトさんで、HTML5ではこんな面倒なスクリプトを書く必要がない!ということを紹介されていて、目からうろこだったのでかいておきます。

http://www.workabroad.jp/tech/856

書き方

 <a download="ファイル名" href="ファイルへのリンク">

具体例

 <a download="crop.mp4" href="uploaded/crop.mp4">

ファイル、フォルダの操作の基本

Windows 初心者向け

ファイル、フォルダの操作の基本

ファイル、フォルダ操作はアイコン使って行います。
ファイルを開くにはダブルクリックします。右クリックしてメニューから開くを選んでも開けます。

コピーする方法はいくつかあります。

1,コピーしたいファイルを右クリックして、メニューの「コピー」をクリック。
2,貼り付けたい場所で右クリックして、メニューの「貼り付け」をクリック。
3,コピーしたいファイルを選択して、メニューバーの「編集」-「コピー」をクリック。
4,貼り付けたいフォルダを開いて、メニューバーの「編集」-「貼り付け」をクリック。
5,「共通の作業」の「ファイルとフォルダのタスク」の「このファイルをコピーする」をクリック。
6,貼り付けたい場所を選択して「コピー」をクリック。
7,コピーしたいファイルを貼り付けたい場所まで「Ctrl」を押しながらドラッグ&ドロップする。
8,コピーしたいファイルを貼り付けたい場所まで右ボタンでドラッグ&ドロップする。
9,メニューの「ここにコピー」をクリックする。
10,コピーしたいファイルを選択して「Ctrl」+「C」を押す。貼り付けたい場所で「Ctrl」+「V」を押す。
11,などです。コピーは何回でも貼り付けることができ、コピー元はそのまま残ります。
 多くの方法でコピーと貼り付けの作業を行うことになりますが、別の種類の方法で行ってもかまいません。
例:右クリックメニューの「コピー」をクリックしてコピーして、「Ctrl」+「V」で貼り付ける。など

移動(切り取りして貼り付け)する方法はいくつかあります。

1,移動したいファイルを右クリックして、メニューの「切り取り」をクリック。
2,移動したい場所で右クリックして、メニューの「貼り付け」をクリック。
3,移動したいファイルを選択して、メニューバーの「編集」-「切り取り」をクリック。
4,貼り付けたいフォルダを開いて、メニューバーの「編集」-「貼り付け」をクリック。
5,「共通の作業」の「ファイルとフォルダのタスク」の「このファイルを移動する」をクリック。
6,貼り付けたい場所を選択して「移動」をクリック。
7,移動したいファイルを移動したい場所までドラッグ&ドロップする。(ドライブ間はコピーになる)
8,移動したいファイルを移動したい場所まで右ボタンでドラッグ&ドロップする。
9,メニューの「ここに移動」をクリックする。
10,移動したいファイルを選択して「Ctrl」+「X」を押す。移動したい場所で「Ctrl」+「V」を押す。

例:右クリックメニューの「切り取り」をクリックして切り取りして、「Ctrl」+「V」で貼り付ける。など

ファイルの削除は削除したいファイルを右クリックして、メニューの「削除」をクリックし、表示されたダイアログで「はい」をクリックします。

名前の変更は変更したいファイルを右クリックして、メニューの「名前の変更」をクリックし、名前を入力します。
FrontPage

ピクセル数をはかる

Webサイト作成 TIPS

画面上で何ピクセルかわかるツール

Webを作成していると、
「ん~、ここ何ピクセルだろ?たぶん500ぐらい?
絶対音感みたいに絶対ピクセル感があったらほしいな!」

と思うことがあると思いますが、それを手助けしてくれるツールです。

・ピクセル定規 (フリーソフト)
http://www.vector.co.jp/soft/win95/util/se313761.html

縦、横が変えられるので、本当に机の上で定規を測るのと同じ感覚で使えます。
お勧めです。[smile]

ビットマップ画像をきれいに表示する

Flash

スムージングにチェックをつける

普通にライブラリにJPEGやPNG、GIFなどのビットマップの画像を取り込むと、Flashで書き出したときに美しく表示できません。

そのため、次の手順で変更します。

  1. ライブラリで画像を選択し、右クリック
  2. プロパティを表示し、「スムージング」にチェックをつける。
  3. サブウィンドウで「圧縮 ロスレス(PNG/GIF)を選択する。

macromedia FlashMX version6.0の話しです。

配置場所によっても画像が劣化する

Flash内でJpeg、PNG、GIFのそれぞれ画像を使用する場合には配置にも気を配りましょう。

Flash内では、0.1ピクセル単位で配置を指定する事が可能ですが
必ず画像をインスタンス化する場合は、&color(#ff0000){1ピクセル単位での配置};とします。

Flash内では画像の表示管理が1ピクセル単位となてっているので、配置で
0.1ピクセルなどを指定すると、&color(#ff0000){小数点以下のピクセル部分は近似値の画像表示};となります。

”配置を設定するウィンドウの表示方法”
&ref(Flash_jouhou_window.jpg);

”画像インスタンスの表示位置設定例”
&ref(Flash_jouhou_window.2jpg.jpg);

Flash内での画像の拡大・縮小・変形は基本的にはしてはいけない

Flashで画像を扱う際にもっとも基本的な事項です。
画像を拡大・縮小・変形(表示角度変更を含む)をする際には必ずPhotoShopなどの画像加工ソフトで画像加工を行ってからFlashに読み込みましょう
(Flash自体が画像加工処理を得意とするアプリケーションではない為、拡大・縮小・変形をFlashアプリケーション内で行うと、著しく画像が劣化します。)

モーションで徐々に拡大するなどの画像処理を行いたい場合には
画像が最大の時に表示させたいサイズのものを取り込んで作業を行いましょう。
この場合、画像シンボルに対して「スムージングにチェックをつける>#v96a1bc6」の作業をかならず行ってください。見た目が格段に違います。

PNG形式でボタンなどの素材は取り込む

Flash自体は、画像加工ソフトとしての性能が低いので
Photoshopなどの画像加工ソフト/Illustratorなどのドロー系ソフトを利用してボタンなどの素材を作成してFlashに取り込ませるのが一般的です。

Illustratorで作成した画像はベジェ曲線の情報も含めて取り込める方法がありますが
ここでは、全ての画像加工ソフト・ドローソフトに対応できる画像取り込みに適用できる方法を案内します。
有効な方法として”PNG形式での保存”データーを取り込むというです。

”PNG形式を使う利点”

  • -透明部分がある画像が取り込める
  • -取り込んだ際に劣化がない

大まかにFlashで画像を読み込ませる際は

  • ボタンなどの素材  ⇒ PNG形式
  • 写真などの素材   ⇒ JPEG形式

と覚えておくと作業効率が良くなります。