2019.12.23はじめての人の為のweb制作ツイートシェアはてブ送るPocketせっかく今までweb系の事やってきたので、webの記事もたまには書いてみようかと思います。今回初めての人の為の初歩的なことからまとめてみたいと思います。HTMLを書いてみるwebサイトを作る際の基本になるHTMLを書いてみましょう。テキストエディタで文字を打ったりもしくはコピペするだけで大体できます。エディタはwindowsのメモ帳やMacだとmiあたりのソフトで構いませんが、色々あるので選んでみましょう。codeAtomDreamweaverこの辺りから選ぶと良いです。それぞれネットで調べてプラグインを入れたり、テーマを変えて使いやすいようにカスタムします。Atomは使ったことはありますが、現在は使ってないですね。DreamweaverはAdobe製で高機能なのですが、重いのであまり使いません。更新作業などでライブビュー(コードと画面の表示を同時に見れるモード)を使うことはあります。ややこしいテーブル(表)をいじる時とかですね。Dreamweaverは有料なのと、ある程度マシンスペックが必要な点に注意。各エディタについてそれぞれ検索すればインストールやプラグインの入れ方など出てくると思いますので予め自分の使いやすいようにカスタムしてください。面倒ならホント最初はメモ帳でもいいです。<html><head><title>ページのタイトルが入ります</title></head><body><h1>私のサイト</h1></body></html>これをファイルとして「index.html」という名前で保存してダブルクリックなんかでブラウザで開けばウェブサイトの原型が出来上がりです。実際にアップロードしたのはこちらのリンクで確認してください。(※pcの設定で拡張子を表示するようにしておいてください)ちなみにindexというのはトップページのファイルにつけられる名前です。web業界のルールとしてそういうもんだと思ってください。間に入れた文字はブラウザのタブに表示されるページのタイトルです。あと検索エンジンでの検索結果で表示されます。</body>の間に入るものがそのページのコンテンツになりますただしこれはかなり原型も原型で、これではまともなサイトとは言えません。文書としての内容を記述していきます。href=""></head><body><h1>私のサイト</h1><p>テキストが入ります。</p><ul><li>リスト</li><li>リスト</li></ul></body></html>となります。サンプルはこちらdesctriptionやkeywordなどはページとして目には見えないけど設定として入力しておくべきです。descriptionは検索エンジンでの検索結果に表示される内容なのでユーザーに見てもらった際に興味を引くような内容を考えましょう。重要視されませんので気持ち程度で構いません。他にはIE9以下の対策の記述がありますが、とりあえずコピペでいいです。<body>内の要素ですが、<h>タグで文書としての見出しを設定します。<p>はパラグラフなので通常の文章を入れます。<ul>と<li>はリストです。他にもHTMLで使うタグは色々あるので、用途に合わせて正しいものを選びましょう。タグを適切に選ぶことで、検索エンジンにサイトを正確に評価してもらえる可能性が高まります。それによって検索順位にも影響がある可能性が上がります。これでは文字が大きすぎたりしますよね。他にも色をつけたりしたいですよね。そこで使用するのがCSS(カスケーディングスタイルシート)です。HTMLはあくまで文書ファイルです。文字の大きさや色を変えたいレイアウトを組み変えたい要素と要素の間隔を取りたいこういった装飾についてはCSSというものを使ってデザインを行います。HTMLは文書、HTMLのデザインはCSSとそれぞれのファイルの意味を理解しておきましょう。今回は一旦説明は省きますが、またの機会に説明できればと思います。普段見ているwebサイトはこういった技術の結晶で、結構手間がかかっているという事を理解してもらえたと思います。実際にHTMLなんかを記述してみたら分かると思いますが、結構手間なんですよね。今回はまずHTMLとCSSでwebサイトが出来るということと、HTML記述もそれなりに手間がかかるということを理解してもらえれば十分です。コメントをキャンセルメールアドレスが公開されることはありません。※サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。上に表示された文字を入力してください。腰椎間板ヘルニア自分なりに気づいた事や感じた事、伝えたい事から趣味的な事や日常の事まで発信していきます。DARKweb関連の仕事をしているDKGMが普段の生活の中での経験や気付きを残すブログです。webと関係ない話も多めです。