マンガでわかるホームページ作成
ホームへ
マンガでわかるホームページ作成記事一覧
マンガでわかるホームページ作成について
2020年05月23日
「マンガでわかるホームページ作成」はいわゆるhtml入門であり、ホームページを作ったことがない方にもわかりやすいよう、その作り方をマンガで説明します。
この記事を読む
Webサイト作成開始!
2020年05月24日
マンガでわかるホームページ作成は高校生の夢華がWebデザイナーであるお姉ちゃんにWebサイトの作り方を教えてもらうという話です。もちろん読者自身がWebサイトを作れるように説明してまいります。
この記事を読む
ホームページ作成に最低限必要なもの
2020年05月24日
ホームページ作成に最低限必要なものにはパソコン・エディタ・インターネット環境・サーバー・ドメインが挙げられます。それぞれ説明します。
この記事を読む
Webサイト制作のおすすめ高機能無料エディタ【Brackets】
2020年05月30日
Web制作ができる最強の無料ソフトBracketsのメリット、Dreamweaverとの比較を紹介します。Dreamweaverの代わりになる無料エディタないかなぁという方にもおすすめしますし、ちょっとWeb制作始めてみたいという初心者の方にも超絶オススメです。
この記事を読む
html・CSS・javascript・PHPとは何か簡単にわかりやすく説明
2020年05月30日
htmlとそれに関連するCSS、javascript、phpとは何か簡単にわかりやすく説明します。この記事ではhtmlなどがどんなものなのかざっくりイメージをつかみ、概要がわかるように説明しています。
この記事を読む
よく使うhtmlタグ一覧【12個に厳選!】
2020年05月30日
htmlタグはたくさんあります。その中でもよく使うhtmlタグを12個に厳選して紹介します。これを覚えれば最低限のホームページが作れます。
この記事を読む
htmlタグの属性と値とは?【よく使う属性一覧】
2020年05月30日
htmlはタグを覚えただけでは使いこなせません。セットで使われる属性と値を覚えましょう。よく使う属性と値を紹介します。数はそれほど多くないので使いながら暗記しましょう。
この記事を読む
htmlタグの親子要素・兄弟要素とは
2020年06月03日
htmlにおいて親子要素・兄弟要素というワードがでてきます。親子要素・兄弟要素について解説します。
この記事を読む
htmlのブロック要素とインライン要素とは?
2020年06月03日
htmlタグは大きくブロック要素とインライン要素に分かれます。このブロック要素とインライン要素を理解していないとCSSで装飾するときにつまづきますし、html構築でも間違ってしまいます。
この記事を読む
html定型テンプレート【コピペでOK!】
2020年06月03日
htmlにおいて最初の型はほぼ一定です。コピペでさくっと作ってしまいましょう。
この記事を読む
【html】画像(img)の貼り付け方
2020年06月03日
画像を貼るにはimgタグを使います。htmlの画像の貼り付け方について、画像の準備の仕方も含めて解説します。
この記事を読む
htmlでリンクの貼り方【aタグの使い方】
2020年06月04日
ホームページと言えばリンク、リンクのないホームページなどほぼありません。ホームページを作る以上必ず覚えなければならない「リンクの貼り方」です。htmlでリンクを貼るにはaタグを使います。
この記事を読む
htmlの相対パス・絶対パス【画像が表示されない・リンク切れのときに】
2020年06月04日
内部リンクなどファイルの場所を指定するとき、パスを指定することになります。パスを理解しないとリンク切れや画像が表示されないということになりかねません。そんな相対パスと絶対パスについて説明します。
この記事を読む
CSSとは【CSSの書き方】
2020年06月11日
CSSはデザインをつかさどる言語です。 htmlが骨組みとなり、それに背景色や大きさ、配置といったデザインの指示を出すのがCSSです。 CSSはWebサイトを作るにあたり習得必須の言語です。
この記事を読む
CSSセレクタとは【CSSを適用させる対象】
2020年06月11日
どのhtmlタグを対象とするのか指定するのがCSSセレクタです。classやid、そのほかよく使うセレクタを紹介します。
この記事を読む
CSS width height【要素の幅と高さを指定】
2020年06月11日
CSSのwidth(幅)とheight(高さ)の指定について説明します。あわせて注意点、min-width(最小幅)、max-width(最大幅)についても説明します。
この記事を読む
CSSで使う長さの単位【px・em・%・vw・vh/calc】
2020年06月11日
CSSにはwidth等で大きさ・長さを指定するための単位が複数存在します。またそれらを計算できる仕組みがあります。これらをマスターしてイメージ通りのデザインを作成しましょう。
この記事を読む
CSSでのカラーコード(色)の書き方
2020年06月19日
Webサイトでは背景色、線の色、文字の色など色(カラーコード)を指定する場面が多々あります。色(カラーコード)の書き方を3つ紹介します。
この記事を読む
CSS background【背景の指定方法】
2020年06月20日
CSSにおいて背景を指定するには「background」プロパティを使います。backgroundでは主に5つのプロパティがあり、それらを説明します。
この記事を読む
CSS border(枠線)の使い方と種類一覧
2020年06月20日
CSS borderおよびborderに関連するCSSプロパティの種類一覧を実例とともに紹介します。
この記事を読む
【CSS】marginとは?paddingとは?両者の違い・使い分けについて
2020年06月25日
marginとpaddingはボックスの余白を調整するCSSです。 marginとpaddingの使い方や違いについて説明します。
この記事を読む
CSS displayの書き方・一覧【23種説明】
2020年06月25日
CSS displayの書き方を23種デモ付きで全部説明します!
この記事を読む
CSS display:flexで解決できること9選!
2020年06月25日
display:flexは便利らしいがどんなときに使えるのか。 横並べを中心に、いろいろなことができるので覚えておきましょう。
この記事を読む
CSS positionの書き方【実装例・デモとあわせて紹介】
2020年06月25日
CSSのpositionの書き方をstatic,relative,absolute,fixed,stickyの使用例とともに説明します。
この記事を読む
CSSセレクタの優先順位と点数計算
2020年06月27日
疑似クラス、属性セレクタなど含めたCSSセレクタの優先順位と点数計算方法を解説します。
この記事を読む
html内にCSS・styleを直書きする方法と使い分け
2020年06月28日
htmlタグの中にstyle属性を指定し、ダブルクォーテーションの中にCSSを直書きします。
この記事を読む
CSSの!importantの意味・使い方・注意点まで徹底解説!
2020年06月28日
CSSの!importantの意味・使い方・書き方・優先順位・重複したらどうなるのか、注意点・効かないときの確認方法などを徹底的に解説します。 マンガもあります。
この記事を読む
CSSが効かない原因と回避方法【よくあるケアレスミス】
2020年07月04日
CSS効かない、htmlが崩れたときは以下に当てはまらないかチェックしてみてください。
この記事を読む
CSSが効かないときの原因特定方法【DevToolsの使い方】
2020年07月11日
CSSの一部が効かない!何が悪いのかわからない!という方へCSSが効かないの原因特定方法を説明します。
この記事を読む
htmlが崩れた原因特定方法【Markup Validation Serviceの使い方】
2020年07月11日
ホームページが崩れたけど原因がわからないと直しようがないですよね。まずは原因の切り分けと特定が重要です。ホームページが崩れたときはhtmlかCSSあるいはjavascriptなど原因が考えられます。全部一気に確認はできないのでまずここではhtmlに問題がないか確認・原因特定する方法を説明します。
この記事を読む
スマホ対応・レシポンシブデザインとは
2020年07月11日
スマホ対応とはスマホでも利用しやすいようにWebサイトを調整することです。
この記事を読む
PCでスマホ表示に切り替える方法【Chromeを使おう】
2020年07月11日
スマホサイト開発や他社のスマホ対応動向確認のときPCで確認できれば楽です。PCのchromeでスマホ画面を表示する方法を紹介します。
この記事を読む
view portの書き方/レスポンシブ・スマホ対応【コピペでOK】
2020年07月11日
今どきレスポンシブ・スマホ対応が当たり前。しかしスマホ対応させるにも方法がわからない?レスポンシブ・スマホ対応view portの書き方について説明します。
この記事を読む
メディアクエリの使い方/レスポンシブ・スマホ対応
2020年07月11日
今やスマホ対応があたり前、レスポンシブデザインがあたり前の時代です。でもどうやって対応させればいいのかわからない!そんなレスポンシブ・スマホ対応させる「メディアクエリ」の使い方について、基本的な書き方、ブレイクポイント、入れ子、印刷時対応、オススメの書き方を説明します。
この記事を読む
スマホ対応・レスポンシブデザインのコツ
2020年07月17日
「スマホ対応・レスポンシブデザインが必要なのわかったけど、実際問題具体的にどうやればいいの?」というあなたへ、スマホ対応・レスポンシブデザインサイトを作る具体的な方法とコツを説明します。
この記事を読む
レンタルサーバーとは何か、なぜ必要か
2020年07月24日
ホームページ開設に必要なものの一つに「レンタルサーバー」があります。このレンタルサーバーとは何か、なぜ必要なのかを説明します。
この記事を読む
レンタルサーバーの料金と選び方
2020年07月24日
これからホームページやブログを始めようとしているあなた!レンタルサーバを料金や有名かどうかだけで選ぼうとしていませんか!?あなたに必要なスペックの中で最安値を狙うのが一番お得な方法です。あなたにピッタリのレンタルサーバの選び方を解説します。
この記事を読む
激安レンタルサーバーの取得方法【167円/月】
2020年07月25日
1ヶ月あたり167円という激安料金で利用可能なレンタルサーバー「バリューサーバー」の取得方法を具体的に説明します。
この記事を読む
ドメインの決め方と料金【1円】
2020年07月25日
サイトを開設するにはサーバーの他にドメインが必要です。ドメインとは何か、ドメインの決め方・料金について説明します。
この記事を読む
ドメインの具体的な取得方法【3ステップ】
2020年07月26日
ホームページを開設するにはドメインが必須です。ドメインの具体的な取得方法を3ステップで説明します。
この記事を読む
ドメインの自動更新設定方法
2020年07月26日
せっかく取得したドメインも1年後更新しないと使えなくなり、同時にサイトも見れなくなります。ドメインを自動更新されるようにして毎年滞りなく使えるようにしておきましょう。
この記事を読む
ドメインとサーバーの紐付け手順
2020年07月26日
サーバーには「このドメイン使います」、ドメインには「このサーバーで使います」と知らせ、結び付ける必要があります。ここを超えるとドメインとサーバーが使え、サイトを公開できる状態になります。手順を丁寧に説明していきます。
この記事を読む
FFFTPでアップロードする手順
2020年07月26日
サーバーの用意ができたらファイルをアップロードできるようになります。公開時だけではなく、修正・更新のときにもアップロード・ダウンロードしますので手順をしっかり覚えていきましょう。
この記事を読む
WordPress(ワードプレス)とは
2020年08月10日
WordPressとはインターネット環境とブラウザだけで簡単にホームページを更新できるシステムです。
この記事を読む
WordPressインストール手順【つまづきやすいポイントも解説】
2020年08月29日
WordPressを使うにはWordPressをサーバーにインストールしなくてはなりません。 WordPressのインストールの手順をつまづきやすいポイントとともに説明します。
この記事を読む
WordPressの使い方【メニューの説明】
2020年08月29日
WordPressをインストールし、ログインできたものの何をどうすればいいのかわからない!? そんなかたのためにWordPressの使い方を説明します。主に各メニューの説明です。
この記事を読む
WordPress 記事作成方法
2020年08月29日
WordPressは記事をたくさん更新できる・更新しやすいことが特徴の一つです。基本的にはWordで文章が作るような感覚でカンタンに更新できます。とはいえ、機能が豊富です。すべてを覚える必要はありません。よく使う機能について説明します。
この記事を読む
WordPressのプラグインとは
2020年08月30日
プラグインとはWordPressにおける「追加機能」のことです。 プラグインは非常に多くありますが、サイトによって要不要があるため必要なものだけ追加するという使い方になります。
この記事を読む
WordPressテーマ自作方法
2020年08月30日
テーマとはWordPressにおけるサイトデザインテンプレートのことです。 サイトの目的によっては既存のテーマ・デザインではなくオリジナルのデザインを適用させたい場合があります。 オリジナルのテーマの自作方法を説明します。
この記事を読む
アクセス解析・Googleアナリティクスとは【アクセス数を増やすために】
2020年09月20日
アクセス解析とは、サイトにどのような人がいつどこにどうやって訪れたのか調査することです。 この記事ではアクセス解析の概要・目的、ツールの活用方法を解説します。
この記事を読む
Googleアナリティクスの導入手順・設定方法
2020年09月20日
アクセス解析のためにGoogleアナリティクスを導入したいという方へGoogleアナリティクスの導入手順・設定方法を説明します。
この記事を読む
Googleアナリティクスの使い方・見方
2020年09月21日
Googleアナリティクスは非常に便利で多機能です。一方で多機能すぎて何ができるのか一見わかりません。 Googleアナリティクスの機能のうちよく使うものを抜粋し、Googleアナリティクスの使い方・見方を紹介します。
この記事を読む
Googleサーチコンソールの導入手順・設定方法
2020年09月21日
Googleサーチコンソールはアクセスされた検索キーワードを知ることができる唯一の手段です。アクセス数を増やすためには必須のツールです。 この記事ではGoogleサーチコンソールの導入手順・設定方法を解説します。
この記事を読む
Googleサーチコンソールのインデックス登録手順
2020年09月22日
インデックス登録とはGoogleにサイトや記事のURLを伝え、存在していることを知らせる行為です。 これをしないといつまで経ってもあなたのサイトはGoogle検索に表示されません。よってアクセスは0のままです。 Googleサーチコンソールのインデックス登録手順を説明します。
この記事を読む
Googleサーチコンソールの使い方・見方
2020年09月22日
GoogleサーチコンソールはSEO・アクセス数を増やすために必須のツールです。 Googleサーチコンソールの使い方・見方を紹介します。
この記事を読む
ネットで売上を上げるための方程式
2020年11月10日
ネットで売上を上げるための方程式は次の通り。売上=「商品の料金」×「集客数」×「コンバージョン率」。これらについて詳しく解説します。
この記事を読む
SEOの基礎【アクセスを増やすために】
2020年11月10日
アクセスを増やす方法を調べると必ずと言っていいほど「SEO」という言葉に出くわします。 このSEOについて、基礎的な知識と具体的な方法を解説します。
この記事を読む
ブログテーマの決め方【結論:得意分野・好きな分野】
2020年11月10日
アフィリエイトブログに挑戦してみたいけど、そもそもどんなテーマのブログを作ればいいんだろう? そんな疑問に答えるべく、ブログテーマの決め方を説明します。
この記事を読む
SEOを意識した記事のキーワード選定方法【1万のキーワードが見つかる】
2020年11月10日
テーマは決めたけどどんな記事を作ればいいんだろう? キーワードはどうやって見つければいいの? アクセスを増やせる記事を書きたい! そんな疑問に答えるべく、SEOを意識した記事のキーワード選定方法を説明します。
この記事を読む
記事を書いた後の順位確認と改善方法【当サイトのデータ公開】
2020年11月10日
記事を書いた後ほったらかしでいいのだろうか?ちょくちょく記事の改善をしたほうがいいの? そんな疑問にお答えすべく記事を書いた後の順位確認と改善方法について解説します。
この記事を読む
ブログで稼ぐ方法【アドセンスとアフィリエイト】
2021年01月19日
「ブログで稼げるって聞いたけど何で稼ぐの?」 昨今、副業ブームであったり、コロナ禍で、ネットを通じて仕事にすることへ興味を持つ方も多いかと思います。 私が実践している、実践しようとしているものを含めて、ブログで稼ぐ方法を紹介します。
この記事を読む
Googleアドセンスの始め方【審査突破のために】
2021年01月25日
ブログでお金を稼ぐと言えばまずは「Googleアドセンス」です。当ブログの収入源でもあります。そんなGoogleアドセンスの始め方と審査突破について解説します。
この記事を読む
Googleアドセンスはいくら稼げるの?【当サイトのデータを公開】
2021年01月25日
「Googleアドセンスで収益化するとどのくらい稼げるもんなの?」 そんなあなたの疑問にお答えしたいと思います。 Googleアドセンスの収益化について、いろいろ実験的にやってみて見えてきたことなどを当サイトのデータを公開しつつ、ご紹介したいと思います。
この記事を読む
Googleアドセンス広告の貼り方
2021年01月25日
Googleアドセンスの審査を通過したらいよいよ広告を貼りましょう。 Googleアドセンス広告の貼り方を説明します。
この記事を読む
Googleアドセンス振り込みの準備【PINコード・振込口座設定】
2021年01月25日
Googleアドセンスでの振り込みと審査に通ってから収益を得るまでに設定することについて解説します
この記事を読む
あとがき
2022年07月27日
「マンガでわかるホームページ作成」を最後まで読んでいただきありがとうございます。最後になりますが頑張るあなたにメッセージを送ります!
この記事を読む
CSSやhtmlをマンガで学ぶ