save pdf file in c# : Create pdf bookmarks application control cloud windows azure html class DevPro%20HTML5%20PDF5-part1493

Figure 9. The site-level heading now appears, and the subtitle has disappeared! Notice that despite 
multiple <h1> elements, there is correct indentation between the first two.
Figure 9: Example HTML5 source outline after first set of code modifications
The source of the final line in the outline is the last <div> in default.cshtml (see Figure 5). Since this 
data is considered "side note" data, and is not regarded as the main content of the article, we can re-
engineer it to use semantics, as follows:
<aside id="sidenote"> 
<h1>What does semantic mean?</h1> 
<p> 
A relevant definition is: 
<mark class="definition">to show, indicate by sign</mark> 
In HTML5, the "sign" is the element. 
</p> 
</aside> 
Once again, the <div> has been replaced-this time with the <aside> element. Although the <aside> 
contains an <h1> element, it will be regarded with less importance by the search-engine parser 
because of its ambient container. The <span> was replaced with a more appropriate choice, the 
<mark> element. As the name implies, it represents text to be marked or highlighted. After one more 
run-through with the outliner after all the code changes, we see a proper indentation of the outline, 
shown in Figure 10.
Figure 10: Example HTML5 source outline after second set of code modifications
46
Chapter 5: HTML5 Syntax and Semantics: Why They Matter
Create pdf bookmarks - add, remove, update PDF bookmarks in C#.net, ASP.NET, MVC, Ajax, WinForms, WPF
Empower Your C# Project with Rapid PDF Internal Navigation Via Bookmark and Outline
display bookmarks in pdf; create pdf bookmarks online
Create pdf bookmarks - VB.NET PDF bookmark library: add, remove, update PDF bookmarks in vb.net, ASP.NET, MVC, Ajax, WinForms, WPF
Empower Your VB.NET Project with Rapid PDF Internal Navigation Via Bookmark and Outline
create pdf with bookmarks from word; adding bookmarks to pdf reader
More Semantics
There are other areas in the document that are easy to identify for semantic markup. For example, in 
the _SiteLayout.cshtml file (see Figure 3), the final <div> on that page is for the footer. We can replace 
it as follows:
<footer id="footer"> 
&copy; 
<time datetime="@DateTime.Now.ToString("yyyy-MM-dd")"> 
@DateTime.Now.Year 
</time>, Don't steal me... 
</footer> 
Note the insertion of the <time> element. It simply provides a stronger context for any date or time 
provided in the HTML markup.
How about the links to other pages in the site? The following code:
<ul id="menu"> 
<li><a href="@Href("~/")">Home</a></li> 
<li><a href="@Href("~/About")">About</a></li> 
</ul>  
can be changed to this: 
<nav id="menu"> 
<h1>Site Navigation</h1> 
<li><a href="@Href("~/")">Home</a></li> 
<li><a href="@Href("~/About")">About</a></li> 
</nav> 
Because the links in this code are regarded as the primary navigation within our site, it is appropriate 
to use the <nav> element in this case. But why did an <h1> tag sneak in? The <nav> element is fac-
tored in the outlining of the document. An <h1> element provides the semantic meaning, though the 
site.css file prevents it from being viewed.
What about the HTML5 logo in default.cshtml (Figure 5)? It can be transformed to be semantic, as 
follows:
<figure id="logo"> 
<img src="http://bit.ly/html5semantics_logo" 
width="133" height="64"  
alt="HTML5 Powered with Semantics" 
title="HTML5 Powered with Semantics" /> 
<figcaption>HTML5 Semantics</figcaption> 
</figure> 
Not only was the <div> replaced with <figure>, the span was replaced with a more suitable option, 
the <figcaption> element.
Chapter 5: HTML5 Syntax and Semantics: Why They Matter 
47
VB.NET PDF File Compress Library: Compress reduce PDF size in vb.
Bookmarks. inputFilePath = Program.RootPath + "\\" 3.pdf"; String outputFilePath = Program.RootPath + "\\" 3_optimized.pdf"; 'create optimizing options
creating bookmarks in a pdf document; create bookmarks in pdf from excel
VB.NET PDF File Split Library: Split, seperate PDF into multiple
how to split a PDF file into multiple ones by PDF bookmarks or outlines Valid value for each index: 1 to (Page Count - 1). ' Create output PDF file path
how to add a bookmark in pdf; excel hyperlink to pdf bookmark
The Final Section
The co-author of this series, Daniel Egan, and I are often asked by those new to HTML5 when to use 
the <section> element. It is our opinion that this element has the potential to be the most misused or 
unused of the semantic elements. In our example, our "article" is rather small. The larger an article, 
the more likely it will be divided into manageable "sections" (as is the case with the article you are 
reading). You can use the HTML5 Semantic Notepad tool (bit.ly/semanticnotepad) as an aid in visual-
izing the <section> as well as other semantic elements in an HTML5 document, as shown in Figure 
11.
Figure 11: Viewing an HTML5 document's semantic elements using the HTML5 Semantic Notepad
Despite the small amount of content in the demo article, there is an appropriate use for the <section> 
element in it. In the default.cshtml file, we will change the list of semantic elements to be in its own 
"section," as shown in Figure 12.
Figure 12: Adding a <section> element to an HTML5 document
<section> 
<h1>A list of semantic elements</h1> 
<ul> 
48
Chapter 5: HTML5 Syntax and Semantics: Why They Matter
C# PDF File Split Library: Split, seperate PDF into multiple files
Split PDF file by top level bookmarks. The following C# codes explain how to split a PDF file into multiple ones by PDF bookmarks or outlines.
how to add bookmarks to pdf document; bookmarks pdf files
C# PDF File Compress Library: Compress reduce PDF size in C#.net
Bookmarks. inputFilePath = Program.RootPath + "\\" 3.pdf"; String outputFilePath = Program.RootPath + "\\" 3_optimized.pdf"; // create optimizing options
add bookmark pdf; pdf bookmark editor
<li>article</li> 
<li>aside</li> 
<li>figure</li> 
<li>figcaption</li> 
<li>footer</li> 
<li>header</li> 
<li>hgroup</li> 
<li>nav</li> 
<li>mark</li> 
<li>section</li> 
<li>time</li> 
</ul> 
</section>
Because this content can be logically grouped together, it makes sense to put it in a <section>. This is 
especially the case when you have reason to provide a heading for the content. Other uses for a <sec-
tion> could be to indicate sidebar content with its own heading or a grouping of links with its own 
heading.
When we run our example HTML5 one last time through the outliner site, we see a rich HTML5 
outline generated as a result of the correct usage of semantic elements in the document, as shown in 
Figure 13.
Figure 13: Example HTML5 source outline after final set of code modifications
Make HTML Code More Meaningful
Semantic tags may not impact your users visually, but they provide meaningful data to modern parsers 
and search engines-so they can potentially have significant impact on your site's search-engine 
ranking and web traffic. I've shown you how, with a few adjustments, you can start using semantic 
elements now in your own websites. Get accustomed to using these new elements now-you'll be glad 
you did!
Chapter 5: HTML5 Syntax and Semantics: Why They Matter 
49
C# Create PDF Library SDK to convert PDF from other file formats
file. Create and save editable PDF with a blank page, bookmarks, links, signatures, etc. Create fillable PDF document with fields.
pdf create bookmarks; how to bookmark a pdf in reader
.NET PDF SDK - Description of All PDF Processing Control Feastures
Full page navigation, zooming & rotation; Outlines, bookmarks, & thumbnail display; Integrated annotation; More about Web Viewer ▶. Conversion. PDF Create.
how to bookmark a pdf file in acrobat; bookmark a pdf file
Chapter 6: Introduction to HTML5 for 
Mobile App Development
Get your HTML5 mobile development bearings using this in-depth guide
By Wallace McClure
Download the code:
http://www.devproconnections.com/content/content/141262/141262_ExampleApp.zip
HTML5 is the umbrella term for the next major evolution of markup, JavaScript, and Cascading Style 
Sheets (CSS) for web applications. HTML5 is becoming an ever-more important mobile development 
technology -- especially in light of Adobe's recent announcement that it's ceasing development on 
Flash Player for mobile browsers and increasing its investments in HTML5. In this article, I intend to 
provide a comprehensive overview of HTML5 with an emphasis on features oriented toward mobile 
development. We'll dive into some specific examples of HTML5 features and focus specifically on 
what is available with mobile devices. I will focus on what developers can do today as opposed to 
what is part of the specific set of standards. I'll also mention where a product may have a slightly dif-
ferent outcome than expected. 
Markup
HTML5 introduces many new tags and attributes. In this section, we'll take a look at the ones you as 
a developer will likely need to use immediately. 
HTML5 page. First off, an HTML5 page is much easier to set up than a web page in earlier HTML 
versions. Previous versions of HTML and XHTML had very complicated XML namespace support that 
average developers were confused by and honestly didn't pay much attention to. HTML5 has a much 
simpler page definition and will be simpler for developers to get started with. 
Figure 1: Sample HTML5 page
<!DOCTYPE html> 
<html @Page["CacheManifestFile"]> 
<head> 
<meta charset="utf-8" /> 
<meta http-equiv="X-UA-compatible" content="IE=edge,chrome=1" /> 
50
Chapter 6: Introduction to HTML5 for Mobile App Development
VB.NET Create PDF Library SDK to convert PDF from other file
Create and save editable PDF with a blank page, bookmarks, links, signatures, etc. Create fillable PDF document with fields in Visual Basic .NET application.
create bookmarks in pdf reader; editing bookmarks in pdf
XDoc.Word for .NET, Advanced .NET Word Processing Features
& rotation; Outlines, bookmarks, & thumbnail display; Integrated annotation; More about Web Viewer ▶. Conversion. Word Create. Create Word from PDF; Create Word
add bookmarks to pdf preview; bookmark template pdf
<title>@Page.Title</title> 
<!--These styles and scripts aren't required, merely show what is available.--> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-
1.0b1.min.css" /> 
<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></
script> 
<script src="@Href("~")js/jquery.tmpl.min.js" ></script> 
<script src="@Href("~")js/Modernizr-2.0.6.js" ></script> 
<script src="http://maps.google.com/maps/api/js?sensor=true"></script> 
@RenderSection("head", required: false) 
</head> 
<body> 
<div data-role="page"> 
<header data-role="header" > 
@RenderSection("header", required: false) 
</header> 
<section> 
<div data-role="content"> 
@RenderBody() 
</div> 
</section> 
<footer data-role="footer"> 
<div align="center"> 
@RenderSection("footer", required: false) 
</div> 
</footer> 
</div> 
</body> 
</html>
Let's look at an HTML5 template, shown in Figure 1, which I created for my HTML5 samples (avail-
able for download with the online article; see the top of page for the download button). There are a 
few items to note in the sample code: 
The <DOCTYPE/> tag is much simpler than we formerly saw in HTML. The tag instructs the browser 
to run in standards-compliant mode. 
The <meta/> tag with the http-equiv attribute instructs the browser to use the most recent version 
of the HTML engine in the browser. In addition, if the user has the Google Chrome Frame plug-in 
installed, the Chrome Frame engine is used in Internet Explorer (IE). (See the sidebar "Author's Notes" 
at the end of this article for more information about Chrome Frame.) 
The code download includes a set of jQuery and jQuery Mobile CSS and JavaScript libraries. 
Although use of these libraries is clearly not a strict requirement for HTML5, they will be used to hook 
into the HTML5 page and provide features that will make development easier. 
Chapter 6: Introduction to HTML5 for Mobile App Development 
51
The <script/> tag does not have the type or language attribute. These attributes are not required for 
HTML5. There is a new attribute for the <script/> tag named async. The async attribute allows for the 
script to be executed asynchronously, or not. 
The jquery.tmpl.min.js and Google maps files are used for their templating capabilities and are not a 
requirement for HTML5. 
Modernizr-2.0.6.js contains the Modernizr development library. Modernizr (modernizr.com) is a 
JavaScript library that makes development much easier and simpler when testing browsers as well as 
when building HTML5 apps. (See Dan Wahlin's article "HTML5 and CSS3 Feature Detection with 
Modernizr" for more information about Modernizr.) 
Within the <body/> tag, there are additional content sections. These include the <header/>, <sec-
tion/>, <article/>, <footer/>, and other tags. These tags allow for a page to be divided into logical sec-
tions that can provide additional information to a page. 
Multimedia tags. The most discussed, and controversial, feature in HTML5 is its support for video, 
which is provided by the <video/> and <audio/> tags. Before these tags existed, developers had to opt 
for building Rich Internet Application (RIA) type of solutions that may have included Silverlight and 
Flash to get support for audio and video. 
Let's look at the <audio/> tag first. The <audio/> tag offers developers a standardized way to provide 
audio to web applications. The following example shows how to use the <audio/> tag: 
<audio controls="controls" preload="none" title="HTML5 Audio Example"> 
<source src="@Href("~")Content/HTML5.mp3" type="audio/mpeg" /> 
</audio>
As you can see, the <source/> tag indicates that HTML5 supports the .mp3 file type. Various file types 
can be specified in the <source/> tag (e.g., .ogg). 
HTML5's <video/> tag provides video support. There is a major difference between audio and video 
in the browser world. With audio, MP3 has widespread support among the various browsers that 
developers will encounter. There's no equivalent "default" video format in the marketplace. Figure 2 
shows a short example that uses the <video/> tag. 
Figure 2: Using HTML5's <video/> tag
<video controls="controls" onclick="this.play();" 
poster="@Href("~")images/PlayVideo.png"> 
<source src="@Href("~")Content/HTML5.mp4" preload="none" /> 
<source src="@Href("~")Content/HTML5.webm" preload="none" /> 
<source src="@Href("~")Content/HTML5.ogv" preload="none" /> 
<source src="@Href("~")Content/HTML5.m4v" preload="none" /> 
<source src="@Href("~")Content/HTML5264.mp4" preload="none" /> 
Your browser does not support html5 video. Try some flash. 
</video>
52
Chapter 6: Introduction to HTML5 for Mobile App Development
Just as the <audio/> tag does for audio, the <video/> tag provides the basic infrastructure for sup-
porting video. The biggest problem with the <video/> tag is the lack of agreement by major vendors 
on which formats they support. I won't bore you with the details of this ongoing disagreement. But 
as you can see in the example in Figure 2, you can specify a number of different formats via the 
<source/> tag. 
The biggest problem for developers will be creating the video files in the necessary formats for display 
to users. And in addition to creating and specifying the file formats, developers will need to be careful 
with the MIME types that are loaded and set up on the server. The installation of Microsoft IIS 7.5 
that I used needed to be configured to send these files to the user, so you will most likely need to set 
up these features. In my example, I set up the necessary MIME types by adding the entries shown in 
Figure 3 to the web.config file. I've found two tools very helpful in creating the video in the necessary 
format: Firefogg and HandBrake
Figure 3: Adding MIME type entries to web.config
<system.webServer> 
.......... 
<staticContent> 
<mimeMap fileExtension=".mp4" mimeType="video/mp4" /> 
<mimeMap fileExtension=".ogv" mimeType="video/ogg" /> 
<mimeMap fileExtension=".web" mimeType="video/web" /> 
<mimeMap fileExtension=".m4v" mimeType="video/mp4" /> 
</staticContent> 
</system.webServer>
Both the <audio/> and <video/> tags and the browsers that support them provide support for JavaS-
cript methods and events. Some of these methods and events can be used to start playing the multi-
media, pause the multimedia, handle the multimedia finishing, and initiate numerous other changes 
and events. 
Input tags
and 
attributes
. We've had the same set of input tags in HTML for many years. These include 
<input/>, <select/>, <form/>, and others. These tags have served us well. We've learned over the past 
few years that there are numerous user input scenarios that we can optimize. For example, how many 
times have you used a text field to allow the user to input a phone number? You may have had to use 
some logic to limit the input to numbers or another similar form. It would be nice if we had a tag that 
was optimized for a phone number. HTML5 provides this along with other new input types. The fol-
lowing examples demonstrate how to use HTML5 input tags: 
<input id="phone" name="phone" type="tel" placeholder="Phone"/> 
<input id="email" name="email" type="email" placeholder="Email" 
autocapitalize="off" />
For a desktop web browser, this may not be a big deal, but for a mobile user, the tel and email input 
types can be a godsend. The tel type is used as a hint to the browser to open a keyboard that is opti-
mized for phone input, like the one shown in Figure 4. This keyboard will handle primarily numeric 
input. The email type will result in a keyboard being opened that is optimized for inputting an email 
address. 
Chapter 6: Introduction to HTML5 for Mobile App Development 
53
Figure 4: Keyboard for the input type tel in the Android browser running in the emulator
I'm sure that developers are now thinking, "This is great, but what happens when I run this on IE8 or 
another browser that doesn't support these new input types?" Thankfully, when a browser, such as an 
old version of IE or Firefox, encounters an input type that it does not understand, the browser will dis-
play the input tag as a text field. This allows a developer to start using these new input types and still 
have backward compatibility with existing browsers. Note that I've covered only a few of the input 
types. HTML5 provides more input types to handle dates, numbers, and other types of input data. 
In addition to new input types, numerous new attributes are available. Two new attributes worth men-
tioning here are placeholder and autocomplete attributes. The placeholder attribute allows for text to 
be placed within a TextField class as a watermark, as shown in Figure 5.
Figure 5: Placeholders in the Android browser
54
Chapter 6: Introduction to HTML5 for Mobile App Development
The content in the watermark is not stored as input, it is merely displayed. This capability can be used 
to display helpful information to the user without taking up valuable screen real estate. For example, 
the downloadable code examples I've provided include a user registration sample, in which a test is 
performed on the page-ready event. In this test, if the browser supports the placeholder attribute, the 
textual explanations for the input fields are turned off, and instead a placeholder is used to provide 
the user with information regarding the TextField while conserving on-screen space, which is at a 
premium in a mobile device. The autocomplete attribute can be used to turn off the browser's auto-
completion help. 
Two additional attributes, though not part of the official HTML5 specification, are useful in the mobile 
world with the iPhone and Android. The first, the autocorrect attribute, can be used to turn on/off 
auto-correction. This can be helpful depending on how users feel about auto-correction. The second, 
the autocapitalize attribute, can be handy when inputting proper names. The following example 
shows how to use these attributes. 
<input id="firstName" name="firstName" type="text" placeholder="First Name" 
autocorrect="off" autocapitalize="on" autocomplete="off" autofocus="true" />
There are more new tags and attributes in the HTML5 specification. You can find a larger listing of the 
tags here
JavaScript 
HTML5 includes a number of new JavaScript methods and JavaScript support for HTML5 tags and 
features. There are a number of new methods for supporting <audio/>, <video/>, and other supported 
features. Let's look at some of them. 
Geolocation. Although geolocation support is not an official part of the HTML5 specification, it's hard 
to overlook it. For the purposes of this article, we'll consider it a part of HTML5. With geolocation, it's 
possible for a browser to request the location information from the underlying operating system. This 
occurs by performing the following steps: 
1. A browser check is performed to verify that the browser supports geolocation. In the example in 
Figure 6, the check is performed using the Modernizr library. 
2. The getCurrentPosition method is called with the three parameters. The first parameter is required, 
and the second two are optional. 
a. The first parameter is a callback on success. This callback will be called when the geolocation 
value is determined. 
b. The second parameter is a callback on error. This callback method happens when there is an 
error determining the user location. 
c. The third parameter is options that can be passed in. In this example, enableHighAccuracy is 
turned on. 
Chapter 6: Introduction to HTML5 for Mobile App Development 
55
Documents you may be interested
Documents you may be interested