このページでは、HTMLとCSS、Javascriptを使ったwebサイトの作り方についてまとめていく。
Contents
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の自作テーマの作成方法
続きを見る
