タグ別アーカイブ: AH Formatter

AH CSS Formatterで作った本：『CSS Secrets』（Lea Verou）をチェック！

CSSについての解説書はたぶん数えきれないほどありますが、6月に発売された『CSS Secrets』の評判はかなりよさそうです。しかも、この本は弊社のAH CSS Formatterを使っているらしい！

O’ReillyからはPDF版とEPUB版も購入できます。AmazonはKindle版のみです。Kindle版はたぶんあまり読み易くないし、DRMがかかっているので買いたくありません。PDFにしようか、紙版にしようかと迷いましたが、ビジュアルな本は高くてもやはり紙でしょう。早速購入してみました。

書名：『CSS Secrets, Better Solutions to Everyday Web Design Problems』(英語)
著者： Lea Verou
発行所： O’Reilly Media　米国
発行日：2015年6月
ページ数：392

本書のタイトルは、Webデザインで日々発生する問題にどう対処するかについてです。但し、Web全体のデザインをどうしたら良いか、というものではありません。CSS仕様の項目をトピック的にとりあげて、CSS 2.1からCSSレベル3でどのように強化されたのかという観点の説明が主体です。例も、大きなコードではなく簡単なコードとその表示見本を示しています。仕様を作成する立場からの解説本という位置づけになるでしょう。

表紙

本のページは次のような内容です。

内容１

内容２

この本の制作方法について

この本の内容は、O’Reillyが定義するHTML Book標準のHTML5で書かれており、レイアウト、図、カラーなどはHTML+CSSでスタイル付けされているそうです。

本の制作はO’Reillyの提供するAtlasシステムを使っています。O’Reilly AtlasのPDFレンダラーはアンテナハウスのAH CSS Formatterが採用されています。

つまり、上のようなページは印刷用CSSでレイアウトを指定し、弊社のAH CSS FormatterでPDF化しています。

すごいですね！

CSS組版の実際

CSSでレイアウト指定して作られた本はこれが初めてではありません。例えば、アンテナハウスでPDFを制作した『日本語組版処理の要件』という本もCSS Formatterで制作しています。

HTML+CSSで本を作る、ということは技術的にはできているわけです。

残る大きな問題は、こうした手法が、どの位一般的に使えるか、また生産性がどうか、ということでしょう。『CSS Secrets』の著者であるLea Verouさんは、現在、W3CのCSSワーキンググループに招待されてInvited Expertとして仕様の策定作業に参加しているほどの人です。つまりCSSについて恐らく世界でも有数の専門知識をもっている人が、CSS組版レイアウトの限界に挑戦した（著者の言葉）本が『CSS Secrets』です。この著者だからできることで、誰でもすぐに真似できることではありません。

さて、この本の制作についての統計が載っています。

・内容HTMLは10,000行を超える
・レイアウトはSCSSで4,700行、SCSSから生成したCSSは3,800行

※SCSSというプリプロセッサを使って、SCSSの記法で書いたプログラムからCSSを生成している。最近は、Webページもほとんどこのような手法で作るようになっていると言われます。CSSをハンドコードするのはもはや少数派？

1冊の本のために3,800行の印刷用CSS（生成）しているのですが、これにどれだけの時間を労するものなのか？
『CSS Secrets』はTechyな著者によるTechyな挑戦と言えます。著者がかけた時間と熱意に脱帽です。

一方、プロが使う仕事のためのツールは生産性が重要な指標になります。

システムやツールを評価する観点として、InDesignなどのDTP方式と比べて生産性がどの程度かは、実用性を判断する上で大きなポイントです。

ちなみにアンテナハウスでは、Atlasと類似の本を作る仕組みとしてCAS-UBをサービスしています。CAS-UBはテキスト文字組主体の本に限れば、InDesignよりもはるかに高い生産性で本を作ることができます。ビジネス・ツールは生産性を向上できないと意味がないと思います。

投票をお願いいたします

瞬簡PDF 編集 2024
かんたん操作でPDFを自由自在に編集

瞬簡PDF 作成 2024
ドラッグ＆ドロップでPDF作成

CSS を組版に使うときに注意すべきこと（入門編その２）

こんにちは、『AH Formatter』のサポート担当です。
前回、CSS でレイアウトを実現する上で注意すべき点を挙げてみました。[1]
おさらいすると、
・セレクタで対象を決めて、プロパティと値でスタイル付けすること
・セレクタは多重定義できること
・優先順位があること
などです。
優先順位は大雑把に言ってしまえば、
１．Style=””
２．idセレクタ
３．classセレクタ、属性セレクタなど
の順番に低くなります。

詳しい仕様は、
http://www.w3.org/TR/css3-selectors/
に載っています。
日本語の解説サイトもたくさんあります。
私もまだまだ勉強中です。

実際のところ、一番頻繁に使われているのは <div class=”～”> のタイプかと思います。
コンテンツを divタグで囲って classセレクタでレイアウトを指定します。

.hoge{
border-style:solid;
border-color:#fbbdaf;
border-width:10px 10px 10px 10px;
color:#000000;
font-size:90%;
padding:0.1em 0.4em;
}

<div class=”hoge”>
<p>Antenna House</p>
<p>AH Formatter</p>
</div>

出力結果

ネストしたdiv構造で次のようなケースはよくあります。

.default{
background-color: #900;
padding:10pt;
font-size:20pt;
}
.test{
color:red;
border-top-style:dotted;
border-top-width:10pt;
border-top-color:yellow;
}
.test2{
border-style:solid;
border-width:5pt;
}
.test3{
border-bottom-color:blue;
}

<div class=”default”>
<div class=”test test2 test3″>
<p>Antenna House</p>
</div>
</div>

この場合、競合したスタイルは、後から指定されたものが優先になります。
組版結果は次の通り。

出力結果

さらに、前回、同じセレクタに対して何度でも指定することができると書きました。
上記の例で、
.default{
background-color: #00EE40;
}
を追加したらどうなるでしょう。
この場合も後から定義されたものが有効になります。

次に、CSS が外部ファイルに定義されていて、
このふたつの defaultクラスが別々のファイル（”styleA.css” と “styleB.css”）に保存されていたら？

答えは、”styleB.css” の.default{　}が有効になります。
この順番が変わるだけで結果が違ってきてしまいますね。ああ恐ろしい。

実際にサポート業務をしていると、次のようなデータを見ることが多くあります。

<!DOCTYPE html>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=utf-8″/>
<title>Test</title>
<link rel=”stylesheet” type=”text/css” href=”style-A.css” />
<link rel=”stylesheet” type=”text/css” href=”style-B.css” />
.
.
.
<link rel=”stylesheet” type=”text/css” href=”style-X.css” />
<link rel=”stylesheet” type=”text/css” href=”style-Y.css” />
<link rel=”stylesheet” type=”text/css” href=”style-Z.css” />

</head>
<body>
<h1>Test</h1>
<div class=”A B C D”>
<div class=”E F G”>
<div class=”H I J K L M N” id=”sample”>
<div class=”O”>
<p>………</p>
<ol class=”M A Z”>
<li>……</li>
<li>……</li>
<li>……</li>
</ol>
</div>
</div>
</div>
</div>
</body>
</html>

こんな状態でレイアウトを変更しようとなった時に、
どこを変更したらいいかをすぐに判断するのは難しいですね。
CSS はレイアウトを分離して共通化して運用できるのでとても便利ですが、
複数の開発者が共有するような場合には工夫しないと破綻してしまいそうです。
設計段階での明示的なルール決めと共に、
シンプルなオーサリングやレイアウト設定が必要になります。

続きのお話はまたいずれ。

[1] CSS を組版に使うときに注意すべきこと（入門編）

投票をお願いいたします

アウトライナー
PDFを解析してしおり・目次を自動生成

瞬簡PDF 作成 2024
ドラッグ＆ドロップでPDF作成

Windows Server 2003 のサポート終了

過日、2015年7月15日に「Windows Server 2003」のサポートが終了しました。
→ Windows Server 2003 のサポート終了

『AH Formatter』におきましても「Windows Server 2003」を
マイクロソフトのサポート終了にともない動作環境の保証外としております。
「Windows Server 2003」そのものが脆弱性など問題が発見されても
修正プログラムは提供されませんので該当 OS で『AH Formatter』をご利用いただいている場合は、
後継システムへの移行を強くお勧めいたします。

なお、OS の話とは別になりますが、『AH Formatter』の最新版は V6.2 となります。
旧バージョンをご利用いただいている方は、
最新版へのバージョンアップを是非ご検討ください。

評価版は以下のページよりお申し込みいただけます。
→ AH Formatter V6 評価版のお申し込み

投票をお願いいたします

アウトライナー
PDFを解析してしおり・目次を自動生成

瞬簡PDF 編集 2024
かんたん操作でPDFを自由自在に編集

弊社プレゼンテーション資料のご紹介（XML London 2015）

2015年6月6日～7日にロンドンで開催された XML カンファランス（XML London 2015）にて、弊社の Tony Graham は、XSL FO チュートリアルセッションで「XSLT and XSL FO Toolbox of Tips and Tricks」（XSLT と XSL-FO の実践のためのコツとヒント）を発表しました。

その内容は、主に多様な言語で記述されている世界人権宣言（UDHR in Unicode）を用いて、スタイルシートや XSL-FO を開発する流れを説明したものです。『AH Formatter』や『Antenna House リグレッションテストシステム（PDF 高速自動比較ツール）』、『focheck』など弊社製品のみでなく、様様なツールを用いて実践的な解決策を示しています。

資料（PDF）は英語になってしまいますが、よろしければご覧ください。
→ XSLT and XSL FO Toolbox of Tips and Tricks

XML London 2015 の出展レポートは既にブログに掲載しております。あわせてご覧いただければ幸いです。
→ 海外出展レポート XML London 2015 その１、その２

投票をお願いいたします

瞬簡PDF 編集 2024
かんたん操作でPDFを自由自在に編集

瞬簡PDF 統合版 2024
アンテナハウスPDFソフトの統合製品！

AH Formatter の処理速度向上 TIPS

長く『AH Formatter』をご使用くださっているお客様から、バージョンアップ検討の際に『AH Formatter』の処理速度の低下が報告されることがあります。『AH Formatter』は初めてのリリースからこの秋でいよいよ 16年目に突入します。その間、バージョンアップのたびに新機能を追加してまいりました。そのため、以前のバージョンと比較すると、どうしても処理時間が長く掛かるようになってしまいます。

そこで、新バージョンを使用しつつ、処理速度を向上するには、次のような方法がございますので、ご提案いたします。

１．表の幅を指定し、table-layout=”fixed” にする（table-layout=”auto” を使用しない）。

２．「オプション設定ファイル」で欧文ペアカーニングと欧文リガチャの指定を無効にする。
　以下のように設定します。
　pair-kerning=”false”
　latin-ligature=”false”

３．できるだけ 1パスで処理する（「2パス組版」を使用しない）。
　ただし、1パスだとページ番号が確定するまで組版結果をメモリに保持するので、未組版のページのページ番号参照（fo:page-number-citation）がある文書は、メモリが少ない場合、スワップが発生して遅くなる可能性があります。
　その場合は、未組版のページへの参照をできるだけ減らすように、ページ番号参照をなくす必要があります。それができない場合は、スワップの発生するデータに限っては、2パス組版を指定することでメモリの消費を抑えるのがよいでしょう。
　参考：大規模文書の組版（オンラインマニュアル）

投票をお願いいたします

HTML on Word
WebページをWordで作る！

瞬簡PDF 作成 2024
ドラッグ＆ドロップでPDF作成

[AH Formatter] Windows にインストールされていないフォントを使う方法

AH Formatter のあまり知られていない小技をひとつ取り上げたいと思います。

Windows にインストールされていないフォントを使う

AH Formatter Windows 版では、フォントを Windows にインストールしなくても利用することができます。実験的に利用したいフォントや、Windows にインストールしたくないフォントなどを指定しておくことができます。
次のようにします。

例えば、使いたいフォントを C:\MyFonts に用意します。

環境変数 AHF62_FONT_CONFIGFILE または AHF62_64_FONT_CONFIGFILE を確認してください。
そのディレクトリに、次のような内容の font-config.xml というXMLファイルがあります。

<?xml version="1.0" encoding="UTF-8" ?>
<!-- DOCTYPE font-config SYSTEM "font-config.dtd" -->
<font-config
    otf-metrics-mode="typographic"
    name-processing-mode="windows-name">
  <!-- add your font folder here -->
  <font-folder path="C:\Windows\Fonts">
  </font-folder>
</font-config>

このファイルに次のような行を追加してください。

<?xml version="1.0" encoding="UTF-8" ?>
<!-- DOCTYPE font-config SYSTEM "font-config.dtd" -->
<font-config
    otf-metrics-mode="typographic"
    name-processing-mode="windows-name">
  <!-- add your font folder here -->
  <font-folder path="C:\MyFonts">
  <font-folder path="C:\Windows\Fonts">
  </font-folder>
</font-config>

もし、その font-config.xml が編集できないときは、別の場所に作って、環境変数を修正してください。

AH Formatter を再起動すると、C:\MyFonts にあるフォントを利用できるようになります。

投票をお願いいたします

瞬簡PDF 作成 2024
ドラッグ＆ドロップでPDF作成

瞬簡PDF 編集 2024
かんたん操作でPDFを自由自在に編集

海外出展レポート　XML London 2015　その２

Tony Graham はこのカンファランスの XSL FO チュートリアルセッションで XSLT と XSL-FO の実践のためのコツとヒントについての発表も行いました。

およそ 400言語に翻訳されている世界人権宣言（UDHR）の様々な言語のユニコードテキストを用いて、FO を作成するサンプルなどを紹介しています。

発表資料はこちらからダウンロード可能です。
https://www.antenna.co.jp/AHF/ahf_jirei/pdf/2015/tips-and-tricks.pdf

トニーグラハムの経歴
Tony Graham は1991年よりマークアップに関わり、1996年からは XML に、そして1998年からはXSLT/XSL-FO に従事している。現在 W3C の Print and Page Layout Community Group の議長を務めている。以前は W3C の XSL-FO 仕様を策定する XML Print and Page Layout Working Group (XPPL) の招待エキスパートであり、また同時に XSLT のエキスパートであり、stf スキマトロンテスティングフレームワークの開発者であり、Antenna House focheck XSL-FO 検証ツールの開発者であり、XSpec および Juxy XSLT テストフレームワークのコミッターであり、「Unicode: A Primer」の著者である。
Tony の XML と SGML のキャリアは日本、USA、イギリス、アイルランドで培われ、また扱った言語は英語、中国語、日本語、韓国語で、教育界、自動車産業、出版、ソフトウェア、通信機器業界など様々な分野に関わっている。
2014年11月より、アンテナハウス(株)にシニア・アーキテクトとして勤務。 AH Formatter、クラウドオーサリングサービス、その他関連製品に携わり、XSL-FO, XSLTのコンサルティングサービスを担当している。

US 営業グループ
アンテナハウス海外サイト
http://www.antennahouse.com/
http://rainbowpdf.com/

投票をお願いいたします

瞬簡PDF 作成 2024
ドラッグ＆ドロップでPDF作成

HTML on Word
WebページをWordで作る！

海外出展レポート　XML London 2015　その１

6月6-7日、ロンドンで XMLカンファランス (http://xmllondon.com/) が開催されました。弊社からは、アイルランド在住のTony Graham がプレゼンを行いました。

“RELAX NG（リラクシング）” と “Schematron（スキマトロン）” を組み合わせて XSL-FO のマークアップの妥当性をチェックする方法について、述べました。
RELAX NG は、構造的な検証を処理し、Schematron は RELAX NG では表現できない制約条件を処理します。

この機能は oXygen XML エデイタのアドオンとして、Schematron と RELAX NG を使って XSL-FO の詳細な検証を行う” focheck “として開発されました。focheck （オープンソース）は、GitHub よりご利用可能です。Oxygen の追加のアドオンフレームワークとしてインストールすることが可能です。もちろん、oXygen とは独立して focheck の RELAX NG と Schematron を使用することも可能です。

focheck – Validate XSL-FO and Antenna House extensions in oXygen or standalone
→ https://github.com/AntennaHouse/focheck

AH Formatter は、組版結果をより精度の高いものに仕上げるため、XSL 1.1標準の他に弊社独自の拡張機能を実装しています。この拡張機能の妥当性も RELAX NG と Schematron の組み合わせにより、チェックすることが可能となっています。

アドオンフレームワークの使用方法について、日本語のリードミーもご用意しました。是非お試しください。

明日はXML London で Tony Graham が行ったもう一つのプレゼンについてお伝えします。

US 営業グループ
アンテナハウス海外サイト
http://www.antennahouse.com/
http://rainbowpdf.com/

投票をお願いいたします

HTML on Word
WebページをWordで作る！

瞬簡PDF 統合版 2024
アンテナハウスPDFソフトの統合製品！

『第 19 回　国際電子出版 EXPO（eBooks）』出展のご案内

7月1日から国際電子出版EXPOが始まります。
ついこの間、Page2015を終えたばかりと思ってしまうのは、年寄りの証拠でしょうか…。

さて、今年の展示会は（も）、書籍編集・制作WebサービスCAS-UBと、そのバックグラウンドで機能するアンテナハウスの主力製品AH Formatterをメインに、PDFビューアやその他製品等を展示・紹介します。

メインは御馴染みですが、他にデモが可能なのは、Antenna House リグレッションテストシステム（PDF 高速自動比較ツール）です。地味に需要のある製品です。ご興味を持たれましたら、ぜひ弊社アンテナハウスブース（西ホール8-1）までお越しください！

今年はなんと、土曜日まで開催しています。
（毎年水曜日～金曜日までだった）
平日都合が付かない方、隣接するブックフェアのついでに覗ける方など土曜日を使ってご覧になってはいかがでしょうか。

投票をお願いいたします

瞬簡PDF 書けまっせ 2024
PDFに文字が書ける！入力欄を自動認識

瞬簡PDF 変換 2024
PDFをOffice文書へ高精度変換

CSS を組版に使うときに注意すべきこと（入門編）

こんにちは、『AH Formatter』のサポート担当です。
今回はCSSのお話です。
CSS3ではページの概念が追加され、html+cssでもPDF化や印刷時に見栄えのいい結果が得られるようになりました。
『AH Formatter』でCSSを組版されるお客様も徐々に増えてきました。

CSSはパッと見、とても簡単そうです。
書き方はこんな感じです。

セレクタ｛
　プロパティ：値；
　プロパティ：値；
｝

セレクタでスタイル付けしたい対象を指定します。
対象を決めて、どんなスタイルにしたいかをプロパティ名と値のセットで指定します。基本はこれだけ。
例えば、

p {
　font-size:10pt;
　color:red;
　}

のようにするだけです。
セレクタというのは、このようにタグを直接指定して使う要素型セレクタもありますが、
他にも様々な種類があります。
classセレクタ、idセレクタ、擬似要素セレクタ、属性セレクタなどです。
一般的にはclassを使うことが多いですが、複合して使うこともできます。
仕組みとしてはとても単純ですが、管理していくことが非常に難しい。
そして、何か問題があったときに原因箇所を探るのがこれまたもっと難しい。
何故かと言えば、

・スタイルの定義を複合的に指定できること
・同じセレクタで何度でも多重に定義できること
・スタイルには子要素まで継承されるものがあること
・スタイルには優先順位があること

などが理由です。

例えば、

<p id=”abc” class=”aaa bbb ccc”>Antenna House</p>

/* CSS */
/* 要素型セレクタ */
p {
color:red;
}

/* idセレクタ（p要素のみ） */
p#abc {
color:blue;
}

/* idセレクタ（要素特定なし） */
#abc {
color:green;
}

/* classセレクタ（p要素のみ） */
p.aaa {
color:yellow;
}

/* classセレクタ（要素特定なし） */
.bbb {
color:pink;
}

/* 全称セレクタ */
* {
color:black;
}

/* classセレクタ */
.bbb {
color:white;
}

こーんな感じでCSSは定義できます。
さて、ここで問題です。この場合何色で表示されるでしょう～か？

正解は、青（blue）です。
上記の場合、要素を特定したidセレクタが優先されます。
この優先度のルールを把握するだけでも大変です。
（さらに最優先される “!important” なんて厄介な奴がおります。）

このCSSで
“bbb”のクラスが2回定義されていること、気がつきましたか？
そう、”同じセレクタで何度でも”です。いいんです、CSSでは。
前の定義を残しつつ、ちょっと追加してレイアウト変更しよう、なんてことも可能ですが、
こうしてるうちにCSSはどんどん膨大なものになっていきます。

それから、この例ではid名やclass名に”abc”や”aaa”なんて適当に書いてますが、
名前付けルールも「自由」です。
なんでもいいんです。これってとても怖いことです。
こんな風に適当に付けてたらそのうち破綻するの、目に見えてますよね。
名前にしろ、多重定義にしろ、自由すぎるにも程があります。

だから、ちゃんとルールを決めてやりましょう、っていう方法論が
たくさん考えられています。
裏を返せば、それだけ皆さん破綻しないために苦労されているってことですね。

複雑化したCSSはトラブルの元、です。
開発もメンテナンスも（そしてサポートも）XSL-FOの数倍の時間を必要とします。
『AH Formatter』では、CSSの組版はシンプルな構造、シンプルなレイアウトをお勧めします。
マニュアルなどの複雑なレイアウトにはXSL-FOでの組版が向いています。

続きのお話はこちらです：CSS を組版に使うときに注意すべきこと（入門編その２）

投票をお願いいたします

HTML on Word
WebページをWordで作る！

瞬簡PDF 変換 2024
PDFをOffice文書へ高精度変換

Pages: Prev 1 2 3 ... 13 14 15 16 17 18 19 20 21 22 23 Next

I love software2!

ソフトウェアに愛を込めて by アンテナハウス株式会社

タグ別アーカイブ: AH Formatter

AH CSS Formatterで作った本：『CSS Secrets』（Lea Verou）をチェック！

表紙

内容１

内容２

この本の制作方法について

CSS組版の実際

CSS を組版に使うときに注意すべきこと（入門編その２）

Windows Server 2003 のサポート終了

弊社プレゼンテーション資料のご紹介（XML London 2015）

AH Formatter の処理速度向上 TIPS

[AH Formatter] Windows にインストールされていないフォントを使う方法

海外出展レポート　XML London 2015　その２

海外出展レポート　XML London 2015　その１

『第 19 回　国際電子出版 EXPO（eBooks）』出展のご案内

CSS を組版に使うときに注意すべきこと（入門編）

2026年9月
月	火	水	木	金	土	日
« 8月
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30