29. May 2007 12:22
I've been busy recently migrated my homepage (and several others) from classic ASP to ASP.NET. My homepage displays the latest 5 posts with a summary and a link to the full blog post.
I eventually found a tutorial using XSLT explaining how to achieve this after discovering that XmlDataSource XPATH doesn't support namespaces!
I've tinkered with the XSLT that Arnaud Weil posted in his blog to achieve the following objectives:
- Limit the amount of posts returned by the transformation.
- Show a summary of the post.
- Show a summary that tries hard not to cut words in half when generating a snippet.
- Produce XHTML valid code.
Here's the source of my XSLT...
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<!--<xsl:output method="html"/>-->
<xsl:output method="xml" indent="yes" omit-xml-declaration="yes"/>
<xsl:template match="/atom:feed">
<div id="FeedSnippets">
<xsl:apply-templates select="atom:entry" />
</div>
</xsl:template>
<xsl:template match="atom:entry" name="feed">
<xsl:if test="position()<6">
<h4><xsl:value-of select="atom:title"/></h4>
<p>
<xsl:choose>
<xsl:when test="string-length(substring-before(atom:summary,'. ')) > 0">
<xsl:value-of select="substring-before(atom:summary,'. ')" />...<br />
</xsl:when>
<xsl:when test="string-length(substring-before(atom:summary,'.')) > 0">
<xsl:value-of select="substring-before(atom:summary,'.')" />...<br />
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="substring(atom:summary,0,200)" />...<br />
</xsl:otherwise>
</xsl:choose>
<strong>Read full post: </strong><a href="{atom:link[@rel='alternate']/@href}"><xsl:value-of select="atom:title"/></a></p>
<hr />
</xsl:if>
</xsl:template>
</xsl:stylesheet>
25. May 2007 13:21
People find reading text on screen much more difficult than reading on paper, by following some simple guidelines web designers can help make this as painless as possible.
Due to the nature of how web browsers render textual content on the screen; using the fonts installed on the client machines, it severely limits the font variation web designers have at their disposal.
Most browsers will be able to render the following fonts without reverting to a default alternative:
- Arial
- Georgia
- Verdana
- Arial Black
- Times New Roman
- Trebuchet MS
- Courier New
- Impact
- Comic Sans MS
I personally stick to the top 3 fonts in this list as they are very readable on-screen and are the most professional; avoid Comic Sans MS and Courier New.
It is also possible to specify alternative fonts in your CSS style sheets for the browser to use if your font of choice isn't available.
Once you've chosen a font for a website use that font throughout to maintain consistency. Websites that use too many fonts sprinkled through their pages look unprofessional. Verdana is the most readable font even at low point sizes.
Maintaining Readability
To increase a sites' readability you should focus your attention on three things:
- Choose a good font and a decent readable default font size.
- Make sure the text and background contrast in colours is high.
- Avoid using all capitals in blocks of text and headings.
Text in Images
Some web designers get around the font support problems mentioned above by creating a bitmap image of all headings, titles etc. Although this method does allow you to use any font your graphics program supports, including anti-aliased (smooth-edged) fonts, it causes a big accessibility and SEO problems. You should only use this technique for a company logo, all other textual information should be actual text in your HTML.
21. May 2007 12:20
How often do you visit a website and are unsure where to click and what is clickable?
In the past all links were blue and underlined, but web designers have increasingly found that modern stylesheet functionality (CSS) now allows them to change the look and feel of links and experiment with unconventional navigation. Sometimes so much so, that users have to mine the pages for links by hovering over the page to find out what is clickable, all for the sake of design.
User Expectations
Hyperlinks need to stand out to users as links, a clickable entity that will cause a new page to be requested when clicked.
Users should not have to spend their precious time learning what style the site uses to render hyperlinks, by watching when their mouse cursor turns into a pointing-hand while scanning the site.
Web designers need to understand users expectations.
All links should be underlined at the very least. Any other use of underlined text or blue words should be avoided as these can be confused with links.
17. May 2007 12:18
I've just been watching the IIS 7.0 episode of the .NET Show. One of the new exciting features of IIS 7.0 for people who run their sites on a shared hosting environment are the new Delegated, Remote Administration options.
Essentially this will allow developers who do not have access to IIS on the box to use an IIS client tool to configure their site remotely over HTTP. This obviously relies on the hosting company to offer this functionality.
This has been a major bugbear for developers running their sites on IIS in the past in a shared environment. If set-up correctly it should allow hosting companies to save time and money by delegating some IIS functionality out to the site administrators.
I've recently moved hosting companies in order to get ASP.NET and the .Net framework 2.0, and I think that it will be big selling point for hosting firms. As far as I'm aware you will need Vista or Longhorn server to get IIS 7.0 however, so we may not see hosting companies offering this for a while yet.
16. May 2007 13:44
XSLT is a powerful method of converting XML into another well-formed XML based document. You can for example transform RSS syndication format into ATOM and even XML into XHTML.
Probably the easiest way to debug your XSLT is to use the Firefox web browser. Make sure you have the Web Developer toolbar (by Chris Pederick) installed.
You'll need to add a stylesheet to the XML document you're transforming using a declaration like this:
<?xml version='1.0' encoding='UTF-8'?>
<?xml-stylesheet type="text/xsl" href="transformAtomFormat.xsl"?>
Then in Windows Explorer right-click the XML document and open in Firefox. You'll see the rendered output of your transformation in the browser. If you view the page source you'll see your XML source, not much use when you want to see the output source of your XSLT transformation. For this you need to right click somewhere on the page, find the Web Deveoper toolbar menu and choose "View Generated Source" from the sub-menu. Now you'll see what Firefox is rendering to the screen.
Find out more about XSLT at W3 Schools