先日、新たにブログサイトにカテゴリー欄を設置できたことで、ブログ初心者の私も少しばかり得意げになって、また新たな機能に挑戦しようと目論んでいました。 それは、最新の記事を公開した時に「新着」だとわかるような表示をすることです。 簡単に出来んじゃね?などと高をくくっていたら、はい、撃沈しました(泣) なして〜(´༎ຶོρ༎ຶོ)?そんな難しいことですかぁ〜(´༎ຶོρ༎ຶོ)??なんで出来ひんのぉ〜(´༎ຶོρ༎ຶོ) 傷心しながらも、いずれリベンジする時のために事の次第を記録します(╬◣д◢)ウオリャー! はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 前置き 初心者の私が選んだブログのやり方は、Hugo 、Cloudflare 、GitHub などといった、ツールやサービスを組み合わせて作る手法です。 いわゆる「静的サイトジェネレーター」という方式で、ブログを運営しています。 (静的サイトジェネレーターについては、こちらの記事でまとめています) 自分で組み立てるブログなので、ただ記事を書いていればいいという訳にはいきません。 自分であれこれ設定してやる必要があります。 今回のように新たな機能を追加するには、ターミナルでコマンドを実行していかなければなりません。(ターミナルについては、こちら) 初心者の私には難しいことばかりですが、出来た時の喜びは格別のものがありますし、何と言ってもほとんど無料でブログが出来ますヽ( ´¬`)ノ ワ~イ 故に、“お金はかからないが手間はかかる” とも言えますね〜 そんな訳で、新着の表示くらいパパッと出来るだろ?と思われる方もいらっしゃると思いますが、ボタン一つで設定できる類のものではない、ということをご承知おきいただければ幸いです〜┌|-.-|┐ペコッ 事の始まり 日々、ブログ挑戦に取り組む中で、いきなり「カッコ良くて、おしゃれで洗練されたブログ」にはなれませんが、少しでも「読みやすい・見やすいブログ」を目指しています。 今はまだ始めたばかりで、記事数も少なく、ウルトラ・スーパー・シンプルなブログですが、成長してそれなりのブログになることを夢見ています。 そんな風に考えている中で、新着の記事を公開した際に「新着」とか「NEW」とか表示されたら「おっ、新しい記事が公開されたんだな」って分かりやすいし、そういうのってあるよね?!と思いつきました。 それに、そういう表示があると、このコンテンツは今も生きてる、というか、過去の時点で更新が止まってしまったコンテンツではなく、今も継続して更新されているコンテンツである、ということが分かりやすいし、画面上もペタっとした感じ → 動きがある、というような気がして、生き生きした感じがしそうだと思ったわけです。 「新着」とか「NEW」とかって表示させるだけなんだから、簡単に出来るっしょ!と、我ながら「ええこと思いついたなぁ」と、ニンマリ口元がゆるんでいました、この時は。 3つの選択肢 さて、ブログ記事を公開した際に「新着」だと一目で分かるような表示をする方法としては、3つあるようです。 A. 記事のフロントマターに手動で「NEW」印をつける ただし「もう新着じゃなくなった」タイミングで自分で削除する手間あり。 (フロントマターについてはこちら) B. 日付を見て自動で「NEW」をつける 「公開から7日以内の記事には自動でNEWマークを出す」という仕組み。一度設定すれば、以降は完全に自動で消す手間もなし。 C. お知らせ欄に「新着記事」として手動で書く お知らせ欄を作ってそこに「〇月〇日 新しい記事を公開しました」と書く方法。 この3つの選択肢から私が選んだのは、B です。 一度設定すればいいだけだし、自分が思い描いていたものとピッタリだと思いました。 ただ、テーマのファイルを「上書き」するという作業が入るらしく、少し難易度が高そうです。 とはいえ、ひとまずやってみよう!という事で、早速行動開始です٩(`・ω・´)و 具体的な方法 私はこのブログを Hugo というツールを使って作っているのですが、その中で「PaperMod」というテーマを使用しています。 テーマはブログの骨組みや外観に関わる重要な要素のひとつです。 (テーマについてはこちら) 今回の作業では「PaperMod」のファイルの中身は直接触らず「オーバーライド」という仕組みを使って、テーマ本体は無傷のまま表示だけを変える、ということをやっていきます。 オーバーライドに関しては、こちらのサイト「「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典」の説明を一読していただければと思います。 理由は、 分かりやすくこの説明をするには、ずぶの素人で初心者の私には難しい 故に専門家のサイトをチェックしていただきたい 日頃から分からない用語は必ずこのサイトをチェックしていてお気に入りのサイトであること 実際の作業中は、自分が何をしているのかちんぷんかんぷんだったのが、このサイトの説明を読んで、自分がやっていたことの輪郭が見えたというか、イメージが掴めたから(完全に理解できたわけではありませんが… ^^;) 以上の理由から、ぜひ上記のサイトを一読していただければ、より私のブログの内容も伝わるのではないかと思っています。 その上で、敢えて私自身の言葉で「オーバーライド」を端的に説明するなら、 ...
ブログ挑戦開始早々に直面したトラブル
初心者でありながら、Hugo や Cloudflare 、GitHub などを組み合わせて作るブログに果敢に挑戦してきました。 奮闘しながら着実に作業を進め、いよいよ最初の記事を公開することができ、嬉しさと感動で浮かれていた私に、突如何の前触れも無くひとつの問題が降りかかってきました。 これまで機能していた「ローカルプレビュー」が、なぜか上手く機能しなくなってしまったんです。今回は、「ローカルプレビューが機能せず顔面蒼白事件」の顛末についてまとめました。 はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 ローカルプレビューとは? 簡単に言うと、自分の PC の中だけで本番前の確認をする機能のことです。 今回の私の場合に当てはめてもう少し丁寧に言うなら、自分の PC 上で作成したブログ記事を、公開前に自分の PC の中だけで完成イメージを確認するための機能、ということになります。 初心者の私が挑戦したブログの手段は、必要なサービスやツールを組み合わせて作る方法で、ブログ記事は Obsidian というノートアプリで作成しています。 Obsidian で書いた記事を、Hugo というツールが HTML の Webページに変換してくれます。 つまり Hugo は、Obsidian で作成した文章ファイル( Markdown ファイル )を、Webブラウザ上で見ることができるようにサイトを生成してくれるのです。 このような手法でブログを作成しているので、公開する前に、実際に公開したらどのように見えるのか?を確認する作業がとても重要になります。 (ブログの手段やブログ組み立ての流れについては、『ブログ挑戦に必要なもの3つ』や『ブログ記事を書くために Markdown と仲良くなる』の記事の中でまとめています) 突然機能しなくなったローカルプレビュー ブログ公開に向けて準備している段階では、ローカルプレビューで下書き段階の記事を確認することがちゃんと出来ていました。 ところが、5記事公開して以降、突然プレビューが出来なくなってしまいました。 ここまで奮闘しながら一歩一歩ブログ公開に向けて進んできて、晴れて最初の記事を公開する所まで辿り着き、嬉しさと感動で有頂天になって浮かれていた所に、青天の霹靂とはまさにこのことです(泣) この時、自分の顔を見てはいませんが、一瞬、顔面蒼白になってたと思います(›꒪⌓︎꒪‹)チーン……… だって、プレビュー出来なきゃブログ公開出来ないじゃ〜ん(泣) もしくは、ぶっつけ本番でブログ公開すんの?いや、怖すぎるぅー!無理ぃー!(泣) 「えっ?てことは詰んだ?ブログ挑戦終了?!」 さっきまで楽園にいたはずなのに、急に奈落の底に突き落とされましたぁ。。。_|¯|○ やはりこの世は諸行無常だぁぁぁ〜 ん?諸行無常?ってことは、状況はまた変わるってことか?! 対処法の模索 諸行無常が真理なら、この苦境もまた変わっていくはず! ということで、現代では神頼みの他に AI という新興ツールにも頼って対処法を模索していきます。 早速 AI に「助けてくれ〜!」と救援要請したところ、毎度お馴染み「ひたすら状況確認の繰り返し〜」のドロ沼にはまりました( ´д`)ぇ~ AI :「まず〇〇を確認してください」 AI :「日付が未来になってませんか?」 AI :「新規記事はどのフォルダに作成しましたか?」 AI :「最近、設定ファイルの中身を編集しましたか?」…etc. ...
カテゴリーページを設置
ブログサイト内の情報を整理するため、カテゴリーページを設置してみることにしました。 ブログ挑戦に関するメインの記事は、「ブログ運営」のカテゴリーに、ブログそのものがどう変わったかに関する更新情報は、「ブログアップデート」に分類しました。 以前は空白だった画面の右上に表示されています。 どうですか?申し訳程度にカテゴリーが2つだけちょこんと並んでいます! 素人感満載で可愛くないですか?www なぜカテゴリーページを設置したか? 前回の記事「日本語対応の表記に変更」の扱いについて、これまでのブログ記事とは別に分類した方が、情報が整理されて見やすくなるのではないかと考えました。 これまで書いてきた通常のブログ記事は、私のブログ挑戦記で、 “ブログを運営していく過程を記録する記事” です。 一方、「日本語対応の表記に変更」のような記事は、 “ブログそのものがどう変わったかを記録する記事” となります。 同じ「ブログ」というテーマではありますが、情報としてはかなり性格が違います。 記事数が増えてきたら、「あの記事はどこだっけ?」が起きやすくなりそうなので、前回の記事をきっかけにカテゴリー分けをしてみることにしました。 実装してみて 最初はうまくいかず失敗したものの、2回目の挑戦で成功しました。 ブログサイト内の右上にカテゴリー欄が表示されてるのを見た時は、とても感動しました! カテゴリー分けのやり方は思ったほど難しくなく、設定情報を書き込む箇所に追加で指定してやるだけです。 ただ、この設定関連はまだ勉強不足で理解が足りていないので、詳細に関してはいずれメインのブログ記事でまとめたいと思っています。 まだ始めたばかりのカテゴリー分けの取り組みですが、ブログの成長がわかりやすいので満足しています。 今後もあれこれ改良しながらブログ挑戦を継続していきます🌱
日本語対応の表記に変更
ブログ挑戦を始めた当初、日付欄の表記に実は少し戸惑っていました。 というのも、巷でよく見るブログの日付は、「〇年〇月〇日」という日本語ですが、このブログの日付は、「January 1, 2026 」というようなアメリカ式の英語対応になっていたんです。 多少の違和感はありつつも、変えようにもどうするのか分からずそのまま放置していました。 今回、そこを修正して日本語に対応した日付表記にすることが出来ました〜ヽ( ´¬`)ノ ワ~イ 以前の表示 修正後の表示 これで見やすさがアップして、違和感も解消されました〜🎊 小さな変化ですが、自分のブログが少しずつ “らしく” なっていくのは嬉しいもんです^ ^ ちなみにやり方は、設定をあれこれ書き込むファイルなのかな?そういうものがあって、そこがデフォルトではアメリカ式英語になっていました。 それを日本語に書き換えたことで、修正することが出来ました。 今後の展開 この設定関連は、どのように扱うのかまだ全然分かっていない項目なので、おいおい理解していければいいなぁ、と思っています。 今後は、こうしたブログの更新情報も随時残していけば、ブログの成長過程がわかりやすいのではないかと考え、とりあえずやってみることにしました。 こういった情報は、お知らせや告知の要素が強いので、短文で要点だけ伝える形で運用してみようと考えています。 通常のブログ記事は、初めてその記事を見た人でも内容が分かるように、前置きや簡単な説明など、なるべく詳細に書いているつもりです。 ですが、短文ではそれが無いので上手く伝わるか不安もありますが、ブログそのものがどう変わっていったかを確認するのには打って付けなのではないかと期待しています。 今後も、ブログ記事の執筆に加え、読みやすい見やすいブログを目指して、改良しながらブログを育てていく予定です🌱
ブログチャレンジ60日目の成果レポート
初心者が『ゼロから始める90日ブログ立ち上げチャレンジ』を開始して、約2か月が経過しました。右も左も分からずに始めたこの挑戦は、既に3分の2が過ぎてしまいました。 自分には無理だと思っていたことが出来て感動したり、壁にぶつかって頭を悩ませては疲労困憊したり…。 ブログ挑戦を通して新しい経験を積んでいるなぁと多少の満足感を感じつつも、進捗や生産性に関しては課題山積です。 60日経過時点の成果と今後の課題についてまとめました。 はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 前置き 以前から「ブログをやってみたい」と思いながら、なかなか行動に移せずにいたものの、気持ちと行動が矛盾した状態に嫌気が差し、ようやく心を決め、千里の道の一歩目を踏み出すことになりました。 (ブログ挑戦に至るまでの葛藤についてはこちらの記事 ) 立てた目標は、 「90日で60記事書いて、最初の1人に届ける挑戦」です。 目標というか、冒険ミッションみたいな感じかもしれません。 真の目標は、ブログ記事を書いて公開、そしてそれを継続すること。(ง🔥Д🔥)ง ウオリャー! また、“期限を決めてCloudflareでブログに挑戦、期限内に上手くいかなければnoteで始める” という条件を自分で決めました。 (Cloudflareを選んだ理由についてはこちらの記事 ) 最初の30日で達成できたことは、 5記事作成 1記事公開(Cloudflareで) でした。30日目の成果レポートの詳細についてはこちらの記事 にまとめています。 60日目の成果 それでは結果から。60日経過して達成できたことは、 6記事作成 10記事公開 (60日間全体としては、11記事の作成と公開) う〜ん、この成果はどう受け止めるべきなのか難しいところです。 最初の30日は、記事作成以外にブログ公開のための技術設定など、やることが色々ありました。 次の30日に関しては、そういった技術的な設定等はほとんど無く、ブログ記事執筆に注力すればいいだけのはずなのに、記事数は前回より1記事増えただけでした。 振り返り そもそもの目標である「90日で60記事書いて、最初の1人に届ける挑戦」の目標数値は、荒唐無稽というか、自分の現実に合っていないかなり高い数値設定だった、ということはあると思います。 この “90日で60記事” という数字も、「こんなもんかな?」「これくらい出来たら上出来なのでは?」という感じで適当に決めたものなので、この数字に執着するつもりはありません。 また、文章を書く仕事なんて経験のない初心者で、日記すらまともに書いたことがないど素人が、そんな順風満帆に記事を量産できるなんて思う方が、頭の中お花畑状態だということも承知しています。 最初の目標設定が高過ぎ=現実を分かっていなかった、ということだと思います。 加えて結果の数字だけを見て、少し落ち込んでしまっているのかもしれません。 もともと、ブログを継続することは容易ではない、ということは重々承知していたからこそ、何度も何度も「記事を書いて公開する、これを継続すること」これが最重要課題で、最も注力すべきことだと自分に言い聞かせてきたはずなのに、まだ始めてたったの2か月くらいで数字を見て気落ちしている…。 馬鹿げた数値目標は、やる気を削ぐことに繋がりかねないな、と少なくとも自分には合っていないと思いました。 とはいえ、今回の成果には正直満足できないし、どちらかというと不服です。 現実にそぐわない目標数値の設定や文章を書くことに関して不慣れ、という点を考慮しても、もう少し改善していくべきだと思っています。 小さな敗北 今回ブログ挑戦にあたって立てた目標は、悪くはないけど自分には合っていない目標だということが見えてきました。 とはいえ、そこから分かることもありました。 それは、 90日で60記事はかなりハードルが高い ブログで収益化に数か月から数年かかる理由の一つは、納得いく記事の量産は容易ではない 記事数を積み上げないことには、最初の読者に届かない これらは実際にやってみたからこそ身に染みて実感できたことです。 これはある意味、収穫でもあると思います。 30日目は意気揚々としていたものが、60日が経過した今、自分の立てた目標達成には程遠いという現実を突きつけられ、小さな敗北感を味わっています(゜-Å) ホロリ 「じゃあ、ここで諦めるのか?」 まさか!苦労して Cloudflare でブログを公開するとこまで来たのに、早々に尻尾を巻いて逃げるなんてあり得ない! 「小さな敗北に涙してる場合じゃないぞ!」頭の中でこんな声が聞こえますΣ(´Д`;) うあ゙ “90日で60記事” という数字に気落ちしつつも、まだ挑戦を始めてたったの2か月しか経ってないという別の数字に、針小棒大に捉えすぎで「まだまだこれからやん!」と少し不安な気持ちが和らぎました。 そして、この記事を書きながら自分自身も、険しい凸凹道を進むのに苦戦してるだけで、諦めたくないと思ってるんだな、と再確認することができました。 ...
初心者ならでは!ブログ開始前の苦戦あれこれ
巷の情報を検索すると、初心者にはレベルが高すぎて「その手前が知りたいんだけど…」みたいな状況になることが割とあります。 専門家や詳しい人には当たり前すぎて、初心者がまさかそんなことでつまずいてるなんて思いもよらないのかもしれません… ^^;) 今回は、「そこ!?」って思われるかもしれない初心者ならではの、ブログ開始前に手こずったあれやこれやをまとめてみました〜 はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 前置き 本題に入る前に、私がどういう方法でブログに挑戦しているかを、あらかじめサラッとお伝えしておきます。 私が選んだブログのやり方は、必要なサービスやツールを組み合わせて作る、という自分で組み立てるタイプのものです。 (ブログの方法については、こちらの記事) なので本題を読んで、「そもそも、なんでそれが必要なの?」と思われるかもしれませんが、必要なものを自分で組み合わせて作らないといけないからです。 このことを踏まえた上でお読みいただければ、合点がいくのではないかと思います。 (ブログ開設の全体の流れについては、こちらの記事 では、本題に参りましょう〜┌|∵|┘ヨロシク 手こずり案件 その1:入口でもう迷子 詳しい人からすると、そんなことでつまずいてるのか?と笑われそうで、ちょっと悲しい気もしないでもないですが、実際つまずいたんだからしょうがない(´༎ຶོρ༎ຶོ`) 今後同じことでつまずかないためにも、ここは恥を忍んで、忸怩たる思いで我が身に鞭打って、不退転の決意を持ってここに記したいと思います!(ふざけてすみません┏●⁾⁾ペコリ) 冗談はさておき、ブログを始める前の準備段階のところで、初心者の私が最初につまずいたのは、 👉「GitHub の公式サイトがどれか分からない」 というものでした・・・ズコォーッ щ(゜ロ゜щ)オーマイガーッ!!!! 「なんでやねん!」とツッコまれそうですが、事実です(T_T) 自分で “ GitHub ” と検索して出てきたものと、AI が「これやで〜」と教えてくれたものが、なんかちょっと違うんですよね。 検索した方の URL は、https://github.co.jpで、日本語でサイトが見られるんですけど、AI が教えてくれた方の URL は、https://github.comで完全に英語表示でした。 ここで初心者は「えっ?どっち?偽サイト?」と、つまずいてしまうわけです。 日本人だから日本語のサイトの方が良さそうな気もするけど、「どうしたらええの〜(泣)」と迷子になりました。 初心者はこんなもんです(" ̄д ̄)けっ! AI によると、登録するなら「 github.com 」で、こっちが世界中で使われている GitHub 本体なんだそうです。 github.co.jpは日本向けの GitHub 関連サイトとして運用されてるとか。 結局、初心者の私は AI の言う通りにしましたが、今振り返ってみると、どっちでも行けたんじゃないかなと思ってます。 なぜなら、先ほど試しに日本語サイトの方から、「 GitHub に登録する」をクリックしてみたら、自分が登録したアカウントのページに飛べたからです。 「行けるんか〜い(  ̄- ̄)」 今回、初心者の私は、GitHub の本体か日本向けサイトかで迷子になっていただけなので、大きな問題は無かったのですが、初心者が気を付けなければいけないことがあります。 AI によると、GitHub は人気サービスなので、見た目が似ている偽サイトが存在することがあるんだそうです。 なので、アカウント作成時は、必ず公式のgithub.comから入ることを忘れないで下さい! ...
ブログ記事を書くために Markdown と仲良くなる
Hugo でブログを作るには、Markdown で文章を書きます。 Markdown と仲良くなることが、初心者にとってスムーズに記事を書くためのキーポイントと言っても過言ではないと思います。 この Markdown 、初心者には最初手こずらされる侮れない相手ですが、慣れてしまえばとても便利で良い相棒になります。 今回はそんな Markdown について理解を深めていきたいと思います。 はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 Markdown って何? まずは、いの一番に Markdown が何なのかをおさえておかないと先に進めません。 Markdown とは、 👉簡単な記号を使って文章の構造や書式を指定するための手法で、マークアップ言語1の一種です。 少し噛み砕いて言うと、普通のテキストに少しの記号を足すだけで、きれいに見える文書が作れるんです。 例えばこんな感じです。 例1 見出しは#で表します。 # 見出し ↑のように表記すると、実際の表示は↓のようになります。 見出し 見出しの大きさは、#の数で変えられる仕組みになっていて、#が増えるごとに小さくなっていきます。 例2 太字にしたい文字を**で囲ってやると、文字を強調することができます。 **太字** ↑のように表記すると、実際の表示は↓のようになります。 太字 他にも、 リンク 引用 リスト 表 などといった書式を手軽に表すことができます。 このように、簡単な記号で文章を構造化できるので、初心者にも扱いやすい手法となっています。 Hugo と Markdown Markdown が何なのか理解したところで、次は Hugo との関係です。 ざっくりとした流れはこうです。 Markdown で文章を書く ↓ Hugo が HTML に変換する ↓ テーマやテンプレートで見た目を整える ↓ Webサイトとして公開する “ Markdownファイル ” というテキストファイル(拡張子はだいたい「.md 」となっています。違う場合もあるようです)を作ってそこに文章を書くと、Hugo はこれを HTML の Webページに変換してくれます。 ...
ブログ記事の長さの正解は?
ブログ挑戦を始めたばかりのど素人の私。 ブログ記事1本の長さについて少〜し気になっています。 長い方がいいのか、短い方がいいのか。 ケースバイケースな気もするけど、ブログ界隈での定石とかあるんだろうか? ここは深掘りしてみると新たな発見があるかもしれないと思い、いろんな角度から掘り下げてみることにしました〜 はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 長文、短文それぞれのメリット・デメリット 長文 短文 情報量 ◎ 多い △ 少ない 網羅性 ◎ 高い △ 限定的 深い理解 ◎ 得意 △ 難しい 読みやすさ △ 構成次第 ◎ 読了までの負担感 △ 大きい ◎ 小さい 専門性・説得力 ◎ 出しやすい △ 執筆コスト △ 高い ◎ 低い 更新・メンテナンス △ 大変 ◎ 比較的楽 ブログでの長文、短文という前提で考えると、↑の表のような感じの性質があるかと思います。 その上で、初心者的観点からそれぞれのメリット・デメリットを比較してみました。 【長文のメリット⭕️👍】 情報量が豊富でお得感あり 1つの記事で疑問解消できる(あちこち別の記事を探し回らなくていい) 【長文のデメリット❌👎】 読むのが大変 書くのも大変 【短文のメリット⭕️👍】 読むのが楽 スマホでも読みやすい 【短文のデメリット❌👎】 情報量に限界がある 満腹感がない(足りない感じ) どちらも一長一短あるので、「詳細がわかる長文が有利」「短いほど読みやすい」という単純な話ではなさそうですねぇ🧐 ...
ブログの土台作り「はじめまして Hugo 」その2
前回の記事では、初心者が Cloudflare でブログ挑戦を始めたら、Hugo という便利なツールに出会って、私のブログ挑戦の仲間に加わることになりました。 ブログの土台作りとして、ターミナルの使い方を学び、Hugo をインストールし、ブログの作業場所を作るところまで進みました。 次はいよいよ、ブログの骨組みや外観を決める「テーマの導入」という作業に入っていきます。 はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 前置き 私のこのブログ挑戦は Mac を使って作業しています。 OS の異なる端末では使うツールや手順に違いがあるかもしれないので、あらかじめご承知おきください。 前回の記事で、Hugo のインストールはターミナルを使って作業、ということについて書きましたが、ここでおさらいです。 ターミナルとは、キーボードからコマンド(命令文)を入力して、コンピューターを直接操作するための司令塔みたいなソフトのことです。 最初の設定では、このターミナルをかなり使います。 これから作業に入っていく「テーマの導入」も、ターミナルを使っていきます。 テーマの選択 まずテーマとは、ブログの骨組みや見た目(デザイン)に関わるもので、どれを選ぶかによって、そのブログの印象が大きく変わってきます。 素人のくせに一丁前に「おしゃれでカッコいいのがいいな!」なんて思っちゃうわけなんですよね〜(´∀`*)エヘ AI がすすめてきたのは「PaperMod」というテーマです。 軽い シンプル 人気が高い 長く使える なんだそうで、初心者向けの設定が少ないテーマとして、この「PaperMod」などがよく使われているということでした。 そう言われても、どんなものかピンとこないし、他のテーマも気になるし、ということで、Hugoの公式サイトや、巷のおすすめなんかを調べに行ってみました。 あれこれ情報をゲットして公式サイトを見に行ったんですが、テーマの種類は物凄ぉ〜くたくさんありました。 ゲットした情報から複数のテーマをチェックし始めたんですが、選択肢が多いこともあって正直よく分からんし、「コレだ!」というテーマも特に見つけられませんでした。 AI おすすめの「PaperMod」が一番シンプルで分かりやすそうだな、と思いましたね。 「シンプル イズ ベスト!」ということで、「PaperMod」でいいや、となりました〜🎉 今となっては、このシンプルなテーマを選んで良かったな、と満足しています(*´ω`)ノ ハィ テーマの導入 どのテーマにするか決まったところで、ここからまたターミナルを使って作業していきます。 実は、「PaperMod」の導入方法は主に3つあるそうなんです。 git clone で導入 Git Submoduleで導入 ZIPをダウンロードしてコピー ここではそれぞれの導入方法について詳しく触れませんが、それぞれメリット・デメリットがあります。 そして、今回 AI の誘導のもと私が行ったのは⒈のgit clone での導入方法です。 実はこれが後に、混乱の渦に私を陥れる元凶、諸悪の根源「テメ、ぶっ飛ばすぞ!オコだぞオコ、怒💢💢」の発端となる出来事であることは、この時は知る由もありませんでした。 (この混乱の渦に巻き込まれて心が折れかけた件については、またいずれ記事にします) さて、後に降りかかる災難なんて微塵も想定していなかった呑気な私は、AI に言われるがまま、ターミナルでコマンドを実行していきます。 自分の Mac にテーマを入れ、Hugo に「PaperMod」を使うんやで、と教えてやる設定をしていきました。 ...
ブログの土台作り「はじめまして Hugo 」その1
初心者がCloudflareでブログに挑戦しようと行動を開始したら、どこからともなく急に現れた " Hugo " と " Astro " 。 「誰あんたら?いったい何者?」状態の私はまず、この2つの選択肢のうち一方を選ばなければいけないという岐路に立たされました。 まずは、" Hugo " と " Astro " についてどんなものか知ることからスタートです。 はじめに 知識ゼロ、ずぶの素人、頭の中はほぼ空っぽの超初心者がブログをやってみようと決意。 その過程で 「なんか難しすぎんかい?!」とつまずいた事、 「どゆこと??」とよく分からなかったこと、 「へぇ〜、そういう感じなのね」と学んだこと、 「おっ?なんか身になったっぽい」と得られたことなど、あれこれ記録しています〜 Hugo と Astro Cloudflareでブログを公開するためには、ブログの中身を用意しなければなりません。 中身、つまりブログに書く文章や画像をパソコンの中で用意する際に、この Hugo や Astro というツールを使うと簡単なんだそうです。(AI 調べ) この Hugo や Astro は、専門用語で「静的サイトジェネレーター」と言い、静的サイト=作り置きのサイトを生成してくれるツールのことです。 静的サイトのイメージは、作り置きのパン屋さんです🥐 あらかじめ完成形を作っておくので、表示される内容が変わることはありません。(誰が見ても同じ) 対して、動的サイトのイメージは、注文を受けてから作るレストランです🍳 なので、表示される内容が変わることがあります。(人によって内容が変わる) 例を挙げるなら、 このブログ『知識ゼロからの試行錯誤 Lab Log 』は「静的サイト」 Amazonなどのネット通販サイトは「動的サイト」です。 噛み砕いて言うと、静的サイトジェネレーターというのは、材料となる「記事の文章」と「デザインのひな形」を入れると、「完成したブログのページ」(お店に並べられる商品)が出てくる機械のようなイメージのものです。 要するに、ドラえもんの道具みたいな便利アイテムなんですね〜 それぞれのメリット・デメリット Hugo や Astro がどういうものなのか、なんとな〜く分かったところで、違いは何なのさ?ってことで、それぞれのメリット・デメリットを比較・検討してみました。 【Hugoのメリット⭕️👍】 高速(数百~数千記事になっても生成が非常に速い) 情報が豊富(ブログ用途で長年使われてるので、検索して問題解決しやすい) 長期運用しやすい(仮に Hugo をやめても、記事のファイル、画像はそのまま残る) 【Hugoのデメリット❌👎】 デザイン変更が少し難しい 動的な機能が苦手(検索機能やコメントなど) 【Astroのメリット⭕️👍】 ...