http://www.MagicLogix.com Magic Logix CEO Hassan Bawab Discusses SEO Best Practices for HTML5 at the Big Design Conference in Addison, Texas 2012. Slideshow includes Top 5 HTML5 Benefits for SEO, Introducing New Tags, Benefits, an HTML5 Taxonomy and Status, and other tips you can utilize SEO for HTML5. Visit our website for more information. Hope this helps.

1. Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

2. SEO Best Practices for
HTML5
Hassan Bawab
CEO & Founder @ Magic Logix
hbawab@magiclogix.com
www.magiclogix.com
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

3. Introduction
T E S T I M O N I A L:
HTML5 is a hot topic currently, and j the use of it
ust “We are truly impressed and satisfied with the
results that Hassan Bawab and Magic Logix have
will generate buzz and press for your site. It also
delivered. Our website traffic has increased
creates such visually appealing aesthetics that users drastically from our initial website design and
will want to share it. Think of the PA N Google
CMA development, to our current SEO Campaign! Due
to the exposure from online marketing and SEO,
Doodle and how many people you told when you
we have now managed to open 13 locations
saw it. across Texas.”
- Jose Fuentes, Owner, Gloria’s Restaurants
These are j some of the ways that HTML5 can
ust
www.gloriasrestaurants.com
benefit you.
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

4. Top 5 HTML5 Benefits for
SEO -1
T E S T I M O N I A L:
• HTML5 allows for the implementation of rich media. In addition
“Magic Logix built this large and complex website
to making your website more attractive, this will also increase
your CTR, time on site, and ultimately increase your page rank. for us in timescales most agencies would have
considered impossible. The website was a critical
• Web Developers are more likely to use HTML5 over Flash. This
allows mobile sites to be more dynamic and increases the part of our launch and they delivered a top notch
usability for mobile consumers (especially Apple users). service with a dedication and passion for
perfection. We would not have been successful
• HTML5 increases the popularity of Geo Locations, and increases without them!”
the use in applications because it is higher browser - Ketan Karia, CMO
compatibility
Actian Corporation
www.actian.com
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

5. Top 5 HTML5 Benefits for
SEO -2
T E S T I M O N I A L:
•HTML5 allows Google and other search engines to index the id
tags of page elements and place higher importance on the content “Magic Logix built this large and complex website
based upon which the element is contained within. This can have
for us in timescales most agencies would have
an extremely positive effect on how you place within the ranking
algorithm, especially if you have a lot of rich media content. considered impossible. The website was a critical
part of our launch and they delivered a top notch
•HTML5 allows developers to build drag and drop tools into
websites and have them work efficiently. This increases user service with a dedication and passion for
interaction, average time on site, and page speed. perfection. We would not have been successful
without them!”
- Ketan Karia, CMO
Actian Corporation
www.actian.com
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

6. Introducing NEW Tags -1
• < article> generally used for blogs, allows a block of content to
be self-contained
• < section> specifies a subsection of a block of content, such
as an < article> . If a blog post was broken into several
sections by subheaders, each section could be wrapped with a
< section> tag. J as books have chapters, blocks of content
ust
can have section.
• < header> could serve two purposes: (1 ) to specify the header
of a page or (2) to indicate the header section of a self-
contained block of content (an < article> ). < header> tags might
contain navigation, branding or the document headline.
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

7. Introducing NEW Tags -2
• < hgroup> is used to wrap a section of headings (< h1 > through
< h6> ). A great example would be an article with both a headline and
subheadline at the top:
< hgroup>
< h1 > Main Headline< / >
h1
< h2> Article tagline or subheading< /
h2>
</
hgroup>
• < footer> is a bit like the < header> tag. It could specific the
< footer> of an entire HTML document or the footer of an < article> .
This may contain things like footer navigation or meta-data about an
article (author, data, etc)
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

8. Introducing NEW Tags -3
• < nav> is mean to enclose site navigation. This can be used anywhere:
main site navigation, previous/
next article links, or pagination.
• < aside> is for content related to the parent element in which is
resides, but not strictly part of the main document. In other words,
could be used on a website sidebar or it could be used within an
< article> for special call outs – like the “did you know” call outs
found in many books.
• < video> is for video content. Its purpose is to provide a cross-
browser compatible way to display video.
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

9. Introducing NEW Tags -4
• < summary> – This defines a visible heading for a < details> element
(only works in Google Chrome!)
• < details> – This is for additional details that a user can view or hide
(only works in Google Chrome!)
• < time> – This defines the date and time which has likely been
introduced as Google hasn’t been brilliant at determining the date of
blog posts in the past.
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

10. Other Benefits
• Developers can now integrate this rich media into social media sites
like Twitter and Facebook. Thus increasing visits to their individual
pages on these already popular sites.
• Decrease HTTP requests and bandwidth usages
• HTML5 provides a new SQL-based database A that allows for local
PI
data storage.
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

11. Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com

12. Conclusion
According to binvisons, Quarterly HTML Census, Q3 201 1 ,
here is some statistics how HTML being used by Top
1 00 sites
•HTML5 = 34%
•HTML 4.01 = 20%
•XHTML 1 .0 = 46%
Musing from Magi:
“Mark your content wisely with HTML5”
Magic Logix | 1 661 0 Dallas Pkwy #2200 Dallas, TX 75248 | Phone: 21 4.694.21 62 | Fax: 972.692.5737 | www.magiclogix.com