• ベストアンサー

ホームページビルダー15のフルCSSテンプレート

今現在、ホームページビルダー9を標準で使っていますが、新しくホームページビルダー15のフルCSSプロフェッショナルテンプレートでホームページを作成したいのですが、今現在のホームページをフルCSSプロフェッショナルテンプレートにダイレクトに張り付ける方法とかあるのでしょうか?それともまた一から作り直さなければいけないのでしょうか?できれば今現在のホームページを生かした状態でフルCSSプロフェッショナルテンプレートを使って作成したいのですが。いろいろやってみたのですが、できませんでしたよろしくお願いします。

  • CSS
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.2

リンクがきちんと読み込まれていないようですね。 5 作成したウェブサイトの影響 ( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%83%BB%E3%83%93%E3%83%AB%E3%83%80%E3%83%BC#.E4.BD.9C.E6.88.90.E3.81.97.E3.81.9F.E3.82.A6.E3.82.A7.E3.83.96.E3.82.B5.E3.82.A4.E3.83.88.E3.81.AE.E5.BD.B1.E9.9F.BF ) ならよいかな?  私の周囲のプロでホームページビルダーを使ってウェブページを桜精している人はいません。持っていたとしても、ビルダーで作成したページを裸にしてしまうためか、画像などを作るためです。専用ソフトのほうがよいですが、コスト的に安いので。  大事なことは、HTMLを正しく作成することです。これはオーサリングツールすべてにいえることですが、文章を読み解き、内容を理解して、最適な要素名(タグ)を選択してマークアップすること・・・これだけは何を使おうと著者か、読解力のある人でないとできません。  それさえしっかりできていれば、スタイルシートでどのようにもデザインできます。 【引用】____________ここから HTMLは、常に構造的マーク付けを規定するところのSGMLをルーツに持っている。HTMLの性質上、プレゼンテーションに関する要素や属性は、次々と他の機構、とりわけスタイルシートに置換えられていく。 また、文書の構造をプレゼンテーションと切り離すことで広汎なプラットフォームや多様なメディアでの文書提供コストを低下でき、文書の改訂も容易になるということが、経験的に知られている。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )]より  は、「文書の構造さえきちんとマークアップされていれば、様々にデザインできる」という意味です。  残念ながら、将来にわたってスタイルシートに対応できるツールはできないでしょう。原理的に無理な話です。  私は、スタイルシートを書くときには ・Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint.html ) ・The W3C Markup Validation Service ( http://validator.w3.org/#validate_by_input ) も通過して、HTMLは完成していますから、HTMLを見なくてスタイルシートが書けます。  たとえば div.section div.article{font-size:0.9em;border:solid gray 1px;} div.section div.article.note strong{color:red;}  は 「本文中の関連記事は灰色線で囲み、文字サイズを0.9で」 「本文中の関連記事(article)、かつnote(注意書き)内の強調文字列は赤くしよう」  とか・・、こんな単純なことすら、ツールではできるはずもないですね。 ましてや、HTMLに手をくわえないで(加えてはならないし) ・3カラムでデザインしていたものを2カラムにしよう ・i-phone用に狭い画面でも表示できるスタイルを作ろう ・印刷用に章番号をつけよう  などは不可能です。  だからプロは決して使わない・・  今までのものはそのまま、今後もフルCSSにしても、あまり手を加えずにそのままテンプレートに流し込むほうがよいでしょう。下手に手を加えると悲劇的になります。

adukimasu
質問者

お礼

とても参考になりました。とてもすっきりしました。ありがとうございました。

その他の回答 (1)

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

無理です。  私の仕事のもっとも大きな比重(負担)を占めるのがホームページビルダーの作成したウェブページの標準化です。  ホームページビルダーは、デザインのためにHTML自体を標準でないものに書き換えていますから、それを直す手段はありません。  古いデータはそのままにするか、全面的に書き直すしか方法はありません。基本的に、ブラウザで表示させて、それをコピーペーストすることすらできません(特にどこでも配置で作成されていた場合)。よってすべてゼロからの製作になります。  基本的に、ウェブオーサリングツール( http://ja.wikipedia.org/wiki/Web%E3%82%AA%E3%83%BC%E3%82%B5%E3%83%AA%E3%83%B3%E3%82%B0%E3%83%84%E3%83%BC%E3%83%AB )(特にホームページビルダー http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%83%BB%E3%83%93%E3%83%AB%E3%83%80%E3%83%BC )で作成されたページ(特に、HTMLやCSSをよく理解していない素人さんによって作成されたもの)は再利用はまったく不可能です。  Dreamweaverは、説明にも「HTMLやCSSの知識が必要」と書いてあるからまだしも、ホームページビルダーは「知らなくても作れる」なんて宣伝してるし、ユーザーも信じているから余計に厄介です。  現実には、どのオーサリングツールを使う場合も、というかオーサリングを使うなら余計にHTMLやCSSを知って理解しておく必要があります。そうしないと、ウェブオーサリングツールでとんでもない非標準ページを作成してしまいます。詳しくは上記リンクをご覧ください。  オーサリングツールを否定するわけではありませんが、HTMLはデザインをするものではなく、その文書の構造をマークアップするメタ言語( http://ja.wikipedia.org/wiki/%E3%83%A1%E3%82%BF%E8%A8%80%E8%AA%9E )です。すなわち、どれが見出しで、どの部分が引用で、どこが表、どこが目次なのかをマークアップしたものですから、内容を読み解き、最適なタグを選択する必要がありますが、それは著者か人でないとできません。オーサリングツールに頼れないし、頼られても困るでしょう。  ですから、文章を読み解きそれに最適なタグ(要素)を選ぶ作業はテキストエディタを使うにしろオーサリングツールを使うにしろ、HTMLの深い知識が必要です。私も当初は仕様書( http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.html )を座右において常に参照していました。  CSSは、現時点で対応しているオーサリングツールはありません。これは無理です。プロパティはなんとか対応していますが、最も重要なカスケーディング処理には未対応ですからCSSは手で書くことになります。  具体的には、たとえば、 <body>  <div class="header">   <h1>サイト見出し</h1>   <p>これは何とかのページ</p>   <div class="nav">    <ol>     <li><a href="./index.html">サイトのトップ</a></li> ・・・・    </ol>   </div>  </div>  <div class="section">   <h1>本文見出し</h1>   <p>ほげほげ・・</p>    <div class="aside">     本文と関係ないコラム的記事    </div> ・・・  </div>  <div class="footer">   <h1>文書情報</h1>    <div class="aside">     本文と関係ないコラム的記事    </div>・・ と、文書構造にしたがって正しくマークアップされたHTMLがあったとして、(オーサリングツールでこれができないのはわかるでしょう。)それをCSSで、「本文見出しを赤フッターのh1は緑で表示したい。」「本文中のコラムだけは少し小さい字で」「フッターは一回り小さい文字」「フッター中のコラムは大きさを変えない」となると div.section h1{color:red;} div.footer h1{color:green;} div.section div.aside,div.footer div.aside{font-size:0.9em;} という簡単なものでOK、HTMLに一切手を加える必要はない。  しかも、あとでCSSを直したいときもHTMLも開かなくてよいしブラウザで確認しなくても、フッターの文字を青にしたけりゃできる。  こんな単純なことですら、オーサリングで行うことはできない。たぶん一つ一つの要素を選択してHTMLに不要なidを付与して、CSSの悠長なものになる。  基本的に、オーサリングツールを使ってWeb標準(を正しいとすれば)のページを作成しようとすると、とっても煩雑で大変な作業になります。 ★結果として言えることは  既存のものはそのまま放って置くこと。  すくなくともHTMLとCSSはオーサリングツールに頼らない、頼るならきちんとHTMLやCSSの知識を身に付けること。   それができなければ、あえてウェブ標準(フルCSS)に惑わされず、非標準なものを作り続ける オーサリングツールの問題点 ( http://ja.wikipedia.org/wiki/Web%E3%82%AA%E3%83%BC%E3%82%B5%E3%83%AA%E3%83%B3%E3%82%B0%E3%83%84%E3%83%BC%E3%83%AB#.E5.95.8F.E9.A1.8C.E7.82.B9 ) ホームページビルダー「作成したウェブサイトの影響 」( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%83%BB%E3%83%93%E3%83%AB%E3%83%80%E3%83 ホームページビルダー「CSSへの対応」 http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%83%BB%E3%83%93%E3%83%AB%E3%83%80%E3%83%BC#CSS.E3.81.B8.E3.81.AE.E5.AF.BE.E5.BF.9C%BC#.E4.BD.9C.E6.88.90.E3.81.97.E3.81.9F.E3.82.A6.E3.82.A7.E3.83.96.E3.82.B5.E3.82.A4.E3.83.88.E3.81.AE.E5.BD.B1.E9.9F.BF )  これはウェブ標準のウェブページを作成するときの話です。あなたが「フルCSS」をウェブ標準のために考えられているなら、厳しいですが、このアドバイスでよいでしょう。  そうでないなら、フルCSSにこだわる必要はありません。  ウェブ標準とは何かは、下記のリンク先周辺をしっかりお読みください。 【引用】____________ここから HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )]より 【引用】____________ここから Webページのプレゼンテーションを向上させようという志は素晴らしいものではあったが、そのためのテクニックには思わぬ副産物があった。こうしたテクニックは、特定の人々、特定の時代状況でしか成り立たず、すべての人々、すべての時代状況において成り立つものではないのだ。こうしたテクニックの例を挙げよう。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Style Sheets in HTML documents (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )]より

関連するQ&A

  • ホームページビルダーのテンプレートについて

    ホームページビルダー20を使っています。 ホームページビルダー20で、レスポンシブデザインのサイトを制作しようと思います。私がしたいことは下記の通りです。 (1)レスポンシブデザイン(パソコンだけでなく、スマホにも対応したサイト) (2)テンプレートだが、写真や画像などを差し替えられること。 ※写真や画像は、フォトショップエレメントなどで作成します。 ホームページビルダー20には、下記の2つのタイプ(レスポンシブデザイン対応)があるようですが、(A)(B)とも、写真が画像は入れ替えられるのでしょうか? (A)SPのテンプレート (B)クラッシックのフルCSSテンプレート よろしくお願いいたします。

  • ホームページビルダーcssテンプレート編集について

    ・ホームページビルダー17でのccsテンプレートを利用しての編集について教えてください。 当方HP編集ど素人です。   ビルダー17に入っているcssテンプレートをほぼそのまま利用してサイトを作成しています。 テキスト等はテンプレートのまま文書を打ちかえて替えられたのですが、画像を追加してテンプレートにない位置に画像を入れたのですが、転送してみると画像が表示されません。 追加で画像を増やした分や、css素材のレイアウトコンテナーを利用して画像を挿入した部分などがダメです。ビルダー内で、プレビューするとしっかり表示されているのに、転送すると表示されません。 画像のファイル名は半角英数小文字にしていますがダメです。画像は転送後の状態です。 どなたか詳しい方で素人でもわかるように教えていただける方いらっしゃいましたら何卒ご回答よろしくお願いいたします。

  • ホームページビルダーV9でCSSテンプレートを開くとレイアウトが崩れる

    インターネット上で見かけるCSS無料テンプレートを使ってホームページをつくろうとしています ホームページビルダーV9でファイルを開きページ編集タブで見ると画面が崩れています 黄色の改行マークのような表示も出ます プレビュータブをクリックすると正常に戻ります ●ホームページビルダーV9ではCSSテンプレートが使えないのでしょうか ●また、設定を直すなどの操作が必要なのでしょうか テーブルでレイアウトしてあるタイプのテンプレートはそんなことはないようです しかし、今回はCSSをマスターしたいので、CSSのみのホームページにこだわっています よろしくお願いします

  • ホームページビルダ18のCSSがおかしくなりました

    月曜日までに出さないといけないので助けてください。 ビルダー18でホームページを作りました。 ほとんど完成していたところですが、 最後にCSSを少し触って、でもやめて、保存したところ、 index.html はじめサイト全体が、CSSがない状態になりました! フルCSSというので作っていたので、もとのフルCSSのテンプレートも CSSがない状態(文字情報だけ)になっています。 バックアップを取っているので、そちらのCSSファイル5個を 作っていたサイトに入れてみても、CSSとリンクができていないのか、 CSSがおかしくなっているのか、index.htmlが文字だけの状態になります。 バックアップのファイルは触っていないのに、なぜ元に戻らないのでしょうか? どうしたらいいのでしょうか? 月曜日までに作らないといけないのでどうかお願いします。

  • 初心者がホームページで、CSSを造りたいです

    今まで、ホームページ作成ソフト ホームページビルダーの、どこでも配置モードで、 素人なりに、ホームページを作成してました。 HTMLは、少しわかります。 時代の流れから、HTMLでは、幼稚な感じがしてしまい。 CSSの、ホームページを造りたいのですが、 素人の自分には、仕組みがさっぱりわからず困ってます。 CSSテンプレートのようなサイトから、素材をもってきても、 編集する方法がよくわかりません。 CSSが、簡単に使えるような方法があれば助かります。 よろしく御願いいたします。

  • ホームページビルダーでテンプレートが転送されない

    ホームページビルダー16です。 フルcssテンプレートからサイトを作成しました。 そして転送をしたのですが、ページとサイトで転送をしても、テキストはいくのですが、テンプレートと画像が転送できていません。 プレビューでみるとちゃんと見えるのですが、転送するとテキストのみで崩れています。 バイナリモードとテキストモード、パッシブモードでも転送してみましたが、変わりません。 どうか助けてもらえないでしょうか。。 どうぞよろしくお願い申し上げます。。

  • 良いホームページビルダーやテンプレートを教えて

    現在通信販売のホームページ作る勉強をしていますが、いま使っているホームページでは商品の写真をクリックしたときに商品の詳細な説明ページに移動する設定がうまくいきません。 それで良いホームページビルダーやテンプレートがありましたら、教えてくださると大変助かります。 よろしくお願いします。

  • Homepage managerでcssテンプレートは使えますか。

    Homepage managerでcssテンプレートは使えますか。 レイアウト用にcssのテンプレートを使ってみようと思い、他のサイトからダウロードしたのですが、Homepage managerでとりこんで使うことができるのでしょうか。スタイルシートファイルエディタを使うのかと思ったのですが、やり方がまったくわかりません。 また、css自体よくわかっていないのですが、このレイアウトの中に細かい表などを作成していくことも可能なのでしょうか。 ご教授よろしくお願い致します。

  • ホームページビルダー15の操作について

    ホームページビルダーを最近購入して WEBを作成しているのですが、 「共通部分の同期」に関する質問です。 最初からフルCSSプロフェッショナルテンプレートから作成すれば、 ID=ヘッダーやID=フッターなどの変更箇所をクリックして 「共通部分の同期」ボタンで変更が一気に反映されるのですが、 フルCSSプロフェッショナルテンプレートから作成せずに 自分で白紙ページからサイトを作成した場合も 同じように「共通部分の同期」で一発更新できるようにしたいと 思っております。 このやり方に関して市販の参考本を見ても載っておらず、 ネットで探しても、解決法にたどりつけず、 ジャストシステムのサポートに電話しても 「ただいま込み合っておりまして、順番につないでおります」状態で つながらず、ほとほと困っております。 どなたかご教授いただければ幸いです。 何卒、宜しくお願い申し上げます。

  • ホームページビルダー19のワードプレステンプレート

    ホームページビルダー19のワードプレステンプレートでホームページを作成しようとしていますが、使用したいテンプレートの背景色や文字の色を全体に変えたいのですが、どのような方法がありますか。 私はホームページを作るのは実は初めてです。

専門家に質問してみよう