バナー画像

ビューア(viewer)という言葉は「画像ビューア」「イメージビューア」「ブラウザビューア」など様々な言葉とセットで利用されています。

本記事では、HTMLビューアにフォーカスを当てて基本的な概要と抑えておきたいアプリを厳選してご紹介していきたいと思います。

HTMLビューアって何?


まず「ビューア(viewer)」という言葉の意味として、データやファイルなどを閲覧・表示するためのソフトウェアのことを指しています。

つまりHTMLビューアはHTMLを閲覧・表示するためのソフトウェアのことを意味します。

一般的に出力に特化したものをHTMLビューアと呼んでおり、編集や保存などの機能は備えられていません。
※最近のHTMLビューアは、編集・保存が可能なソフトウェアも数多く存在します。

HTMLエディターとの違い

HTMLエディターという言葉も一般的に使用されていますが、HTMLビューアと何が異なるのでしょうか?

結論としてHTMLエディターには、HTMLの編集や保存機能が備えられているソフトウェアを総称してHTMLエディターと呼んでいます。

HTMLビューアは閲覧・表示(ソフトウェアにより編集・保存機能)に対し、HTMLエディターにはデフォルトで編集・保存機能が備わっています。

パソコンで使用可能なHTMLビューア


パソコンでは様々なHTMLエディターが利用出来るため、一般的にHTMLファイルを開く際はHTMLエディターを活用する方法が一般的です。

広義の意味でHTMLビューアの一部である、おすすめHTMLエディターをご紹介していきます。

Visual Studio Code

Visual Studio Codeは現在、最も注目を集めているエディターの1つです。

HTMLエディターとして紹介していますが、ほぼ全てのプログラミング言語に対応しており、更に任意のOSで利用することが可能な強力なエディターです。

2015年に登場したばかりの比較的新しいエディターですが、軽量でありながら高性能なことから近年シェア率が大幅に上昇しているコードエディターです。

Atom

GitHubがリリースして一躍人気となった「Atom」も注目のエディターです。

Web開発に特化して作成されており、もちろんHTMLビューアとしての役割も果たします。

様々なパッケージが提供されており、自分好みのエディターにカスタマイズ可能な点も人気の理由となっています。

Sublime text

Sublime textはデフォルトが軽量でありながら、パッケージやAPIを追加することでカスタマイズ可能なため、古くから愛用しているユーザーも多いテキストエディターです。

HTMLとCSSのコードを見やすくするためのカラースキームが標準で搭載されているため、余分な機能は必要ないHTMLビューアとして利用したい方には使いやすいエディターです。

Windowsはもちろん、MAC・Linuxにも対応しており、設定ファイルを同期することで様々な環境で自分好みのカスタマイズを使いまわせるメリットがあります。

サクラエディター

必要最低限のHTMLビューアとしての役割があれば良いという方におすすめなのはサクラエディターです。

国内でも古くからユーザーが多く、信頼性の高いテキストエディターです。

今回ご紹介している他のエディターほど多機能ではありませんが、シンプルなHTMLビューアとしての役割は十分に果たせるエディターです。

WebStorm

WebStormはJetBrains社が提供する高機能コードエディターです。

HTMLビューアと呼ぶには豊富すぎるほどの機能が提供されています。

コードの編集履歴が保存される機能や、リアルタイムエラー検知機能がデフォルトで提供されており、プログラマーにとっては非常に使い勝手の良いHTMLエディターです。

有料エディターのため、HTMLを閲覧・表示だけを利用用途とする方にはあまりおすすめとは言えません。

Android端末で使用可能なHTMLビューア


スマートフォンの登場で、携帯端末でもHTMLファイルの閲覧表示が可能になっています。

まずはAndroid端末で使用可能なHTMLビューアを3つご紹介していきます。

HTML Viewer

HTML Viewer(GooglePlay Store)

HTML Viewerで検索をすると大体一番上に表示されるのがこちらのアプリです。

簡易的に表示するのであれば特に問題なく利用することは可能ですが、レビューにもある通りバージョンにより文字化けの問題も懸念されます。

GooglePlay Storeでの評価は「3.6」でまずまずの評価を得ています。

Local HTML Viewer

Local HTML Viewer(GooglePlay Store)

スマートフォンに保存されたhtmlファイルやCSS、Javascriptファイルを閲覧することが可能なアプリです。

zipで圧縮されたファイルの閲覧も可能で、簡単な確認であればこのアプリだけで足りるほどの機能が提供されています。

GooglePlay Storeでの評価は「3.9」で、1000件以上の評価が寄せられており、実績も十分なアプリです。

HTML Source Code Viewer Website

HTML Source Code Viewer Website(GooglePlay Store)
こちらのアプリは閲覧だけでなく、ソースコードを編集することも可能です。

ソースコードを共有する機能も実装されており、HTMLビューアの域を超えるような多機能ビューアです。

GooglePlay Storeでの評価は「4.7」とかなり高い評価を得ています。

ただ、評価総数が250程度と上述したアプリに比べると少ないため、まだまだ認知度は低いアプリです。

iOS端末で使用可能なHTMLビューア


続いてiOS端末で使用可能なHTMLビューアをご紹介していきたいと思います。

HTML Viewer Q

HTML Viewer Q(AppStore)

軽量のHTMLビューアでファイル管理ツールとしての役割も果たします。

iTuensでファイルを共有することが可能で、表示はもちろん編集も可能です。

AppStoreで評価「4.6」を記録しており、総評価数も1,200件以上と実績も十分のアプリです。

html+css+js-web designer,html5

html+css+js-web designer,html5(AppStore)

html, css, Javascriptの閲覧・編集が可能なHTMLビューアです。

各言語の基礎を学習可能なコンテンツが提供されている点も特徴の1つです。

編集したコードをTwitterやFacebookにシェアする機能も提供されてます。

AppStoreでの評価は「4.3」となっていますが、評価数が少ないのが懸念点です。

HTML & HTML5 Editor

HTML & HTML5 Editor(AppStore)

シンプルに設計されたHTMLの閲覧・編集が行えるHTMLビューアです。

無駄な機能は提供されておらず、HTMLコードの編集に必要な最低限の機能が提供されているアプリです。

AppStoreでの評価は「4.0」で、余計な機能は使わないからシンプルにHTMLの閲覧・編集だけを行いたい方に利用してもらいたいアプリとなっています。

さいごに:HTMLビューアはパソコンだけでなくスマートフォンでも利用可能なソフトウェア


本記事では、HTMLの基本的な概要とパソコン・スマートフォンで利用可能なHMLTビューアをご紹介してきました。

プログラミングはパソコンで行うのが一般的ではありますが、簡単なHTMLファイルの閲覧・編集程度であれば、スマートフォンでも実施出来るようになっています。

ちょっとしたスキマ時間でもプログラミングコードの確認に利用出来ますので、ぜひ一度スマートフォンでもHTMLビューアをお試しください。

エンジニアになりたい人に選ばれるプログラミングスクール「ポテパンキャンプ 」

ポテパンキャンプは卒業生の多くがWebエンジニアとして活躍している実践型プログラミングスクールです。 1000名以上が受講しており、その多くが上場企業、ベンチャー企業のWebエンジニアとして活躍しています。

基礎的な学習だけで満足せず、実際にプログラミングを覚えて実践で使えるレベルまで学習したいという方に人気です。 プログラミングを学習し実践で使うには様々な要素が必要です。

それがマルっと詰まっているポテパンキャンプでプログラミングを学習してみませんか?

卒業生の多くがWebエンジニアとして活躍

卒業生の多くがWeb企業で活躍しております。
実践的なカリキュラムをこなしているからこそ現場でも戦力となっております。
活躍する卒業生のインタビューもございますので是非御覧ください。

経験豊富なエンジニア陣が直接指導

実践的なカリキュラムと経験豊富なエンジニアが直接指導にあたります。
有名企業のエンジニアも多数在籍し品質高いWebアプリケーションを作れるようサポートします。

満足度高くコスパの高いプログラミングスクール「ポテパンキャンプ」

運営する株式会社ポテパンは10,000人以上のエンジニアのキャリアサポートを行ってきております。
そのノウハウを活かして実践的なカリキュラムを随時アップデートしております。

代表の宮崎もプログラミングを覚えサイトを作りポテパンを創業しました。
本気でプログラミングを身につけたいという方にコスパ良く受講していただきたいと思っておりますので、気になる方はぜひスクール詳細をのぞいてくださいませ。