EnjomonWeb

WEBページの画像
2024/06/02

誰でも簡単に作成・編集ができる!Excel(エクセル)でWEBページを作る方法

htmlやCMSを使わなくても、Excel(エクセル)さえ使えれば、誰でも簡単にWEBページの作成ができることをご存じですか?

Excelであれば多くのパソコンにインストールされており、ページの更新もExcelで可能なため、メンテナンス性にも優れており、なかなか便利な機能です。

WEBページを作りたいけど、言語の習得や使ったことのないシステムの利用は少しハードルが高く感じる...そんな方におすすめの手法です。

但し、ユーザビリティーが低かったり、SEO効果は全くといっていいほど得られないと思われますので、社内ポータルサイトの作成など、利用は限定的にする必要があるためご注意ください。

作成手順

さっそくExcelをWEBページとして保存する手順を解説します。

以下のExcelで作成された従業員名簿を例として説明したいと思います。

①名前を付けて保存

Excelファイルを開いたまま、上部「ファイル」から「名前を付けて保存」を選択します。

なおExcelもちゃんと上書き保存してから行いましょう。

②ファイルの種類で「WEBページ」を選択し保存

ファイル名はExcelと同じ名前が自動的に入りますので、そのまま保存しましょう。

③ブック形式の確認で「はい」を選択

※「はい」クリック後、元々のファイルがExcelファイルのまま表示されたり、WEBページをExcelで開いた状態で表示されたり、バージョン?によって違うようです。

WEBページをExcelで開いた状態で表示されていた場合、編集を続けると元のExcelファイルに編集内容が反映せず不都合が出る可能性があるため、ファイルは一旦閉じることをおすすめします。

④Excelファイルと同じフォルダにWEBファイルが作成される

拡張子が「.htm」のファイルが作成されます。

WEBページは通常「.html」ですが、ExcelをWEBページで保存すると「.htm」となります。

※この時点でExcelファイルは削除しても問題ありませんが、残しておいた方が後述する編集に役立つため、削除せず置いておきましょう。

※拡張子が「.files」のファイルフォルダを削除してしまうと、htmファイルも消えてしまうためご注意ください。WEBページの部品が入っているようなフォルダです。

⑤WEBページ完成

作成されたhtmファイルを開くと、WEBページとしてブラウザで表示されるはずです。

これでWEBページの作成は完成となります。

とっても簡単ですね!

編集方法

続いて編集方法を解説します。

内容の追加や変更など、編集もExcelで簡単にできます。

WEBファイルをExcelとして開いて編集する方法もありますが、その方法だと図の編集ができなくなったり、数式が消えてしまったり、効率が悪いところが多いため、元のExcelファイルを編集する手順で解説します。

ちなみに最初の手順が少し違うだけで、作成手順とほぼ同じ操作です。

①編集したいページの元Excelを開く
②Excelを編集し上書き保存する

編集が終わったらExcelの上書き保存も忘れずに行いましょう。

③名前を付けて保存
④ファイルの種類で「WEBページ」を選択し保存

ファイル名はExcelと同じ名前が自動的に入りますので、そのまま保存しましょう。

⑤名前を付けて保存の確認

「はい」を選択し上書きします。

⑥ブック形式の確認で「はい」を選択

※「はい」クリック後、元々のファイルがExcelファイルのまま表示されたり、WEBページをExcelで開いた状態で表示されたり、バージョン?によって違うようです。

WEBページをExcelで開いた状態で表示されていた場合、編集を続けると元のExcelファイルに編集内容が反映せず不都合が出る可能性があるため、ファイルは一旦閉じることをおすすめします。

⑦WEBページが更新される

htmファイルを開くと更新した内容が反映しています。

以上が編集の手順となります。

おすすめはしませんが、念のためWEBページをExcelで開いて編集する方法も続いて説明します。

WEBページをExcelで開いて編集する方法

WEBページを開くプログラムをExcelを選択して開くと、WEBページをExcelとして開き、直接編集等が可能です。

①WEBページをExcelで開く

htmファイルのうえで右クリック→プログラムから開く→Excelを選択します。

他にも簡単な開き方として、なんでもいいのでExcelブックを開き、htmファイルをExcel上にドラッグし開いてもExcelで開けます。

②ページを編集する
③上書き保存する

以上の手順で、WEBページをExcelとして開き編集が可能です。

ただ先述した通り色々不具合があるため、あまり更新がないもの以外は、この方法での更新はおすすめしませんのでご注意ください。

ここまでExcelからWEBページを作成する方法を説明しましたが、WEBページを単体で利用することはあまりなく、通常はリンク先のページをWEBページとして表示させるなどといった利用が多いかと思います。

ここからは複数のWEBページのリンク元となるページの作成を、ポータルサイト作成を例として解説していきたいと思います。

ポータルサイト作成手順

①Excelでポータルサイトを作成する

サイトのデザインやコンテンツはお好みでどうぞ。

②リンクを貼る

今回は例として、先ほど作成した従業員名簿をリンク先として貼ってみます。

リンクを貼りたいセルにカーソルを合わせ、挿入→リンク(ハイパーリンクの挿入)をクリック。

なおフォルダの階層は、ポータルサイトの階下に、リンク先を集約したフォルダを作成するのが分かりやすくてオススメです。

③ファイルを選択

リンク先に設定したいページのhtmファイルを選択し、OKをクリックします。

フォントがリセットされるため、必要に応じ変更してください。また下線が不要な場合は消去しましょう。

④Excelを上書き保存

リンクを貼った状態のExcelが完成しました。

この時点で忘れずに上書き保存しましょう。

⑤名前を付けて保存
⑥ファイルの種類で「WEBページ」を選択し保存
⑦ブック形式の確認で「はい」を選択
⑧Excelファイルと同じフォルダにWEBファイルが作成される

これでポータルサイトが完成しました!開いてみましょう。

ポータルサイト完成イメージ

ただこの状態だと、リンクをクリックすると開いていたページがリンク先のページに変わってしまい、ポータルサイトに戻りたい場合、ブラウザバックで戻る必要があります。

敢えてそうする場合もありますが、基本的にはポータルサイトは開いたまま、リンクは別タブで開いた方が効率的なため、リンク先を別タブで開く方法も紹介したいと思います。

リンク先のページを新規タブで開く方法

通常、リンク先を新規タブで表示させる場合、htmlでアンカータグに「target=”_blank”」を設定することで可能となります。

今回Excelで作ったhtmファイルも、実はhtmlとしてマークアップ言語で書かれたテキストファイルとして存在しており、その中身に少し手を加えることで可能となります。

①filesフォルダを開く
②sheet001ファイルをメモ帳で開く

Excelのシート別にファイルが作成されるため、該当のシートファイルをメモ帳として開きます。

メモ帳での開き方は、該当ファイルのうえで右クリック→プログラムから開く→メモ帳をクリック。

プログラムにメモ帳がない場合は、編集方法でもご紹介した通り、新規メモ帳を開いてファイルをドラッグでも可能です。

③sheet001ファイルがhtmlで表示される

これがExcelで作ったファイルをhtmlとして表示した状態です。

通常書くプログラムより複雑になっています。

ちなみにプログラム内の以下部分がリンクの設定になります。


<td class=xl75 colspan=2 style='mso-ignore:colspan'>
<a href="../img/従業員名簿.htm"  target="_parent">

「target="_parent"」となっており、parentは同じウィンドウで表示になるため、このparentの部分を、新規タブで表示のblankに変更してあげます。

④parentをblankに置換

メモ帳を開いた状態でCtrl+Hをクリック→上段に「parent」・下段に「blank」と入力し、すべて置換をクリック→上書き保存。

(すべて置換が表示されない場合は、ウィンドウサイズを大きくしてみましょう)

⑤リンクが新規タブで表示

htmファイルを開いてリンクをクリックしてみましょう。

リンクが新規タブで表示され、ポータルサイトはそのまま残るようになりました。

どちらの方がいいかはサイトによると思いますので、目的に応じて設定してもらえればいいかと思います。

以上、ExcelからWEBページを作る方法、またポータルサイトの作り方でした。

htmlが分からない方が多い環境でも使える技術なので、簡易なWEBページをすぐにでも作りたいという方は利用を検討してみてもいいかもですね。

About

EnjomonWebは、「えんじょもん」である元転勤族の管理人が石川県金沢市から発信する、WEB制作情報をメインとした情報発信サイトです。

コーディング習得過程で検索してもすぐに解決しなかったことや、初心者には分かりづらい内容を分かりやすく説明することができるサイトを目指しています。

※「えんじょもん」とは金沢弁で「遠方の人、県外出身の人」という意味の方言。