August 12, 2008 PLEASE FORWARD
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Tips, Tricks, News and Reviews for Web Coders
by Kevin Yank (techtimes@sitepoint.com)
Read the HTML version of this newsletter, with graphics, at:
http://www.sitepoint.com/newsletter/viewissue.php?id=3&issue=202
Note: This newsletter is supported solely by advertisers like the
one below. We stand 100% behind every ad that we run. If you ever
have a problem with a company that advertises here please contact
us and we will try to get it resolved.
INTRODUCTION - - - - - - - - - - - - - - - - - - - - - - - - - -
Hi gang! Welcome to another issue of the SitePoint Tech Times.
In this issue Kevin explores the humble blockquote element. The
blockquote element has a long history of being taken for
granted. Kevin will show you how to make use of a
largely-forgotten attribute to add a little more meaning to
your blockquotes.
sitepoint.com is running a great promotion [1] at the moment.
For every SitePoint book you buy you can get another SitePoint
book (in PDF format) for free!
SitePoint is also looking for a new technical editor. If you
work in the web industry and love writing about technology and
sharing your know-how, we need you [2]. If you know someone who
does, refer them to us [3] and be in the running to win an Apple
iPhone!
Hope you enjoy this issue!
[1] <http://www.sitepoint.com/books/freepdf/>
[2] <http://www.sitepoint.com/about/jobs/job2-technical_editor.php>
[3] <http://www.sitepoint.com/about/referral/techeditor/>
SPONSOR'S MESSAGE - - - - - - - - - - - - - - - - - - - - - - - -
ektron
What do you want your website to do?
Ektron CMS400.NET gives you all the tools you need to create,
deploy, and manage your Web site - all rolled into one application.
* Corporate Web Site: Put authoring in the hands of your subject matter experts
* Intranet: support inter-departmental communication
* Social Networking Platform: Make your site an online destination
* Web 2.0 Toolbox: Make your site more interactive & engaging
* Ektron Starter Sites: Build your site faster and smarter.
Version 7.5 now available! Watch an INSTANT DEMO now:
http://www.ektron.com/instant_demo.cfm?cpcid=4323&cpid=NLC-2689&campaignid=2689
IN THIS ISSUE - - - - - - - - - - - - - - - - - - - - - - - - - -
- Introduction
- Blockquote: Then and Now
- New Technical Articles
- Techy Forum Threads
- More Techy Blog Entries
BLOCKQUOTE: THEN AND NOW - - - - - - - - - - - - - - - - - - - -
by Kevin Yank
As The Ultimate HTML Reference [1] author Ian Lloyd puts it,
"blockquote has been around a long time, but it hasn't
aged a day." But while the effect of the <blockquote> tag in
today's browsers is virtually unchanged from when it was
first introduced in the Web's earliest browsers, the way
we use it has progressed dramatically.
blockquote, of course, is meant to mark a "block quote" -- a
verbatim reproduction of content originally published or
presented elsewhere, presented as a block, apart from the
surrounding content. Belying this important purpose, the
element's default visual presentation is quite simple:
browsers simply leave left and right margins of about 36 pixels
to either side of the element.
Early on in the Web's history, blockquote was largely
ignored. In a time when HTML elements were routinely misused to
achieve visual effects, blockquote was seen as the identical
twin of dd [2], since they both have the same visual effect, and
because <dd> is shorter to type than <blockquote>, that's
what designers used.
Designers who took pride in the quality of their code quickly
found HTML validators (like the W3C's [3]) didn't
appreciate them using dd for this. dd elements belong inside a
definition list (dl [4]), after all. A blockquote, on the other
hand, can go anywhere a block element is welcome, so gradually
it became the element of choice for producing indentend content.
The more indented a designer wanted content to appear, the more
blockquote elements he would wrap it in. This led to some pretty
monstrous code, particularly when generated by WYSIWYG authoring
tools:
<blockquote>
<blockquote>
<blockquote>
<blockquote>
<blockquote>
<p>A block with breathing room!</p>
</blockquote>
</blockquote>
</blockquote>
</blockquote>
</blockquote>
Of course, today most web designers understand the value of
semantically meaningful code. This, and the fact that CSS can be
used easily to apply the exact same formatting that blockquote
elements get by default, has seen correct use of blockquote rise
to dominate in recent years.
Meanwhile, the semantics provided by blockquote are more
relevant than ever. Blogs continually quote other blogs and
sites, and the blockquote element is perfectly suited to marking
up such quotations.
Read on to discover some of the blockquote element's
hidden subtleties, and how it could be used to reveal a web
within the Web: a web of attribution.
[1] <http://www.sitepoint.com/books/htmlref1/>
[2] <http://reference.sitepoint.com/html/dd>
[3] <http://validator.w3.org/>
[4] <http://reference.sitepoint.com/html/dl>
SPONSOR'S MESSAGE - - - - - - - - - - - - - - - - - - - - - - - -
Maintaining a website can be both fun and sometimes frustrating
especially if the web host does not catch up to your needs. The
owners behind WebHostingBuzz have experienced it all.
We have been there and done it. We know what YOU want when it comes
to running a script oriented website. We know what YOU want when it
comes to value for your web hosting dollars. We host over 150,000
domains across the globe. Surely we can host yours!
Host unlimited websites under one account. Get a free domain name
for life, tons of web space and transfer for only $40 per year.
http://www.webhostingbuzz.com/website-hosting.shtml?host_sitepoint-special
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
A WEB OF ATTRIBUTION
Many aspects of the Web are based on the concept of links. When
I link to you in a blog post, Google counts that as a vote of
confidence in your content. Modern blog software even
"pings" the target of a link to let it know it has
been linked to (this is called a trackback). So in many ways,
the Web today is a web of links.
The blockquote element has the potential to create a second
"web within the Web" -- a Web of attribution.
This potential is created by the little-known cite attribute
[1], which is supposed to point to the URL from which the quote
was taken.
<blockquote cite="http://example.com/source.html">
<p>A scintillating quote...</p>
</blockquote>
If everyone marked up their blockquotes this way, it would open
the door to powerful analysis tools of the same sort that we now
have for links. Not only would Google be able to tell you who
links to you, but it could also tell you who was quoting you.
The problem with the cite attribute, of course, is that almost
nobody knows about it -- and even fewer people use it! And
the reason? In most browsers, it doesn't do anything.
This is something that the Microformats community really
gets -- no matter how useful a feature of HTML would be to
Google, developers won't bother using it if that feature
won't be visible to the visitors to the site.
Microformats [2] are ways of using existing features of the HTML
language together to make the language do new things, and one of
the rules of Microformats is that they are "defined for
humans first and machines second." The fact that a
Microformat must be visible and useful to the site's users
gives designers a real reason to use it.
With this in mind, the Microformats community has proposed a way
of using blockquote to build a web of attribution in a
user-visible way. The draft microformat is called cite-rel [3],
and it looks like this:
<p>A scintillating quote from <cite id="goodquote"
class="relationship"><a href="http://example.com/source.html"
>someone I respect</a></cite>: </p>
<blockquote cite="#goodquote">
<p>A scintillating quote...</p>
</blockquote>
Instead of pointing directly at the source of the quote, the
cite attribute of the blockquote points to the ID of a cite
element [4], which contains the actual link to the source.
Not only does this produce a structure that search engines can
read to discover quotations and their sources on the Web, but it
makes these citations visible to users, since the citation is
ultimately presented in a link.
Next time you whip out a blockquote, consider including a cite
attribute to point to the source, and even try out the cite-rel
microformat to make that source visible to your users, not just
Google!
How do you use blockquote? Leave a comment and let me know:
Blockquote: Then and Now [5]
by Kevin Yank
JavaScript & CSS Blog: Stylish Scripting
[1] <http://reference.sitepoint.com/html/blockquote/cite>
[2] <http://reference.sitepoint.com/html/microformats/>
[3] <http://microformats.org/wiki/cite-rel>
[4] <http://reference.sitepoint.com/html/cite>
[5] <http://www.sitepoint.com/blogs/?p=2813>
SPONSOR'S MESSAGE - - - - - - - - - - - - - - - - - - - - - - - -
Create and Deploy Rich Internet Applications on the Desktop with
Adobe(R) AIR(TM) software.
With Adobe AIR, Ajax developers can use existing skills and code to
build responsive, highly engaging applications that combine the power
of local resources and data with the reach of the web. Deliver
applications to the desktop that complement and expand your browser
applications.
Download the Adobe AIR SDK and Ajax docs to start building applications
today: http://ad.doubleclick.net/clk;205795756;28433728;w
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
That's all for this issue -- thanks for reading! We'll see you
next week.
Andrew Tetlaw
techtimes@sitepoint.com
SitePoint Technical Editor
NEW TECHNICAL ARTICLES - - - - - - - - - - - - - - - - - - - - -
Build a Web 2.0 Voting Widget with Flex: Part II
by Jack Herrington
More Flex quizzes, and more book giveaways! In Part II of this
series, Jack expands on our voting widget in Flex 3, and once
again provides a quiz for you to test your knowledge at the
end, and receive a free book for your trouble!
http://www.sitepoint.com/article/1662
TECHY FORUM THREADS - - - - - - - - - - - - - - - - - - - - - - -
addEvent() function - e.target / this
<http://www.sitepoint.com/forums/showthread.php?threadid=564118>
How to creater a central header page for Logo and Menu
<http://www.sitepoint.com/forums/showthread.php?threadid=564337>
Call for Interview Question for Jeff Veen
<http://www.sitepoint.com/forums/showthread.php?threadid=564282>
image slideshow
<http://www.sitepoint.com/forums/showthread.php?threadid=564133>
Hiding Pages from Search Engines
<http://www.sitepoint.com/forums/showthread.php?threadid=563245>
vector images
<http://www.sitepoint.com/forums/showthread.php?threadid=561917>
MORE TECHY BLOG ENTRIES - - - - - - - - - - - - - - - - - - - - -
News & Trends Blog: INDUSTRY NEWS FOR WEB PROFESSIONALS
Will the iPhone Kill the Kindle? (6 comments)
http://www.sitepoint.com/blogs/2008/08/12/will-the-iphone-kill-the-kindle/
8tracks a?" The Legal Web Mixtape (3 comments)
http://www.sitepoint.com/blogs/2008/08/07/8tracks-the-legal-web-mixtape/
Web Tech Blog: TECHNICALLY SPEAKING
Our "Buy One, Get One FREE" Deal Is Back! (1 comment)
http://www.sitepoint.com/blogs/2008/08/07/our-buy-one-get-one-free-deal-is-back/
Who Is The Best Web Developer In Australia? (2 comments)
http://www.sitepoint.com/blogs/2008/08/07/who-is-the-best-web-developer-in-australia/
SitePoint Needs Web Tech Enthusiasts a?" Win An iPhone!
http://www.sitepoint.com/blogs/2008/08/04/sitepoint-needs-web-tech-enthusiasts-win-an-iphone/
ADVERTISING INFORMATION - - - - - - - - - - - - - - - - - - - - -
Find out what thousands of savvy Internet marketers already know:
email newsletter advertising works! (You're reading an email ad
now, aren't you?)
Find out how to get YOUR sponsorship ad in this newsletter and
reach 95,000+ opt-in subscribers! Check out
http://www.sitepoint.com/mediakit/ for details, or email us at
mailto:adinfo@sitepoint.com
HELP YOUR FRIENDS OUT - - - - - - - - - - - - - - - - - - - - - -
People you care about can take charge of their Website by
effectively using the information and resources available on the
Internet. Help them learn how - forward them a copy
of this week's SitePoint Tech Times.
ADDRESSES - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Send suggestions and comments to:
techtimes@sitepoint.com
To subscribe, send a blank email to:
subscribe@sitepoint.com
The Archives are located at:
http://www.sitepoint.com/newsletter/archives.php
The SitePoint Tech Times is hosted by SparkList:
http://www.sitepoint.com/newsletters/sparklist/
The SitePoint Tech Times is (c) 1998-2008 SitePoint Pty. Ltd. All
Rights Reserved. No part of this Newsletter may be reproduced in
whole or in part without written permission. All guest articles
are copyright their respective owners and are reproduced with
permission.
SitePoint Pty. Ltd.
48 Cambridge Street
Collingwood, VIC 3066
AUSTRALIA
You are currently subscribed to The SitePoint Tech Times as:
ignoble.experiment@arconati.us
To change the email address that you currently subscribe with:
http://sitepoint.com/newsletter/manage.php
To switch to the HTML version of this newsletter:
<http://sitepoint.com/newsletter/htmlplease.php?email=ignoble.experiment@arconati.us>
To leave this list, send a blank email to:
leave-2379841-2266608.e57363ef99c8b59c8667cca2fd106cbe@sitepoint.sparklist.com
Do Not Reply to this email to unsubscribe.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
No comments:
Post a Comment
Keep a civil tongue.