自分のホームページを作りたいと思っています。
綺麗さにこだわる方なのですが、作るのがなかなか難しくて出来ません。
前にホームページビルダー13のバリューパックを買って、
「できる」の本を見ながらとりあえずホームページビルダークイックを使って
やろうとしたのですが、難しくて出来ませんでした。
なるべく綺麗な、充実したホームページを作りたいのですが、
どうすればよいでしょうか?あまり難しいのだとわかりません。
内容は、基本的ですが、プロフィール、活動内容、リンク、ブログなどで、
画像や動画(自分で撮ったもの)を貼ったりしたいです。
No.6ベストアンサー
- 回答日時:
>最初は形にこだわらず、htmlにて簡単なサイトを作ることから始めてみようと思います。
それが良いでしょう。でしたら、例を挙げておきます。
はじめてのWebドキュメントづくり ( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ )を一通り読破されてからの説明です。そうすると今からの説明がよくわかると思います。
(歴史)
「はじめてのWebドキュメントづくり」はHTML4.01が勧告された当時のもので、その後ウェブ、HTMLの世界は様々なことがあり、いきつか当時から変化した部分があります。
簡単に言うと、「HTML4.01がHTMLの最後の仕様で今後はすべてXHTMLになる予定」が、色々あって、HTML2.0の開発は中断され、今後はHTML4.01を元に、HTML5に向かうことに統一されました。
以下の説明は、それを前提にしています。
(準備)
1) テキストエディタの「EmEditor Free ( http://jp.emeditor.com/modules/download2/rewrite … )」を手に入れてください。下のほうにfree版へのリンクがあります。
2) 次をブックマークに入れて置いてください。
・Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint. … )
・HTML 4.01仕様書邦訳 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
3) 下記のHTMLの:を半角の:に_をタブに変換して、どこかに保存してください。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
_<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
_<title>サンプル</title>
_<meta name="author" content="otsugiri">
_<meta http-equiv="Content-Style-Type" content="text/css">
_<link rel="START" href="../index.html">
_<style type="text/css">
<!--
-->
_</style>
</head>
<body>
_<div class="header">
_<h1>サンプル</h1>
_</div>
_<div class="sectin">
_</div>
_<div class="footer">
_</div>
</body>
</html>
このHTMLは、すべての基本になります。Another HTML-lint gatewayでは、作者のメールアドレスが無いと忠告されますがそれは無視してください。
4) <body></body>内に三つの<div>があり、それぞれにclass名がつけられていますが、その根拠は仕様書の
『DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』
と、HTML5で登場する新しい要素( http://standards.mitsue.co.jp/resources/w3c/TR/h … )です。
★HTML4.01strict(厳密型)では、見栄えに関するほとんどすべての要素、属性が使えません。
HTML4.0Transitional(移行型)では使えますが、 HTML5では存在もしないので、いずれ使えなくなるので、はなからstrictで学んでください。(ビルダーは基本はtransitionalです)
覚えることも半分になりますしね。
仕様書にも『HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』と明記してあります。
5) 文章を追加するときは
ナビゲーションなら
<div class="nav">
_<ul>
__<li><a href=""></a></li>
__<li><a href=""></a></li>
__<li><a href=""></a></li>
_</ul>
</div>
です。どのようにclass名をつければよいかは、「HTML5で登場する新しい要素」を参考にすると良いでしょう。HTML4.01を作成する場合のとても良い参考になります。
HTMLが、こうしてきちんと書かれていれば、後はスタイルシートで
・3つやのそれ以上の区画に分けて表示
・ナビゲーションを背景画像付きの横並びにして、マウスが乗ったら背景画像を変えよう
・活動内容の写真と説明を、アルバム風に画面に合わせて並び替えられるようにしよう。
---広い画面では4個、狭くなると3つ、さらには二つ、でも極端に広いときでも4つ以上増やさない
などが、まったく好きにデザインできるようになります。あとからデザインを変えるのもHTMLは、まったく弄らなくて済みます。
・ビルダーなどのオーサリングツールでは、この様に文章を読み解き、それぞれの部分が文書全体を校正するどのような意味を持つ要素なのかを判断し、最適なタグやclass名をつけるのは、原理的に不可能なのです。
また、文書構造を読み解きデザインすることも不可能なのです。
もちろん、HTMLやスタイルシートを知っていれば、ビルダーでも作成できますがビルダーの仕事は「綴りが間違ってないか」「きちんと閉じられているか」の便利な道具となります。こうして学んだ知識は、ビルダーを使って正しいHTMLを作成するために必須となります。
タグなんて、使うのは、せいぜい数十個・・多くても四十数個です。中学校で2000語の英単語を習うことに比較したら微々たる物です。
頑張ってください。皆が通ってきた道です。あなたよりはるかに、回り道をして・・・
いろいろとありがとうございました。
少しやってみていますが、意外ととっつきやすい感じがしました。
やはりhtmlとCSSの方がいいようです。
ありがとうございました!
No.4
- 回答日時:
二週間前に、相談者様と同じく、(スキルがないけどホームページを作りたい。
)と思い、悪戦苦闘の末一週間前に、断念した者です。
ネットショップをやろうと思って、ホームページビルダー16のバリューパックを買ってきて、製作を
始めたのですが、「できる」のとうりに進めていくと、「できる」に書いてあるとうり、3時間で公開と
まではいかなくても、一日程度で出来そうでした。
でも、(なるべく綺麗な、充実したホームページを作りたいのですが)←このとうりなんですよね。
さらに、個性も出したいわけで、いろいろ頑張ったのですが、
さて、スキルのない私が得た少ない情報を、お伝えします、同梱されているテンプレートを使われる
と思いますが、1ページ目のメインの画像のスペースの大きさを、変えられるものと、変えられない
テンプレートがあります、画像の部分をクリックし、選択した印に、枠だけが出るのは、変えられませ
ん。枠の四隅に、四角いコーナーマークがでるのは、スペースのエリアを自由にかえられます。
これで、いけるとおもったのですが、残念ながらHP開設を四月中に予定していましてTime Upという
ことで断念し、いま現在業者に委託しています。
同じような思いの方が、いるのだなと思い、回答させていただきました。
上記、ご存知のことなら、無視して下さい。
質問者様のHP開設と健闘をお祈りします。
私もHPを作ってくれる業者があるということを知って、
興味がわきましたが、かなり値段が高いので断念しました。
ホームページビルダーではあまり私のやろうとしていることは
できないようなので、htmlから簡単に始めて見たいと思います。
ご回答ありがとうございました!
No.3
- 回答日時:
誰だって、最初はスキルなんてありません。
大事なことは、ウェブサイトを作ることを目的にしないことです。ウェブサイトはあくまで手段であって、目的であってはなりません。これはすべてのことにいえますね。
幸いに『プロフィール、活動内容、リンク、ブログなどで、(多くの人たちと情報を共有したい)』という目標があるとのことですが、多くの人たちを見ていると、挫折の大きな要因は「綺麗な、充実したホームページを作りたい」であることが多いようです。
デザインなんて糞食らえ!!くらいの意識が本当は必要なのです。
★2.2.1 HTMLの略歴 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
★よいウェブページを書こうとする人のためのヒント ( http://www.sal.tohoku.ac.jp/~gothit/webauthoring … )
を一読して置いてください。
『【引用】____________ここから
Webが編み出されたところである科学技術分野に携わる人々の間では、文書のプレゼンテーションよりも中身にこそ関心が持たれる。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[14.1 スタイルシートの概説( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より』
以降を少し読まれると、わかりますが、「デザイン」を優先するあまりに、「角をためて牛を殺す」状態になり、結局完成させることが出来ず挫折してしまう。挫折してしまったのではないですか?
あなたの目標が、『プロフィール、活動内容、リンク、ブログなどで、(多くの人たちと情報を共有したい)』でしたら、その目標を外れないように、始めはデザインなんて稚拙なものでよいのです。その内容が--世界中の誰かにとって価値があるものでしたら、それで十分以上なのです。デザインは、上達していけばいくらでもよくなるでしょう。
大事なことは
【引用】____________ここから
HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[HTMLの略歴( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
読み上げブラウザや検索エンジンには、視覚ブラウザのデザインなんて何の役にも立ちません。自己満足以外の何者でもありません。あなた自身もネットで情報を探し、それをブックマークに登録するのは、デザインではなく中身でしょ!!
挫折しないで続けていくために必要なことは、目的を見失わないこと。手段と目的を混同しないこと。デザインはそのサイトの価値には何も寄与しません。
HTML4.01仕様書の翻訳メンバーの内田さんが、ご家族のために書かれた
★はじめてのWebドキュメントづくり ( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ )
というウェブサイトがあります。
まず、そのあたりから始めてください。
ワープロやDTP( http://ja.wikipedia.org/wiki/DTP )とは、まるで違う世界です。デザインをするためのものではなく、文書全体で「ここ見出し」「ここは段落」「ここは引用文」と印を付けていくと、どのような端末で利用しても情報が伝わる。残念ながら、その意味ではビルダーは、HTML自体の目的や価値を知らないと、本来の目的とはまったく逆の方向を向いてしまうかもしれません。
一度基本に返って、テキストエディタあたりから初めてください。こんなに簡単なものだったのかと思われます。私も15年も前にそうして始めました。
いろいろとページを紹介していただき、丁寧なご回答ありがとうございます。
最初は形にこだわらず、htmlにて簡単なサイトを
作ることから始めてみようと思います。
ありがとうございました!
No.1
- 回答日時:
本格的にwebサイトを作ろうとしたら、htmlの勉強をするところからになります。
最初はとっつきにくいので、ブログから始めてはいかがでしょう。
ブログならテンプレートが用意されていて、初心者でもすぐできます。
けれど、ブログ自体もそんな単純なものではなく
知識があれば好きなように作り変えて自分の思い通りのページにもできます。
ブログを書いたりいじったりして、実践知識を身に付けつつ
ある程度のレベルになったら自分でサイトを立ち上げてみては。
現在ブログはseesaaブログをやっています。
カレンダーなどの項目の設置などはわかりやすくて
できました。
htmlを使った簡単なサイトを作るところから始めてみようと思います。
ご回答ありがとうございました!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- その他(IT・Webサービス) ロリポップのレンタルサーバーを借りてます。(一般的な安いプラン) 元々はホームページでも作ろうと思っ 1 2023/05/24 19:54
- Ameba(アメーバブログ) アメブロは、HTMLのタグの入力を許さないブログ・サイトですか? 1 2023/06/18 18:48
- ホームページ作成・プログラミング アメーバ・ブログは"HTMLタグ"を許可してないのですか? 2 2023/06/17 21:08
- ホームページ作成・プログラミング 友人のホームページを引き継ぐには 2 2023/06/13 15:23
- モデル 所属している芸能事務所の社長が苦手 2 2023/05/14 17:52
- SEO ホームページを作る際の質問です 1 2023/06/07 18:50
- SEO 内容がほとんど同じホームページを作ったらどうなるでしょうか? 3 2022/12/17 21:19
- ホームページ作成・プログラミング ホームページの内容変更を無料で(自分で)したいので方法を教えてください 3 2022/07/14 13:32
- アニメ 名前がどうしても思い出せないアニメがあって、詳しい方の力を借りたいです。 ・製作年 2年ほど前に見た 2 2022/08/20 22:35
- WordPress(ワードプレス) 初心者なので、分かりやすく教えていただけると幸いです。 数年前にホームページをとある会社で作ってもら 6 2023/05/12 14:30
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
line-height指定で発生する余白...
-
一括で全体を右にずらす
-
article、section、hgroup?
-
div要素が重なってします
-
html5でheaderの中にnav
-
ブログのサイドバーが下にくる
-
オシャレな区切り線はありませ...
-
グラフィックス
-
idとclassの指定方法
-
HTML属性での「""」 「''」違い
-
<div>テキスト</div>
-
html divボックスの入れ子で中...
-
html5にて水平線の引き方は?
-
HTMLとCSSの次に覚えることは何...
-
html の divとtable の役割
-
h1のテキストサイズよりh2の方...
-
【html&css】太さの違う2本線の...
-
改行がしたいのですが、うまく...
-
携帯サイト、ナノでのタグ編集...
-
コンピューターの画像ブロック
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlのolやulなどlistにtitleや...
-
HTML属性での「""」 「''」違い
-
div要素が重なってします
-
<div id="container">の使いか...
-
複数のボタンを等間隔に、かつ...
-
html の divとtable の役割
-
divとpの使いわけ
-
ヘッダーとフッターだけ背景を...
-
min-heightとheightの違いについて
-
セクションをdivで囲むと見出し...
-
画面を縮小するとカラムが落ち...
-
ヘッダーを左右に二分割する方...
-
1時間30分を簡単に表したいで...
-
スペースを使わず文字位置を揃...
-
CSSで、contentsがfooterに重な...
-
h1に自分自身へのリンクを張...
-
divの中に外部のHTMLを埋め込む
-
divを横に並べる方法
-
hタグの右横に画像を表示
-
h1のテキストサイズよりh2の方...
おすすめ情報