Dreamweaverで画像サイズをリセットするコマンド＆半分にするコマンド（Retina対応に便利） | バシャログ。
あけましておめでとうございます。hakoishiです。 本年もよろしくお願いいたします。 正月休みはコタツと闘っては連日連敗を喫しておりました。 眠りへの誘惑危険すぎる。 さて、本日はDreamweaverの画像サイズのリセットが一気にできちゃうコマンドと、半分にリサイズするコマンドのご紹介を。 画像サイズをリセットするDreamweaverコマンド Dreamweaver 画像の幅と高さをリセットするコマンド « きんくまデザイン http://www.kuma-de.com/blog/2009-01-27/298 既存のソースを使いまわしてコーディングする時や、修正を重ねるうち微妙にサイズの違った画像が多発した時。 1つずつクリックして修正していくのは手間ですね。 と、そんな時にこのコマンド。 ソースを全選択した状態で、「コマンド」メニュー⇒「画像サイズをリセット」を適用すると、ページ
Adobeが作ったHTML作成ツール、Edgeの本気度
HTML5ベースのアニメーション作成ツール、Adobe Edgeの完成度と、Flashとの使い分けについてプロダクトマネージャーに聞いた アドビシステムズは2011年8月1日、HTML5ベースのアニメーション作成ツール「Adobe Edge Preview版」をAdobe Labsサイトで無償公開した。正式な製品化は2012年を予定している。 これまでWeb用のアニメーション作成といえばAdobe Flash Professionalが独壇場だったアドビのツールラインアップに、新しい手段が加わることになる。Adobe Edgeとは何か、また、Flashとの使い分けはどうすべきなのか、アドビシステムズ Creative Suiteグループプロダクトマネージャーのデヴィン・フェルナンデス氏に話を聞いた。 矢野 Adobe Edgeとはどんなツールですか？ デヴィン HTML5によるアニメーショ
アドビ、オンラインサービス「Adobe BrowserLab」をアップデート | クリエイティブ | マイコミジャーナル
アドビ システムズは、WebデザイナーやWeb開発者がデザインの一貫性や整合性を確認するため、異なるブラウザやオペレーティングシステム上でのWebサイトのプレビューを簡単に行うことのできるオンラインサービス「Adobe BrowserLab」をアップデートした。 「Adobe BrowserLab」 今回のAdobe BrowserLabのアップデートで新しく導入された機能としては、FirefoxユーザーがFirebugを使って編集した結果を簡単にプレビューし、それが他のブラウザでどのように維持されるかを検証することのできるFirebugへのアドオン機能、Safari 5のサポート、「Dreamweaver CS5」統合の強化、ページの位置決め方法が異なるブラウザについて、スクリーンショットをページの特定の位置に揃えることのできる、Smart Alignと呼ばれる新しい比較ツールの強化、な
CSS Nite in Ginza, Vol.49「バシャログ LIVE」が終了しました。 | バシャログ。
バシャログ。のスタッフが出演した CSS Nite in Ginza, Vol.49 「バシャログ。LIVE!」 は満員御礼の中、終了いたしました。 ご参加いただきました皆さま、どうもありがとうございました。 あんなに大勢（150人くらい参加いただいたそうです）の人の前で話をするのは小学校のときに球技大会の選手宣誓をして以来でした… とても貴重な経験をさせてもらいました。楽しかったです！ 以下、講演のフォローアップです。 デモの詳しい内容については、さらに別のエントリーでご紹介する予定がありますので、どうぞお楽しみに！ 資料 スライド資料（PDF） ※デモを見ないと意味がわからない内容かも… デモの内容は今後エントリーとして公開しますので、資料は参考程度でご覧ください 講演の内容 Web制作の「効率」にスポットを当てた内容でお送りしました。 普段バシャログ。で公開しているような Tips
コメントを生成して挿入するDreamweaver用拡張機能を作成しました | Topics | DB - KAYAC Designer's Blog （カヤック デザイナーブログ）
意匠部、渕上です。 htmlの閉じタグの手前にコメントを入れることがめんどくさくなったので、Dreamwaver用の拡張機能を作って解決することにしました。 どういうコメントかというと、以下のようなやつです。 <div id="container"> ～～～ <!-- /#container --></div> このコメントを入れることでコードの見通しがよくなるので絶対いれたほうがいいことはわかってるんですが、idやclass名を記述しなきゃいけないのがちょっと大変なんですねー。 ダウンロード ということで、作成した拡張機能はコチラ。 ダウンロード - End_comment.mxp インストール mxpファイルをダブルクリックするとAdobe Extention Managerが立ち上がりインストールされます。 インストールできないことがあります 「メニューを更新できませんでした」という
Zen-Codingの応用でもっと超速に - 原稿ありきの変換について
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに こんにちは。R＆D統括本部 制作本部 ウェブデベロップメント部に所属しております。岡部和昌（@kzms2）と申します。 前回の記事（マークアップ効率化 - zen-codingでコーディングを倍速に）ではZen-Codingの基本について説明しました。 また、その内容をCSS Nite実行委員会（公式ページ）が主催した、Dreamweaver Town Meeting in TokyoというDreamweaverにフォーカスをあてたイベントで公演させていただきました。 ［撮影：飯田昌之］ その公演では、Zen-Codingを知らない方向けに、Zen-Codingとは何か・どんなことが出来るのかなど、基本に関して実演を行い
iPhoneサイトを無料作成！Dreamweaver拡張機能が登場
使い慣れたDreamweaverで、iPhone用のWebサイトを作りたい。そんなWeb制作者の声に応えるエクステンション（拡張機能）「iPhone site extension for Dreamweaver CS4/5」が登場した。利用は無料で、開発元のエイチツーオー・スペースのWebサイトからダウンロードできる。 iPhone site extensionは、アドビ システムズのHTML/CSSオーサリングツール「Dreamweaver」にiPhone用Webサイトの作成支援機能を追加するエクステンション。iPhone site extensionをDreamweaver CS4/CS5にインストールすると、新規作成メニューから「iPhone用ページ」「iPhone用Webアプリ」の2種類のHTML/CSSテンプレートが選択できるようになる。各テンプレートには、アップルのデザインガイ
Dreamweaverのテンプレート機能関係の参考サイト – 我流天性 がらくた屋
Dreamweaverのテンプレート機能の参考サイトの自分用メモです。 使いこなせれば、中小規模のサイトをシステム無しで、 Webデザイナーのみで管理／運営ができます。 頑張ってContributeと連携すれば、こんなサイトも運用できちゃったりします。 Dreamweaverのテンプレートを使った事例 サッポロビールにおけるテンプレート活用事例 | デベロッパーセンター http://www.adobe.com/jp/devnet/dreamweaver/articles/dw10seminar_sapporobeer_02.html あの大手サイトもテンプレート機能を使ってます。一通り全部読んでみる事をお勧め。 北九州芸術劇場 http://www.kitakyushu-performingartscenter.or.jp/ 手前味噌ですいません…(汗 Dreamweaver Templ
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を選ぶといいかも
A List of 58 Awesome Sites With Tons of Free Web Tutorials
The Internet is full of wonderful free gems, and web tutorials are definitely high up on our list of favorites. There are hundreds of great, free tutorials out there on everything from web building (HTML, CSS, etc.) to Flash to Photoshop. We've put together our favorite 58 tutorial hubs and we want to share them with you. We chose these resources because they have great information, come from auth
Adobe Edge: 2010年2月 ワンパクの「もっと使いこなしてみよう！Dreamweaver」最終回 拡張機能でDreamweaverをパワーアップ！
株式会社ワンパクの近藤＆杉山の師弟コンビがDreamweaverの覚えておきたい便利な機能や、見落としていた機能などをお届けする本連載。今回で最終回となりました。最後に取り上げるのはDreamweaverの 「拡張機能」です。拡張機能をインストールすれば、Dreamweaverには搭載されていない機能を加えることができ、自分好みにカスタマイズすることができます。そして、「杉山のこれ知ってます？」のコーナーでは、ダミー画像を簡単に用意できるイメージプレースホルダーと、ファイル操作を制限できるクローク機能について紹介します。 入れておくと便利！ オススメ拡張機能 杉山：師匠～！ 便利なもの見つけちゃいましたよ～(*^▽^*)/ 近藤：なんだ？ 杉山：Dreamweaverの拡張機能です！ ただでさえ便利なDreamweaverが、拡張機能をインストールすると、ますます便利になっちゃうんですね！
http://blog.v-colors.com/etc/778.html
先日、ノンプログラマのためのPHP入門という素敵なUSTを見ていたのですが、その中で出てきたzen coding。 前々から知っていたものの、これ使うならエディタごと乗り換えないといけないんだ！とずっと勘違いしていて、なんだかんだでまだDreamweaver使ってるし…サイトの定義とかもしてるからなんだかんだでエディタ乗り換えるの面倒だしなぁ…とかごにょごにょ思っていたのですが… Dreamweaverでも使えるらしいよ！知らなかった！無知って怖い！＞＜ Dreamweaver用はこちらからダウンロードできます。 ダウンロードしたZen Coding.mxpをダブルクリックするとエクステンションマネージャーが立ち上がるので、承諾するをクリックしてインストール。 これだけでOK。 インストールが終わったら、早速何か入力してみましょう。 すごい！感動！ 展開はcontrolキーと,(カンマ)キ
第6回 環境設定を見直そう（2）
前回に引き続き、環境設定について見直します。今回はブラウザプレビューに関して。 ■ ブラウザプレビューとは Dreamweaverではデザインビューを通して、制作しているページをプレビューすることができますが、これはあくまでも補助的な役割にしか過ぎません。 ブラウザはInternet Explorerだけではありませんし、同じブラウザでも複数のバージョンがあり、また、対応OSによってもレンダリング（表示）は異なります。このような複雑な状況を、Dreamweaverのデザインビューで一括管理するのがムリなのは、当然といえば当然といえます。 そこで、Dreamweaverでの制作では、要所要所でブラウザプレビューを行いながら、実際の表示結果を確認しつつ作業を進めます。 メニューバーから行う際には、［ファイル］ → ［ブラウザでプレビュー］ から、または、ドキュメントツールバーで、地球アイコンを
ブログ – H2O space
Webサイトを制作する際、パーツ類に使う色を決める必要があります。色の選択は、ユーザーの印象を大きく左右するため、慎重に行うことが重要です。特におすすめなのが、「ベースカラー」「アクセントカラー」「サブカラー」という3つ […]
[携帯]フォームで使うパーツまとめ │ これからゆっくり考L +α
携帯サイトに限ったことではないですが、フォームページの作成って結構骨が折れるというか心が折れるというか眠くなるというか。 そんなフォームページを簡単にやっつけるべく、コピペでペタペタはっていけるようにまとめてみました。 こんなフォームページがちょちょいのちょいと。 Dreamweaverなどを使っている場合はスニペットに登録しておくとかなり作業効率がアップしますよ？ ただ、Dreamweaverを使わずに秀丸とかでコーディングする時もあるので、そういう時の自分の為に。 メニュー さくっとコピペできるように、html用とxhtml用で分けています。 ・html用のフォームパーツ ・xhtml用のフォームパーツ 数字とか値は適当に入っているので、コピペしたら直してくださいませ。 html用のフォームパーツ ・基本のパーツ ・割とそのまま使えるパーツ ・名前 ・住所 ・生年月日 ・性別 ・同意規
ソースコードを書くときのスタイルシート – creamu
最近ソースコードを書く機会が時々あるので、HTMLとCSSを整備してみました。 実体参照への変換は、今までDreamweaverのデザインビューにペーストして、コードビューで変換されたものを使っていたんだけど、<br />が入っちゃうんですよね。 なのでakiyanの以下のページを使うことにしました。自分で作ろうかな、とも思ったけど、これが便利だからいいかな。 HTML実体参照変換 ソースは以下のようにしました。 HTML <span class="small">ソースコードのキャプション</span> <div class="codex"><pre><code>ソースコードが入ります</code></pre></div> pre { margin:0; padding:0; overflow:auto; white-space:pre-wrap; word-wrap:break-word
Adobe Edge: 2009年7月 CMS導入は誰のため？ 〜CMS百花繚乱時代に、改めて考える〜
Webサイトの制作案件において、クライアントから「今後の運用まで考えて、CMS を導入してほしい」という要望を受けることが多いでしょう。とは言うものの、今や CMS 百花繚乱時代。Movable Type、WordPress、Drupal など、ネット上ではさまざまな CMS が話題となっています。では、どの CMS を選べばいいのでしょうか？ 各 CMS サービスの特徴を調べ、自分のスキルに見合ったものや導入しやすいものを選択することも大切ですが、制作後の先にある視点も取り入れることが大切ではないかと思うのです。本記事では、サイト運用ソリューションの現状を俯瞰しつつ、CMS の導入時に必要となる視点について改めて考えてみたいと思います。 クライアントにDreamweaverを覚えていただくのは、ちょっと... 制作会社が Web サイトを受注して制作する案件では、そのまま運用（日々
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
試してみよう！Dreamweaver CS5.5 Vol.01 試してみよう Dreamweaver CS5.5：スマートフォンサイトの制作に挑戦しよう！ - Adobe HTML5 特設サイト
CSS Nite in Ginza, Vol.49「バシャログ LIVE」 で紹介したDreamweaverの正規表現クエリーを公開します | バシャログ。
iPhone site extension for Dreamweaver CS4/5 | エイチツーオー・スペース[H2O Space.]