Muse (2015) 基本講座

テキストのスタイルを設定

全334コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
入力済みのテキストのそれぞれの部分に、フォントサイズ、行送り、揃えなどの要素を設定してスタイリングして行きます。
講師:
07:44

字幕

このレッスンではテキストのスタイルを変更します。入力してあるテキストをこれですね装飾を変えていきましょう。テキストの操作なんですがこの一番上のテキストのボタンを押すとテキストパネルが出てくるのでこれで集中して行いましょう。まずは、この写真の上にある文章ですね。まず、これなんですけどフォントカラーを今、黒なのを白にしましょう。そうすると、こんな風になりましたね。ただ、白だとこの背景で見づらいですよね。こういった時には、この「効果」の部分をクリックして「シャドウ」があります。影が付けられます。影を付けてやると大分読みやすくなります。では「シャドウ」をオンにします。影ができましたね。そしたら、ここら辺の項目を調整します。今、「不透明度」が 50%これはこのままでいきましょう。では、「ぼかし」を若干弱くしてシャープにすると少し読みやすくなります。では今「距離」が8 になっていますけれどもこれを少なくしていくと大分影が近くなっていくのでこれを 2 とかにしてあげると十分読めますね。この様にシャドウをつけることで文字が溶け込んでしまわずに目立たせるとそんなことも行えます。では、さらに調整をしていきましょう。 では、次にテキストパネルで、まず、これは中央揃えになっていますね。そしたら、このボタンを押すと今は大文字と小文字の混在で書かれているのが全部大文字になります。ここは全部大文字で行きましょう。改行されて2行になってしまったのでこのボックスをもう少し広げてやって目いっぱい左右に広がるようにしましょう。これでなかなか格好いい感じになりましたね。ではさらに下の方に行きます。ちょっと下がって次はこの見出しですね。ここなんですけれど今、このテキストボックスの中は塗りはなしで文字だけがあります。ではここで「塗り」の部分ですねここに色を設定して塗りつぶしてしまいましょう。同じ色にしたいのであわせて設定してください。カラーコードに 2 を 6 回入れます。すると、こんな感じの濃いグレーになります。濃いグレーになると当然文字が見えないのでカラーは白にします。よく見えますね。では、文字が小さいので 24 にしましょう。読みやすくなりました。そしたらこの上の部分の空きの部分を調整して5 ぐらいでちょうどいいでしょうかねこんな感じにしましょう。では、この下も全く同じにデザインしてありますので同じようにどんどんやっていきましょう。 塗りつぶしを2 を 6 個にしてあげてカラーは白にしてサイズを 24 にしてそして、空きを 5 にすると。こちらも24 の白の塗りが2 が 6 個そして上の空きを作ります。例えば、こうやっていてやっぱりここも大文字にしようかなとまとめて行いたいときですねそうした時にはShift キーを押しながらこれらの複数のテキストボックスをクリックしていきます。一番上もクリックします。この状態でこの大文字化のボタンを押せばいっぺんに処理する事もできます。個別にやっても良いですしこのように一括で処理しても OK です。では、プランのページに戻って次は About us のページですねこちらも調整しましょう。そしたら、この文章ですけどここですね、テキストボックスを選んだ状態で大きさはちょっと大きく18 point にしましょう。そして、この「行送り」の部分を170 にするとこんな感じでちょっと間が空いてこのリード文っぽくなります。そしたら、ここにさらに今は入っていない見出しを加えましょう。また、ダブルクリックして入力状態に入って頭1個改行してでは、Our Story とタイトルを追加しました。そしたら、これは文字を少し大きくして24 にしましょう。 そして、中央揃えにしてここだけ見出しなので大文字にするといい感じに差別化できましたね。そしたら、次はこのそれぞれのプロフィールの部分ここは文字のサイズだけ変えていきましょう。まず名前の部分は24 でプロフィールの部分はもう少し大きく 18こんな感じでいいかなと思います。同じことを別の人にも適用していきましょう。3人目も同じく文字サイズを上げて紹介文もサイズアップします。これで全員の分ができました。ちょっと縮小して見渡すようにしてみましょう。こんな感じで統一された雰囲気にして頭のところは明らかに文章のタイプが違うので見た目も変えました。そして、Home の画面はそれぞれですね。画像の上に載っているのも画像に書き込んでしまっている文字ではなくテキストで書いてあるのでちゃんと検索の対象にもなるというページを作るうえで大変いい状態になっていますね。このようにある程度デザインされた文字もMuse 上でテキストの状態のままで作ることができます。ぜひともこの辺の機能を活用してみてください。

Muse (2015) 基本講座

WebデザインソフトMuseを使うと、HTMLのコードを使わずにデザイン性に溢れるWebページを簡単に作ることが可能です。このコースではマスターページの作成やコンテンツの追加、テキストの追加や色の設定、ウィジェットや拡張機能の活用、レスポンシブなレイアウトの設定やデータをアップロードしてウェブ上に公開する手順などMuseの操作をひと通り学ぶことができます。

4時間01分 (39 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2016年07月02日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。