サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
Dreamweaver CS6 では、デスクトップやスマートフォン、タブレットなど様々な画面サイズに適したコンテンツレイアウトを実現するための「可変グリッドレイアウト」機能は、「レス ポンシブWebデザイン」といわれる、CSS3の Media Queries を使用してワンソースでマルチデバイス対応させる振り分け方法を容易に実装するための機能です。 前編では、この「可変グリッドレイアウト」機能を利用して、実際に3つのデバイスでレイアウトが可変する大枠のHTMLまでを準備しました。 後編では、以下の様な作例のデザインを元にして、実際の細かい部分のコーディングにあたってのTipsや注意点を紹介いたします。 ※このサンプルサイトは本記事用に作成した架空のサイトであり、公式のページではありません。 モバイル→タブレット→デスクトップというCSSの継承順序と Media Queries まず、前編
Enhance and extend DreamweaverDreamweaver providesits ownAPI as well as the Common Extensibility Platform (CEP), and offers you the flexibility of usingC++,HTML,CSS, and JS tobuild extensions for Dreamweaver. You can extend the DreamweaverUI, add powerful features forbuilding web apps and automate entire cross-applicationworkflows.Build custom web development toolsImportdatabase data in
旧ブログで公開していた「Dreamweaver スペシャルコードヒント」ですが、ありがたいことにリクエストをいただきましたので、改めて公開します。 なお、データ自体は公開当時のままですので、最新版で動作しない場合はご容赦ください。 そもそも、スペシャルコードヒントとはDreamweaver でコーディングする際、先頭の数文字を入力しただけで入力候補を一覧化してくれる「コードヒント機能」。スペシャルコードヒントは、このコードヒント用の XML ファイルをカスタマイズしたものです。 デフォルトのコードヒントからの変更点は、以下の通りです。（※対応バージョンごとに多少の差異があります。） 利用頻度の低いCSS プロパティのコメントアウト@ で @import を表示数値入力の際、px、%、em、s、deg、grad、rad、turn を表示CS4 版のみ「!im」で !important を表
HTML制作が3倍速くなるDreamweaverの裏技教えます 第1回：デザインビューは使えない？ 鷹野雅弘（@swwwitch） スイッチ 2012/6/29CSS Niteでおなじみの鷹野さんが、新人Web担当者向けに知って得するDreamweaver裏技を教えますCSS Niteを主催している鷹野です。この連載では、知ってると、HTMLページの制作速度が3倍に上がるAdobe Dreamweaver（以下、Dreamweaver）の裏技をお伝えしていきます。新人Web担当者のキャシーに、僕がいろいろと教えていくスタイルで進めていきます。 鷹野／Web制作会社に勤務。Dreamweaverとはバージョン1.2からのお付き合い。『よくわかるDreamweaverの教科書（CS6対応版）』をマイナビから発売。 。 キャシー／企業のWeb担当者。ちょっとした更新作業を行っている。CMSが
福岡を拠点にWebサイト制作・iPhoneアプリ制作を行うフリーランス 入江慎吾のWebサイト。 PLUSはワクワクするWebサービスやiPhoneアプリを制作しています。Macでは有名なエディタCodaがメジャーアップデートされ、Coda2が出ました！あわせてiPadアプリのDiet Codaも出ていて、iPadでもコーディングができる時代に。DreamWeaverを使っていましたが、前から気になっていたCodaをこの機会に使ってみようと思い、購入しましたので使い勝手などをご紹介します。 Coda2で何ができる！？ ほぼDreamWeaverと同じことができます。 ・HTML、CSS、JS、PHP、Rubyなど言語を問わずコーディングができる ・MySQLのかんたんな管理ができる(簡易版phpMyAdminみたいなもの) ・FTP機能もついている ・SSHも使える 動作が軽
一定期間更新がないため広告を表示しています
2011年12月11日に開催された「効率的なサイト制作のためのDreamweaver活用術seminar」のフォローアップです。 お預かりしました質問の件は、追記しますので、後でまた覗いてください追記しました。 スライドはCSS Nite in Ginza, Vol.59フォローアップ |CSS Nite公式サイトから（※すべてではありません）。HTML5やCSS3などのスキルの獲得には下記のセミナーをオススメします。 平日の夜のショートセミナー「CSS Nite back2basic」を2012年1月に開催します #cssnite_b2b |CSS Nite公式サイト ご質問の件 条件コメントを使ったInternet Explorer用の振り分けなど、最近のよく使われているものについて教えて欲しい。 Internet Explorer用の条件分岐次のように記述することで、Inter
こんばんは！ハッピーバレンタイン！！ の今日は、三宮、吹雪いてました。寒い・・・ 今回は前回の続きで、Zen codingのデフォルトのインデントを消す方法を説明します。 ドアズは、基本的にノーインデントという方針上このデフォルトの設定が邪魔なのです。 Zen codingはDWにインストール済みですね？ 初めて使うという方は、こちらの記事をどうぞ。 まずは、Zen codingの設定類が入っているフォルダを開きます。Windows7の場合はここ↓ C:\Users\コンピュータ名\AppData\Roaming\Adobe\Dreamweaver 9\Configuration\Commands\ZenCoding その他OSの方は、とりあえずAdobeのフォルダ＞DWのフォルダを探し当ててください（人任せ） その中から、zen_editor.jsというファイルを開きます。 この関数の
チーム内のももクロ旋風が留まるところを知りません。 まだメンバーの顔と名前覚えきってないんだけどそんなこと言えないhakoishiです。がんばります。 さて、本日はDreamweaverの使い勝手をちょこっとだけ底上げしてくれる拡張機能を5つほどご紹介します。 Zen Coding これはもう、いわずもがなですね。コーディング効率大幅アップ。 下記よりDreamweaver用のファイルを選択してDLしてください。 Downloads - zen-coding 閉じタグコメントを挿入 「コマンド」メニュー⇒「閉じタグコメントを挿入」で閉じタグコメントを自動で挿入してくれます。 ID・classも自動的に拾ってくれるので、構造のチェックにも便利。 コメントを生成して挿入するDreamweaver用の拡張機能を作成しました Dreamweaver CS5 Validator 「結果」パネル⇒「バ
米Adobe Systems社でウェブ用オーサリングツール『Dreamweaver』の製品担当であるCreative SuiteグループプロダクトマネージャーのDevin Fernandez氏とFireworksプロダクトマネージャーの森房卓史氏が来日。ガジェット通信の取材に答え、『Dreamwever』の最新動向について説明しました。 『Dreamweaver CS5』では次のエリアにフォーカスしています。 ・CMS（Content Management System、コンテンツ管理システム） ・CSSインスペクション ・コードヒント ・HTML5パック 各項目について見ていきましょう。 ・CMS環境で『ライブビュー』を活用 クライアント向けCMSを多くのユーザーが使っています。開発者にはこれの管理が難しい課題です。単純なテーマでも100以上のインクルードされたファイルが存在し、各ページ
コーディングを早くすると言えば超速コーディングとして話題になった「Zen-Coding」がありますが、記述方法を覚えなければいけないのもあって及び腰な人も多いのではないでしょうか（私です）。 私はコーディングする際は先にテキストをコピーしてもってきてからタグで囲むので、このような使い方をしてるとあまりZen-Codingは使わないのかなと思います。【追記】調べたら囲んだあとにもできました。Wrap with Abbreviationを選択し、ウインドウが出てくるのでそこにzen-codingの記述をすればいいです。ご指摘ありがとうございました。 覚えてしまえば早くなりそうですが、そこまでなーと思う人がちょこっとスピードアップできることをよく使っているDreamweaverの機能をご紹介します。 特に新しい事ではなく元から付いてる便利な機能のご紹介です。 スニペットを使う よく使うコードを登
Dreamweaver用の拡張機能をまとめました。 便利なものばかりなので、ぜひお役立てください。 タグ挿入・文字列変換 コメントを生成して挿入するDreamweaver用拡張機能 <!– /#container –>などのコメントを簡単に挿入できます。 IDやClass名は自動で取得してくれます。 Adobe – Dreamweaver Productivity : Close Tags 閉じていないタグを閉じてくれます。 Adobe – : Adobe Dreamweaver 10周年セミナー：全角・半角変換拡張機能 全角の数字やカナを半角に直したり、その逆もできます。 携帯サイト作成にも便利ですね。 Zen-Coding DreamweaverでZen-codingが使えるようになります。 （CS3の方は、Zen Coding for Dreamweaver v0.5を選ぶといいかも
2017年6月29日 便利ツール Webサイトを制作する時のWebオーサリングツール・HTMLエディタは何を使用していますか？きっと多くの人がDreamweaverを使っていると思います。私もそうでした。が、最近私のまわりのWebデザイナーがみんなCodaというソフトを使っているのに気づき、試したところ、あまりにも使い勝手がいいので紹介します。本当におすすめです！ ↑私が10年以上利用している会計ソフト！ Codaの特徴を簡単に 詳しい説明はリンクをクリックでジャンプします。Mac専用 美しいビジュアル 便利なプレビュー画面PHPやJavaScriptの動作確認も 素早いタグ打ちが可能 有料 8,500円 はい、Mac専用なんです。このブログを読んでいるユーザーの70%がPC使用なのでこれを記事にするか悩みましたが、Mac愛用者さんに向けて！ちなみに私はCoda英語版をインストールして
iPhone（iPhone 3G/3GS）／iPod touchは、PC向けサイトがそのまま表示できるところが大きな魅力の一つです。しかし、小さな画面や、指で操作するとインターフェイスなどのようにデバイス特有な面も多く、PC向けサイトのままでは必ずしも見やすいとはいえません。そこで本記事では、Dreamweaverを使ってiPhone向けサイトを作る時のテクニックや注意点をご紹介します。 必要条件 この記事を最大限に活用するには、次のソフトウェアが必要です。 Dreamweaver CS5 体験版 今すぐ購入 制作したサイトの表示結果を確認する方法 ライブビューでプレビューする Dreamweaver CS5（および CS4）には「ライブビュー」機能が搭載されており、ページのレンダリングにはWebKitエンジンを利用しています。iPhoneのSafari（Mobile Safari）も
先日、ノンプログラマのためのPHP入門という素敵なUSTを見ていたのですが、その中で出てきたzen coding。 前々から知っていたものの、これ使うならエディタごと乗り換えないといけないんだ！とずっと勘違いしていて、なんだかんだでまだDreamweaver使ってるし…サイトの定義とかもしてるからなんだかんだでエディタ乗り換えるの面倒だしなぁ…とかごにょごにょ思っていたのですが… Dreamweaverでも使えるらしいよ！知らなかった！無知って怖い！＞＜ Dreamweaver用はこちらからダウンロードできます。 ダウンロードしたZen Coding.mxpをダブルクリックするとエクステンションマネージャーが立ち上がるので、承諾するをクリックしてインストール。 これだけでOK。 インストールが終わったら、早速何か入力してみましょう。 すごい！感動！ 展開はcontrolキーと,(カンマ)キ
意匠部、渕上です。htmlの閉じタグの手前にコメントを入れることがめんどくさくなったので、Dreamwaver用の拡張機能を作って解決することにしました。 どういうコメントかというと、以下のようなやつです。 <div id="container"> ～～～ <!-- /#container --></div> このコメントを入れることでコードの見通しがよくなるので絶対いれたほうがいいことはわかってるんですが、idやclass名を記述しなきゃいけないのがちょっと大変なんですねー。 ダウンロード ということで、作成した拡張機能はコチラ。 ダウンロード - End_comment.mxp インストール mxpファイルをダブルクリックするとAdobe Extention Managerが立ち上がりインストールされます。 インストールできないことがあります 「メニューを更新できませんでした」という
簡単なリファレンス（Dreamweaver CS3の場合） 最終更新日： 08/09/04 Dreamweaver CS3の使い方 目次 サイト定義をするCSSを優先にしない設定にする 新規にHTMLファイルを作る 起動時に新規ドキュメントを開くようにする ショートカットキーで新規ドキュメントを作成する 新規にCSSでレイアウトされたドキュメントを作成する ウィンドウサイズの変更・調整HTMLファイルのプロパティの変更 文字の入力 文字の大きさを変更する 文字の色を変更する 画像を追加する 画像ソフトからコピー&ペーストで画像を挿入する 罫線（区切り線）を追加する 箇条書きを作る クリックでメーラーを起動させるようにする 表を作る 別ページへリンクを作る ドキュメントにリンクされたページを開くHTMLファイルに名前をつけるHTMLファイルを保存する 背景、テキスト、リンクなどの色を
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
