HTMLとCSS、Javascriptを使ったwebサイトの作り方まとめ

このページでは、HTMLとCSS、Javascriptを使ったwebサイトの作り方についてまとめていく。

Webサイトの仕組み

まずはwebサイトの仕組みなどをわかっておくと、今後の準備がかなり楽になる。

Webサイトとは何か。Webサイトの仕組みやWebサイトとホームページの違いを説明

続きを見る

ウェブデザインが思いつかない時

コーディングの前に最初にたちはだかるのがウェブデザイン。

なかなか思い浮かばないこともあるのでは？

そんな時に他社事例としてとても参考になるギャラリーサイトをみるとウェブデザインの助けになる。

Webサイト制作の参考に便利なギャラリーサイト38選

続きを見る

HTMLでのwebサイトの作成方法

ツールの準備から、画面へのHTMLの表示方法までの流れを解説。

HTMLでのホームページの作成方法

続きを見る

実際にコーディングする前に用意しておくこと

コーディングに取り掛かる前に、準備しておくと楽かもしれない。

カラムについて

カラムやレイアウトに関する記事。カラムについて理解するとwebサイト制作がかなりスムーズ。

ヘッダーについて

[CSS]ロゴを左に、メニューを右に横並びに配置するヘッダーを作成

続きを見る

下記の記事も参考になるかも。

画像やイメージについての取り扱い

ウェブサイトで使う画像やイラストはどこで取得できるの？

イラストやアイコン、画像を自分で用意することが難しくても、素材サイトで取得できる。

下記にアイコン、イラスト、画像それぞれの素材サイトをまとめた。

レスポンシブ対応

Githubを使ったwebサイトアップロードの方法

[Github] Github pagesの使い方：作成したウェブサイトを公開する

続きを見る

wordpressで自作テーマの作成

HTMLサイトをアップロードまでできるようになると、wordpressを使って、自分のデザインにブログ機能などを付け足すこともできる。

こちらが実際のHTMLサイトとwordpress追加後のサイトの例となる。

HTMLサイト：

https://shotaro-kamimura.github.io/minamiuonuma/#

wordpressサイト：

https://localjapan.shotarokamimura.com/

詳しいやり方は、こちらでまとめた。

WordPressの自作テーマの作成方法

続きを見る