完全にわたし流のブログの作りかた。プログラミングも全て手探りで作ったわけ

ほんっっとに自己流なので多分役に立たないのだけれど、説明書が読めないタイプはこうやって作るんだなと思ってみてくれたら嬉しいです。逆に効率の良いやり方教えてください。

 ▽ 目次

HPをつくろう

まずHPを作ろうと思った経緯なのですが、ほんとに暇だったからでかっこいい理由は何1つもないのだけれど、コロナで時間が増えたからSNSを見る時間が本当に増えて、そこからいろんな方々のサイトに飛んでHPやブログを見る機会があって、このカスタマイズ素敵だなあとかこうゆうのやってみたいなっていうのは時間がありふれた中でちょっと考えてたところはあります。

始める前にこうしたいな〜まで行き着くインプットのお時間が大切です。

わたしのこのHPは、はてなブログを使ってます。

特別な理由はもちろんなく、作り方 ブログって検索したらでてきたので使ってます。

HTMLを打つというか見つける

はてなブログはこんなかんじで編集が3画面に分かれていて、普通にこの文章を打つときは1番左の「みたまま編集」細かな設定をするときは「HTML」ちゃんとバグなく反映されてるか確認するのが「プレビュー」っていう風に分けてます。認識あってるか分からないけど。

みたまま編集はそのまま文章打ち込むだけなので、わたしも最初ちょっと苦戦した「HTML編集」での作り方を書いていきます。

いわゆるコードというものなのでしょうか。HTML編集はこんなかんじで難しい文字を打ち込んでゆきます。

もちろん自分で0から打てるなんてことはないので、1個1個「ブログ ＋ やりたいカスタマイズ ＋ コード」で、検索して出てきたコードをコピー&ペーストです。

やりたいカスタマイズっていうのは、1番最初に言ったインプットのお時間ですね。アイディアがないと検索もできないのです。

例えば

あっ、このレイアウトかわいいな！チェックの！

「ブログ 囲み枠 コード」 で検索

めっちゃいろんな種類でてくる〜！

他にもいろんな囲み枠でてきた！
気に入ったやつのコードをコピー&ペースト

ってかんじです、基本的に。めっちゃ単純。
全然特別なことしてなくてごめんなさい。

ちょっと参考にしようと思うサイトをみつける
→ いいなあって思うカスタマイズをみつける
→ コードをぐぐる
→ コピー&ペースト

です。

何も難しいことしてないのでほんとに誰にでもできると思います。

大抵コードをググって探しているときに、こんなレイアウトもあったんかー！て関連ででてきた方を採用したり、
コードをコピペしたデフォだと左寄りだけど、中央にしたいなあって思ったら「ブログ ＋ 中央よせ ＋ コード」で調べて新たにレイアウトしたり、本当その繰り返しでやってます。

ググればなんでも出てくる時代ならではです。すごい。

▶︎ 参考にさせていただいたサイトさんはこちら
わたしも愛用中。

打てば当たる方式もあるよ

あとは、たまにページのソースを表示してそこから紐解くパターンもあります。ちょっと大変。
ページのソースとは、HPを右クリックするとこうゆう選択画面が出てくるので、ページのソースを表示をクリックすると

一瞬バグかな？と思うこうゆう画面がでてくるので、
そこから手当たり次第探す方法。

ぜっっったいもっと効率よい方法があると思うのだけれどわたしは知らないのでそこからコードを見つけて、コピペして、打てば当たる方式で打ち込むという。
たまにヒットします。

まとめ

そんなことを繰り返してなんとか形になっているHP。

コードも大事だけれど、このコードで作ったレイアウトをもーっと生かせるのはデザインだと思うのでよかったらこちらもみてくれると嬉しいです。

▶︎ ホームページを自分で編集するにあたって
わたしが重宝したアプリたち。

コロナ自粛ならではの時間の使い方でした。

正しいやり方もわかってないまだまだ練習中のひよっこなので、どなたか一緒にHPの作り方練習しましょ〜