• 締切済み

ホームページ作成中ですが、タグで分からない所を教えてください。

現在、書籍やネットでHTMLを勉強しながら、自分でホームページを作っている最中です。作りたいデザインはあるのにタグが分からないので教えてください。 サイトデザインとしては、ページを700~800ピクセルくらいで作って、左右の余白は、背景をボーダーの素材を使用、例のHPのようにページの右側に薄く影を付けたいのです。(ソースを見てもサッパリで・・・) (例)高松西ロータリークラブ http://www.88club.com/rc/ また書籍やネットでは項目ごと、例えば「文字の装飾」「リンク」「表の作成」など辞典のように説明していますが、全体の流れがイマイチ分かりません。 1つのホームページを0から初めて完成まで順に手順を紹介しているようなサイトがあれば教えてください。 お忙しいところ申し訳ありませんが、宜しくお願い致します。

みんなの回答

  • meah1835
  • ベストアンサー率51% (265/512)
回答No.2

>0から初めて完成まで  ↓ 目標サンプルページがあってとても理解しやすいですよ。 http://homepage.shichihuku.com/ >薄く影を付けたい  を除けば、質問者様のご要望のサイトが出来上がると思います。

jaikoooo
質問者

お礼

お忙しいところ、ご回答ありがとうございます。 教えていただいたサイト、とても分かりやすいです。 自分ではタグ辞典のようなサイトや書籍しか見つけられなかったので、紹介してもらったような一連の流れがあると、とても勉強になります。 本当にありがとうございました。

  • BlurFiltan
  • ベストアンサー率91% (1611/1754)
回答No.1

そのページはテーブルのセルの背景に「影」の画像を使っているようですよ。 その名もズバリ「kage.gif」。 コレ↓ http://www.88club.com/rc/img_cmn/kage.gif 上のURL文字列のGIFへのリンクがかかった部分を右クリックするなどして, 対象(GIF)を任意のフォルダに保存させてもらうとします。 そしてその GIF を保存したフォルダ内に 任意の名前で次の HTML を保存してもらうと簡略例が見えると思います。 ----------------------------------- <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>サンプル</title> </head> <body bgcolor="#E8E8E8"> <div align="center"> <center> <table border="0" width="500" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF"> <tr> <td width="499"> <p>aaa</p> <p> </p> <p> </p> </td> <td width="1" background="kage.gif"><img border="0" src="kage.gif" width="5" height="1"></td> </tr> <tr> <td width="499"> <p>bbb</p> <p> </p> <p> </p> </td> <td width="1" background="kage.gif"> </td> </tr> </table> </center> </div> </body> </html> ----------------------------------- 背景にすると同時に この GIF をスペーサーとしても使っているようです。 Google検索 「spacer」 http://www.google.co.jp/search?hl=ja&q=spacer&lr=&aq=f&oq= W3C などの勧告で,こういう HTML の書き方は良くないものとされていますし 最近はあまり見かけませんが, まあ,1つの方法ではあるという例にはなると思いますね。 ご質問にある「作成手順」の説明ではありませんが, 一応作る方法の回答です。 ※作成手順は自分で考えるものではないでしょうか?  具体的にどうしたいのかをまず決めて  そのしたい状態になるように段取りをします。

jaikoooo
質問者

お礼

お忙しいところご回答ありがとうございます。 試してみたらサンプルページで確認できました!! しかも簡略して書かれているので、大体の構造も把握することができました。これから少しずつ自分なりに手を加えていって、思い通りのホームページを作れるように勉強したいと思います。 かなり行き詰っていたので本当に助かりました。 ありがとうございました!

関連するQ&A

  • ホームページビルダーで作成したウェブページのセンタリング

    ホームページビルダー11のどこでも配置モードでサイトを作成しています。ページ幅は800ピクセルで現状左に寄って表示されるため、ワイド画面のPCでは右側に大きく余白ができてしまい、見栄えがよくありません。 ネットでいろいろと調べていたところ、サイト内のcssファイルにあるタグを書き足すことでセンタリング表示されるということだったのでやってみましたが、何の変化もありませんでした。 ホームページビルダー11のどこでも配置モードで作成したサイト(ページ)をそれほど手間をかけることなくセンタリングする方法をご存知の方がいらっしゃいましたら、どうかお教えいただけないでしょうか?

  • ホームページ作成

    ホームページ作成 こんにちは。 義理の兄が個人で商売をしております。 そこで、ショップのホームページを作成したいと考えているのですが、 (ゆくゆくはネットショッピングができるように・・・) まずは、最初に何から調べだしたらいいのでしょうか? どのような順序で誰もが見れるホームページになるのでしょうか? 以前、ホームページビルダーでデザインなどは作成したことがあるのですが、 サイトにアップする方法などわからず、料金もどれくらいかかるのか全く不明で、 何から手をつけていいかも分かりません。 ど素人にもわかるように教えていただけたら幸いです。 また、ホームページ作成のおすすめのサイト、書籍等ありましたら教えてください。 よろしくお願いいたします。

  • ホームページの作成の進め方

    現在、自社のホームページを改訂しています。 既にページはあるのですが、あまり中身がないなと言うことで、更新しやすいようにCMSも使うようにするなど全面的な改定となります。 ですが、うちの会社は特にWEBデザインなどを受け持ったこともない会社ですので、どのように進めていったらいいのか、いまいち判りません。 だいたいの流れとしては、まずイメージを掴みやすいようにHTMLで基本的なページを作成し、そこから各コンテンツの担当者にページ内容を決めていって貰う……というのを考えていますが、それが良いのかどうかもちょっと判りません。 このような仕事の参考になりそうな、サイトや書籍などがありましたら、ご紹介いただければと思います。 よろしくお願いいたします。

    • ベストアンサー
    • CSS
  • ホームページのデザイン改造

    ホームページの見栄えを良くしたり、デザインを良くするのに役に立つサイトや書籍はありませんか? ホームページに書く文章を変えるのではなくてデザインのみです。 本屋を探してもホームページの基本的な作り方や素材集ばかりでもっと見栄えを良くするテクニック的な物を知りたいです。 また綺麗なホームページばかり書いてある書籍やデザインに定評があるページばかり集めたリンク集なんかでもかまいません。 象徴的すぎる質問かもしれませんがお願いします。

  • タグでホームページ作成したいのですが・・・

    ど素人中のど素人なのでお気を長くして聞いて下さい。 タグでホームページ作成したいのですが、最初からつまずいています。 http://hp-sozai.net/ このページみたいに外側と中側(内容)を分けて、 それでいて、 外側は小さいJPG画像を敷き詰めたいと考えています。 このサイトのタグを表示しても何がなんだか分からず、 HTMLの本を読んでもフレームなのかテーブルなのか良く分かりません。 どなたかどのように書いたらいいのか教えて下さい。 宜しくお願いします。

  • ホームページ作成・リンクについて

    閲覧ありがとうございます。 ホームページを作成しているのですが、ページリンクの装飾についてお聞きしたいことがあります。 cssでリンクの部分に点線で下線が表示されるように設定しているのですが、 border-bottom-style:dotted; これだと、バナーなどの画像部分にも点線が表示されてしまい、少々不恰好です。 指定した部分だけ下線を表示させなくすためにはどういったタグを入力すればいいのでしょうか? 回答よろしくお願いします。

  • ホームページ作成とデザイン

    ホームページを作ったり、サイトのデザインを自分でできるようにしたいです。 HTML?やらPHP?やら全く知らないです。 それらを独学できるおすすめの本など、素人でも分かる書籍はありませんか? できれば普通の書店で置いている本などがいいです。 よろしくおねがいします。

  • ホームページの作成

    ドロップシッピングのサイトを立ち上げたいのですが、下記のURLのようなホームページのデザインはどうやって作成したらいいのでしょうか?HTMLは少々理解できて、バナーなどもデザインできるのですが、トップページのメニュー部分などはどうやって作成したらいいのか?分かりません。また、商品ページや、ドロップシッピング運営会社への商品ページの埋め込みなど。。。その辺はどういうふうにすればいいのでしょうか? http://www.brand-index.jp/ テンプレートなどは無料であるのでしょうか?もしあればサイトを教えてほしいです。

  • 最近のホームページ作成ソフト

    大手企業のホームページ、たとえば1例としてNTTドコモ、佐川急便などは、ホームページソフトを使用して作成したりするのでしょうか? 似た様なページデザインを、時々みかけます。 最近流行のデザインなのでしょうか?

  • ホームページビルダーで作ったサイトの幅と余白

    ホームページビルダー8を使用しています。 困っているのは、他のサイトのようにパソコン画面左側に固定したお気に入りの欄を右に広げたり狭めたりしてサイトの画面の幅が変わる時に、私のサイトは常にその中央に位置しないということです。 お気に入りの幅を広げようとすると、最初から右側の余白だけが狭まり始め、左側は一定です。 例として(ヤフーなどより幅を狭く作っている)運輸会社さんのサイトがわかりやすいのでURLを記します。 http://www.kuronekoyamato.co.jp/ 運輸会社サイトは、お気に入りを広げても狭めても両側の余白の幅は変動するものの、常に左右対称の同じ幅です。 (そして、ある一定以上お気に入りを広げると、その段階で初めてサイトの右側が見えなくなり始めます。) ほとんどのサイトはこのようになっているとおもいますが、 私のサイトの場合は、どうしてこのように左右均等に余白ができないのか教えてください。 今のやり方は次のようにやっています。 Illustratorで下地のデザイン(簡単なグラデーションの壁紙のようなもの)を作り「Web用に保存」し、それをビルダーの「どこでも配置モード」で、「ページ編集」画面で一番最初に貼り付けて、その上にビルダーで文字を書いたりボタンを貼り付けたりしています。 「ページ編集画面」で、画面の左端合わせて自分の下地デザインを貼り付けると、ネット上でみた時に左側に全く余白がない状態になるので、わざと左側を約四センチくらい空けて、余白を作るようにして、下地デザインを配置しています。 でも、上記したようにこの約四センチの余白はお気に入りの幅が変動しても常に同じにしかならず、右側の余白だけが変動します。 よろしくお願いします。

専門家に質問してみよう