よろしくお願いいたします。
初心者ですがとりあえずHPビルダー8.0を使ってHPを作りUpしました。ただあまり凝ったデザインができなかったので、PhotoshopとImageReadyを使っていろいろ試してみました。スライスした画像をビルダーで表示することも何とかできるようになり、今回初めてアニメーションgifに挑戦しました。
そこで質問なのですが、たとえばImageReadyで編集中のページの中央にアニメーションgifを配置することはできますか?私的にはImageReadyでページ全体を制作し、任意の場所にアニメーションgifを配置し、すべて完成したところで、HPビルダーへ持っていきたいんです。別々にもっていった場合、通常の編集モードでうまく配置できないと思うんです。どこでも配置モードを使えばいいかもしれませんが。
そのあたりの事をご存知の方教えてください。よろしくお願いいたします。
No.3ベストアンサー
- 回答日時:
>アニメーションgifを貼り付けたのはドラッグ&ドロップでやりました
No2の2でも書いたように基本的にPhotoshopではアニメーションgifは扱えませんので、ImageReadyで扱って下さい。既に出来上がっているアニメーションgifを貼り付けたい場合も、まず、Photoshopで背景となる画像等を配置して(最初からImageReadyでも可)アニメーションgifを貼り付ける場合は必ずImageReadyで作業して下さい。
保存もImageReadyでやったほうがよいですね。Photoshopですとレイヤーが統合されてしまうことがあります。
(先の回答で混乱させてしまっていたらごめんなさい)
>アニメーションを貼り付けた新規書類はweb用に保存でjpgで保存しました
他の部分はjpgでもgifでも画像に適したものでよいですが、アニメーションgifの部分のスライスだけは、必ずgifで保存して下さい。
ImageReadyのレイヤーでアニメの部分のレイヤーを選択し、[レイヤー]-[レイヤーに基づく新規スライス]を使えばアニメ部分だけのスライスが簡単にできます。そこをレイヤー選択ツールで選択し、最適化パレットにGIFと表示されていれば大丈夫です。それを最適化ファイルの保存をすれば、適切なhtmlが保存されるはずです。
この回答への補足
こんばんは。
返事が遅くなり申し訳ありません。
40代も半ばを過ぎますと、飲み込みガ悪くなりまして・・・
やっとできました。でも何か自信がない。
これでよいのか最終確認させてください。
1.アニメgifをImageReadyに貼り付けてもアニメは動かない。
それを「最適化ファイルの保存」してもアニメは動かない。
2.「最適化ファイルの保存」したファイルをHPビルダーへ持っていってもHPビルダー上ではアニメは動かない。
3.HPビルダー標準モードで、メニューバーの真ん中辺りにある「e(IEの起動)」のボタンを押してIE上でプレビューしてもアニメは動かない・・・
これって絶対おかしくないですか?特にIEでも動かないなんて。
1と2は「そんなものかな」て思ってましたけど・・・
アドバイス頂けましたらよろしくお願いいたします。
No.2
- 回答日時:
1.ごめんなさい。
これは私の癖(保存はPhotoshopでやる)でした、ImageReadyで保存されても問題ないと思います。2.既存のアニメーションgifをPhotoshopで開くと一番最初の画像(フレーム)だけの静止画になってしまうと思います。
既存のgif形式のファイルをアニメーションのままPhotoshopで使いたい場合は、一度ImageReadyで開いて(こうするとアニメの全コマがレイヤーとして表示されます)、その後Photoshopに戻ればいいかと思います。
また、作成した画像を保存する際はWeb用保存(最適化保存)だけでなくPSD形式でも保存されることをお勧めします。そうでないと後から再編集する時面倒なので。
3.ご質問のように「ページ全体」をスライスで作られる場合は問題なさそうですね。
ページの一部だけにスライスされた画像を使う場合はhtmlを直接コピー&ペーストしたほうが早いのですが、この場合はこっちのほうが楽ですね。
PhtoshopとHP作成には人それぞれやり方があるなーと再認識しました。
htmlの右クリで「HPビルダーで編集」があるなんて気づかなかった・・・(笑)
ご不明な点がありましたら、何度でもどうぞ。判る範囲のことはお答えいたします。
この回答への補足
遅くからすみません。
試行錯誤に悪戦苦闘。ちょっと凹んでます。
何とかできましてHPビルダーで開いてみました。画面上では全く問題ないのでIEでプレビューしましたが、アニメーションは動きません。どこが悪いのでしょうか?Photoshopで新規の書類(800×600 72PPI)にアニメーションgifを貼り付けたのはドラッグ&ドロップでやりました。Photoshop上ではアニメーションは動きません。アニメーションを貼り付けた新規書類はweb用に保存でjpgで保存しました。
こんなやり方でよいのでしょうか?
よろしくお願いいたします。
No.1
- 回答日時:
出来ますよ。
私の場合はHPの画像(写真なので基本的にjpg)の一部だけアニメーションgifにして(ここまでImageReadyで作業)、それをPhotoshopでスライスし、保存したhtmlソースをHPビルダーに貼り付けました。注意点としては、htmlをHPビルダーに貼り付けると、
スライスした画像と画像の間に隙間が出来ることがあります。
この場合は画像の属性の枠表示にいったんチェックを入れて、枠の幅を0にし、枠の表示のチェックをはずすと隙間は消えます。
あと、私は「どこでも配置モード」は一切使いません。どこでも配置モードは、上から何ピクセル、左から何ピクセル、にこの画像を配置する、というやり方ですので、作成者の環境で綺麗に見えても、
閲覧者のディスプレイの解像度によってはめちゃくちゃな表示になったりします。
(HPB8あたりはその辺が改善されているかもしれません。私はHPB6.5使用なので)
上記のスライスした画像の配置も、単にテーブルで画像を配置しているだけなので、これも、通常モードで綺麗に出来ますよ。
ただ、ページ「全体」でこれをやってしまうと、画像が大きくなって読み込みに時間がかかる場合もありますからご注意を。
(通常、ページ全体でこう言うことをやる場合はFlashのほうが適しているかと思います)
ご参考までに。
この回答への補足
どうもありがとうございます。
回答の中で3点ほど質問があるんですが
1.>(ここまでImageReadyで作業)、それをPhotoshopでスライスし・・・
とありますが、スライス→最適化保存の作業はImageReadyではなくPhotoshopでやるわけですね?
2.Photoshopへのアニメーションの貼り付けはページ全体とアニメーションのファイル両方を開き、アニメーションをドラッグ&ドロップしてやる方法でよろしいでしょうか?
3.>htmlをHPビルダーに貼り付けると・・・
とありますが、私がやった方法は、htmlファイル(IEのアイコン)を右クリックし、HPビルダーで編集をクリックしてますが、その方法でよろしいでしょうか。
重ねてお願いいたします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- ノートパソコン gifアニメ―ションを動画(mp4でOK)にしたい 1 2022/08/14 09:51
- デスクトップパソコン ホームページビルダー15 1 2023/05/30 12:30
- その他(Microsoft Office) ピボットテーブルへの集計フィールド挿入 1 2023/02/26 11:33
- Ameba(アメーバブログ) アメブロは、HTMLのタグの入力を許さないブログ・サイトですか? 1 2023/06/18 18:48
- ホームページ作成・プログラミング アメーバ・ブログは"HTMLタグ"を許可してないのですか? 2 2023/06/17 21:08
- Visual Basic(VBA) エクセルマクロでアニメを作る方法を教えてください。 1 2023/02/07 14:27
- HTML・CSS 画像が分割されて切り替わる、ループアニメーションが作りたい 7 2023/05/27 17:12
- 郵便・宅配 アマゾンの配送 8 2023/08/01 09:08
- 画像編集・動画編集・音楽編集 AfterEffectでのシャターの挙動がおかしい 1 2023/05/07 00:38
- その他(IT・Webサービス) ホームページにカウント数を表示する 2 2022/10/28 10:37
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ペイントで丸くトリミングして...
-
メタセコイアで、どうやって画...
-
IllustratorのWeb用に保存の「...
-
画像のリサイズ&上書き保存を...
-
画像を自動的に配置できるフリ...
-
Illustrator 埋め込んだ画像が...
-
フェイスブックが急に利用停止...
-
GIMPで切り抜き
-
JPEG画像のバイト数を減らすに...
-
WEBカメラでの定期的な静止画の...
-
macイラレとwinイラレの互換...
-
動画のキャプを連写
-
突然ネットのつながりが遅くな...
-
イラレでリンクが勝手に埋め込...
-
グーグルの無料・画像ソフトで...
-
GIMPで重ねた下の画像がうっす...
-
excelの列幅高さが勝手に変わる...
-
ワード B4→A4に縮小印刷す...
-
ワードA3で作成したファイルをA...
-
邪魔なwww.softonic.jpの消し方...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
イラストレータにtiff画像は貼...
-
JPEGの画像を重くしたい
-
一太郎に画像を挿入するとファ...
-
JPGファイルなのに読み込めない。
-
pngファイル内の複数の画像を1...
-
レイヤーを結合せず、photoshop...
-
JPG画像のレイヤー分解?編集?...
-
VBAでwebの画像を名前を付けて...
-
保存形式TIFFからJPEGやEPSへの...
-
ペイントで丸くトリミングして...
-
JPEG画像のバイト数を減らすに...
-
gimpで綺麗に文字を入れる方法...
-
保存したホームページのファイ...
-
uwsc 画像の取得および保存方法...
-
macイラレとwinイラレの互換...
-
GIMPで切り抜き
-
gimpですりガラスのような画像...
-
商品+ぼかした影”だけ”をEPS保...
-
PS4Proでブラウザを使っていま...
-
画像の色が白黒になる
おすすめ情報