僕がブログを構築した当初のサイトデザインは見すぼらしかったです。とにかく速く記事作成などコンテンツを充実させることに専念したいため、1から自分でデザイン構築する余裕がありませんでした。
WordPressのテンプレートを活用はしますが、テンプレートを使うことは他の人と同じデザインになるということです。なるべく、自分のサイトらしいデザインを目指したかったので、そこで工夫した内容について記事にします。
公開されいるサイトデザイン(CSS)
ネットには様々な資源が落ちています。その中には、常に公開されていて著作権の問題が一切生じない資源があります。それは、サイトデザインです。サイトデザインは、HTMLとCSSをダウンロードすることで表示しており、その内容は、ほとんどのサイトで解析な状態で公開されています。
デザインのゴール
デザインにはキリがありません。先ずは、何を変えたいか明確にしていきます。その中では、良いデザインの具体的なイメージが無いと進みません。
何を変えれば良いデザインになるか?
実のところ、それほど悩む必要はありません。というのも、サイトを構成する要素に分解すれば分かります。サイトは、段組み(フレーム)、文字、画像で出来上がってます。シンプルにすると、結局この三要素のみでサイトの個性が決まります。ブログをシンプルにすれば、結局は文字と画像(たまに動画)が本質となるコンテンツだと分かります。
サイトの三要素が分かったので、この三要素を解析することで、自分のサイトを劇的に変化させることができそうです。これは、パワーポイントでの工夫と同じです。また、パワーポイントでフォントを変えるだけで、資料のデザインが劇的に変化するという経験をしていない方はいないと思います。
解析のやり方はとても簡単です。特殊なソフトをインストールする必要もなく、その場で簡単に出来ます。やり方は、
CSSの解析と言えど、段組み(フレーム)、文字、画像の三要素に絞った解析であれば、さほど時間を掛けずに終わります。また、取り出すCSSコードも短くて済みます。
段組み(フレーム)、文字、画像の三要素に絞って他の人のサイトを見てみましょう。様々なことに気づきます。僕が日頃からセンスが良いと思っていたサイトを解析して思ったことを書くと、
文字の種類は何か分からないが綺麗に見える。
文字が意外と小さい。
画像が多用されている。そして、文字が少ない。
画像が、スマホとPCで表示が変わる(スマホだとより小さな画面に適した見やすい表示になる。)。
段組みは、内容がシンプルに伝わる1カラムか、2カラム。
ごちゃごちゃしおらずシンプル。
以上のことを率直に思いました。
自身が感動したデザインについては、すべてCSSを抜き出して自分のサイトに組み込み真似てます。とは言え、抜き出したCSSコードは30行に満たないと思います。僕が組み込んだCSSコードは下の通りです。
月間10万PVメディア「MOMOHUKU」を支えるツール3選
「MOMOHUKU」は"月間10万PVメディア"にまで成長しました。
最近は"DX(デジタルトランスフォーメーション)"が流行りのせいか、、、「MOMOHUKUさんのWebサイトの運営ノウハウを知りたい。」とよく聞かれます。
誰もが知る東証一部の企業からも「コンサルしてほしい」と言われます。
表向きは丁重にお断りしていますが、ITコンサルなんか「ナンセンスなので絶対やらんわ」と内心では思っています。
僕がITコンサルに手を出した時は「よほど、この人はお金に困ってるんだな」と蔑んでみてもらって構いません。
後、ブログ運営に関する記事も書きません。
面倒臭いからです。
今の「DXの流れ」に一言いうなら?
興味ない。勝手にやってろ。
代わりに、このスペースでWebサイトで絶対に活用すべきツールを紹介します。
ここで紹介するツールがなければ、MOMOHUKUは「月間10万PV」にはならなかったと断言します。
貴重な情報を入れて「ブログ運営」に関する記事を過去に書きましたが、どれもアクセスが伸びませんでした。
ブログ運営に関する記事は巷に溢れ過ぎていて読み手からは全部同じ内容に見えるんだと思います。
かなり良い記事でしたが「全て非公開」にしました。
二度と公開しません。
とは言え、WPのエラー対策の記事などは上げています。
ツール①:WordPressテーマ「SWELL」なら「コンテンツ作り」に専念できる。
SWELLを使えば「コンテンツ作り」が「3倍」は速くなります。
SWELLを最初から導入しましょう。
僕は「Webサイト運営が軌道に乗ったら」と考えて、100記事くらい書いたのちにSWELLを導入しましたが「最初から導入しておけばよかった」と後悔しました。
僕はWebサイトを「コンテンツファースト」で運営しています。
ちなみに「ITの専門知識をできるだけ使わない」ように心がけています。
非ITの人でも「学習コストなく運営できる仕組み」になるからです。
ITの専門知識を使うと"コスト"が発生する
- コーディングすると"保守"が発生する。
- 非IT系が一切触れなくなる。
- 学習コストも発生する。
まぁ、こういう配慮をすると「舐め腐ってくる」のが非IT系ですが。
長い目で見れば「コーディング排除」は組織にとって確実に使い易いシステムになります。
まぁ「舐め腐ってくる非IT系」をきちんとシバき倒して下さい。
ツール②:レンタルサーバー「ConoHa WING」なら5分でWebサイトを構築できる。
「MOMOHUKU」は、レンタルサーバーに「ConoHa WING」を利用しています。
これから自分のオウンドメディアを立ち上げる方は「ConoHa WING」の利用をオススメします。
理由は「ConoHa WING」なら5分でサイトが立ち上がるからです。
「コンテンツファースト」を心がけていると書きました。
同様にITは「シンプルさ、手軽さ」が正義です。
技術を軽視するわけでなく「ITにこだわると面倒臭く」なるだけだからです。
例えば
「WordPressを高速化してくれ」とITエンジニアに相談してみてください。
WordPressをGatsby.jsで静的サイト化すれば爆速化します!なんて言うITエンジニアが絶対にいます。
そのITエンジニアは続けてこう言います。
サイトは爆速化されますが「非IT系」はWebサイトに触れなくなります。
うちは「エンジニアしかいない」から良いんです。
こういう会社は「先祖帰り」したいだけです。
「自分たちにしか出来ない仕事」を増やしたいだけですね。
何より前提である「サイトが爆速化」されると言うのも絶対に達成されません。
僕のサイト「MOMOHUKU」と「Gatsby.jsを一生懸命に導入したWebサイト」でPageSpeed Insights(速度評価を比較)してみれば分かります。
ツール③:WordPressのプラグインは、とりあえず「UpdraftPlus」を入れる。
僕が尽く救われてきたプラグインを一つ上げるなら「UpdraftPlus」です。
「UpdraftPlus」だけで確実に幸せになれます。
しかも、無料です。
本当に申し訳ないことに「無料」で必要十分の機能です。
そろそろ、感謝だけの気持ちで「有料」を購入しようかと思っています。
コメント