SlideShare a Scribd company logo
1 of 120
The Ebook Developer's Toolbox
Sanders Kleinfeld
O’Reilly Media, Inc.
Twitter: @sandersk
ebookcraft 2016
An Inconvenient
Truth…
Ebooks are made of
CODE!!!
Technologies of the
Trade:
(X)HTML CSS JS
XSLT
regexRDF NCX
ONIX
MOBI EPUB
PDF
MathML SVG XPath
OPFOTF
WOFF LATE
X
WTF?!
Tools/Techniques of
the Trade:
InDesign Media QueriesKindlegen
oXygen
MathML Cloud
“View
Source”
CSSLint
Readium
jQuery Sass
Acrobat
Kindle
Previewer
iBooks Author
epubcheck
ADE
FontForge FileFormat.info
BISG EPUB
3 Support
Grid
“What’s in my
Toolbox?”
Three Indispensable Tools
for my Workflow
1.XSLT
2.Responsive Ebook Design Techniques
3.Equation Processing with MathML Cloud
XSLT 101
Pop Quiz #1: XSLT is…
A: An acronym for “Extensible
Stylesheet Language Transformations”
B: A programming language
written in XML syntax
C: An official W3C Specification
D: All of the above
Pop Quiz #1: XSLT is…
A: An acronym for “Extensible
Stylesheet Language Transformations”
B: A programming language
written in XML syntax
C: An official W3C Specification
D: All of the above
(http://www.w3.org/TR/xs
XSLT is a tool for global,
programmatic markup
manipulation
<body>
<div class="section">
<p><b>Chapter 1</b></p>
HTML5 is really great,
because there are lots of new
elements to facilitate
meaningful
tagging of content.
<br/><br/>
Also, they deprecated a lot
of yucky <font
color="green">non-semantic
stuff.</font>
</div>
</body>
<body>
<section>
<h1>Chapter 1<h1>
<p>HTML5 is really great,
because there are lots of new
elements to facilitate
meaningful tagging of
content.</p>
<p>Also, they deprecated a
lot of yucky <span
style="color: green;">non-
semantic stuff.</span></p>
</section>
</body>
XSLT
? ?
Rhetorical Question #1:
“Um, can’t I just use
regular expressions
for this?”
Example:
Converting <b> to <em> with
regex
your_markup.replace(/<b>/, '<em>')
But what about:
•Closing tags (</b>)
•Attributes (<b class="term">)
•Extra Whitespace (<b >)
your_markup.replace(/<(/)?b(s*[^>]*)>/g, '<$1em$2>')
A Stack Overflow Classic:
“You can’t parse [X]HTML with regex”
(http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags)
XSLT leverages a
functional* paradigm
* Many folks have salient objections to calling XSLT a functional programming
language (e.g., http://www.snoyman.com/blog/2012/04/xslt-rant.html), but
document processing with XSLT still embodies the spirit of functional programming,
and it feels pedantic to me to deny that.
<markup>
<!--Input-->
</markup>
Functional Paradigm
in XSLT
<markup>
<!--Output-->
</markup>
<xsl:stylesheet>
<xsl:template match="...">
<!—Stuff happens here-->
</xsl:template>
<xsl:template match="...">
<!—Stuff happens here-->
</xsl:template>
</xsl:stylesheet>
f(x) = 1 * x
Identity Function*
in Algebra
* Output of function is identical to input
Identity Stylesheet*
in XSLT
* Output of stylesheet is identical to input
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl:template match="@*|node()">
<xsl:copy>
<xsl:apply-templates select="@*|node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
Rhetorical Question #2:
“Say What?”
Identity Stylesheet
in XSLT: Explained
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl:template match="@*|node()">
<xsl:copy>
<xsl:apply-templates select="@*|node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
BEGIN
stylesheet
END
stylesheet
BEGIN matching
function
Match any node (element,
attribute, text)
BEGIN copy matched node
(OPEN elem)
END Copy matched node
(CLOSE elem)
Select any
node
END matching
function
Run stylesheet against specified children of
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p>
</p>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p>
</p>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p>
</p>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p class="greet">
</p>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p class="greet">
</p>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p class="greet">
</p>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p class="greet">
Hello World
</p>
</body>
Identity Stylesheet in XSLT: How it Works
<xsl:stylesheet
xmlns:xsl="http://www
.w3.org/1999/XSL/Tran
sform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<p class="greet">
Hello World
</p>
</body>
Rhetorical Question #5:
“OK, so how do you
actually transform
the output”
You can override the identity templates with
other, more specific matching templates (just as
you override rules with other rules in CSS)
CSS XSLT
* {
font-size: 10px;
}
h1 {
/* Custom Handling */
font-size: 20px;
}
<xsl:template match="@*|
node()">
<xsl:copy>
<xsl:apply-templates
select="@*|node()"/>
</xsl:copy>
</xsl:template>
<xsl:template match="h1">
<xsl:copy>
<!--Custom handling-->
<xsl:apply-templates/>
</xsl:copy>
</xsl:template>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl:template match="@*|node()">
<xsl:copy>
<xsl:apply-templates select="@*|node()"/>
</xsl:copy>
</xsl:template>
<xsl:template match="p[@class='greet']">
<h1>
<xsl:apply-templates select="@*|node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
XPath matching all p elements with a clas
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1>
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1>
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1>
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
<p></p>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
<p></p>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
<p></p>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
<p>What’s up?</p>
</body>
Our first transform: Convert all
<p class="greet"> elements to <h1>s
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match=“p[@class=‘greet’]
”>
<h1>
<xsl:apply-
templates select=“@*|
node()"/>
</h1>
</xsl:template>
</xsl:stylesheet>
<body>
<p class="greet">
Hello World
</p>
<p>What’s up?</p>
</body>
Stylesheet Input XHTML Output XHTML
<body>
<h1 class="greet">
Hello World
</h1>
<p>What’s up?</p>
</body>
Pop Quiz #2: What does this transform do?
XSLT INPUT XHTML
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/
XSL/Transform" version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-templates
select="@*|node()"/>
</xsl:copy>
</xsl:template>
<xsl:template match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong> is
awesome!</p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p></p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p></p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p></p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p>Learning</p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p>Learning</p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p>Learning</p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p>Learning</p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p>Learning is
awesome!</p>
Pop Quiz #2 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3
.org/1999/XSL/Transform"
version="1.0">
<xsl:template
match="@*|node()">
<xsl:copy>
<xsl:apply-
templates select="@*|
node()"/>
</xsl:copy>
</xsl:template>
<xsl:template
match="strong"/>
</xsl:stylesheet>
<p>Learning
<strong>XSLT</strong>
is awesome!</p>
Stylesheet Input XHTML Output XHTML
<p>Learning is
awesome!</p>
Pop Quiz #3: Write XSLT that drops
<strong> tags from the HTML below, but
preserves the text content inside the tags
INPUT XHTML
<p>Learning
<strong>XSLT</strong> is
awesome!</p>
DESIRED OUTPUT XHTML
<p>Learning XSLT is
awesome!</p>
Pop Quiz #3 Solution
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl:template match="@*|node()">
<xsl:copy>
<xsl:apply-templates select="@*|node()"/>
</xsl:copy>
</xsl:template>
<xsl:template match="strong">
<xsl:apply-templates/>
</xsl:template>
</xsl:stylesheet>
BEGIN match “strong”
element
Select child nodes (except
attributes) of matched
“strong” element
End match “strong”
element
Intermediate Topics
•XPath expressions
•Conditionals
(xsl:if, xsl:choose/xsl:when/xsl:otherwise)
•Looping/Grouping
(xsl:for-each, xsl:for-each-group)
•Numbering/Labeling
(xsl:number)
•Includes/Imports
(xsl:include/xsl:import)
My Favorite XSLT Reference Book
Responsive Ebook
Design
What do we mean by
responsive design?
“Rather than tailoring disconnected designs to
each of an ever-increasing number of web
devices, we can treat them as facets of the
same experience. We can design for an
optimal viewing experience, but embed
standards-based technologies into our designs
to make them not only more flexible, but more
adaptive to the media that renders them.”
— Ethan Marcotte
“Responsive Web Design”
http://alistapart.com/article/responsive-web-design
Responsive Ebook Design:
Four Principles
1. Content is split into pages
(Safari for Mac) (iBooks for Mac)
2. Content reflows from page to page
(iBooks for iPhone) (iBooks for iPad)
3. Content settings are user-configurable
User #1’s settings User #2’s settings
4. Single ebook archive for all platforms
(iBooks) (NOOK)
(Google Play)
(Kobo) (Kindle)*
(Universal
Ebook)
* Either converted to MOBI via KindleGen, or submitted to Amazon for conversio
Responsive Ebook Design
Toolbox:
CSS Media Queries
Media Queries encapsulate CSS rules to
be applied only when certain display
conditions are satisfied, such as:
•Screen dimensions fall within a given
width/height range
•Screen is monochrome or color
•Screen orientation is portrait or
landscape
Media Query Syntax*
@media media-type and (media-feature)
{
/* CSS Rules to be applied */
}
al media type, followed by zero or more media featu
Some Key W3C-Specified
Media Types:
•all - applied on any device
•print - applied to output for printers
•speech - applied on screen readers
•screen - applied to any display that is
not print or speech, which encompasses
most Web browsers and readers
Kindle’s Custom Media Types*:
•amzn-kf8 - applied on any Kindle device
or app that supports Amazon’s
Kindle Format 8 specification
•amzn-mobi - applied to Kindle devices or
apps that support only the legacy MOBI 7
format.
* See Chapter 8 of Kindle Publisher Guidelines
Example #1:
Kindle’s Recommended Media
Queries for table handling*
@media amzn-mobi {
table.complex {
/* Suppress display of complex tables on MOBI and use fallback image instead */
display: none;
}
}
@media amzn-kf8 {
img.table_fallback {
/* Suppress display of table fallback images on KF8, which can support complex tables */
display: none;
}
}
* See Chapter 8 of Kindle Publisher Guidelines
Some Key W3C-Specified
Media Features:
•(min-|max-)width - query the width of the current display window.
•(min-|max-)device-width* - query the screen width of the device
•(min-|max-)height - query the height of the current display window
•(min-|max-)device-height* - query the screen height of the device
•orientation - query whether orientation is currently portrait or
landscape
•color - query whether the display is color
•monochrome - query whether the display is monochrome
* Deprecated in Media Queries Level 4
Example #2:
Media Query for iBooks for iPad
@media (min-device-width:768px)
and (max-device-width:1024px) {
#usernote::before {
content: “You are reading this on
iBooks for iPad";
}
}
iBooks Ereader Detector
https://github.com/sandersk/ibooks_ereader_detector
Example #3:
Media query to target both
iBooks + KF8-enabled Kindle*
@media not amzn-mobi {
/* Styling for everything that _is not_
a MOBI 7 platform */
}
Queries for formatting Poetry on Kindle and EPUB”
Responsive Ebook Design
Toolbox:
CSS Fragmentation
Some Key W3C-Specified
Fragmentation Properties:*
•page-break-before - configure page
breaking rules before specified element(s)
•page-break-after - configure page
breaking rules after specified element(s)
•page-break-inside - configure page
breaking rules within specified element(s)
nger mandates “page-” prefix on these properties, but it’s a good id
page-break- properties accept the
following values
•auto - Defer to browser/ereader on
pagebreak here (default)
•avoid - Avoid pagebreak here
•always - Always pagebreak here
•left - Add one or two pagebreaks to
make next page a left page
•right - Add one or two pagebreaks to
make next page a right page
•inherit - Inherit pagebreak rules from
parent element*
* “page-break” rules are not inherited by default
Example #1:
Force pagebreaks before top-level
headings
h1 { page-break-before: always }
Example #2:
Avoid pagebreaks within figures
figure { page-break-inside: avoid }
Some More Key W3C-Specified
Fragmentation Properties:*
•orphans - specify minimum number of
lines within an element that must be
preserved before a page boundary (at
bottom of page)
•widows - specify minimum number of
lines within an element that must be
preserved after a page boundary (at top of
page)
* Default value is 2 for both properties
Example #3:
Require three paragraph lines to
“stay together” at both the
bottom and top of pages
p {
orphans: 3
widows: 3
}
For more, read my
article
“Responsive Ebook D
Accessible Math
with MathML Cloud
(MathJax)
The Publisher’s Challenge:
How to produce high-quality,
accessible mathematical content
across ereader platforms
Option #1:
Embedded MathML
(http://www.w3.org/Math/)
MathML in EPUB (iBooks)
MathML in EPUB (NOOK)
MathML in Mobi (Kindle Fire)
Option #2:
SVG
(http://www.w3.org/TR/SVG)
SVG in EPUB (iBooks)
SVG in Mobi (Kindle Voyage)
SVG in Mobi (Kindle “classic”)
The only reliable,
universal choice is
bitmap images
But how can we
automate creation of
equation images…
…And what about
accessibility?
MathML Cloud provides a solution
for automation and accessibility
http://mathmlcloud.org
MathML Cloud API
http://benetech.github.io/mmlc-api/
MathML Cloud is open source,
built on mathjax-node
https://github.com/benetech/mmlc-api/
“What’s in YOUR
Toolbox?”
Thank You!
? ?☺
Contact Me:
@sandersk

More Related Content

What's hot (20)

Xml
XmlXml
Xml
 
HTML5 Is the Future of Book Authorship
HTML5 Is the Future of Book AuthorshipHTML5 Is the Future of Book Authorship
HTML5 Is the Future of Book Authorship
 
HTML/CSS Lecture 1
HTML/CSS Lecture 1HTML/CSS Lecture 1
HTML/CSS Lecture 1
 
109 sem 1_-_kasdorf
109 sem 1_-_kasdorf109 sem 1_-_kasdorf
109 sem 1_-_kasdorf
 
Dos and donts
Dos and dontsDos and donts
Dos and donts
 
Html,javascript & css
Html,javascript & cssHtml,javascript & css
Html,javascript & css
 
Css presentation lecture 1
Css presentation lecture 1Css presentation lecture 1
Css presentation lecture 1
 
What is HTML - An Introduction to HTML (Hypertext Markup Language)
What is HTML - An Introduction to HTML (Hypertext Markup Language)What is HTML - An Introduction to HTML (Hypertext Markup Language)
What is HTML - An Introduction to HTML (Hypertext Markup Language)
 
Html css workshop, lesson 0, how browsers work
Html css workshop, lesson 0, how browsers workHtml css workshop, lesson 0, how browsers work
Html css workshop, lesson 0, how browsers work
 
Painless OO XML with XML::Pastor
Painless OO XML with XML::PastorPainless OO XML with XML::Pastor
Painless OO XML with XML::Pastor
 
WEB DEVELOPMENT
WEB DEVELOPMENTWEB DEVELOPMENT
WEB DEVELOPMENT
 
Khoa dang (kay)
Khoa dang (kay)Khoa dang (kay)
Khoa dang (kay)
 
HTML Lecture Part 1 of 2
HTML Lecture Part 1 of 2HTML Lecture Part 1 of 2
HTML Lecture Part 1 of 2
 
HTML CSS & Javascript
HTML CSS & JavascriptHTML CSS & Javascript
HTML CSS & Javascript
 
HTML5
HTML5 HTML5
HTML5
 
AJAX Workshop Notes
AJAX Workshop NotesAJAX Workshop Notes
AJAX Workshop Notes
 
Oreilly
OreillyOreilly
Oreilly
 
Avoiding Pitfalls with Internationalization & Localization
Avoiding Pitfalls with Internationalization & LocalizationAvoiding Pitfalls with Internationalization & Localization
Avoiding Pitfalls with Internationalization & Localization
 
DIWE - Coding HTML for Basic Web Designing
DIWE - Coding HTML for Basic Web DesigningDIWE - Coding HTML for Basic Web Designing
DIWE - Coding HTML for Basic Web Designing
 
Introduction to WEB HTML, CSS
Introduction to WEB HTML, CSSIntroduction to WEB HTML, CSS
Introduction to WEB HTML, CSS
 

Viewers also liked

Closer to Metal - ebookcraft 2016 - Greg Albers
Closer to Metal - ebookcraft 2016 - Greg AlbersCloser to Metal - ebookcraft 2016 - Greg Albers
Closer to Metal - ebookcraft 2016 - Greg AlbersBookNet Canada
 
Javascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick Ruffilo
Javascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick RuffiloJavascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick Ruffilo
Javascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick RuffiloBookNet Canada
 
Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...
Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...
Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...BookNet Canada
 
Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017
Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017
Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017BookNet Canada
 
The Success of a Book: Building pre-pub discoverability & buzz
The Success of a Book: Building pre-pub discoverability & buzzThe Success of a Book: Building pre-pub discoverability & buzz
The Success of a Book: Building pre-pub discoverability & buzzBookNet Canada
 
Understanding Your Metadata’s Journey
Understanding Your Metadata’s JourneyUnderstanding Your Metadata’s Journey
Understanding Your Metadata’s JourneyBookNet Canada
 
Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017
Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017
Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017BookNet Canada
 
Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...
Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...
Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...BookNet Canada
 
On Again; Off Again - Benjamin Young - ebookcraft 2017
On Again; Off Again - Benjamin Young - ebookcraft 2017On Again; Off Again - Benjamin Young - ebookcraft 2017
On Again; Off Again - Benjamin Young - ebookcraft 2017BookNet Canada
 

Viewers also liked (9)

Closer to Metal - ebookcraft 2016 - Greg Albers
Closer to Metal - ebookcraft 2016 - Greg AlbersCloser to Metal - ebookcraft 2016 - Greg Albers
Closer to Metal - ebookcraft 2016 - Greg Albers
 
Javascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick Ruffilo
Javascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick RuffiloJavascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick Ruffilo
Javascript: Bringing Ebooks to Life - ebookcraft 2016 - Nick Ruffilo
 
Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...
Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...
Everything You Wanted to Ask a Retailer About Pricing But Your Legal Departme...
 
Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017
Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017
Audiobooks and the Sound of Sales - Noah Genner - Tech Forum 2017
 
The Success of a Book: Building pre-pub discoverability & buzz
The Success of a Book: Building pre-pub discoverability & buzzThe Success of a Book: Building pre-pub discoverability & buzz
The Success of a Book: Building pre-pub discoverability & buzz
 
Understanding Your Metadata’s Journey
Understanding Your Metadata’s JourneyUnderstanding Your Metadata’s Journey
Understanding Your Metadata’s Journey
 
Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017
Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017
Beyond Good & Evil: The nuts and bolts of DRM - Dave Cramer - ebookcraft 2017
 
Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...
Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...
Creating a Roadmap for Accessibility - Amanda Karby, Kristin Waites - ebookcr...
 
On Again; Off Again - Benjamin Young - ebookcraft 2017
On Again; Off Again - Benjamin Young - ebookcraft 2017On Again; Off Again - Benjamin Young - ebookcraft 2017
On Again; Off Again - Benjamin Young - ebookcraft 2017
 

Similar to The Ebook Developer's Toolbox - ebookcraft 2016 - Sanders Kleinfeld

Transforming xml with XSLT
Transforming  xml with XSLTTransforming  xml with XSLT
Transforming xml with XSLTMalintha Adikari
 
IWMW 2001: XML and XSLT
IWMW 2001: XML and XSLT IWMW 2001: XML and XSLT
IWMW 2001: XML and XSLT IWMW
 
Service Oriented Architecture - Unit II
Service Oriented Architecture - Unit IIService Oriented Architecture - Unit II
Service Oriented Architecture - Unit IIRoselin Mary S
 
Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...
Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...
Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...Allison Jai O'Dell
 
2001: Bridging the Gap between RSS and Java Old School Style
2001: Bridging the Gap between RSS and Java Old School Style2001: Bridging the Gap between RSS and Java Old School Style
2001: Bridging the Gap between RSS and Java Old School StyleRussell Castagnaro
 
Intro to xsl templates
Intro to xsl templatesIntro to xsl templates
Intro to xsl templatesWill Trillich
 
Inroduction to XSLT with PHP4
Inroduction to XSLT with PHP4Inroduction to XSLT with PHP4
Inroduction to XSLT with PHP4Stephan Schmidt
 
Rancangan Jaringan Komputer
Rancangan Jaringan KomputerRancangan Jaringan Komputer
Rancangan Jaringan KomputerCandra Adi Putra
 
5 xsl (formatting xml documents)
5   xsl (formatting xml documents)5   xsl (formatting xml documents)
5 xsl (formatting xml documents)gauravashq
 
Introduction of xml and xslt
Introduction of xml and xsltIntroduction of xml and xslt
Introduction of xml and xsltTUSHAR VARSHNEY
 

Similar to The Ebook Developer's Toolbox - ebookcraft 2016 - Sanders Kleinfeld (20)

Transforming xml with XSLT
Transforming  xml with XSLTTransforming  xml with XSLT
Transforming xml with XSLT
 
IWMW 2001: XML and XSLT
IWMW 2001: XML and XSLT IWMW 2001: XML and XSLT
IWMW 2001: XML and XSLT
 
XML XSLT
XML XSLTXML XSLT
XML XSLT
 
Service Oriented Architecture - Unit II
Service Oriented Architecture - Unit IIService Oriented Architecture - Unit II
Service Oriented Architecture - Unit II
 
Xslt
XsltXslt
Xslt
 
Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...
Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...
Notes from the Library Juice Academy courses on XPath, XSLT, and XQuery: Univ...
 
2001: Bridging the Gap between RSS and Java Old School Style
2001: Bridging the Gap between RSS and Java Old School Style2001: Bridging the Gap between RSS and Java Old School Style
2001: Bridging the Gap between RSS and Java Old School Style
 
Intro to xsl templates
Intro to xsl templatesIntro to xsl templates
Intro to xsl templates
 
Inroduction to XSLT with PHP4
Inroduction to XSLT with PHP4Inroduction to XSLT with PHP4
Inroduction to XSLT with PHP4
 
xhtml_basics
xhtml_basicsxhtml_basics
xhtml_basics
 
Xhtml Basics
Xhtml BasicsXhtml Basics
Xhtml Basics
 
xhtml_basics
xhtml_basicsxhtml_basics
xhtml_basics
 
Xhtml Basics
Xhtml BasicsXhtml Basics
Xhtml Basics
 
Rancangan Jaringan Komputer
Rancangan Jaringan KomputerRancangan Jaringan Komputer
Rancangan Jaringan Komputer
 
treeview
treeviewtreeview
treeview
 
treeview
treeviewtreeview
treeview
 
Xslt
XsltXslt
Xslt
 
Xslt
XsltXslt
Xslt
 
5 xsl (formatting xml documents)
5   xsl (formatting xml documents)5   xsl (formatting xml documents)
5 xsl (formatting xml documents)
 
Introduction of xml and xslt
Introduction of xml and xsltIntroduction of xml and xslt
Introduction of xml and xslt
 

More from BookNet Canada

Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024BookNet Canada
 
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024BookNet Canada
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...BookNet Canada
 
Transcript: Green paths: Learning from publishers’ sustainability journeys - ...
Transcript: Green paths: Learning from publishers’ sustainability journeys - ...Transcript: Green paths: Learning from publishers’ sustainability journeys - ...
Transcript: Green paths: Learning from publishers’ sustainability journeys - ...BookNet Canada
 
Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024
Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024
Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024BookNet Canada
 
Transcript: Book industry state of the nation 2024 - Tech Forum 2024
Transcript: Book industry state of the nation 2024 - Tech Forum 2024Transcript: Book industry state of the nation 2024 - Tech Forum 2024
Transcript: Book industry state of the nation 2024 - Tech Forum 2024BookNet Canada
 
Book industry state of the nation 2024 - Tech Forum 2024
Book industry state of the nation 2024 - Tech Forum 2024Book industry state of the nation 2024 - Tech Forum 2024
Book industry state of the nation 2024 - Tech Forum 2024BookNet Canada
 
Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024
Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024
Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024BookNet Canada
 
Transcript: Trending now: Book subjects on the move in the Canadian market - ...
Transcript: Trending now: Book subjects on the move in the Canadian market - ...Transcript: Trending now: Book subjects on the move in the Canadian market - ...
Transcript: Trending now: Book subjects on the move in the Canadian market - ...BookNet Canada
 
Transcript: New stores, new views: Booksellers adapting engaging and thriving...
Transcript: New stores, new views: Booksellers adapting engaging and thriving...Transcript: New stores, new views: Booksellers adapting engaging and thriving...
Transcript: New stores, new views: Booksellers adapting engaging and thriving...BookNet Canada
 
Show and tell: What’s in your tech stack? - Tech Forum 2023
Show and tell: What’s in your tech stack? - Tech Forum 2023Show and tell: What’s in your tech stack? - Tech Forum 2023
Show and tell: What’s in your tech stack? - Tech Forum 2023BookNet Canada
 
Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023
Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023
Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023BookNet Canada
 
Transcript: Redefining the book supply chain: A glimpse into the future - Tec...
Transcript: Redefining the book supply chain: A glimpse into the future - Tec...Transcript: Redefining the book supply chain: A glimpse into the future - Tec...
Transcript: Redefining the book supply chain: A glimpse into the future - Tec...BookNet Canada
 
Redefining the book supply chain: A glimpse into the future - Tech Forum 2023
Redefining the book supply chain: A glimpse into the future - Tech Forum 2023Redefining the book supply chain: A glimpse into the future - Tech Forum 2023
Redefining the book supply chain: A glimpse into the future - Tech Forum 2023BookNet Canada
 

More from BookNet Canada (20)

Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
#StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
 
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
 
Transcript: Green paths: Learning from publishers’ sustainability journeys - ...
Transcript: Green paths: Learning from publishers’ sustainability journeys - ...Transcript: Green paths: Learning from publishers’ sustainability journeys - ...
Transcript: Green paths: Learning from publishers’ sustainability journeys - ...
 
Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024
Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024
Green paths: Learning from publishers’ sustainability journeys - Tech Forum 2024
 
Transcript: Book industry state of the nation 2024 - Tech Forum 2024
Transcript: Book industry state of the nation 2024 - Tech Forum 2024Transcript: Book industry state of the nation 2024 - Tech Forum 2024
Transcript: Book industry state of the nation 2024 - Tech Forum 2024
 
Book industry state of the nation 2024 - Tech Forum 2024
Book industry state of the nation 2024 - Tech Forum 2024Book industry state of the nation 2024 - Tech Forum 2024
Book industry state of the nation 2024 - Tech Forum 2024
 
Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024
Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024
Trending now: Book subjects on the move in the Canadian market - Tech Forum 2024
 
Transcript: Trending now: Book subjects on the move in the Canadian market - ...
Transcript: Trending now: Book subjects on the move in the Canadian market - ...Transcript: Trending now: Book subjects on the move in the Canadian market - ...
Transcript: Trending now: Book subjects on the move in the Canadian market - ...
 
Transcript: New stores, new views: Booksellers adapting engaging and thriving...
Transcript: New stores, new views: Booksellers adapting engaging and thriving...Transcript: New stores, new views: Booksellers adapting engaging and thriving...
Transcript: New stores, new views: Booksellers adapting engaging and thriving...
 
Show and tell: What’s in your tech stack? - Tech Forum 2023
Show and tell: What’s in your tech stack? - Tech Forum 2023Show and tell: What’s in your tech stack? - Tech Forum 2023
Show and tell: What’s in your tech stack? - Tech Forum 2023
 
Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023
Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023
Transcript: Show and tell: What’s in your tech stack? - Tech Forum 2023
 
Transcript: Redefining the book supply chain: A glimpse into the future - Tec...
Transcript: Redefining the book supply chain: A glimpse into the future - Tec...Transcript: Redefining the book supply chain: A glimpse into the future - Tec...
Transcript: Redefining the book supply chain: A glimpse into the future - Tec...
 
Redefining the book supply chain: A glimpse into the future - Tech Forum 2023
Redefining the book supply chain: A glimpse into the future - Tech Forum 2023Redefining the book supply chain: A glimpse into the future - Tech Forum 2023
Redefining the book supply chain: A glimpse into the future - Tech Forum 2023
 

Recently uploaded

Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjStl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjMohammed Sikander
 
OSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsOSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsSandeep D Chaudhary
 
How to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptxHow to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptxCeline George
 
e-Sealing at EADTU by Kamakshi Rajagopal
e-Sealing at EADTU by Kamakshi Rajagopale-Sealing at EADTU by Kamakshi Rajagopal
e-Sealing at EADTU by Kamakshi RajagopalEADTU
 
Andreas Schleicher presents at the launch of What does child empowerment mean...
Andreas Schleicher presents at the launch of What does child empowerment mean...Andreas Schleicher presents at the launch of What does child empowerment mean...
Andreas Schleicher presents at the launch of What does child empowerment mean...EduSkills OECD
 
Sternal Fractures & Dislocations - EMGuidewire Radiology Reading Room
Sternal Fractures & Dislocations - EMGuidewire Radiology Reading RoomSternal Fractures & Dislocations - EMGuidewire Radiology Reading Room
Sternal Fractures & Dislocations - EMGuidewire Radiology Reading RoomSean M. Fox
 
Personalisation of Education by AI and Big Data - Lourdes Guàrdia
Personalisation of Education by AI and Big Data - Lourdes GuàrdiaPersonalisation of Education by AI and Big Data - Lourdes Guàrdia
Personalisation of Education by AI and Big Data - Lourdes GuàrdiaEADTU
 
How To Create Editable Tree View in Odoo 17
How To Create Editable Tree View in Odoo 17How To Create Editable Tree View in Odoo 17
How To Create Editable Tree View in Odoo 17Celine George
 
Graduate Outcomes Presentation Slides - English (v3).pptx
Graduate Outcomes Presentation Slides - English (v3).pptxGraduate Outcomes Presentation Slides - English (v3).pptx
Graduate Outcomes Presentation Slides - English (v3).pptxneillewis46
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfPondicherry University
 
How to Send Pro Forma Invoice to Your Customers in Odoo 17
How to Send Pro Forma Invoice to Your Customers in Odoo 17How to Send Pro Forma Invoice to Your Customers in Odoo 17
How to Send Pro Forma Invoice to Your Customers in Odoo 17Celine George
 
Improved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio AppImproved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio AppCeline George
 
diagnosting testing bsc 2nd sem.pptx....
diagnosting testing bsc 2nd sem.pptx....diagnosting testing bsc 2nd sem.pptx....
diagnosting testing bsc 2nd sem.pptx....Ritu480198
 
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽中 央社
 
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...Nguyen Thanh Tu Collection
 

Recently uploaded (20)

Supporting Newcomer Multilingual Learners
Supporting Newcomer  Multilingual LearnersSupporting Newcomer  Multilingual Learners
Supporting Newcomer Multilingual Learners
 
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjStl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
 
OSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsOSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & Systems
 
How to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptxHow to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptx
 
e-Sealing at EADTU by Kamakshi Rajagopal
e-Sealing at EADTU by Kamakshi Rajagopale-Sealing at EADTU by Kamakshi Rajagopal
e-Sealing at EADTU by Kamakshi Rajagopal
 
Andreas Schleicher presents at the launch of What does child empowerment mean...
Andreas Schleicher presents at the launch of What does child empowerment mean...Andreas Schleicher presents at the launch of What does child empowerment mean...
Andreas Schleicher presents at the launch of What does child empowerment mean...
 
Sternal Fractures & Dislocations - EMGuidewire Radiology Reading Room
Sternal Fractures & Dislocations - EMGuidewire Radiology Reading RoomSternal Fractures & Dislocations - EMGuidewire Radiology Reading Room
Sternal Fractures & Dislocations - EMGuidewire Radiology Reading Room
 
Including Mental Health Support in Project Delivery, 14 May.pdf
Including Mental Health Support in Project Delivery, 14 May.pdfIncluding Mental Health Support in Project Delivery, 14 May.pdf
Including Mental Health Support in Project Delivery, 14 May.pdf
 
Personalisation of Education by AI and Big Data - Lourdes Guàrdia
Personalisation of Education by AI and Big Data - Lourdes GuàrdiaPersonalisation of Education by AI and Big Data - Lourdes Guàrdia
Personalisation of Education by AI and Big Data - Lourdes Guàrdia
 
Mattingly "AI and Prompt Design: LLMs with NER"
Mattingly "AI and Prompt Design: LLMs with NER"Mattingly "AI and Prompt Design: LLMs with NER"
Mattingly "AI and Prompt Design: LLMs with NER"
 
How To Create Editable Tree View in Odoo 17
How To Create Editable Tree View in Odoo 17How To Create Editable Tree View in Odoo 17
How To Create Editable Tree View in Odoo 17
 
Graduate Outcomes Presentation Slides - English (v3).pptx
Graduate Outcomes Presentation Slides - English (v3).pptxGraduate Outcomes Presentation Slides - English (v3).pptx
Graduate Outcomes Presentation Slides - English (v3).pptx
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
 
Mattingly "AI & Prompt Design: Named Entity Recognition"
Mattingly "AI & Prompt Design: Named Entity Recognition"Mattingly "AI & Prompt Design: Named Entity Recognition"
Mattingly "AI & Prompt Design: Named Entity Recognition"
 
How to Send Pro Forma Invoice to Your Customers in Odoo 17
How to Send Pro Forma Invoice to Your Customers in Odoo 17How to Send Pro Forma Invoice to Your Customers in Odoo 17
How to Send Pro Forma Invoice to Your Customers in Odoo 17
 
Improved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio AppImproved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio App
 
diagnosting testing bsc 2nd sem.pptx....
diagnosting testing bsc 2nd sem.pptx....diagnosting testing bsc 2nd sem.pptx....
diagnosting testing bsc 2nd sem.pptx....
 
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
 
OS-operating systems- ch05 (CPU Scheduling) ...
OS-operating systems- ch05 (CPU Scheduling) ...OS-operating systems- ch05 (CPU Scheduling) ...
OS-operating systems- ch05 (CPU Scheduling) ...
 
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
 

The Ebook Developer's Toolbox - ebookcraft 2016 - Sanders Kleinfeld

  • 1. The Ebook Developer's Toolbox Sanders Kleinfeld O’Reilly Media, Inc. Twitter: @sandersk ebookcraft 2016
  • 3. Ebooks are made of CODE!!!
  • 4.
  • 6. (X)HTML CSS JS XSLT regexRDF NCX ONIX MOBI EPUB PDF MathML SVG XPath OPFOTF WOFF LATE X WTF?!
  • 8. InDesign Media QueriesKindlegen oXygen MathML Cloud “View Source” CSSLint Readium jQuery Sass Acrobat Kindle Previewer iBooks Author epubcheck ADE FontForge FileFormat.info BISG EPUB 3 Support Grid
  • 10. Three Indispensable Tools for my Workflow 1.XSLT 2.Responsive Ebook Design Techniques 3.Equation Processing with MathML Cloud
  • 12. Pop Quiz #1: XSLT is… A: An acronym for “Extensible Stylesheet Language Transformations” B: A programming language written in XML syntax C: An official W3C Specification D: All of the above
  • 13. Pop Quiz #1: XSLT is… A: An acronym for “Extensible Stylesheet Language Transformations” B: A programming language written in XML syntax C: An official W3C Specification D: All of the above (http://www.w3.org/TR/xs
  • 14. XSLT is a tool for global, programmatic markup manipulation
  • 15. <body> <div class="section"> <p><b>Chapter 1</b></p> HTML5 is really great, because there are lots of new elements to facilitate meaningful tagging of content. <br/><br/> Also, they deprecated a lot of yucky <font color="green">non-semantic stuff.</font> </div> </body> <body> <section> <h1>Chapter 1<h1> <p>HTML5 is really great, because there are lots of new elements to facilitate meaningful tagging of content.</p> <p>Also, they deprecated a lot of yucky <span style="color: green;">non- semantic stuff.</span></p> </section> </body> XSLT ? ?
  • 16. Rhetorical Question #1: “Um, can’t I just use regular expressions for this?”
  • 17. Example: Converting <b> to <em> with regex your_markup.replace(/<b>/, '<em>')
  • 18. But what about: •Closing tags (</b>) •Attributes (<b class="term">) •Extra Whitespace (<b >) your_markup.replace(/<(/)?b(s*[^>]*)>/g, '<$1em$2>')
  • 19. A Stack Overflow Classic: “You can’t parse [X]HTML with regex” (http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags)
  • 20. XSLT leverages a functional* paradigm * Many folks have salient objections to calling XSLT a functional programming language (e.g., http://www.snoyman.com/blog/2012/04/xslt-rant.html), but document processing with XSLT still embodies the spirit of functional programming, and it feels pedantic to me to deny that.
  • 21. <markup> <!--Input--> </markup> Functional Paradigm in XSLT <markup> <!--Output--> </markup> <xsl:stylesheet> <xsl:template match="..."> <!—Stuff happens here--> </xsl:template> <xsl:template match="..."> <!—Stuff happens here--> </xsl:template> </xsl:stylesheet>
  • 22. f(x) = 1 * x Identity Function* in Algebra * Output of function is identical to input
  • 23. Identity Stylesheet* in XSLT * Output of stylesheet is identical to input <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet>
  • 25. Identity Stylesheet in XSLT: Explained <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> BEGIN stylesheet END stylesheet BEGIN matching function Match any node (element, attribute, text) BEGIN copy matched node (OPEN elem) END Copy matched node (CLOSE elem) Select any node END matching function Run stylesheet against specified children of
  • 26. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML
  • 27. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML
  • 28. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> </body>
  • 29. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> </body>
  • 30. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> </body>
  • 31. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p> </p> </body>
  • 32. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p> </p> </body>
  • 33. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p> </p> </body>
  • 34. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p class="greet"> </p> </body>
  • 35. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p class="greet"> </p> </body>
  • 36. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p class="greet"> </p> </body>
  • 37. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p class="greet"> Hello World </p> </body>
  • 38. Identity Stylesheet in XSLT: How it Works <xsl:stylesheet xmlns:xsl="http://www .w3.org/1999/XSL/Tran sform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> </body> Stylesheet Input XHTML Output XHTML <body> <p class="greet"> Hello World </p> </body>
  • 39. Rhetorical Question #5: “OK, so how do you actually transform the output”
  • 40. You can override the identity templates with other, more specific matching templates (just as you override rules with other rules in CSS) CSS XSLT * { font-size: 10px; } h1 { /* Custom Handling */ font-size: 20px; } <xsl:template match="@*| node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> <xsl:template match="h1"> <xsl:copy> <!--Custom handling--> <xsl:apply-templates/> </xsl:copy> </xsl:template>
  • 41. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> <xsl:template match="p[@class='greet']"> <h1> <xsl:apply-templates select="@*|node()"/> </h1> </xsl:template> </xsl:stylesheet> XPath matching all p elements with a clas
  • 42. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML
  • 43. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML
  • 44. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> </body>
  • 45. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> </body>
  • 46. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> </body>
  • 47. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1> </h1> </body>
  • 48. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1> </h1> </body>
  • 49. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1> </h1> </body>
  • 50. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> </h1> </body>
  • 51. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> </h1> </body>
  • 52. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> </h1> </body>
  • 53. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> </body>
  • 54. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> </body>
  • 55. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> </body>
  • 56. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> <p></p> </body>
  • 57. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> <p></p> </body>
  • 58. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> <p></p> </body>
  • 59. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> <p>What’s up?</p> </body>
  • 60. Our first transform: Convert all <p class="greet"> elements to <h1>s <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match=“p[@class=‘greet’] ”> <h1> <xsl:apply- templates select=“@*| node()"/> </h1> </xsl:template> </xsl:stylesheet> <body> <p class="greet"> Hello World </p> <p>What’s up?</p> </body> Stylesheet Input XHTML Output XHTML <body> <h1 class="greet"> Hello World </h1> <p>What’s up?</p> </body>
  • 61. Pop Quiz #2: What does this transform do? XSLT INPUT XHTML <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/ XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p>
  • 62. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML
  • 63. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML
  • 64. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p></p>
  • 65. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p></p>
  • 66. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p></p>
  • 67. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p>Learning</p>
  • 68. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p>Learning</p>
  • 69. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p>Learning</p>
  • 70. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p>Learning</p>
  • 71. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p>Learning is awesome!</p>
  • 72. Pop Quiz #2 Solution <xsl:stylesheet xmlns:xsl="http://www.w3 .org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply- templates select="@*| node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"/> </xsl:stylesheet> <p>Learning <strong>XSLT</strong> is awesome!</p> Stylesheet Input XHTML Output XHTML <p>Learning is awesome!</p>
  • 73. Pop Quiz #3: Write XSLT that drops <strong> tags from the HTML below, but preserves the text content inside the tags INPUT XHTML <p>Learning <strong>XSLT</strong> is awesome!</p> DESIRED OUTPUT XHTML <p>Learning XSLT is awesome!</p>
  • 74. Pop Quiz #3 Solution <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> <xsl:template match="strong"> <xsl:apply-templates/> </xsl:template> </xsl:stylesheet> BEGIN match “strong” element Select child nodes (except attributes) of matched “strong” element End match “strong” element
  • 75. Intermediate Topics •XPath expressions •Conditionals (xsl:if, xsl:choose/xsl:when/xsl:otherwise) •Looping/Grouping (xsl:for-each, xsl:for-each-group) •Numbering/Labeling (xsl:number) •Includes/Imports (xsl:include/xsl:import)
  • 76. My Favorite XSLT Reference Book
  • 78. What do we mean by responsive design?
  • 79. “Rather than tailoring disconnected designs to each of an ever-increasing number of web devices, we can treat them as facets of the same experience. We can design for an optimal viewing experience, but embed standards-based technologies into our designs to make them not only more flexible, but more adaptive to the media that renders them.” — Ethan Marcotte “Responsive Web Design” http://alistapart.com/article/responsive-web-design
  • 81. 1. Content is split into pages (Safari for Mac) (iBooks for Mac)
  • 82. 2. Content reflows from page to page (iBooks for iPhone) (iBooks for iPad)
  • 83. 3. Content settings are user-configurable User #1’s settings User #2’s settings
  • 84. 4. Single ebook archive for all platforms (iBooks) (NOOK) (Google Play) (Kobo) (Kindle)* (Universal Ebook) * Either converted to MOBI via KindleGen, or submitted to Amazon for conversio
  • 86. Media Queries encapsulate CSS rules to be applied only when certain display conditions are satisfied, such as: •Screen dimensions fall within a given width/height range •Screen is monochrome or color •Screen orientation is portrait or landscape
  • 87. Media Query Syntax* @media media-type and (media-feature) { /* CSS Rules to be applied */ } al media type, followed by zero or more media featu
  • 88. Some Key W3C-Specified Media Types: •all - applied on any device •print - applied to output for printers •speech - applied on screen readers •screen - applied to any display that is not print or speech, which encompasses most Web browsers and readers
  • 89. Kindle’s Custom Media Types*: •amzn-kf8 - applied on any Kindle device or app that supports Amazon’s Kindle Format 8 specification •amzn-mobi - applied to Kindle devices or apps that support only the legacy MOBI 7 format. * See Chapter 8 of Kindle Publisher Guidelines
  • 90. Example #1: Kindle’s Recommended Media Queries for table handling* @media amzn-mobi { table.complex { /* Suppress display of complex tables on MOBI and use fallback image instead */ display: none; } } @media amzn-kf8 { img.table_fallback { /* Suppress display of table fallback images on KF8, which can support complex tables */ display: none; } } * See Chapter 8 of Kindle Publisher Guidelines
  • 91. Some Key W3C-Specified Media Features: •(min-|max-)width - query the width of the current display window. •(min-|max-)device-width* - query the screen width of the device •(min-|max-)height - query the height of the current display window •(min-|max-)device-height* - query the screen height of the device •orientation - query whether orientation is currently portrait or landscape •color - query whether the display is color •monochrome - query whether the display is monochrome * Deprecated in Media Queries Level 4
  • 92. Example #2: Media Query for iBooks for iPad @media (min-device-width:768px) and (max-device-width:1024px) { #usernote::before { content: “You are reading this on iBooks for iPad"; } }
  • 94. Example #3: Media query to target both iBooks + KF8-enabled Kindle* @media not amzn-mobi { /* Styling for everything that _is not_ a MOBI 7 platform */ } Queries for formatting Poetry on Kindle and EPUB”
  • 96. Some Key W3C-Specified Fragmentation Properties:* •page-break-before - configure page breaking rules before specified element(s) •page-break-after - configure page breaking rules after specified element(s) •page-break-inside - configure page breaking rules within specified element(s) nger mandates “page-” prefix on these properties, but it’s a good id
  • 97. page-break- properties accept the following values •auto - Defer to browser/ereader on pagebreak here (default) •avoid - Avoid pagebreak here •always - Always pagebreak here •left - Add one or two pagebreaks to make next page a left page •right - Add one or two pagebreaks to make next page a right page •inherit - Inherit pagebreak rules from parent element* * “page-break” rules are not inherited by default
  • 98. Example #1: Force pagebreaks before top-level headings h1 { page-break-before: always }
  • 99. Example #2: Avoid pagebreaks within figures figure { page-break-inside: avoid }
  • 100. Some More Key W3C-Specified Fragmentation Properties:* •orphans - specify minimum number of lines within an element that must be preserved before a page boundary (at bottom of page) •widows - specify minimum number of lines within an element that must be preserved after a page boundary (at top of page) * Default value is 2 for both properties
  • 101. Example #3: Require three paragraph lines to “stay together” at both the bottom and top of pages p { orphans: 3 widows: 3 }
  • 102. For more, read my article “Responsive Ebook D
  • 103. Accessible Math with MathML Cloud (MathJax)
  • 104. The Publisher’s Challenge: How to produce high-quality, accessible mathematical content across ereader platforms
  • 106. MathML in EPUB (iBooks)
  • 107. MathML in EPUB (NOOK)
  • 108. MathML in Mobi (Kindle Fire)
  • 110. SVG in EPUB (iBooks)
  • 111. SVG in Mobi (Kindle Voyage)
  • 112. SVG in Mobi (Kindle “classic”)
  • 113. The only reliable, universal choice is bitmap images
  • 114. But how can we automate creation of equation images…
  • 116. MathML Cloud provides a solution for automation and accessibility http://mathmlcloud.org
  • 118. MathML Cloud is open source, built on mathjax-node https://github.com/benetech/mmlc-api/
  • 120. Thank You! ? ?☺ Contact Me: @sandersk