The Blog | Welcome to Adobe Blog アドビのブログでは、Creative Cloud、Document Cloud、Experience Cloudの最新情報や役に立つ情報を紹介しています。
サイトにはヘッダーやフッター、ナビゲーション部分など全ページに共通して入る要素があります。 この部分を修正する時はHTMLを全ページ修正するととても手間がかかって大変です。自分のサイトはだいたいCMSで管理しているのでテンプレートを直せばあっと言う間なのですが、それ以外の場合の共通部分を簡単に治す方法を改めて調べてみました。 がんばって直に書いてるものを置換する Dreamweaverのテンプレート機能を使う JavaScriptを使う PHPを使う SSIを使う Node.jsやRubyのツールを使う がんばって直に書いてるものを置換する とりあえず普通にコーディングして、修正などある場合はソフトの一斉置換を使ってなんとかする方法です。 数ページものならあまり気にならないがページが増えていく毎に大変になる。リンクや画像が相対パス指定だと階層が増えると更に大変になります。 <footer>
本連載では、CMSのスタンダードでもある「WordPress」のテーマ作成を、「Adobe Dreamweaver CC」(以下、Dreamweaver)をメインに用いてさまざまなモダンな技術を組み合わせながら爆発的に捗(はかど)らせる方法を解説していく。さまざまなモダンな技術としては、「Sass」「Compass」「Emmet」(旧、Zen-Coding)を想定している。 今回は、Dreamweaverの概要と最新版Dreamweaverの新機能、WordPressの概要、Dreamweaver+WordPressの環境構築を行う際に必要な初期設定などを紹介していこう。 そもそもDreamweaverとは、なぜDreamweaverを使うのか DreamweaverはWebサイト/Webアプリケーションの制作ツールだ。HTMLエディタという見方をすれば非常に動作が重そうで、他の軽量なエデ
Web制作の現場では、日々新しいデザインのインスピレーションを得るためにギャラリーサイトを活用しています。しかし、数多くあるギャラリーサイトの中から、自分の目的に合った適切なサイトを見つけ出すのは意外と難しいものです。 この記事では、複数の...
Web制作者なら誰もが思うこと それは、ファイルを保存していちいちページ更新して確認するのは意外とめんどくさい。 微妙に時間がかかる・・・ ではないでしょうか? Dreamweaverとwordpressを連携させるとワンクリックで表示を確認することが出来ます。 7ヶ月前、設定方法をライトニングトークでお話しさせて頂きました。 ただ、当時はWordpressのこともphpが環境構築しないとローカルで動かないこともDreamweaverのこともろくに知らない状態で、知らないづくしで発表したので作成したスライドは何が言いたいのか分からないものになってしまっています。 今回、設定部分に焦点を当てて簡単にまとめてみます。 ★使用環境:Windows・Dreamweaver5.5 <目次> 1.XAMPPインストール 2.WordPressインストール 3.Dreamweaverの設定 4.Drea
Fireworks CS6には、jQuery Mobileのテーマを作成する機能が追加されました。CS5/CS5.1向けに同様の機能を提供する拡張機能「Fireworks CSS3 Mobile Pack」がAdobe Labsにて提供されていますが、CS6では日本語化されているなどの違いがあります。 アイコンの変更 早速、jQuery Mobileのテーマを作成してみましょう。メニューから[コマンド]→[jQuery Mobileテーマ]→[新規テーマを作成]を選択すると、jQuery Mobileテーマ作成用の画面が表示されます。jQuery Mobileのデフォルトテーマには5つのスウォッチ(カラーバリエーションなもの)が用意されており、Fireworksでも初期状態では5つのスウォッチがページとして定義されています。さらに、スウォッチで共通に利用するアイコンなどを設定するページ、テ
コーディングをするときに自分が主に使ってるのがDreamweaverです。そのままでもいろいろ機能があって便利ですが、コマンドや拡張機能を入れることによってさらに便利に使うことができます。 そこでDreamweaverのコマンドや拡張機能で見つけたものをまとめてみました。他にもこんな便利なものがあるよなど教えてもらえるとうれしいです。 使い方は、コマンドの場合はファイルをダウンロードしてきて以下に入れます。環境によって違う場所にあるかもしれません。 Windows → C:\Program Files\Adobe\Dreamweaver CS5.5\ja_JP\Configuration\Commands Mac → ライブラリ\Application Support\Adobe\DreamweaverCS5\ja_jp\Configuration\Commands 拡張機能はダウンロード
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
チーム内のももクロ旋風が留まるところを知りません。 まだメンバーの顔と名前覚えきってないんだけどそんなこと言えないhakoishiです。がんばります。 さて、本日はDreamweaverの使い勝手をちょこっとだけ底上げしてくれる拡張機能を5つほどご紹介します。 Zen Coding これはもう、いわずもがなですね。コーディング効率大幅アップ。 下記よりDreamweaver用のファイルを選択してDLしてください。 Downloads - zen-coding 閉じタグコメントを挿入 「コマンド」メニュー⇒「閉じタグコメントを挿入」で閉じタグコメントを自動で挿入してくれます。 ID・classも自動的に拾ってくれるので、構造のチェックにも便利。 コメントを生成して挿入するDreamweaver用の拡張機能を作成しました Dreamweaver CS5 Validator 「結果」パネル⇒「バ
私がwebサイトのラフを作る時の流れを書いてみました。 独学で身に付けた方法であり、 一般的な方法ではないかも知れないことを予め断っておきます。 私にはやりやすい方法ですが、 他の人にとってはそうではないかもしれません… 本エントリーはラフデザインのみ注力するため、既にコンセプト、ターゲット、サイト構成などは決まった状態と仮定します。 (※本文中のショートカットキーは全てMacの場合です) 希望デザインのヒアリング ※委託業務の場合です どんなデザインが希望かを先方にヒアリングします。 この時にできるだけ、クライアントのイメージを明確にするため 抽象的でも良いので沢山言葉を貰います。 明るい、可愛い、ポップ、カッコいい、シンプル、落ち着いた…etc 具体的にデザイン参考にしたいサイトがあるのなら聞いておきます。 また頂いた言葉と自分のイメージのギャップを埋めておきます。 ”シンプル”と言う
チャンピオンズリーグ決勝を見るために頑張って起きましたが、眠気のため後半途中で撃沈した sakai です。 お客様から原稿をもらったら、半角カナ、全角カナが入り混じり、数字も半角だったり全角だったり。機種依存文字も使われてたー! なんてことがよくあるかと思います。 今回は Dreamweaver で全角・半角や機種依存文字を一括変換できる拡張機能をご紹介します。 こちら 全角・半角変換拡張機能 CS3 用とありますが、CS5.5 でも問題なく動作しました。 こんな感じでダイアログが出て、変換をすることができます。 これまでは秀丸のマクロを使って一括変換をして、それから Dreamweaver にコピーして… という手順を踏んでいましたが、この拡張機能さえあれば作業を Dreamweaver に一本化できるので、ありがたい! 是非お試しください。
確認・・・Dreamweaver cs4以降 ■Dreamweaverのプレビューがクソ重い。■ 原因1・・・cssのid,class名に「-(ハイフン)」を使っている。 id,class名に記号の上では「マイナス」と同じハイフンを使うと、Dreamweaverがこれをマイナス要素かどうかいちいちチェックするので遅くなる。 (ソース) 対処法・・・id,class名にハイフンを使わない。 ソースには「ハイフン」を「_(アンダーバー)」に差し替えるなどの対処法が書いてあるが、かなり古いブラウザの場合はアンダースコアさえ認識しない場合があるので、一応心に留めておく。 ちなみに僕はセレクタ名が長くなる場合はキャメルケースで書いてます。 wrapperLeftContainer みたいな。 ただcssではIE5以下は大文字を解さないので、同じクラスタ名で大文字小文字の使い分けはできない。 原因2・
Manage your organization's users, settings and licenses.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く