7月 « 2009 « 高品質HTMLテンプレート&Wordpressテーマ

ホームページデザイン(mono-A-4)

Filed under: デザインmono-Aタイプ,ブルー系デザイン — タグ: , , , , , , — @ 2009年7月31日2:37 PM

ホームページデザイン(mono-A-4)青を基調としたシンプルなデザインのホームページテンプレート&Wordpressテーマです。堅実でまじめな雰囲気のこのデザインは様々な企業サイトやニュースサイトなど幅広いジャンルで活用できます。

誠実、真面目、安全という印象を与えるこのテーマは、建築、設計、製造、流通業などの企業のホームページにぴったりです。その他、学校や塾、クリニックなどのサイトにマッチします。

デモサイト

HTMLテンプレート・Wordpressテーマの特徴

アクセスアップ・売り上げアップにつながるテンプレート&テーマ
HTMLテンプレート・WordpressテーマともにW3C勧告に準拠した設計です。適切で正しいHTMLであることはウェブサイト構築には不可欠の要素です。アクセシビリティの向上、サーチエンジン対策、サイトのメンテナンス性の向上等、サイトのアクセスアップ、顧客獲得が期待できます。
SEOの効果のある適切なHTML記述
hタグをはじめとするHTMLの効果的な記述によりSEOに効果を期待できます。ホームページ運営の成功の秘訣はなんといっても検索エンジン上位表示です。そしてその基本は適切なHTMLの記述にあるといえます。
フルCSSデザインのシンプルなHTML
デザインはすべてスタイルシートに記述しました。これによりHTMLはとてもシンプルでホームページ作成初心者でも取り組めるテンプレートです。また、スタイルシートを書き換えることでサイト全体のデザインをカスタマイズでき、メンテナンス性が大幅に向上しました。
サイト規模数ページから100ページ程度のサイト向け
ほとんどの中小企業や個人事業主の方のホームページの規模にぴったりです。2階層までのリンク構造を考慮していますので中小規模ショッピングサイトにも使えるテンプレートです。
WordPressならブラウザ上で簡単更新
WordPressは無料で使うことの出来るCMS(コンテンツマネジメントシステム)のひとつです。レンタルサーバーなどにインストールして、ホームページの更新やコンテンツの追加を、インターネットエクスプローラーなどのブラウザ上で行なうことができます。Wordpressについては「WordPressでホームページ運営」をごらんください。
WordPressを活用すればブログも同じデザインで
ホームページで社長のブログや店長のブログを活用している方もいるでしょう。でもブログサービスを使うとデザインやレイアウトがホームページとは違ってしまいます。Wordpressを使えばブログも同じデザインで運用できます。
マウスオーバーでボタンの色が変わる

HTMLテンプレートのスクリーンショット
&Wordpressテーマ適用デモサイト

HTMLテンプレートmono-a-4-2 HTMLテンプレートmono-a-4-3 HTMLテンプレートmono-a-4-4 HTMLテンプレートmono-a-4-5 HTMLテンプレートmono-a-4-6

WordPressテーマ適用デモサイト(デザインはHTMLテンプレートも同じです。)

HTMLテンプレートセットには以下のものが含まれています。

ホームページ制作マニュアル
こちらのテンプレートを利用してホームページを作成する場合の作業の流れと注意点などをまとめました。はじめにこちらをお読みください。
HTML記述マニュアル
上のスクリーンショットのようなページでHTMLの記述方法を解説しています。実際のテンプレートを利用してマニュアルページを作成していますのでホームページ作成の参考になるでしょう。
基本テンプレート
基本構造のみのテンプレートです。ここから作業を始めるとよいでしょう。
サンプルサイト
何ページかページをリンクで結んだサンプルサイトです。ホームページ作成の参考に。

WordPressdテーマセットには以下のものが含まれています。

WordPressマニュアル
WordPressテーマの使い方、テンプレートファイルの編集方法などを解説しています。Wordpressのインストール、記事の投稿方法については「WordPressでホームページ運営」をごらんください。
テーマフォルダ
WordPressテーマの本体です。このフォルダをWordpressをインストールしたサーバーにアップロードします。
サンプル用Wordpressインポートファイル
まだ記事を何も投稿していないWordpressでの表示を確認するためのWordpressインポートファイルです。ページや投稿の内容がWordPressテーマ適用デモサイトと同じものになります。

ホームページ作成に不安のある方は

ホームページを自分で作成することに不安のある方は1ヶ月のメールサポートつきパックをお申し込みください。ホームページを作成する上での疑問質問にメールでお答えいたします。メールでのご質問には土、日、祝日を除き概ね24時間以内に回答いたしております。1ヵ月間ご質問の回数に制限はありませんが、制作途中のページをサーバーに仮アップするなどしてこちらにうまくいかない点が明確になるようお願いいたします。

高品質HTMLテンプレート&Wordpressテーマがお求め安い価格

HTMLテンプレート
ホームページ制作マニュアル(PDF14ページ)/HTML記述マニュアル(HTML31ページ)/基本テンプレート/サンプルサイト 9,800円 購入する
HTMLテンプレート+1ヵ月メールサポート付
ホームページ制作マニュアル(PDF14ページ)/HTML記述マニュアル(HTML31ページ)/基本テンプレート/サンプルサイト/1ヵ月間のメールサポートが付きます 22,600円 購入する
WordPressテーマ
WordPressテーマ適用マニュアル(PDF13ページ)/Wordpressテーマセット/サンプル用Wordpressインポートファイル 9,800円 購入する
WordPressテーマ+1ヵ月メールサポート付
WordPressテーマ適用マニュアル(PDF13ページ)/Wordpressテーマセット/サンプル用Wordpressインポートファイル/1ヵ月間のメールサポートが付きます 22,600円 購入する
HTMLテンプレート&Wordpressテーマ
ホームページ制作マニュアル(PDF14ページ)/HTML記述マニュアル(HTML31ページ)/基本テンプレート/サンプルサイト/Wordpressテーマ適用マニュアル(PDF13ページ)/Wordpressテーマセット/サンプル用Wordpressインポートファイル 14,800円 購入する
HTMLテンプレート&Wordpressテーマ+1ヵ月メールサポート付
ホームページ制作マニュアル(PDF14ページ)/HTML記述マニュアル(HTML31ページ)/基本テンプレート/サンプルサイト/Wordpressテーマ適用マニュアル(PDF13ページ)/Wordpressテーマセット/サンプル用Wordpressインポートファイル/1ヵ月間のメールサポートが付きます 27,600円 購入する

※HTMLテンプレートにはフォームなどのCGI等は含まれておりません。
この商品はダウンロード版です。商品の「購入する」をクリックするとインフォトップの決済画面にジャンプします。決済完了後に商品をダウンロードできるようになります。

お支払い方法

ブログで作るホームページ

Filed under: ホームページ制作のヒント — @ 2009年7月30日1:48 PM

ホームページは自分で作成するにしろ、制作業者に依頼するにしろ、公開後の運営が大変です。会社案内程度のホームページでいいというのであれば別ですが、ある程度のアクセスを望んだり、問い合わせを期待したりするのであれば常に新しい情報を掲載していく必要があります。

自分でホームページの更新をしようとすれば作成ソフトを起動して、ページを作成したり編集したりして、リンクを作って、リンク切れなどがないかチェックして、アップロードして…

と、結構面倒なわけです。

頻繁に更新しないのであればあるほどどんどん面倒になっていき、ついにはほったらかしということになります。

制作会社に依頼すれば、当然費用が発生します。「この程度なら別に更新しなくてもいいや」、「今度まとめて更新してもらおう」なんて思っている内にやはりほったらかしになってしまいます。

ブログでホームページを作るという選択

そこで便利なのがいわゆるブログというものです。インターネットエクスプローラーなどのブラウザ上で書きたいことを書き、編集していくだけで面倒なリンク設定やアップロードをしなくて済みます。

でも通常のブログサービスではやはり日記のようです。デザインも個人の趣味のページっぽくなってしまいます。とても会社のホームページには使えません。

そこで考えられるのがサーバーを借りてブログをインストールし、デザイン等自分の好きなようにしてしまうということです。もちろんそれをするには、ただホームページを作るだけよりもはるかに多くの知識を必要とします。特にレイアウトにこだわるのであればCSS(スタイルシート)の知識は必須です。

ただ、一度インストールして設定してしまえば、後の更新作業はとてもラクになります。ちなみにこのサイトは「Wordpress」というブログのプログラムを使って作成しています。

販売するテンプレートを制作したり、テンプレートのスクリーンショットを作成したりすることはブログ上ではどうあがいても不可能ですが、今あなたが読んでいるこの文章もそのほかのページの文章もすべてブラウザ上で書いています。

これはとても便利なことです。パソコンとインターネットにつながる環境さえあればどこにいてもホームページの更新作業が可能なのです。

ブログでホームページを作る

ということも考えてみてはいかがでしょうか?

ホームページ制作会社選びのコツ

Filed under: ホームページ制作のヒント — @ 1:46 PM

このサイトを訪れている人は何とか自分でホームページを作ってやろうと考えているでしょうからあまり興味のないことかもしれません。でも、もしかすると「めんどくさいからやっぱり誰かに作ってもらおうか…」と考えている方もいるかもしれません。

私自身もホームページ制作に携わる人間ですので参考までに。

セールスマンがやってくる

私の知人の店や会社にもセールスマンがやってきたり、セールスの電話がかかってきたりするようです。一概に言えませんがホームページ制作会社ならホームページで堂々と売り込むべきだと私は考えます。電話で勧誘しなければクライアントを見つけられないホームページ制作会社は私だったらご遠慮します。

すごく高い

私も不思議でたまりませんが、ものすごい高額な見積もりを出してくる制作会社があります。私の出した金額の3倍4倍は当たり前に出してきます。何をしてくれるのか不思議で仕方ありません。高いからよいものを作ってくれるのかもしれませんし、そうでないかもしれません。

すごく安い

あまり安いとちょっと不安になってしまいます。でももしかすると意外とよいものを作ってくれるかもしれません。

ホームページ制作費無料

制作費が無料という会社は結構あります。しかしながらたいてい月々の費用が2万円とか。1年で24万円になってしまいます。ホームページはいったん公開すればその制作会社とは長いお付き合いになります。2年、3年となると結構な金額になってしまいます。将来自分で更新するようになったり、自分で安いレンタルサーバーで運営したくなったときにスムーズに移行できるか疑問があります。

長い目で見て考えましょう

ホームページは公開して終わりではありません。更新のコストも考えなくてはなりません。たとえば、もしあなたに50万円の予算があったとしたらそれをすべて制作につぎ込むべきではありません。半分は制作費、半分は1年間の運営費というように考えましょう。

そのあたりをきちんとしてくれる制作会社を選びましょう。そしてその制作会社とはある程度の長いお付き合いになるはずです。あなたのホームページを担当する人の人柄も大切な要素です。そりの合わない人といい関係が築けるはずがありません。

また、あなた自身も制作会社に丸投げの姿勢はよくありません。あなたのホームページはあなたのものです。しっかりと運営していくという姿勢が大切です。

ページのタイトルの重要性

Filed under: ホームページ制作のヒント — @ 1:43 PM

ホームページを制作するときにおいてページのタイトルはとても重要です。HTMLでいえば、

<title>ここにタイトル</title>

この部分です。「ここにタイトル」の部分にそのページのタイトルを的確につけることはSEOにとってもホームページを訪れてくれる人にとっても重要なことです。

たいていの検索エンジンは検索結果の見出しとしてこの「タイトル」を表示します。当然そこに含まれる言葉はそのページに書かれている内容の重要なキーワードであると検索エンジンは判断します。

無題ドキュメント

ホームページ制作ソフトで見える部分だけ一生懸命制作しているとこの「タイトル」部分を見落としてしまいがちです。デフォルトでつけられてしまう「タイトル」は「無題ドキュメント」であったりします。

検索エンジンで「無題ドキュメント」を検索すると実に100万件以上のページがヒットします。それぞれのページは、趣味のサイトだったり企業サイトだったり様々ですが「無題ドキュメント」ではなかなかクリックしてみようという気にはなることが出来ません。

サイト内のタイトルがすべて同じ

「無題ドキュメント」ページ以上に多いのがサイト内のページのタイトルがすべて同じというサイトです。「無題ドキュメント」よりははるかに良いですが仮にそのサイト内のページが100ページにわたる内容であればそれぞれのページに書かれている内容を的確に表すタイトルをつけることが望ましいでしょう。例えば「株式会社やまだ」の「求人情報」のページであれば

<title>株式会社やまだ</title>

ではなく

<title>求人情報 << 株式会社やまだ</title>

等とすることが望ましいです。

「そんなの知ってるよ」という方がほとんどかもしれませんが、残念ながらせっかくテンプレートをご利用いただいているのにタイトル部分の修正を忘れているばっかりに効果を半減させてしまっているサイトが結構あります。

今一度、適切なタイトルがつけられているか確認しましょう。

ホームページのメニューの位置

Filed under: ホームページ制作のヒント — @ 1:42 PM

ホームページのレイアウトをするときたいていの場合パターンは決まっています。ホームページはタイトルなどのヘッダー部分、メニュー部分、内容を書くコンテンツ部分、そしてcopyright等を書くフッター部分で構成されます。たいていは以下のようなパターンでしょう。

ホームページのレイアウト例

上の図の水色の部分がメニュー、ピンク色の部分がコンテンツ(内容)部分です。もちろんもっと様々なパターンはありますが大まかに分けるとほとんどのホームページが上のいずれかのパターンでしょう。

その中でも多いのが2カラムのレイアウトです。このサイトのテンプレートもそうですね。そこで気になるのがメニューの位置。メニューは右がいいのか左はいいのか…

一昔前まではメニューは左というのが常識でした。人の視線はたいてい上から下、左から右に流れるためということからのようです。Windowsのショートカットアイコンも左側が標準です。

しかしどちらかというと「みんな左にメニューがあるから…」というなんとなくという理由が大多数であった気もします。

最近はまだ左メニューの方が多数派のようですが右側にメニューを配置するサイトも数多く見られるようになってきました。その理由は「右利きの人が多い」ということからです。

たいていの場合マウスに手を添えてボーっとしているとマウスカーソルは画面の右下の方にやってきます。ですから右側にメニューがあったほうが近いということです。またスクロールバーは右側にあるため縦長のページのときは「スクロール、クリック」という動作をし易いということもあります。

「ホームページのメニューの位置」についてはそのときの流行もありますから一概にこちらが優れているというものではありませんが、HTMLにおいては常にヘッダー→コンテンツ→メニュー→フッターという書き順にしておく必要があります。

これはSEOの観点からも最も重要なことです。もちろんこのサイトで扱うHTMLテンプレートの書き順はヘッダー→コンテンツ→メニュー→フッターとなっています。

SEOって何?

Filed under: ホームページ制作のヒント — @ 1:39 PM

SEOとは「Search Engine Optimization」の頭文字をとったもので、日本語で言うと「検索エンジン最適化」となります。

企業などにとっては検索エンジンにおいて自社に関連するキーワードで検索したときに検索エンジンでどの位置に表示されるかというのはとても重要な問題です。このため検索エンジンにおいて上位に表示されるようにさまざまな対策を施しています。

SEOの基本は適切なキーワードとそれに基づいた最適なHTMLによるページの作成です。不適切なキーワードによるページの作成や好ましくないHTMLの記述はSEOスパムと判断されることもあるため注意が必要です。

また、SEO業者なる企業も数多く存在します。中には悪徳業者とも言える企業もあります。多くの場合、そのSEO業者がどのような対策を施すのかは明らかにしていません。

一時的上位に表示されることはあっても中長期的にはメリットはないということもあります。SEO業者に依頼する場合は、何をするのかということを明確にしておく必要があるでしょう。

SEOの基本、それは適切なキーワードと最適なHTMLです。そして充実したコンテンツです。仮に検索エンジンで上位に出たとしても恥ずかしくないサイトを作りましょう。

WordPressで構築したサイト

Filed under: ホームページ制作のヒント — @ 1:36 PM

さて、このサイトは何で作ったかといいますと…

ソフトウェアは使っていません。WordpressというCMSを使って構築しています。これからはじめてホームページを作ろうという方には何のことかわからないでしょうけど…

いわゆる「ブログ」と呼ばれるもののひとつです。

「ブログ」と言うとたいていの場合インターネット上の無料または有料のブログのサービスを利用するものと思われているようです。しかし、ちょっとホームページの運営を自分でレンタルサーバーを借りて自分で運営したことのある方ならそうは思いません。

「ブログ」を自分の借りているサーバーにインストールして運営すると考えるでしょう。そのような「ブログ」のプログラムは数多くあり、有名なところとしては「MovableType」があります。そして「Wordpress」もそのような「ブログ」のひとつなのです。

この「ブログ」を利用して制作するホームページは何よりも更新作業がラクという点で大きなメリットがあります。更新作業がラクということは、気軽に更新する気になるということです。前回の更新がもう1年以上前なんていうサイトにならない様にするためには「ブログ」の活用は検討するべきでしょう。

「ブログ」というと「日記」のイメージが強いのですが、決してそうではありません。現在多くのサイトが「ブログ」を使って運営されれるようになってきていますし、とても「日記」のようには見えないサイトばかりです。

このサイトも日記には見えないでしょう。

現在はHTMLテンプレートのみですが、ゆくゆくは「Wordpress」用のテンプレートも考えていきます。

ホームページ制作ソフト

Filed under: ホームページ制作のヒント — @ 1:34 PM

ホームページを制作しようとする多くの人は「ホームページ制作ソフト」を使うことと思います。ホームページを作ったことのない人であればそう思うのは仕方のないことでしょう。

でも実際は、別にソフトウェアはなくとも普通にテキストを書けるソフトがあれば(Windowsであればメモ帳)ホームページを制作することは可能です。

その代わり面倒です。いや、面倒と感じるでしょう。

私がはじめてホームページを作ったのはもう10年以上も前のことですが…とても田舎でしたのでホームページ制作ソフトなんて売っていませんでした。唯一合ったのが本屋さんで見つけたホームページ制作のためのHTML事典のようなもの。

パソコン初心者の私はひたすら試行錯誤しながらメモ帳でホームページを作ったのでした。その何年か後、はじめてホームページ制作ソフトを購入しました。バージョンはちがっても今も使っている「Dreamweaver」。定番ですね。

「ホームページビルダー」も購入したことがあります。しかし、HTMLを書くことを覚えていた私にはとても使いづらいソフトでした。個人やサークル のホームページをちょいちょいと作るには安いしちょうどいいソフトなのかもしれませんが…このソフトの書き出すHTMLは正直びっくりしました。

だからといって「Dreamweaver」は初心者には難しいソフトです。高いですしね。となるとそんなホームページ制作ソフトがよいのか?意外とフリーのソフトの方が使いやすいものがあったりします。

もちろんHTMLの基礎知識は必要です。皆さんこういうと構えてしまうかもしれませんがそれほど難しいものではありません。特に簡潔なHTMLのテンプレートがあれば…

ホームページを制作するには簡潔なHTMLで設計されたテンプレートとフリーのホームページ制作ソフト(HTMLエディタ)で十分のような気がします。

HTML文法

Filed under: ホームページ制作のヒント — @ 1:32 PM

ホームページはHTMLで書かれています。HTMLにはきちんと文法があります。文法に沿ってHTMLを書いていくことはホームページを制作する上で、とても重要なことの1つです。

インターネット上にはHTMLの文法をチェックしてくれるサイトがいくつかあります。代表的なものに

があります。

このサイトで配布するテンプレートもこのサイト自体もまぁまぁ合格点であるでしょう。テンプレートのマニュアルに沿って作成することで適切なHTMLのサイトを作成することが可能です。

HTML文法のみにとらわれてはいけない

HTMLの文法はそれはもちろん大切なことですし、SEO上も効果的であることはいうまでもありません。しかしながらそのこととホームページ自体が効果のあるものになるかどうかは別物です。

それは正しい日本語文法で書かれているがあまり魅力的ではない文章と、文法はでたらめだが何だかとても魅力的な文章があるのと同じことです。

HTMLの文法はブラウザに正確に情報を伝えるためのものであって、ホームページの内容を魅力的に伝えるものではないのです。

結局はコンテンツが大事!!

ホームページの人気を上げようとしたり、売り上げを上げようとしたいのであればやはりホームページの内容が魅力的でなくてはなりません。

HTML文法が正しいことは最低限必要なことであるだけです。

もし、とても魅力的なコンテンツを発信できるものがあったとして、多くの人たちがそのホームページを見ようとしたときにはHTML文法はまったくと言っていいほど関係ありません。

芸能人や有名人のブログは文法上の間違いはたくさんあったりしますがアクセスはたくさんあります。

だからと言ってHTML文法を無視して良いわけではありません。文法は文法ですから…ただそればかりに目が言ってしまうと肝心のコンテンツを充実させることがおろそかになったりします。

スタイルシートでレイアウトする

Filed under: ホームページ制作のヒント — @ 1:29 PM

これまでホームページを作成したことのある方のほとんどがページのレイアウトにはテーブルを使っていることと思います。多くの制作ソフトのテンプレートがテーブルレイアウトと言うこともありますし、なんと言っても視覚的にレイアウトがしやすいのがメリットかもしれません。

しかしながらテーブルはあくまでもテーブル(表)であるため、決して望ましいサイト作りとはいえません。HTMLは複雑になりすぎサイトの管理、運営も面倒になりがちです。

決して全てのテーブルレイアウトを否定しているわけではありませんが、多くのホームページはテーブルでレイアウトするよりもスタイルシートの方がすっきりするなぁと感じます。

またHTMLだけでは実現できないデザインもスタイルシートにより可能となり、ホームページの表現の幅が格段に広がります。そして何といっても適切なHTMLを記述することによりSEOに効果があり、サイトのメンテナンス性も上がるメリットがあります。

ただ、スタイルシートを書いたことのない人にとってはその記述内容はHTML以上に謎であるでしょう。そこでスタイルシートデザインテンプレートが活躍するわけです。

テンプレートを使えばあなたはスタイルシートのファイルを編集することなくシンプルなHTMLをマニュアルどおりに記述していくだけでスタイルシートデザインのホームページを作成することが出来ます。

そして少し慣れてきたらスタイルシートのファイルを開いてみて、文字の色などをあなたの好みに変えていくのもよいでしょう。

1 / 3123