WebデザイナーのためのSublime Text入門

インターフェイスについて

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
Sublime Textはウインドウを分割したり、サイドバーを使用したりと、柔軟なインターフェイスを備えています。作業内容に応じてカスタマイズしてみましょう。
講師:
06:21

字幕

このレッスンではSublime Text のインターフェイス、つまり画面の見方についてご紹介します。それではレッスンファイルの HTML をまずブラウザーにドラッグアンドドロップしましょう。このようにインターフェイスについての説明が簡単に書いてあります。そして同様にこの HTML をSublime Text にもドラッグアンドドロップをします。そうするとこのようにファイルが開くのでブラウザーとエディターが画面の半分半分位になるように調整してみましょう。それではこの左の HTML の内容が右の設計図で出来ているというような形になっています。ではまず Sublime Text のインターフェイスを見てきましょう。まずこのタブが特徴です。ファイルが複数あるときはこのタブが増えていきます。まず試しに新規ファイルを作ってみましょう。ファイルのメニューからNew File を選びます。Mac のショートカットはCommand+NWindows のショートカットはCtrl+N です。New の N と覚えましょう。では New File をクリックすると新規のファイルが先程のファイルの隣のタブとして作成されました。 このようにクリックで移動が可能です。次に画面の分割方法を学びます。画面の分割はメニューからも可能です。それでは Sublime Text を1回クリックしてフォーカスしてそして Sublime Text のメニューの中View という中からLayoutそして Layout の中にColumns:2 という表記があります。また、ショートカットも書いてあります。Mac の場合はCommand+Option+2Windows の場合はShift+Alt+2 です。また、1 と 2 を切り替えることも多いのでそれぞれ 1 と 2 を覚えておくと便利だと思います。では Columns:2 をクリックして見たいと思います。クリックすると、このように今のウィンドウが2分割されました。そして先程作った空の新規ファイルをドラッグして右の方へ移してみましょう。そうするとこのように左のファイルと右のファイルは独立します。このように幾つもタブを開いて同時にファイルを閲覧しながら編集できることがSublime Text の特徴です。それでは View Layout Singleそしてワンカラムに戻しておきましょう。 そしてまたウィンドウを調整しておきます。次はメニューバーです。メニューバーはこの Sublime Text のアプリケーションにフォーカス、つまりクリックしてフォーカスされている時に出てくるこの表記です。Windows の場合はこのメニューバーの所にくっついていると思いますこのメニューから様々なコマンドにアクセスができますが英語なので最初は戸惑いますが少しずつ覚えていきましょう。それでは次にサイドバーです。サイドバーは初期設定では出ていません。こちらは View Side Bar Show Side Barというものがあるのでこちらをクリックしてみましょう。クリックするとこのようにサイドバーが出まして今現在開いているファイルのリストが並ぶようになっています。なので多量のファイルを編集する時はサイドバーを開いておくと便利だと思います。では View Side Bar を選んで一旦 Hide Side Bar で隠しておきましょう。次はステータスバーです。ステータスバーはこの Line と書いてあったり、右下に HTML と書いてあったりする部分です。実はこちらもメニューになっていて例えばこの Tab Size: 4こちらをクリックすると実はインデントに使われているタブのサイズを縮めたりすることが可能です。 また、この HTML と書いてある所はコードのカラーリングを変更できるというものです。ただ、自動的に HTML であればHTML のカラーリング、つまりシンタックスハイライトというものが選ばれるので普段はあまり気にすることは無いでしょう。次はコンソールです。コンソールはエディターに直接命令を出したりしたい時やステータスコマンドなどを見る時に使えます。View Show Consoleというものをクリックすると、このようにコンソールが現れます。この部分にはコンピューターからのメッセージが流れていたりしますが普段はあまり気にすることはありません。そしてまた View Hide Consoleそしてコンソールを隠しておきます。このように、まずどのエリアがクリックできてそしてどのようにすれば作業効率のいい画面レイアウトにできるのかという所を少しずつ慣れていって頂ければと思います。このレッスンでは Sublime Text のインターフェイスについてご紹介しました。

WebデザイナーのためのSublime Text入門

Sublime Textは世界中で多くのプログラマーに愛されている大人気のテキストエディタです。このコースでは、Sublime Textを使うのが初めての方にもわかりやすいようにその使い方を丁寧に解説していきます。コースの後半では実際にSublime Textを使ってコーティングを行っていきます。

2時間16分 (23 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2014年06月18日
再生時間:2時間16分 (23 ビデオ)

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

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

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