>>
38 ミサキさん
7.0の場合[ビュー【一番上、右から三番目】]の中に[定規【下から8番目】]という項目があります。
ここにチェックマーク(vのようなマーク)を入れますと、画像の上と左に定規が出ると思います(ものさしツールではありません)
定規を出したら、定規の上にマウスを乗せて左クリックしながらマウスを動かすと青(標準の色です)の線が出ると思います。
定規の単位は環境設定【[編集]の一番下】]の[単位・定規]で変更出来ます。HP作成されていらっしゃるのでしたら定規の単位「ピクセル」にしておくと良いと思います。
−−−ここまで準備が出来たらいよいよスライスをしてみましょう
●Step1
定規からマウスを左クリックした儘動かして、適当な場所で留めます。後ほどtableタグ内に入れる関係上、なるべく同じ大きさで切るのが良いでしょう。
逆に言えばイラストを描くときに切りやすい大きさにしておくのがスライスをしやすくします。(500*600ピクセルのように100ピクセル単位が切りやすいでしょう)
●Step2
ガイドラインを引いたら[スライスツール]を選択します。
左側のアイコン(作業ツールがいろいろ入っている)の中にある右側、上から三番目のナイフのようなアイコンを選択しますと「ガイドに沿ってスライス」というボタンが、[ファイル][編集]・・・等が並んだ下のバーに表示されていると思いますので、ここを押してください。
●Step3
[ファイル][Web用に保存]を選択します。
左上の画像の上にマウスを置き、左クリックすると画像が暗くなります。この状態で[保存]ボタンを押してください。
[ファイル名]をgazou(名前は任意で結構です)とし、[ファイルの種類]を[画像のみ]として保存してください。
●Step4
保存先にimageという名前のフォルダが出来、中にスライスされた画像が番号を振られて保存されているのが確認出来ると思います。
●Step5
画像を置きたい場所にtableタグを切ります。
縦横それぞれに切った数と同じだけの箱を用意します。
4分割なら縦2横2ですね。
tableタグの中に画像を入れます。順番を間違えないように^-^
テーブルタグの先頭を<table border="0" cellpadding="0" cellspacing="0">と書き直してください。こう表記することで「テーブルを非表示」する事が出来ます。border=0はテーブル枠非表示(0ピクセル)、cellpadding=0はテーブル間隔のピクセル値(0ピクセル)となります。
−−−−−
以上で画像を早く(実質は軽くなっていませんが)見せるように出来ると思います。
企業のHP等にいきますと、幾つもの画像がどどっと表示されて大きなバナーや画像になるのを経験された事もあるかと思いますが、多くの場合は上記に記載した「スライスで画像を切り分けてtableタグを使う」手法が取られていると思います。(違うやりかたの場合もあります)
わからない点がありましたらどのステップがわからなかったかを添えてご質問ください。
尚、[]でくくった言葉はフォトショップ内に出てくる文字、
【】でくくった言葉は表示されるタブ内の位置とさせて頂きました。