WordPressで構築したWEBサイトの説明

私自身、セルフメイドでBlogを構築してみたいと考えWord Pressを使い実際にWEBサイトを構築し運営しています。Word PressはCMSとして非常に完成されており、多少の知識や学習意識は必要ではありますが、おそらく誰でも理解出来る内容であり最初の一歩を踏み出しやすいWEBサイト構築ツールです。

私自身がそうであったように、WEBサイトの開設当初より知識が増えてくるとWord Pressが持つ可能性や構築出来るWEBサイトの広さに感銘を受け色々な機能を持つWEBサイト構築や、デザイン幅の広さにチャレンジしたくなります。

このWEBサイトの記事が、初めてDrupalでWEBサイトを構築していくというテーマであり、Drupalが持つWord PressとのWEBサイト構築に対する考え方の違い、少し柔らかい言い方をするとまとめ方に対する考え方の違いに興味を持った事がDrupalに興味を持ち実際に導入した動機でもありますので、Word Pressに関する記事も時折交えて行きたいと考えています。

WEBサイトの説明

Word Pressを使い、初めて構築したWEBサイトになります。

WEBサイトの内容は前項でも説明しましたが衣食住をテーマに知人のお店を紹介出来たらと考えBlog形式で50代のライフスタイルを提案するような形でWEBサイトを作っています。構築は結構ハイペースで進めたのですが、構築以降なかなか時間が取れず更新が止まっていますが時間を見つけて再開できたらと考えています。

Hooked-on

WEBサイト構築のルール

1. 全ての写真を自身で用意する
2. 著作や肖像権は全てフルオリジナルとするため私自身以外の写真と私自身所有するもの以外原則使わない事
3. 私自身の写真を一人で撮るので写真は全てセルフィーで撮影
4. デジタル一眼を使い写真のクォリテーは落とさない事
5. 50代を超え還暦が近い私自身がモデルになっているので見苦しくない写真を用意する事
6. ルックスが良いわけではないのでサングラスや帽子を用意し私ではなく紹介する衣類などが引き立つ写真を用意する事
7. 記事は全て自身の体験による記事

などを考慮しています。

使用テーマ

オリジナリティーにこだわったルールを決めて素材を用意しWEBサイトを構築しています。使用したテーマは純国産のWord Pressテーマを多数開発し販売しているTCDさんのBloomというBlogテーマを使用しています。このテーマの開発時期が2015年と開発から時間が経っていますが、非常にシンプルで記事の見やすさや極度の装飾要素がなかった事が決め手になっています。TCDさんや使用したBloomの簡単な説明やWEBサイトは文末で紹介します。

制作した記事はTopのナビゲーションと共に右サイドメニューにカテゴリーやタグを設置しています。シンプルな構成や洗練した視覚要素を意識しフッターもサイトクレジットのみにしています。サイトを訪れた方になるべく作成した記事を多く見ていただく事を前提としての構造になっています、初めて使うWordPressを使いこなす事も目的の一つでありBlogの構築というWEBサイト構築として考えた場合最低限でもあり理解しやすい基本構成で構築しています。

実際の構築

シンプルな構成なWEBサイトの構築でもあり記事のテーマも決めていたので、まずBloomテーマの基本設定を行い、いくつかの記事サンプルを作成し記事のフォーマットを決めます。記事 > カテゴリー > メニュー > Top の基本構成の型と大まかなカテゴリー分けを行い実際の構築作業として記事を書いて行きます。記事を書きながらカテゴリーやタグを随時追加して行きます。

記事の作成

始めたら一気に突貫で作っています。当初公開する予定の22記事を作成し、以降の更新分の8記事を含めた30記事を2週間程度で作成します。その短期間での記事作成時間の中に、記事に必要な写真の撮影時間もあるのですが、時間をかけない為なるべく一度の撮影で複数の写真を用意する段取りを組み、撮影するための着替えも用意し、着替えをしながら撮影をしても迷惑がかからない環境として地方の海岸を選びそこで撮影を進めます。

短時間での作成

予約記事は2月分くらいの記事をストックし順次公開するようにして記事を追加しています。制作にかかった時間ですが基本のサイト構成はほぼ1日で作り、記事と写真加工を進めながらの構築を進め、記事が追加されると作った記事の不備が見えて修正といった作業の方が時間がかかっています。こうしたプロセスを経てWEBサイトの公開をして行きます。

Hooked-on En

英語版の作成

その後、マルチリンガルにも挑戦と考え英語版をサブドメインに追加しています。翻訳ソフトで訳して同様に記事を配信していますがこの英語ページは1週間くらいで構築しています。サイトの構築は日本語のページで行なっているので、それほどの手間ではなく翻訳と記事のアップに多少の時間がかかりましたが日本語で作ったページがあるのでそれほどの時間はかかっていません。マルチリンガルという発想と手法はいくつかありますが、私が取ったアプローチは、全く別のWord Pressのサイトを用意し、そこにデザインや構成を同一とし英語化したWEBサイトを構築し、それぞれをナビゲーションにLangageとして言語選択を切り替えるリンクを設置するというごくオーソドックスな形で行っています。このWEBサイトのWord Pressの管理画面は当然言語選択で英語を選択し管理画面、WEBサイト共に全て英語となっています。

Word Pressのシステムとは関係ないのですが、マルチリンガルとして英語を選択していますが、私自身が英語が得意ではないので翻訳ツールを利用し翻訳を行い記事を作成しています。

翻訳ソフト

翻訳サービスは、Googleの翻訳や、私自身がMacとサファリがデフォルトブラウザなので、サファリの翻訳機能など無料でも優れた翻訳ツールが用意されています。翻訳された文書のニュアンスや、意味が異なってしまわない翻訳精度を考えた際、DeepLという翻訳ツールが最適だったのでDeepLを使い記事の翻訳を行っています。無料版でも機能は充実しているのですが、私自身ソフトウエアの開発陣には敬意があり、有料版があればなるべく有料版を選択することで、素晴らしいツールを提供している方の活動が促進される事を願っています。その事から当然有料版のDeepL Proを利用しています。

Portfolio.Hooked-on

写真閲覧サイトの作成

WEBサイトの構築が進み、記事も充実して来た頃、撮影した写真をもう少し良い形で訪問してくれた方に提供できないか？と考えて行きます。その写真を良い形で提供するという理由にWEBサイトのアクセスを増やす手法として海外の巨大な写真をポスト出来るWEBサイトに投稿するというアプローチも視野に入って来ます。

海外での写真投稿

私自身ネット上での活動はほとんどしていないのですが写真はM型Leicaを使っていた関係で、過去に知人から誘われて、Leicaの写真投稿サイトLFIにいくつか投稿しています。この投稿は結構シビアな世界で、Leicaが良い写真と判断するとSelectとして、LFIの中のLeicaが良い写真として選んだジャンルに記録されて行きます。

逆にSelectされないと、自身のアカウント以外には表示されずほとんど誰の目にも触れないで終わります。Word Pressの記事とは関係ないのですが、海外の写真投稿と写真評価の考え方が日本の写真とは全く異なっていて、良い写真の理由、何故素晴らしいかを証明出来る要素が写真に入っていないと全く評価されません。この評価に被写体選択や構図の巧さ、オリジナリティや芸術性や社会性など色々な要素が絡んでいます。

ポートフォリオの必要性

LFIの例だけでなく、自分が撮りある程度に仕上げた写真を海外の写真投稿にポストした際、評価をいただけるとその次のステップに活動内容を告知する必要があります。この告知は必ずしも必要ではないのですが、このアプローチによりポストした写真がWEBサイトへのアクセスを促進してくれます。

このような理由から写真をもう少し大きくして、フルスクリーンのページを作りたくなります。目的が海外の写真投稿サイトに活動状況を告知する為なので、自身が撮った写真のポートフォリオとして利用する写真ギャラリーを制作していきます。

ポートフォリオ用テーマ

写真投稿サイトにデザインにこだわった写真ギャラリーを告知したいのでデザインはBlack Silverという写真のポートフォリオを作成するテーマを選びます。デフォルトで海外の有名写真スタジオが活動内容のポートフォリオを告知するようなデザイン性に優れたテンプレートになります。

Elementor

そのまま使ってもかなりハイレベルなデザインとなっています。サイトの構築はElementorを使って作成しています。構成が決まると写真とコメントを追加するという非常に簡単な操作で海外のファッション雑誌の見出しのようなとても素人が作成したとは考えられないデザインのページになります。

実際の構築はElementorの使い方を簡単に覚え、ページデザインの選択を行い、構成が決まれば、作成するページは写真を並べコメントを入れるだけなので賞味3日で完成させます。

当初はフルスクリーンのスライダーがベースのデザインで構築しています。更新でコラージュのようなギャラリーの追加を行い簡単なブログ記事も書いています。

このようなデザインのWEBサイトが簡単に作れてしまうのもWord Pressの利点です。

参考

Word Pressのサイト構築をする際に使用したTCDさんのテーマとページ制作に使用したサイトビルダーElementor、Potfolioのテーマとして使用したBlack Silverのホームページになります。

おわりに

Drupalを理解する比較対象として前項と当項にてWordPressで作成したWEBサイトの説明を駆け足で説明しました。

不慣れながら突貫で作成したWEBサイトですが、それなりの形になっているのは、WordPressとテーマやプラグインが優秀で、私の知識不足を補ってくれています。当WEBサイトはDrupalを使いWEBサイト構築の学習していく事を目的としていますが、初めてWEBサイトを構築するのにWordPressは非常に適している事を再確認した記事となりました。