WELCOME

やさしいカメラ知識・女性向け画像加工レッスン。
おしゃれな作品作りを楽しむパソコン&デジカメ教室パソカフェのブログ。

おすすめ記事は以下カテゴリーからどうぞ。。

デジカメレッスン
単発1dayデジカメ講座
雑貨撮影レッスン
スマホで可愛い写真
デジカメ年賀状

パソコンレッスン
フォトスケープの使い方
ホームページ作成講座
アメブロカスタマイズ
フォトショップ講座

デジカメのコツ
花・雑貨を撮るコツ
簡単デジカメの設定
楽々デジカメのコツ
写真の構図・基本

 

INFORMATION

受講生を募集いたします

   


単発1dayデジカメ講座

1回3時間8000円
キレイな雑貨フォトが
撮れるようになります

 
 


ホームページ作成

1回2時間6000円
ホームページの更新が
自分でできるように

 


パソコン個人レッスン

1回2時間6000円
貴女のやりたいこと何でも
リクエストしてください

 
所在地
兵庫県川西市湯山台
梅田より60分
宝塚より40分
ご予約・お問い合わせ
レッスン予約カレンダーはこちらから。
お申込み・お問合せはこちらから。
すべてマンツーマンの個人レッスンです。

 

スマホ対応ホームページ作成:紅茶と宝塚歌劇が楽しめるサロンカフェ ヴェルサイユ紅茶店さま 事例紹介その1

こんにちは。
パソコン&デジカメ教室「パソカフェ」主宰、花のポストカードやさんこと渡邊優子です。

パソカフェの個人レッスンでは、やりたいことをなんでもリクエストしていただけます。
今回は「レスポンシブWEBデザインのホームページ」を作成する方法について書きたいと思います。

飾り罫線

PC(パソコン)でみた場合

レスポンシブホームページ 「ヴェルサイユ」/Versailles 紅茶店


スマホ(スマートフォン)でみた場合

レスポンシブホームページ 「ヴェルサイユ」/Versailles 紅茶店

飾り罫線

今回ご紹介するのは
大阪|紅茶と 宝塚歌劇が楽しめるサロンカフェ
「ヴェルサイユ」/Versailles 紅茶店
のホームページ。

オーナのYさまが、何回かにわけてレッスンを受講しににきてくださいました。

テンプレートからお好きなデザインを選び、各ページのレイアウトを考える。
フードやドリンク類をおいしそうに撮影する方法を学ぶ。
iPhoneアプリでおいしそうに加工する方法を学ぶ。

ホームページに掲載する文章を考える。
メニュー一覧を整理し書き出す。

「紅茶と宝塚歌劇が楽しめるサロンカフェ」
という特徴を活かしたページ作りをご一緒に考えました。

ホームページを作るのは、1冊の本を作るのに似ています。
たいへんな作業、おつかれさまでした。
素晴らしいページが完成しましたね。

飾り罫線

このホームページを作るのに、特別なソフトは何も使っていません。
使ったのは、無料でダウンロードできるテンプレートとフリーソフトだけ。
YさまのパソコンはMacだったので、Windows定番のフリーソフトが使えなくてちょっと焦りましたが…。

レッスン内容のご紹介もかねて、
ページの構成やPCビュー&スマホビューをお見せいたします。
レスポンシブWEBデザインのホームページってどんな感じなの?
と興味をお持ちのみなさま、ぜひご参考に。

飾り罫線

では、できあがったホームページが実際どのように表示されるのか。
PCとスマートフォンでそれぞれスクリーンショットをとりました。
比較してみてくださいね。

トップページ(ホーム)

PC(パソコン)でみた場合

レスポンシブホームページ 「ヴェルサイユ」/Versailles 紅茶店

左手にはバラの写真。
テンプレートのバラをお気に召してそのまま利用されました。
「ヴェルサイユ」ですから、バラはイメージにぴったりですね。

店名の「Versailles 紅茶店」はクラシックな書体で作成。
王冠のロゴマークは以前からお持ちのもの。色を変更して使用。

メニューボタンは左カラムに縦に並んでいます。
ページ数は少なめ。写真は多め。
美しい写真をたくさん使って、見て楽しんでいただけるページに仕上げました。

こちらから実際のページがご覧いただけます。
大阪|紅茶と 宝塚歌劇が楽しめるサロンカフェ
「ヴェルサイユ」/Versailles 紅茶店


飾り罫線

スマホ(スマートフォン)でみた場合

レスポンシブホームページ 「ヴェルサイユ」/Versailles 紅茶店

バラの写真がほとんど見えなくなりました。
「Versailles 紅茶店」のロゴは、上部に。

メニューボタンは2列になって上部に。
写真は大きすぎず小さすぎず。
文字も読みやすい大きさです。

レスポンシブホームページ 「ヴェルサイユ」/Versailles 紅茶店

レスポンシブホームページ 「ヴェルサイユ」/Versailles 紅茶店

こちらから実際のページがご覧いただけます。
大阪|紅茶と 宝塚歌劇が楽しめるサロンカフェ
「ヴェルサイユ」/Versailles 紅茶店


飾り罫線

ね?
どのデバイスでも、美しく見やすいでしょう?

これは私の手柄でもなんでもなく…(汗)
このようなすばらしいホームページテンプレートを無料配布しておられるサイトさまのおかげ。
こちらのサイトさまです。

無料ホームページテンプレート Template Party

HTMLとCSSの知識が少しあれば使えます。
ソースもきれいでわかりやすい。
ぜひダウンロードして挑戦してみてください。

飾り罫線

パソカフェでおすすめしているレスポンシブデザインのホームページ

ものすごく簡単にいうと、スマホでもタブレットでもパソコンでも自動的にレイアウトが変化して
見やすいデザインや文字サイズで閲覧できるホームページのこと。
詳しくはこちらをご覧ください。

レスポンシブデザインとは|レスポンシブWebデザイン
|RWD|responsive design - 意味-定義 : IT用語辞典

飾り罫線

これから何回かに分けて、ヴェルサイユ紅茶店ホームページをご紹介いたします。
どうぞお楽しみに。

飾り罫線

パソコン&デジカメ教室「パソカフェ」
兵庫県川西市の自宅サロンで開講しています。
最寄り駅は、阪急宝塚線「川西能勢口」またはJR宝塚線「川西池田」。

教室へのアクセスはこちら

飾り罫線

パソカフェの アメブロカスタマイズ 個人レッスン

アメブロのカスタマイズがご自分でできるようになります。
HTML・CSSの知識のない方でも大丈夫。
カスタムに必要なところだけ、ゆっくり丁寧にお教えいたします。

詳しくはこちら
アメブロカスタマイズの事例とレッスンの流れ

飾り罫線

パソカフェの レスポンシブWEBデザインホームページ作成講座

パソコン、スマホ、タブレット共通で閲覧可能な、
レスポンシブWEBデザインのホームページを作成します。
無料HPテンプレートとフリーソフトを利用。

詳しくはこちら
レスポンシブホームページ作成 事例とレッスンの流れ

飾り罫線

パソカフェの スマートフォン 個人レッスン

写真にコラージュ・文字入れ・スタンプ・フレーム加工
らくらく音声入力で長文でもストレスなし

Yahoo!ショッピングはポイント還元がすごい
Googleマップで家から目的地までかんたんナビ

たまった写真を整理整頓してスッキリ
スマホアプリで睡眠記録

LINE(ライン)で無料通話・かわいいスタンプ入りのメール
ウォークマンみたいに たくさんの音楽を持ち歩いて楽しもう

Googleドライブ、Dropboxでパソコンに写真を転送
アイコン・壁紙の模様替えで、スマホのなかも可愛く個性的
パソコンのメールをスマホで見られると便利なんです

電話とメールだけじゃもったいない!
便利で楽しいスマホとタブレット
そのアプリと使い方を徹底紹介いたします。

飾り罫線

パソカフェの パソコン個人レッスン

ブログ用おしゃれ画像加工 ロゴ作成&使いこなし
フォトショップ ポストカード デジカメ年賀状

名刺・ラベルシール フライヤー・チラシ
フォトムービー フォトブック

ワード エクセル パワーポイント
PhotoScape(フォトスケープ)Picasa(ピカサ)

素敵なフォント(書体)で文字入れする方法 
ラベルプロデューサー DVD・CD盤面印刷ソフト など

いくつかのレッスンを組み合わせることも可能です。
サイトに記載していない内容でも、お気軽にご相談下さい。

飾り罫線

初心者さんのための 単発1dayデジカメ講座

3時間の個人レッスンで、かわいい雑貨写真が
どなたにでも撮れるようになります。

デジタル一眼レフ、ミラーレス一眼、コンパクトデジカメ、スマートフォン。
ご自身のカメラをお持ち込み下さい。

詳しくはこちら
単発1dayデジカメ講座 受講生作品

飾り罫線

パソカフェ予約カレンダーはこちら

レッスン料金・よくあるご質問についてはこちら

レッスンに関するお問い合わせ・お申込みはこちら

飾り罫線



にほんブログ村 PC家電ブログ パソコン教室・サポートへ   にほんブログ村 写真ブログ 写真講座・教室へ  

趣味ぶろ パソコン教室ブログランキング   趣味ぶろ コンピューター教室ブログランキング

ランキングに参加しました。ぽちっと応援お願いいたします♪

飾り罫線

花のポストカードやさんの関連サイト
「パソコン&デジカメ教室パソカフェ」~川西・大阪・宝塚~
やさしいカメラ知識・おしゃれ画像加工。女性講師による個人レッスン。

ポストカード&フレーム印刷用無料素材*花のポストカードやさん本館*
女性向きおしゃれ年賀状&ポストカード  結婚・出産・引越報告 フレーム素材

初心者女子のための パソコン&デジカメ教室~大阪・宝塚・川西~

関連記事

テーマ : ホームページ・ブログ制作
ジャンル : コンピュータ

プロフィール

パソコン教室パソカフェ「花のポストカードやさん」

Author:パソコン教室パソカフェ「花のポストカードやさん」


兵庫県川西市の自宅で
デジカメ&パソコン教室「パソカフェ」
を開いています。
教室で人気のPhotoScapeの使い方を本ブログで公開中。
フレーム加工や組み写真など、素敵なブログ用画像が無料で簡単に作成できますよ。

アクセスランキング
[ジャンルランキング]
ライフ
346位
アクセスランキングを見る>>

[サブジャンルランキング]
習い事
6位
アクセスランキングを見る>>
カテゴリー
FC2カウンター
facebook
ランキングバナー
Twitter
Twitterボタン
Twitterブログパーツ
ブログ全記事表示

全ての記事を表示する

カレンダー
08 | 2017/09 | 10
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
リンク

お気に入りに追加
RSSフィード
管理画面
QRコード
QR