絶対差が出る!独自レイアウトのススメ

独自レイアウトの導入で出来ること

弊社ではテンプレートを使わず「独自レイアウト」でのサイト制作を得意としており、またオススメしております。

管理画面での操作性は通常と変わりませんので、サイトの更新はご自分で行うことが出来ます。

 

テンプレートと独自レイアウトの違い

テンプレートを選ぶ画面
テンプレートを選ぶ画面
独自レイアウトの編集画面
独自レイアウトの編集画面

Jimdoには沢山のテンプレートがあり、スタイル機能で色などを変更出来ます。ただ、やはり「テンプレートはテンプレート」。簡単にホームページが作れる便利さの反面、コンテンツの位置関係や幅、高さなどの細かい調整をはじめ、出来ないことが多々あります。

そこで独自レイアウトの登場です!独自レイアウトを使えばテンプレートでは出来ない機能が使えるようになったり、オリジナリティーのあるホームページを作ることが出来ます。

独自レイアウトのデメリット

独自レイアウトのメリットは数えきれないほどありますが、あえてデメリットの話もしておきます。

独自レイアウトというものは、例えば「ここの線はこの太さで…」というような、全ての項目を0から指定する―つまりHTMLやCSSなどの専門用語を使いプログラミングをする必要があり、当然その知識がないと難しい作業です。

さらにこの独自レイアウトはJimdoのサポート対象外のためにマニュアルもなく、Jimdo独自の複雑なプログラムと向き合わなければいけません。これはホームページ制作業者でさえ一筋縄ではいかない難しさがあります。さらに最大の問題はアナウンス無しで突然仕様変更が行われること…その変更に対応できるだけのスキルも要求されてきます。


独自レイアウトで出来ること

全体の構造について

よくある基本構造
よくある基本構造
  • コンテンツ全体の幅
  • メインコンテンツとサイドバーの幅や位置

【こんな応用方法も!】

  • トップページはサイドバーを隠してワンカラム・それ以外のページはサイドバーを表示して2カラムにする。
  • 特定のページのみナビゲーションメニューとサイドバーなどを隠してLPページ風にする
  • 例えばワードプレスのようなデザインや表示方法にすることも可能です。

このようなコーディングをJimdo研究所は得意としています。

表示方法であきらめていたデザインもご相談いただければ対応させていただきます。

※特殊なコーディングをすると、Jimdoの操作性が損なわれる場合には、コーディングをお断りすることもございます。


ヘッダーエリア

ヘッダーエリアを自由にカスタマイズすることができ、主に以下のようなものを挿入することが出来ます。

  • ロゴ
  • お問い合わせ電話番号
  • メールお問い合わせボタン
  • オリジナルメニューやテキスト
  • その他(サイト内検索バーやGoogle言語選択プルダウンなど)

※オススメポイント!※

お問合せ電話番号部分は、スマートフォンからならワンタップでそのまま電話がかけられます!

(よくあるヘッダー例)

例)ロゴとお問い合わせ電話番号のみ
例)ロゴとお問い合わせ電話番号のみ
例)ロゴ・電話番号・メール問合せへのボタン
例)ロゴ・電話番号・メール問合せへのボタン
例)ロゴ・電話番号・メール・テキストリンク
例)ロゴ・電話番号・メール・テキストリンク

ナビゲーション

グローバルナビゲーションの配置や色大きななどが自由にデザイン出来るようになります。背景のグラデーション化や、マウスオーバーのアニメーション表示、下層ページのプルダウン表示も可能です。スマホ用のハンバーガーメニューをクリックした時の挙動も自由に設定が可能です。

※もちろん縦に並んだグローバルナビゲーションも可能です

(よくあるナビゲーションデザイン例)

オンマウスでの色変化や下階層はプルダウン表示
オンマウスでの色変化や下階層はプルダウン表示
背景をグラデーションにすることも
背景をグラデーションにすることも
下線とオンマウスで色変化やドロップシャドウ
下線とオンマウスで色変化やドロップシャドウ

レスポンシブWEB対応

レスポンシブWEBデザインとは、異なる画面サイズ(パソコン・タブレット端末・スマートフォン端末など)で閲覧時に、幅や高さなどを見やすいように自動調整する機能です。

Jimdoテンプレートも今ではレスポンシブ対応になっていますが、既存テンプレートと独自テンプレートでは表示が大きく違います。既存のテンプレートではできないスマホ表示の表示方法も実現します。

ちなみに、弊社トップページのヘッダ画像はPC表示とスマホ表示では異なった画像を表示させています。


電話番号を大きく表示したい場合などに
電話番号を大きく表示したい場合などに
メニューが画面上部から伸びてくるなど
メニューが画面上部から伸びてくるなど
近年よく見る電話・メール・メニューを並べた形
近年よく見る電話・メール・メニューを並べた形

▲よく見られるスマートフォンでの表示レイアウトパターン。

「何を見せたいか」によってそのレイアウトは変化します。これ以外にも、サイト内検索バーを見せたい場合、Goolgeの言語選択プルダウンを表示したい場合も対応可能です。

様々なコンテンツへの自由度

  • パンくずリストをつける
  • 見出しやボタンのデザイン
  • ブログ表示のカスタマイズ
  • 読みやすい文字設定

…など、様々な要素のデザインが自由になります。

※オススメポイント!※

今流行りのデザイン…例えば、ワードプレスのようなデザインにコーディングすることも可能です!


Jimdo研究所のこだわりポイント:文字設定

標準のフォントなど、テンプレートでもずいぶん読みやすくなりましたが、独自レイアウトでは、文字の大きななどに合わせて、間隔や行間を読みやすく調整してご提供いたしますので、管理者様が入力するときには、普通に入力するだけで読みやすい文章を入力することが出来るようになっています。さりげないことですが、画面上の文字を読み進めたくなるかどうかの一つに、文字設定はかなり重要な要素の一つなのです。

【Jimdoの初期設定】

吾輩は猫である。名前はまだ無い。どこで生れたか頓(とん)と見當がつかぬ。何でも薄暗いじめじめした所でニヤーニヤー泣いて居た事丈は記憶して居る。吾輩はこゝで始めて人間といふものを見た。然(しか)もあとで聞くとそれは書生といふ人間中で一番獰悪(だうあく)な種族であつたさうだ。此書生といふのは時々我々を捕(つかま)へて煮て食ふといふ話である。然し其當時は何といふ考(かんがへ)もなかつたから別段恐しいとも思はなかつた。但(たゞ)彼の掌(てのひら)に載せられてスーと持ち上げられた時何だかフハフハした感じが有つた許(ばか)りである。掌の上で少し落ち付いて書生の顔を見たのが所謂(いはゆる)人間といふものゝ見始(みはじめ)であらう。此時妙なものだと思つた感じが今でも殘つて居る。

【Jimdo研究所が手を入れると…】

吾輩は猫である。名前はまだ無い。どこで生れたか頓(とん)と見當がつかぬ。何でも薄暗いじめじめした所でニヤーニヤー泣いて居た事丈は記憶して居る。吾輩はこゝで始めて人間といふものを見た。然(しか)もあとで聞くとそれは書生といふ人間中で一番獰悪(だうあく)な種族であつたさうだ。此書生といふのは時々我々を捕(つかま)へて煮て食ふといふ話である。然し其當時は何といふ考(かんがへ)もなかつたから別段恐しいとも思はなかつた。但(たゞ)彼の掌(てのひら)に載せられてスーと持ち上げられた時何だかフハフハした感じが有つた許(ばか)りである。掌の上で少し落ち付いて書生の顔を見たのが所謂(いはゆる)人間といふものゝ見始(みはじめ)であらう。此時妙なものだと思つた感じが今でも殘つて居る。

お気軽にご相談ください

■ 現在、既存のJimdoテンプレートを使っているが、独自レイアウトでオリジナルサイトを作りたい!

■ 現在、他サーバーなどでサイトを運営しているが、更新を簡単に自分で出来るようになりたいからJimdoに移したい!

■ これからJimdoで新しくWEBサイトの制作を考えていたが、テンプレートでは物足りないと思っていた!

こんなこと、出来ますか?というご相談も、お気軽にお問合せください。

株式会社 PIK

〒108-0075 港区港南3-4-12

TEL.03-6433-0422