Web制作見本|もとのページの内容をもとに、文章を整えています← 見本ギャラリーへ戻る

水星とは?

Mercury(マーキュリー)は惑星の名前であり、1ページで完結するWebサイトのためのテンプレートの名前でもあります。

What?1ページで、すべてを伝える

Mercuryは、1枚のページの中にすべての内容を収めるWebサイトです。この形は、3〜6ページほどの、互いに関わりの深い内容で成り立つサイトに向いています。たとえば、作家や演奏家の紹介、映画の案内、レストランのご案内。期間を区切ったキャンペーンや催しの告知にも適しています。

くすんだ赤の地に、黒い線が自由に走る抽象画
画像や短い文章を、このような囲み枠で引き立てるための指定が、あらかじめ用意されています。

Build Pages InstantlyDreamweaverの中で、すぐに組み上がる

Mercuryは、パソコンでもスマートフォンでも表示できます。見た目の美しさにも気を配りました。Dreamweaverの中から専用の画面を開くだけで、Mercuryのページが自動で組み上がります。

いつでも、思いどおりに直せる

作ったあとも、専用の修正画面から、区切り(ページパネル)の追加・削除・並べ替えができます。切り替わりの速さや、前後の矢印を最後で止めるか、最初に戻すかも選べます。

Mercuryのページ作成画面
ページ作成の画面
Mercuryの修正画面
修正(モディファイ)の画面

Main Features美しく、使いやすく、誰にでも届く

角丸、影、グラデーションといった効果を、画像を使わずCSSだけで表現しています。見出しやメニューには、埋め込んだ書体も使えます。ロゴも文字でできているため、Dreamweaverの中で文字を差し替えるだけで、ご自身のものに整えられます。

細部まで、行き届いた作り

  • 幅を固定したレイアウトと、画面の大きさに合わせて伸び縮みするレイアウトを選べます。
  • マウス、キーボード、タッチ操作、スクリーンリーダー。どの方法でも、すべての内容にたどり着けます。
  • 次の区切りへ移ると、画面がなめらかに先頭へ戻ります。読み飛ばしが起きません。
  • スマートフォンなどの端末を自動で見分け、それぞれに合った表示に切り替えます。

CSS 3 Effectsまず届け、それから飾る

Mercuryは「プログレッシブ・エンハンスメント」という考え方で作られています。まず、どの端末でもすべての内容が読める、整った骨組みを用意する。そのうえで、新しいブラウザが持つ表現力を使って、見た目を豊かにしていきます。

  • 角丸
  • 埋め込みフォント
  • グラデーション
  • シャドウ
  • カラム表示
  • RGBAカラー