久保 知己

株式会社まぼろし / マークアップエンジニア / 1985年生まれ。HTML/CSSからCMSの構築まで、様々なサイトの制作に携わり、2014年にまぼろしに入社。著書に「CSS3&jQueryで作る スマートフォンサイトUI図鑑 」(アスキー・メディアワークス/共著)、「プロとして恥ずかしくない 新・WEBデザインの大原則」(MdN/共著)などがある。

久保 知己

Dreamweaverで覚える最新Web開発ワークフロー: Sass&ライブビューでBootstrapをカスタマイズ

Dreamweaver CC 2017リリースが公開されて、CSSプリプロセッサーが正式にサポートされ、SassからCSSをコンパイルできるようになりました。今回は、Sassとライブビュー機能などを使ったBootstrapの便利なカスタマイ...

久保 知己

Dreamweaverで覚える最新Web開発ワークフロー: ライブビューを使ってBootstrapのレイアウト作成

この連載でも取り上げていたDreamweaver Nextが、「2017年リリースのDreamweaver CC」として正式に公開されました。 今回は新しくなったDreamweaverを使って、Bootstrapのレイアウト作成の実例をご紹...

久保 知己

Dreamweaverで覚える最新Web開発ワークフロー: プレビュー機能を使ったWeb制作

次世代Dreamweaverではライブビューが更新され、新しくリアルタイムプレビューが追加されました。今回は、今月公開されたDreamweaver ベータ3に含まれるUIや機能から、プレビュー関連の 便利な機能をご紹介します。 Dreamw...

久保 知己

Dreamweaverで覚える最新Web開発ワークフロー: LESSを使ったBootstrapカスタマイズ

Bootstrapは、レスポンシブWebデザインのサイト構築に広く使われているフレームワークです。Dreamweaverは以前からBootstrapをサポートする機能が組み込まれており、グリッドレイアウトやボタンなどのコンポーネントを専用の...

久保 知己

Dreamweaverで覚える最新Web開発ワークフロー: Sass編

先日公開されたDreamweaverベータ版は、高機能で効率的なモダンなツールとして生まれ変わるべく、Bracketsがエディタに取り込まれ、UIにはダークなテーマが適用されるなどの大きな変更が行われています。より詳しい情報は、完全に生まれ...

久保 知己

HTML/CSSを爆速コーディング Emmet入門 第6回 Emmetを使って、コードの編集を強力にサポートする(後編)

HTMLやCSSのコーディングがもっと楽になる、Emmetのアクションについての後編です。前編では7つのアクションを紹介しました。今回は残り9つのアクションについて解説いたします。 8. Go to Matching Pair | 開始タグ...

久保 知己

HTML/CSSを爆速コーディング Emmet入門 第5回 Emmetを使って、コードの編集を強力にサポートする(前編)

これまでの連載では、Emmetの省略記法の展開に関わる内容について説明してきました。しかしコーディングの時は、HTMLやCSSの生成だけでなく、既存のコードに追加や編集をする作業も必ず発生します。 Emmetにはアクションと呼ばれる編集支援...

久保 知己

HTML/CSSを爆速コーディング Emmet入門 第4回 Emmetのスニペットや設定を編集して、思い通りの記述にしよう

第2回、第3回の連載では、Emmetの省略記法を使ったコーディング方法について解説しました。初期設定のままでも便利なEmmetですが、自分のコーディングスタイルにあわせてEmmetの設定を編集してみましょう。 例えば、インデントの変更から独...

久保 知己

HTML/CSSを爆速コーディング Emmet入門 第3回 エディタのコードヒントよりも早い!EmmetのCSSの記法とは?

EmmetはHTMLだけなく、CSSでも省略記法を利用できます。Emmetを使ってCSSを書くには慣れが必要ですが、ある程度覚えればコードヒントを使うよりも素早くCSSの記述ができるようになります。 今回はCSSの省略記法について解説します...

久保 知己

HTML/CSSを爆速コーディング Emmet入門 第2回 Emmetの省略記法を使って、HTMLを素早く入力する

Emmetの代表的な機能に、HTMLとCSSの省略記法があります。今回はCSSのセレクタのように記述できるHTMLの省略記法と、それに関連するEmmetの機能を紹介します。 Bracketsを使って解説するため、インストール方法は、前回の記...

久保 知己

HTML/CSSを爆速コーディング Emmet入門 第1回 Emmetを薦める理由

Web制作に欠かせないツールである「Emmet」というものを、知っていますか?  この連載では、お使いのエディタの機能を拡張するEmmetのインストールから、HTML・CSSの展開、あまり知られていない便利な機能などを解説しま す。初回は、...