<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="http://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:georss='http://www.georss.org/georss' xmlns:gd='http://schemas.google.com/g/2005' xmlns:thr='http://purl.org/syndication/thread/1.0'><id>tag:blogger.com,1999:blog-7239522</id><updated>2011-04-21T14:06:59.001-05:00</updated><category term='reviews'/><title type='text'>The Useful Web</title><subtitle type='html'>Finding things useful in a ever-growing sea of webpages.  Reviews, articles, and general opinions. Great emphasis placed on Website Usability Standards.</subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/posts/default'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default?max-results=100'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><generator version='7.00' uri='http://www.blogger.com'>Blogger</generator><openSearch:totalResults>61</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>100</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-7239522.post-114368676059892728</id><published>2006-03-07T13:44:00.000-06:00</published><updated>2007-01-16T00:42:58.371-06:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='reviews'/><title type='text'>eyeOS 0.8.11</title><content type='html'>The &lt;a href="http://www.eyeos.org/" title="Link to eyeOS.org"&gt;eyeOS project&lt;/a&gt; is one that I have been checking in on from time to time. I've been keeping close watch on it because it seems to have a great deal of potential. For those who are not aware, eyeOS is exactly what people have been thinking might happen to the Internet. It is essentially an operating system that runs in your browser.&lt;br /&gt;&lt;br /&gt;Now, they have &lt;a href="http://www.eyeos.net/eyeOS/" title="Link to the demo version of eyeOS"&gt;a demo version online&lt;/a&gt;, but today, I decided to install their 0.8.11 version on my server and see how it was to work with. First of all, I have to say that this may have actually beaten WordPress for &lt;a href="http://www.eyeos.org/UserManual" title="Link to Installation information"&gt;easiest install&lt;/a&gt;. If not, it definitely matched it. It was incredibly quick and easy. It was basically the following:&lt;br /&gt;&lt;br /&gt;Download the files. Un(tar/zip) them. Upload the whole folder to somewhere on your web server / host. Change the permissions on three folders. Then point your browser at the new main folder, and it starts the install script which only asks you for a password and username. That's it.&lt;br /&gt;&lt;br /&gt;Then when you go to your new eyeOS folder on your domain, you see this login page:&lt;br /&gt;&lt;a href="http://img142.imageshack.us/img142/2734/eyeos19ir.jpg" title="Offsite Image Link to EyeOS 1"&gt;&lt;img src="http://img142.imageshack.us/img142/2734/eyeos19ir.th.jpg" style="border: medium none ;" alt="EyeOS Login page" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;After logging in, you are shown a desktop type environment inside your browser:&lt;br /&gt;&lt;a href="http://img433.imageshack.us/img433/5679/eyeos25qp.jpg" title="Offsite Image Link to EyeOS 2"&gt;&lt;img src="http://img433.imageshack.us/img433/5679/eyeos25qp.th.jpg" style="border: medium none ;" alt="EyeOS Desktop page" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;There are several applications buttons on the screen, and I explored through those some. This is a view of eyeEdit (a file editor) and eyeBoard (like a tag board).&lt;br /&gt;&lt;a href="http://img445.imageshack.us/img445/9685/eyeos31sf.jpg" title="Offsite Image Link to EyeOS 3"&gt;&lt;img src="http://img445.imageshack.us/img445/9685/eyeos31sf.th.jpg" style="border: medium none ;" alt="EyeOS eyeEdit and eyeBoard" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;One thing I found interesting about the eyeBoard was that it did function for simultaneous connections (I created another account in eyeOS for a friend and had him log in and type on there also) and essentially worked as a regular tag board or pseudo-chat.&lt;br /&gt;&lt;br /&gt;Of course, for more communications there is a full contact book (eyePhones) for you to use, and a calendar system (eyeCalendar) integrated.&lt;br /&gt;&lt;a href="http://img445.imageshack.us/img445/1400/eyeos47vo.jpg" title="Offsite Image Link to EyeOS 4"&gt;&lt;img src="http://img445.imageshack.us/img445/1400/eyeos47vo.th.jpg" style="border: medium none ;" alt="EyeOS eyePhones and eyeCalendar" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Additionally they offer built in themes, and you can also change the 'desktop' image. This is in the eyeOptions application. I definitely appreciated that because the default scheme was just a touch too light and somewhat hard on the eyes for me. They have two alternate themes built into this version by default, one that is a Mac style, and one that is more Linux like. Amazingly, I could actually see the log out and the trash can when I switched themes :P&lt;br /&gt;&lt;a href="http://img434.imageshack.us/img434/7105/eyeos52cu.jpg" title="Offsite Image Link to EyeOS 5"&gt;&lt;img src="http://img434.imageshack.us/img434/7105/eyeos52cu.th.jpg" style="border: medium none ;" alt="EyeOS eyeOptions Changing the Desktop" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;The only thing that I did notice was this error coming up periodically.&lt;br /&gt;&lt;a href="http://img434.imageshack.us/img434/1851/eyeos68fp.jpg" title="Offsite Image Link to EyeOS 6"&gt;&lt;img src="http://img434.imageshack.us/img434/1851/eyeos68fp.th.jpg" style="border: medium none ;" alt="EyeOS Recurring Error Box" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;This mostly happened when I tried to do too many things too fast (okay, so I was a bit jazzed trying it out). I'd be dragging windows really quickly, or swapping through them, and I'd have this pop up. I just clicked 'continue' and let the script catch up and it was fine every time.&lt;br /&gt;&lt;br /&gt;Overall, I really can't express how exciting I think this project idea is. For a long while people have been speculating whether or not we will just start having barebones computers with browsers and that run it all.. and if it were hosted by several main companies, an end user would have their files anywhere, and never have to update their OS. Very nifty.&lt;br /&gt;&lt;br /&gt;Probably the most cool thing about this idea: It's not only opensource (GPL) ... but it's made with XHTML, XML, Javascript, and PHP... so this lovely little (only 2.3 megs untarred!!) virtual OS can easily have most Ajax apps merge into it with just a few modifications for interpretation. That said, you need to be using a modern browser to use it.&lt;br /&gt;&lt;br /&gt;Very neat stuff. You can &lt;a href="http://sourceforge.net/donate/index.php?group_id=145027" title="Link to Sourceforge donation page"&gt;donate to the eyeOS project&lt;/a&gt;, or you can help out by &lt;a href="http://www.eyeos.org/DeveloperManual" title="Link to the Developer Info"&gt;making little apps or graphics&lt;/a&gt;, or various other things any open project usually needs. The new app of the week they are talking about is an add-in &lt;a href="http://www.eyeapps.org/?section=eyeapp&amp;category=Internet&amp;amp;app=Blog" title="Link to blog application info"&gt;blog application&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/03/07/eyeos-0811/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368676059892728?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/03/07/eyeos-0811/' title='eyeOS 0.8.11'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368676059892728'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368676059892728'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/03/eyeos-0811.html' title='eyeOS 0.8.11'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368665241478568</id><published>2006-03-06T17:42:00.000-06:00</published><updated>2006-03-29T20:44:12.483-06:00</updated><title type='text'>Patents for the Web?</title><content type='html'>How far will this go? I have &lt;a href="http://news.com.com/Company%20claims%20patent%20win%20in%20online%20rich%20media/2100-1030_3-6042085.html" title="Link To News.com Article"&gt;read&lt;/a&gt; &lt;a href="http://www.linuxpipeline.com/news/180207721" title="Link To LinuxPipeline.com Article"&gt;many&lt;/a&gt; &lt;a href="http://www.informationweek.com/story/showArticle.jhtml?articleID=180206472&amp;cid=RSSfeed_IWK_News" title="Link To InformationWeek.com Article"&gt;of&lt;/a&gt; &lt;a href="http://ajaxian.com/archives/patents-gone-wild-ajax-and-rich-media" title="Link To Ajaxian.com Article"&gt;the&lt;/a&gt; &lt;a href="http://www.aviransplace.com/index.php/archives/2006/02/22/us-grants-patent-for-ajax/" title="Link To Aviransplace.com Article"&gt;online&lt;/a&gt; &lt;a href="http://digg.com/programming/U.S._Grants_Patent_For_Using_AJAX" title="Link To Digg.com Article"&gt;discussions&lt;/a&gt; regarding the new patent granted to &lt;a href="http://www.balthaser.com" title="Link To Balthaser.com"&gt;Balthaser&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;What caused the original panic (myself included) were quotes like the following:&lt;br /&gt;&lt;br /&gt;From &lt;a href="http://news.com.com/Company%20claims%20patent%20win%20in%20online%20rich%20media/2100-1030_3-6042085.html"&gt; News.com&lt;/a&gt;&lt;br /&gt;&lt;blockquote cite="http://news.com.com/Company%20claims%20patent%20win%20in%20online%20rich%20media/2100-1030_3-6042085.html"&gt;"The patent covers all rich-media technology implementations including Flash, Flex, Java, AJAX and XAML and all device footprints which access rich-media Internet applications including desktops, mobile devices, set-top boxes and video game consoles," Balthaser added. "Balthaser will be able to provide licenses for almost any rich-media Internet application across a broad range of devices and networks."&lt;/blockquote&gt;&lt;br /&gt;&lt;br /&gt;and this headline from &lt;a href="http://www.informationweek.com/story/showArticle.jhtml?articleID=180206472&amp;cid=RSSfeed_IWK_News"&gt;Information Week&lt;/a&gt; &lt;br /&gt;&lt;blockquote&gt;The patent--issued on Valentine's Day--covers all rich-media technology implementations, including Flash, Flex, Java, Ajax, and XAML, when the rich-media application is accessed on any device over the Internet, according to the patent holders.&lt;/blockquote&gt;&lt;br /&gt;&lt;br /&gt;From what I can determine from reading the &lt;a href="http://patft.uspto.gov/netacgi/nph-Parser?Sect1=PTO1&amp;Sect2=HITOFF&amp;d=PALL&amp;p=1&amp;u=/netahtml/srchnum.htm&amp;r=1&amp;f=G&amp;l=50&amp;s1=7,000,180.WKU.&amp;OS=PN/7,000,180&amp;RS=PN/7,000,180" title="Link to the full patent text"&gt;actual patent text&lt;/a&gt; (which is beyond ridiculously long) - what they are patenting is ability to create a online interactive web creation application. Does this encompass some existing technology? Likely. Future technology? For certain. &lt;br /&gt;&lt;br /&gt;What concerns me is that this definitely allows, and even forces, a monopoly on online interactive web site creation apps. If the patent holds up in court, it will make it extremely difficult for anyone who would attempt to create an online application for creating websites (even if they were to open source it or otherwise provide it for free) because those people would have to license the technology rights to even create an online web site creation app. With the whole &lt;em&gt;Web 2.0&lt;/em&gt; innovation movement, it is so likely that someone would have / could create a better product (I mean truly, the accessibility part of me just cringed at the fact that their web app is flash based and creates flash websites). So much of the new internet, and current technology as a whole, is different. The Open Source movement is gaining in strenght, and the amount of open projects that have been successful is beyond impressive. It feels like taking a step backwards to allow patents on broad-based open concepts like this.&lt;br /&gt;&lt;br /&gt;Overall, I find the whole matter quite disturbing.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/03/06/patents-for-the-web/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368665241478568?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/03/06/patents-for-the-web/' title='Patents for the Web?'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368665241478568'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368665241478568'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/03/patents-for-web.html' title='Patents for the Web?'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368653704327848</id><published>2006-03-04T19:39:00.000-06:00</published><updated>2006-03-29T20:42:17.886-06:00</updated><title type='text'>Misleading Resolution</title><content type='html'>This is one of those topics that bears mentioning periodically - screen resolution statistics are misleading.&lt;br /&gt;&lt;br /&gt;Often when people are thinking of creating a fixed-width layout, they are doing so due to what their statistics are telling them. If statistics are saying that 99.5% of their views are from vistors browsing on high resolutions, many people feel safe with breaking out of the box and going above the fixed width recommendation of designing for a minimum of an 800x600 screen resolution. Unfortunately, those statistics are misleading.&lt;br /&gt;&lt;br /&gt;To explain why, I'll use myself as a common example of a misleading visitor. The resolution that would read from a visit from me would be 1400x1050. However, that is not the amount of space I actually use when I'm browsing. I like to keep space around my windows so that I can stack things and watch them while I'm working on something else. Like this screen shot I took of my 1400x1050 resolution desktop (image is resized to 800x600 so as to avoid being ridiculously large for viewers who don't use the resolution I do ;)):&lt;br /&gt;&lt;br /&gt;&lt;a href="http://img442.imageshack.us/img442/9103/screenshot14ct.jpg" title="Screen Shot"&gt;&lt;img src="http://img442.imageshack.us/img442/9103/screenshot14ct.th.jpg" style="border:none;" alt="Image of a screen shot at 1400x1050 resolution" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;You see why it would be misleading to assume that just because your stats say I am using 1400x1050 -- that I actually am? The more screen real estate that a person has, the more prone they are to stagger windows just like this. Additionally, take a look at how small my viewport (the portion where your website is actually show, not including the tool bars) is in comparison to my browser window. So... keep that in mind the next time you are tempted to start making a fixed-width webpage just a little bit larger because your stats 'claim' that your users all have loads of screen space.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/03/04/misleading-resolution/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368653704327848?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/03/04/misleading-resolution/' title='Misleading Resolution'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368653704327848'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368653704327848'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/03/misleading-resolution.html' title='Misleading Resolution'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368630454070313</id><published>2006-03-04T15:35:00.000-06:00</published><updated>2006-03-29T20:38:24.606-06:00</updated><title type='text'>Design Issues</title><content type='html'>As I've &lt;a href="http://nicole.enrogue.com/index.php/2005/12/03/when-design-is-an-issue/"&gt;complained about before&lt;/a&gt;, I have issues with artistic design. The more I think on it, the more I'm convinced that I must have been attacked by an art supply kit as a small child and been left mentally scarred toward anything artisitc. I remember taking an art class once in school. I remember singing country songs with another person in class... but I don't recall actually doing any art. In spite of my lack of art classes, I can actually draw halfway decent pictures of people, eyes I'm particularly good at. Does this help me with web design art at all? Not in the least.&lt;br /&gt;&lt;br /&gt;I've only very recently migrated this blog over here to this new location and am running it on WordPress. However... when it comes to thinking up what sort of design I want to do, I keep hitting mental blocks. The same happens with my personal site. Oddly enough, I don't have this issue with other peoples sites. I can easily design for someone else, I even have marvelous little flashes of artistic flair that pop up when I do... but when it comes to my own sites I have a recurring problem with it. I've tried various techniques to change this, like trying to pretend that I'm designing for someone else. It doesn't work, and I'm still not sure why.&lt;br /&gt;&lt;br /&gt;Granted, for any really artsy and graphical sites, I've always sub-contracted an actual graphic artist to do the work. I guess I am just stubborn when it comes to my own website. Regardless, I am finding myself yet again trying to determine what sort of design I want to do. I have lots of things that I'm going to need to do to this new blog still, and coming up with alternate styles and more accessibility for the new blog is a priority. I'm still just not sure what I want.&lt;br /&gt;&lt;br /&gt;I'm trying to come up with solutions and ideas for themes that would fit both Beyond Caffeine (this blog) and &lt;a href="http://www.websitestyle.com"&gt;Website Style&lt;/a&gt; (my main website that feeds from my blog). A cross between something fun and lively (stylish?) and something elegant and cafe feeling. At the same time, I tend to prefer clean styles - though I am willing to try something different. Is there a way to blend the two smoothly... that is what I'm going to be figuring out. I plan to reboot them both with a new theme for the &lt;a href="http://www.cssreboot.com/" title="Link to CSS Reboot"&gt;May Reboot&lt;/a&gt;, so I've got a while to hopefully come up with some ideas. Suggestions are definitely welcome.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Edit:&lt;/strong&gt; Ironically, the morning after I posted this I came to a realization about the color scheme I wanted for this blog.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/03/04/design-issues/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368630454070313?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/03/04/design-issues/' title='Design Issues'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368630454070313'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368630454070313'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/03/design-issues.html' title='Design Issues'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368610481250959</id><published>2006-03-02T22:33:00.000-06:00</published><updated>2006-03-29T20:35:04.990-06:00</updated><title type='text'>More Improvements on IE7 Beta</title><content type='html'>Microsoft has a new version of their IE7 Beta that will be introduced at the &lt;a href="http://www.mix06.com/" title="Link to the MIX 06 site"&gt;MIX 06&lt;/a&gt; event this month in Vegas. The new beta version, which &lt;a href="http://www.stuffandnonsense.co.uk/" title="Link to Stuff and Nonesense"&gt;Andy&lt;/a&gt; is calling the &lt;a href="http://www.stuffandnonsense.co.uk/archives/the_ie7_mix_06_release.html" title="Link to IE MIX O6 Article"&gt;IE MIX 06&lt;/a&gt; release, seems to have addressed quite a few of the bugs that were causing issues for CSS in the first IE7 Beta (at least from what I can tell with the screenshots). In &lt;a href="http://www.molly.com/2006/03/01/microsoft-ie7-progress-sneak-preview-of-mix06-release/"&gt;her post&lt;/a&gt; on the MIX 06 version shown to her and Andy by &lt;a href="http://blogs.msdn.com/ie/archive/2006/03/02/542287.aspx"&gt;Markus Mielke&lt;/a&gt;, &lt;a href="http://www.molly.com/"&gt;Molly&lt;/a&gt; said she is&lt;br /&gt;&lt;blockquote&gt;..very proud to be here today watching history unfold.&lt;/blockquote&gt;&lt;br /&gt;I can't help but agree. It is a wonderful thing for developers to see the &lt;a href="http://www.stuffandnonsense.co.uk/archives/images/wasp_malarkey.jpg"&gt;screenshots&lt;/a&gt; &lt;a href="http://www.stuffandnonsense.co.uk/archives/images/wasp_gemination.jpg"&gt;given&lt;/a&gt; of how the IE7 beta is evolving. Even more encouraging is that they are reportedly trying to fix a few more of the problems in IE7 before the MIX 06 event.&lt;br /&gt;&lt;br /&gt;I have to admit that I'm very surprised. Maybe I shouldn't be. Perhaps the fact that I am is an example of exactly how jaded I have become over time toward the Microsoft crew. So, I'll start right off with saying this... &lt;em&gt;I feel bad that I'm surprised you did something you said you would do, but in all honestly, you should understand why that is.&lt;/em&gt; IF (*note the slightly hesitant tone*) Microsoft is going to continue to keep making a real effort to better their technology toward standards, then it is only fair that we should all make a real effort to give them a fair shot and not be quite so harsh on them. Okay, enough apologies to Microsoft, I think I've eaten enough hat for one day.&lt;br /&gt;&lt;br /&gt;If you want to attend the &lt;a href="http://www.mix06.com/"&gt;MIX 06&lt;/a&gt; this month (March 20 through 22), but can't afford the cost - there are &lt;a href="http://blog.mix06.com/blog/archive/2006/02/05/154.aspx"&gt;a couple&lt;/a&gt; of &lt;a href="http://microsoftgadgets.com/Blogs/gadgetnews/archive/2006/01/29/2559.aspx"&gt;contests going on&lt;/a&gt; to get you there completely free. They are open to International entrants, and cover every aspect of getting you there and back so that you don't need anything to go. Keep in mind that there is a very quickly approaching deadline on these contests, as the conference itself is this month.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/03/02/more-improvements-on-ie7-beta/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368610481250959?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/03/02/more-improvements-on-ie7-beta/' title='More Improvements on IE7 Beta'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368610481250959'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368610481250959'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/03/more-improvements-on-ie7-beta.html' title='More Improvements on IE7 Beta'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368544042546427</id><published>2006-03-01T15:45:00.000-06:00</published><updated>2006-03-29T20:24:00.553-06:00</updated><title type='text'>Finished Projects</title><content type='html'>I've been very busy the last couple of weeks trying to work on three new site designs, hence the slight lack of posting this past week. Whatever possessed me to get myself in the position to have two competition sites due on the same day... I'm still trying to figure out... but finally, I can say that I'm nearly done with all three, and entirely done with the two sites being entered in contests. The only one left is the one I shifted the most time away from - working on my personal site. Go figure. That's just how that happens.&lt;br /&gt;&lt;br /&gt;&lt;h3&gt;First Things First&lt;/h3&gt;&lt;br /&gt;Yesterday, I finished up tweaking out the &lt;a href="http://www.lovecraftcountry.com" title="Link to Lovecraft Country"&gt;Lovecraft Country&lt;/a&gt; website which is being entered in the &lt;a href="http://www.pmachine.com/shootout/" title="Link to the EE Shootout Contest"&gt;Expression Engine Shootout contest&lt;/a&gt;. The site design is not mine originally, and I'm slated to do a complete remake of the code to strip out the few remaining tables used in the original design. Also, I'll be pulling out quite a few uses of z-index layers which could easily be avoided with good CSS positioning. But, that comes later when I do a full overhaul on the site for the &lt;a href="http://www.cssreboot.com/" title="Link to CSS Reboot"&gt;CSS Reboot&lt;/a&gt; in May.&lt;br /&gt;&lt;br /&gt;For the EE Shootout contest, I had a few things that I absolutely needed to do. The site was using a Javascript image rollover menu bar. I stripped that out and replaced it with a unordered list containing the images and displayed inline. Unfortunately, I first needed to redo the images, because none of them were transparent gifs, and that was important for a menu that was going to flex across a changing image background. Plus, the original text on the menu images was terrible to read, so for some accessibility, I used a more readable font and made the color of the text significantly brighter.&lt;br /&gt;&lt;a href="http://www.lovecraftcountry.com" title="Visit Lovecraft Country.com"&gt;&lt;img src="http://www.websitestyle.com/images/LovecraftCountry.com1_sm.jpg" alt="The Lovecraft Country Main Website" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;The next thing was validation to XHTML. I ran the site through a validator, and found pleasantly few things that needed fixing to bring it up to XHTML 1.0 Transitional. Unfortunately, it will have to wait for the full overhaul to get up to XHTML 1.0 Strict. The only glitch in that validation at all were a few warnings (not errors) from the validator response, and those were caused by some autogenerated scripts from the Expression Engine software itself. Hopefully, when the software is fully upgraded to the current version, those errors will disappear. I then doublechecked the CSS, tossed out a few proprietary rules, and got that up to specs. Then I set to working on the accessibility, and managed to churn it out to nearly a AAA level, and definitely a AA rating.&lt;br /&gt;&lt;br /&gt;Of course, one of the biggest time crunches involved was the opening of the forums I had just finished skinning to match the site. The vBulletin powered forums were simple to work with, but they are still acting twitchy with me when I'm trying to implement the new horizontal menu I finished up. So, for now, I'm leaving the menu on the forums static until I can fix that.&lt;br /&gt;&lt;a href="http://www.lovecraftcountry.com/forums/" title="Visit the Lovecraft Country Forums"&gt;&lt;img src="http://www.websitestyle.com/images/LovecraftCountry.comForums_sm.jpg" alt="The Lovecraft Country New Forums" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Lots of things planned for this site in the future, but for now, at least one thing done, and this one is fully entered in the contest.&lt;br /&gt;&lt;br /&gt;&lt;h3&gt;The Other Contest&lt;/h3&gt;&lt;br /&gt;&lt;br /&gt;Now this contest was for the players of the &lt;a href="www.skotos.net/games/marrach/" title="Link to Castle Marrach"&gt;Castle Marrach&lt;/a&gt; online RPG that I play (though I do play far less these days, and that's probably a good thing). They asked us to try to redesign their public Twiki page. Even more fun to do because the current Public Twiki is a full out blank slate. Here's the current design:&lt;br /&gt;&lt;br /&gt;&lt;img src="http://www.websitestyle.com/images/PublicTwiki_before_sm.jpg" alt="The Old Public Twiki" /&gt;&lt;br /&gt;&lt;br /&gt;And I just entirely redid it.&lt;br /&gt;&lt;br /&gt;&lt;img src="http://www.websitestyle.com/images/PublicTwiki_after1_sm.jpg" alt="The New Public Twiki" /&gt;&lt;br /&gt;&lt;br /&gt;I won't go into detail because there was literally nothing there to start with so &lt;em&gt;Everything&lt;/em&gt; was done to it. The most interesting factor was that I had to do this using the &lt;a href="http://www.twiki.org/" title="Link to Twiki"&gt;Twiki&lt;/a&gt; wiki system and their codes similar to SSI includes to break out the HTML into chunks so that a non-technical user wouldn't hurt the code.&lt;br /&gt;&lt;br /&gt;The only conflict I really had with this design was that I couldn't determine if I wanted the images at the bottom to show through the main area with some transparency.&lt;br /&gt;&lt;br /&gt;&lt;img src="http://www.websitestyle.com/images/PublicTwiki_after2_sm.jpg" alt="The New Public Twiki" /&gt;&lt;br /&gt;&lt;br /&gt;In the end, I decided not to use the transparency and just let the images slide behind. But, the design was submitted on time (early by a half-day even!)&lt;br /&gt;&lt;br /&gt;So... a long couple of weeks, plus working on my primary website redesign which is (thank goodness) nearly complete, and planning for a new seminar on website laws and accessibility... I'm going to just relax for the rest of the night.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/03/01/finished-projects/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368544042546427?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/03/01/finished-projects/' title='Finished Projects'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368544042546427'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368544042546427'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/03/finished-projects.html' title='Finished Projects'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368531775220834</id><published>2006-03-01T13:20:00.000-06:00</published><updated>2006-03-29T20:21:57.836-06:00</updated><title type='text'>The Where Should You Travel? Test</title><content type='html'>YAT (Yet Another Test) I took online. I really liked this one, and I absolutely think the result fits me perfectly. Anyone who knows me well is aware that traveling to Europe and seeing many of the countries there is a dream of mine.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Here is my result:&lt;/strong&gt;&lt;br /&gt;&lt;h4&gt;Train through Europe&lt;/h4&gt;&lt;br /&gt;&lt;strong&gt;You scored 100% culture, 30% social, 31% activity, and 44% adventure!&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;A train trip through Europe is a fantastic way to enrich yourself with many different cultures within a relatively short distance. The train service in Europe is out of this world and almost always on time. It doesn't lump you together with a group since you prefer to be independent, yet it takes the scariness out of navigating around a new country in a rental car, trying to make sense of the map. The train system brings you from downtown to downtown and there are often hotels within a short walk of the station. You could decide which countries interest you the most and if you are eligible, buy a rail pass in advance to save a bundle of money. Arriving at a European train station is an architectureally beautiul way to introduce yourself to a new city and it sets the perfect scene for your new experience. If you had fun dreaming about where you might go, don't forget to rate my test. Thanks!&lt;br /&gt;&lt;br /&gt;About the only thing I don't agree with is the &lt;em&gt;'scariness'&lt;/em&gt; of driving around in a rental car and making sense of a map. I actually prefer to drive myself everywhere, and am very good at reading maps. But I also love trains, so its definitely an appealing idea.&lt;br /&gt;&lt;br /&gt;If you feel like trying out &lt;em&gt;The Where Should You Travel? Test&lt;/em&gt;, you can &lt;a href="http://www.okcupid.com/tests/take?testid=5400898936674105318"&gt;find it here&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/03/01/the-where-should-you-travel-test/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368531775220834?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/03/01/the-where-should-you-travel-test/' title='The Where Should You Travel? Test'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368531775220834'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368531775220834'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/03/where-should-you-travel-test.html' title='The Where Should You Travel? Test'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368514631703491</id><published>2006-02-28T22:17:00.000-06:00</published><updated>2006-03-29T20:19:06.406-06:00</updated><title type='text'>ROR Sitemaps</title><content type='html'>Apparently I got behind in new technologies and had missed hearing about &lt;a href="http://www.rorweb.com/" title="Link to Resource of a Resource (ROR)"&gt;ROR&lt;/a&gt; somehow. Granted, the &lt;a href="http://www.rorweb.com/" title="Link to Resource of a Resource (ROR)"&gt;ROR&lt;/a&gt; technology is only celebrating its' 1 year anniversary, but even still, I do try to keep up. So, essentially, let me cover what I've learned about ROR recently. &lt;br /&gt;&lt;br /&gt;&lt;strong&gt;In A Nutshell:&lt;/strong&gt;&lt;br /&gt;ROR is a an acronym for "Resource of a Resource" and is essentially an XML file that acts as an additional resource about your website for search engines to crawl for relevant data. The more information a search engine has to learn about your website, the more it can help your website positioning in searches. ROR XML files are readable by &lt;em&gt;ALL&lt;/em&gt; search engines.&lt;br /&gt;&lt;br /&gt;This comes in stark contrast to the &lt;a href="http://www.google.com/webmasters/sitemaps/" title="Link to Google Sitemaps"&gt;Google Sitemap&lt;/a&gt; tool that uses a format only Google can read easily. Choosing to use ROR instead, means that Google can read it, but so can every other search engine. Additionally, you can use your &lt;a href="http://www.rorweb.com/" title="Link to Resource of a Resource (ROR)"&gt;ROR&lt;/a&gt; XML file within the Google Sitemaps tracking service for webmasters.&lt;br /&gt;&lt;br /&gt;If you would like to test out what a &lt;a href="http://www.rorweb.com/" title="Link to Resource of a Resource (ROR)"&gt;ROR&lt;/a&gt; sitemap looks like, you can go to this &lt;a href="http://www.rorweb.com/rormap.htm" title="Link to Online ROR Sitemap Generator"&gt;online ROR sitemap generator&lt;/a&gt;, and create your own. You simply upload it to your server, and add a link to it in your HTML. If you wish to use the same file for Google Sitemaps for Webmasters, you can do that. You just go to the &lt;a href="http://www.google.com/webmasters/sitemaps/" title="Link to Google Sitemaps"&gt;Google Sitemap&lt;/a&gt; tool, create an account if you don't have one, add your website and fill in the blank for the URL where your ROR file is. When you've done that, Google will ask you to upload a file to your server to prove it's your server. You upload the file, click a little validate button in the Google Sitemap page, and you've set it all up. Now Google has your site on &lt;em&gt;super-charged indexing mode&lt;/em&gt;.&lt;br /&gt;&lt;br /&gt;The &lt;a href="http://www.rorweb.com/" title="Link to Resource of a Resource (ROR)"&gt;ROR&lt;/a&gt; site has a free software program you can download that will do this for you, and you can add even more detail than the &lt;a href="http://www.rorweb.com/rormap.htm" title="Link to Online ROR Sitemap Generator"&gt;online ROR sitemap generator&lt;/a&gt; does.&lt;br /&gt;&lt;br /&gt;On another good note, the folks who made &lt;a href="http://www.rorweb.com/" title="Link to Resource of a Resource (ROR)"&gt;ROR&lt;/a&gt; also recently came out with a new open project called  &lt;a href="http://www.meaningfuel.org/" title="Link to Meaningful Fuel"&gt;Meaningful Fuel&lt;/a&gt;. This project is a metadictionary wiki, and should be able to be used hand-in-hand to continue to improve ROR.&lt;br /&gt;&lt;br /&gt;Overall, an interesting thing to learn, and I'm definitely glad I found out that I had missed this before another year had passed ;)&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/28/ror-sitemaps/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368514631703491?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/28/ror-sitemaps/' title='ROR Sitemaps'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368514631703491'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368514631703491'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/ror-sitemaps.html' title='ROR Sitemaps'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368494615836450</id><published>2006-02-26T22:12:00.000-06:00</published><updated>2006-03-29T20:16:34.896-06:00</updated><title type='text'>Alternative to _blank</title><content type='html'>As anyone who has tried to validate a website to a Strict doctype knows, the &lt;code&gt;target="_blank"&lt;/code&gt; attribute is no longer allowed. The most common question is &lt;em&gt;Why?&lt;/em&gt; and there is a simple answer.&lt;br /&gt;&lt;br /&gt;In web standards, (X)HTML is for content, CSS is for style, and Javascript is for the behaviors. Opening a new window is not content, nor is it style, it is a behavior. Therefore, it does not belong as a component of the content tags (in this case, the &amp;lt;a&amp;gt; tag). &lt;br /&gt;&lt;br /&gt;Now, we obviously don't want to lose the ability to open a new window for an offsite link. Companies want their webpages to stay open while you see the associated content, not have to leave entirely for it. The solution then, should be obvious, you can handle this behavior through Javascripting.&lt;br /&gt;&lt;br /&gt;The absolute best solution I've seen to this utilizes the &lt;code&gt;rel&lt;/code&gt; attribute of the &lt;code&gt;&amp;lt;a&amp;gt;&lt;/code&gt; tag, and turns...&lt;br /&gt;&lt;code&gt;&amp;lt;a href="document.html" target="_blank"&amp;gt;external link&amp;lt;/a&amp;gt;&lt;/code&gt;&lt;br /&gt;Into...&lt;br /&gt;&lt;code&gt;&amp;lt;a href="document.html" rel="external"&amp;gt;external link&amp;lt;/a&amp;gt;&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;The solution comes from &lt;a href="http://www.sitepoint.com" title="Visit Sitepoint.com"&gt;Sitepoint&lt;/a&gt; and can be viewed &lt;a href="http://www.sitepoint.com/article/standards-compliant-world" title="View Solution"&gt;here&lt;/a&gt; with the full instructions and associated Javascript.&lt;br /&gt;&lt;br /&gt;Perhaps in the future, when more and more people are using browsers with better tabbing abilities and auto-tab-opening of off-site links, this won't be an issue anymore. For now, this is a solution.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/26/alternative-to-target-_blank/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368494615836450?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/26/alternative-to-target-_blank/' title='Alternative to _blank'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368494615836450'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368494615836450'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/alternative-to-blank.html' title='Alternative to _blank'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368472716253522</id><published>2006-02-26T21:10:00.000-06:00</published><updated>2006-03-29T20:12:19.073-06:00</updated><title type='text'>Less Women in Technology?</title><content type='html'>There was &lt;a href="http://www.boston.com/news/local/articles/2005/12/18/in_computer_science_a_growing_gender_gap/" title="A Growing Gender Gap - Article"&gt;an article&lt;/a&gt; that was &lt;a href="http://it.slashdot.org/article.pl?sid=05/12/19/1629224&amp;from=rss" title="Reference to Article - A Growing Gender Gap - on Slashdot"&gt;Slashdotted&lt;/a&gt; in December. I was thinking about this and I wonder what the level of accuracy is. The figures referenced say that in 1985 the percentage of women who received Bachelors degrees in Computer Science was at 37%, but has now dropped to 28% in recent years.&lt;br /&gt;&lt;br /&gt;I'm a touch skeptical, and much of that is in the perspective of the actual context. What are the specific numbers of women (not just percentile) that has changed over the past 20 years? Has that number not grown significantly? Then there is the concept of what they are judging on - the gaining of a bachelors degree in a very specific degree. &lt;br /&gt;&lt;br /&gt;On a personal level, I have to say that many of the Computer Science Bachelors programs I looked at in the past were highly unappealing. So many focused on old and outdated technology, that I felt they were entirely not worth the time and money. Another legacy of a faltering educational system and a gap between what is happening in technology and what is actually understood about it. &lt;br /&gt;&lt;br /&gt;I remember sitting in an database class in college and helping my teacher (male) understand how to use MS Access because he had little previous experience in the software program. I recall a similar instance in a Visual Basic class, and I still have nightmares about the way that web design was (and still is) taught there (i.e., using the &amp;lt;font&amp;gt; tag, etc...). On the other hand, I had one absolutely brilliant C++ teacher that sticks out in my memory - and I struggled with that class a lot because he had difficulty coming down to a beginning level to explain it. Another instance of a great teacher was my Oracle instructor - someone who managed to actually make that awfully complex software conglomeration seem easy to navigate. However - throughout all my technology courses... I have only had one female instructor (and that was in high school, not college). &lt;br /&gt;&lt;br /&gt;However, all that a given, I have to say that in the more niche technology sector of Web Standards, there seem to be quite a larger number of women. So much more so that I would nearly wager that small sector comes closer toward an even split than any part of technology I've worked in before. The ones I've found to have the least amount of women (so far) have been in networking / hardware, and database technology.&lt;br /&gt;&lt;br /&gt;In any event, I think its prudent to not limit these surveys of degree related gender presumptions to only those of one specific degree (or a degree at all really). I'd like to see more broad-scale estimations.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/26/less-women-in-technology/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368472716253522?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/26/less-women-in-technology/' title='Less Women in Technology?'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368472716253522'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368472716253522'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/less-women-in-technology.html' title='Less Women in Technology?'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368461152900791</id><published>2006-02-26T20:07:00.000-06:00</published><updated>2006-03-29T20:10:11.616-06:00</updated><title type='text'>A Reminder on Modes</title><content type='html'>As this came up in a recent discussion, I think its prudent to at least briefly list the ideal doctypes to use for the modes you want to trigger in a browser. Keep in mind that there are three termed modes: &lt;em&gt;Quirks Mode&lt;/em&gt;, &lt;em&gt;Almost Standards Mode&lt;/em&gt;, and &lt;em&gt;Standards Mode&lt;/em&gt;. If you want your pages to display in the manner you intended them to, it is vital to trigger the right mode. For instance, if your pages are highly standardized and reliant on CSS, they will not display the same in Quirks Mode as they will in one of the other two modes. This is a quite common problem when trying to pinpoint why a design isn't displaying correctly.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Quirks Mode:&lt;/strong&gt; If you are planning to use write valid and modern code, you inherently aren't using quirks mode. Quirks mode, by its nature, breaks the W3C conventions. The only use of browsers being able to view things in &lt;em&gt;Quirks Mode&lt;/em&gt; is for backward compatibility with old pages. This should not be used for new designs.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Almost Standards Mode:&lt;/strong&gt; This is a more 'in between' state, though depending on the browser can be more or less close to standards mode as the level of closeness to standards mode varies by browser. For example, Safari has an Almost Standards mode that shows tables without the strict requirements for sizing, while IE6 doesn't do this for their Standards mode. So essentially one browsers' mode may be greater or lesser than anothers.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Standards Mode:&lt;/strong&gt; This is where browsers will fully implement a standards compliant presentation of the page (or at least within the current capabilities of that browser for support of them). &lt;br /&gt;&lt;br /&gt;&lt;h4&gt;Doctypes to Trigger Modes:&lt;/h4&gt;&lt;br /&gt;&lt;strong&gt;Quirks Mode&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;The easiest ways to trigger a fully quirks based mode of a browser is to either present no doctype, or to use one of the following (note the lack of URL):&lt;br /&gt;&lt;code&gt;&amp;lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&amp;gt;&lt;br /&gt;&amp;lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&amp;gt;&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Standards &amp;amp; Almost Standards Mode&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;Well, this is as close as it can come. Standards mode, as I mentioned already, isn't standards mode for all browsers. It varies and sometimes the closest you can come is &lt;em&gt;Almost Standards&lt;/em&gt;. So, take these as just general guidelines. Use one of the following: HTML 4.01, or any of the XHTML doctypes with the full URL. Do not use (at least at this point in time) the XML declaration in your XHTML pages -- it triggers Quirks Mode in IE6 and Opera 7. The following are fine:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;For HTML 4.01 Transitional:&lt;br /&gt;&amp;lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&lt;br /&gt;"http://www.w3.org/TR/html4/loose.dtd"&amp;gt;&lt;br /&gt;&lt;br /&gt;For HTML 4.01 Strict:&lt;br /&gt;&amp;lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"&lt;br /&gt;    "http://www.w3.org/TR/html4/strict.dtd"&amp;gt;&lt;br /&gt;&lt;br /&gt;For XHTML 1.0 Transitional:&lt;br /&gt;&amp;lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"&lt;br /&gt;    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&amp;gt;&lt;br /&gt;&lt;br /&gt;For XHTML 1.0 Strict:&lt;br /&gt;&amp;lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"&lt;br /&gt;    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&amp;gt;&lt;br /&gt;&lt;br /&gt;For XHTML 1.1:&lt;br /&gt;&amp;lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"&lt;br /&gt;    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"&amp;gt;&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;For reference, &lt;a href="http://hsivonen.iki.fi/doctype/" title="Activating the Right Doctype"&gt;this article&lt;/a&gt; contains a chart that will make it much more clear. However, I will mention that the link to the article about how serving XHTML as text being 'harmful' is highly debated and not to be taken as a definitive point of view.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/26/a-reminder-on-modes/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368461152900791?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/26/a-reminder-on-modes/' title='A Reminder on Modes'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368461152900791'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368461152900791'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/reminder-on-modes.html' title='A Reminder on Modes'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368438516258326</id><published>2006-02-20T20:04:00.000-06:00</published><updated>2006-03-29T20:06:25.216-06:00</updated><title type='text'>What's Your CSS Level?</title><content type='html'>&lt;h3&gt;Not a Quiz - Rate Yourself&lt;/h3&gt;&lt;br /&gt;I found this accurate and amusing &lt;a href="http://friendlybit.com/css/levels-of-css-knowledge/" title="The Levels of CSS Knowledge"&gt;little article&lt;/a&gt; on &lt;a href="http://friendlybit.com" title="Friendly Bit"&gt;Friendly Bit&lt;/a&gt; and, of course, it immediately got me thinking. &lt;em&gt;"What Level am I?"&lt;/em&gt;&lt;br /&gt;&lt;br /&gt;Without too much ego, I think I'm sitting around a level 5 and steadily moving toward a level 6 as I work more on my book. I think a level 5 is appropriate in most cases for me. I still struggle sometimes with my CSS, but I find more and more that my problem lies not within the code itself, but within my personal issue with a difficulty coming up with creative designs. I suppose I fit the mold of yet another highly analytical person who has to work very hard to be creative and artistic. I envy those who do both easily.&lt;br /&gt;&lt;br /&gt;On the other hand, a level 6 goes into people who write articles and tutorials, books, and teach others. Of those, I think I fit the mold to a degree, but a lesser one for now. In time, I'd like to write more and more tutorials, and once my book is complete I'd like to get started on my next. The seminars I'm working on are also another major feature of that, so perhaps its a combination.&lt;br /&gt;&lt;br /&gt;Regardless, I found the article rather intriguing for its accuracy, and perhaps something for people to look forward to in the way of goal setting for their web knowledge.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/20/whats-your-css-level/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368438516258326?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/20/whats-your-css-level/' title='What&apos;s Your CSS Level?'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368438516258326'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368438516258326'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/whats-your-css-level.html' title='What&apos;s Your CSS Level?'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114040644032968937</id><published>2006-02-19T21:27:00.000-06:00</published><updated>2006-03-25T10:27:25.946-06:00</updated><title type='text'>This Blog Has Moved!</title><content type='html'>The time has finally come! After badgering, begging, pleading, and endless email groveling for Blogger to fix their broken javascript code that was making my blog unable to validate to XHTML 1.1 or XHTML 1.0 Strict... I've moved.&lt;br /&gt;&lt;br /&gt;Now, this blog has a new look and a new location on a subdomain of my main site here &lt;a href="http://blog.websitestyle.com"&gt;http://blog.websitestyle.com&lt;/a&gt; (which will redirect to the blog here &lt;a href="http://nicole.enrogue.com"&gt;http://nicole.enrogue.com&lt;/a&gt;) but it still has all the same content. Thanks to the shiny new WordPress software running the new blog, not only is it all valid code now, but it smoothly imported everything from Blogger.&lt;br /&gt;&lt;br /&gt;Additionally, The Useful Web has now been retitled Beyond Caffeine. Why? Well, the blog now (*gasp*) actually includes some more personal posts. I have always been very strict about making all my posts entirely technical, but in the new blog home I'm loosening up a bit and letting my hair down. You'll still find all the same technical posts as before, just a few extras also.&lt;br /&gt;&lt;br /&gt;I can finally bid Blogger my final goodbye, and hope to see you all on the other side. Please update your feed links and visit the new home of the blog!&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Edit: I have decided to cross-post all the posts I am making on my WordPress blog at http://blog.websitestyle.com on here. I have turned off commenting on this blog, but each post will contain a comment link to the associated post on the new blog where you may comment.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114040644032968937?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/114040644032968937/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=114040644032968937' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114040644032968937'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114040644032968937'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/this-blog-has-moved.html' title='This Blog Has Moved!'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368419508952997</id><published>2006-02-19T20:00:00.000-06:00</published><updated>2006-03-29T20:07:01.183-06:00</updated><title type='text'>Book Progress</title><content type='html'>&lt;h3&gt;The Road is Long and the Path Filled with Boulders&lt;/h3&gt;&lt;p&gt;A bit of an update as I am trucking through, slowly but steadily on my book. I can surely identify what has been the largest difficulty for me in the past two months. On a good note, I can also say that I have (I believe) overcome that difficulty.&lt;/p&gt;&lt;h4&gt;Primary Problem - Organization&lt;/h4&gt;&lt;p&gt;The organization of how I want to present the information kept repeatedly coming back to me as I was writing. It simply felt... off. I kept having a recurring feeling that the more I wrote, the more I was going to have to later fix. It just wasn't feeling well organized.&lt;/p&gt;&lt;p&gt;It has been an element of extreme importance to me for the book to be easily readable, but in that, one of the most vital aspects is for it to be well organized. I want people to be able to flip to the section they want without any question. Was that happening... well no. I realized that I was writing it more in the way of a desktop reference. Listing things out, and that was not what I wanted to do. So... some changes had to occur.&lt;/p&gt;&lt;h4&gt;A Bridge Across&lt;/h4&gt;&lt;p&gt;I feel like I'm getting closer to being caught up in changing what I had already written to increase the readability. I definitely do not want to make the book complicated to find information in. But, at the same time, I don't want it to be just a desktop reference. I think ('think') that I have reached a solution to it.&lt;/p&gt;&lt;p&gt;Primarily I decided that I'm going to use the approach of how I would explain it (such as the order I would address it were I using a lecture format) and try that method. So far, it is seeming to be significantly better and flow together much nicer.&lt;/p&gt;&lt;p&gt;Hopefully, that will continue. On the downside, getting prepared for organizing a seminar is also putting a bit of a roadblock in my time, and some of the volunteer projects I'm working on are also taking a bit of a bite. I'm sure that it will all work out in due time, and I am definitely on the road to getting this moving along at a better rate now.&lt;/p&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/19/book-progress/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368419508952997?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/19/book-progress/' title='Book Progress'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368419508952997'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368419508952997'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/book-progress.html' title='Book Progress'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368398879977631</id><published>2006-02-18T22:56:00.000-06:00</published><updated>2006-03-29T19:59:48.873-06:00</updated><title type='text'>NGD Test</title><content type='html'>&lt;h3&gt;The Nerd, Geek, or Dork Test&lt;/h3&gt;&lt;p&gt;So I took yet another online quiz from &lt;a href="http://www.okcupid.com"&gt;OkCupid&lt;/a&gt; today. I probably shouldn't be so easily amused by online quizzes, but perhaps that is simply something ultimately reflected in my results ;)&lt;/p&gt;&lt;h4&gt;My Results&lt;/h4&gt;&lt;br /&gt;&lt;strong&gt;Pure Nerd&lt;/strong&gt;&lt;br /&gt; 65 % Nerd, 47% Geek, 17% Dork&lt;br /&gt;&lt;br /&gt; For The Record:&lt;br /&gt;&lt;br /&gt;A Nerd is someone who is passionate about learning/being smart/academia.&lt;br /&gt;A Geek is someone who is passionate about some particular area or subject, often an obscure or difficult one.&lt;br /&gt;A Dork is someone who has difficulty with common social expectations/interactions.&lt;br /&gt;You scored better than half in Nerd, earning you the title of: Pure Nerd.&lt;br /&gt;&lt;br /&gt;The times, they are a-changing. It used to be that being exceptionally smart led to being unpopular, which would ultimately lead to picking up all of the traits and tendences associated with the "dork." No-longer. Being smart isn't as socially crippling as it once was, and even more so as you get older: eventually being a Pure Nerd will likely be replaced with the following label: Purely Successful.&lt;br /&gt;&lt;br /&gt;Congratulations!&lt;br /&gt;&lt;br /&gt;You scored higher than 57% on nerdiness.&lt;br /&gt;You scored higher than 70% on geekosity.&lt;br /&gt;You scored higher than 14% on dork points.&lt;br /&gt;&lt;br /&gt;You can try the test online: &lt;a href="http://www.okcupid.com/tests/take?testid=9935030990046738815"&gt;The Nerd? Geek? or Dork? Test&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Well, guess I can't argue with the results really. I'm a learning fanatic, a life-long learner some would say, and for the high &lt;em&gt;geek&lt;/em&gt; score also ... well, I'm writing about the quiz in a web blog... I guess that says it all.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/18/ngd-test/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368398879977631?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/18/ngd-test/' title='NGD Test'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368398879977631'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368398879977631'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/ngd-test.html' title='NGD Test'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114368375956636361</id><published>2006-02-18T19:49:00.000-06:00</published><updated>2006-03-29T19:55:59.883-06:00</updated><title type='text'>Love Hate (LVHA)</title><content type='html'>&lt;h3&gt;CSS Link Specificity&lt;/h3&gt;&lt;br /&gt;&lt;em&gt;Love Hate&lt;/em&gt; is how I taught myself to remember the order. The acronym for the order (LVHA) just wasn't terribly easy to remember on its own. It didn't spell anything, or really give a sensical meaning to me. But &lt;em&gt;Love Hate&lt;/em&gt; works. So what is LVHA?&lt;br /&gt;&lt;ol&gt;&lt;li&gt;a:&lt;strong&gt;l&lt;/strong&gt;ink&lt;/li&gt;&lt;li&gt;a:&lt;strong&gt;v&lt;/strong&gt;isited&lt;/li&gt;&lt;li&gt;a:&lt;strong&gt;h&lt;/strong&gt;over&lt;/li&gt;&lt;li&gt;a:&lt;strong&gt;a&lt;/strong&gt;ctive&lt;/li&gt;&lt;/ol&gt;&lt;br /&gt;LVHA is the order you should designate your link rules in the CSS so they work together. The way that it is designed to work in CSS, each selector has a specificity. So, just like anything else in the cascade, if there are two selectors that are both applied to one element, the one with the higher specificity is applied. Put them in the wrong order, and you could end up with a page that isn't showing your style rules as you intended them.&lt;br /&gt;&lt;br /&gt;The only two that you can change the order on are the a:link and a:visited (primarily because a link is only either or, never both). Now, keep in mind that you can change a multidute of things with links, but always keep in mind that specificity. To give an example of a potential problem, look at the following CSS:&lt;br /&gt;&lt;h4&gt;Problem Order&lt;/h4&gt;&lt;code&gt;a:link { background-color:white; color: blue }&lt;br /&gt;a:active { background-color: blue; color: white;}&lt;br /&gt;a:hover { background-color: black; color: white;}&lt;br /&gt;a:visited {background-color:white; color:green;}&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;If you use the above CSS, all of it will work &lt;em&gt;Except&lt;/em&gt; the active rules. Those will not show. Why? As I said earlier, visited and link do not have to be in a specific order (though ideally they should be in the LVHA order to keep consistency), but the active has to come after the hover. Due to the active being placed before the hover, that part breaks. Simply swapping the places of the active and hover (within the CSS) will fix the order of the cascade and allow it to all work.&lt;br /&gt;&lt;br /&gt;In CSS2 we were able to combine our pseudo-classes, so that we could customize it further. An example being that you could have a regular hover for a link, but make it different for a visited link:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;a:visited:hover {background-color: green; color: black;}&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;Again, specificity isn't terribly complicated on links if you follow the rule order. There are &lt;a href="http://meyerweb.com/eric/css/link-specificity.html"&gt;several&lt;/a&gt; &lt;a href="http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html"&gt;articles&lt;/a&gt; on this topic, but in general, it doesn't get rough unless you aren't following the order.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://blog.websitestyle.com/index.php/2006/02/18/love-hate-lvha/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114368375956636361?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://blog.websitestyle.com/index.php/2006/02/18/love-hate-lvha/' title='Love Hate (LVHA)'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368375956636361'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114368375956636361'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/love-hate-lvha.html' title='Love Hate (LVHA)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114330412992187078</id><published>2006-02-17T10:27:00.000-06:00</published><updated>2006-03-25T10:28:49.996-06:00</updated><title type='text'>Lists Using the List Tags</title><content type='html'>&lt;h3&gt;Making Menus The Right Way&lt;/h3&gt;&lt;br /&gt;Seems like a &lt;em&gt;No-Brainer&lt;/em&gt; doesn't it? Except that it is, apparently, not the case. I constantly see web pages with code like this for a vertical navigation bar:&lt;br /&gt;&lt;p class="code"&gt;&amp;lt;a href=&amp;quot;1.html&amp;quot;&amp;gt;Link1&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;2.html&amp;quot;&amp;gt;Link2&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;3.html&amp;quot;&amp;gt;Link3&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&amp;lt;br /&amp;gt;&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;I also see a &lt;em&gt;ton&lt;/em&gt; of this for horizonal image based navigation bars:&lt;br /&gt;&lt;p class="code"&gt;&amp;lt;p class="something"&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;1.html&amp;quot;&amp;gt;&amp;lt;img src=&amp;quot;1.gif&amp;quot; alt=&amp;quot;1&amp;quot; style=&amp;quot;width:85px;height:35px; border:none;&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&amp;amp; nbsp; &amp;amp; nbsp;&lt;br /&gt;&amp;lt;a href=&amp;quot;2.html&amp;quot;&amp;gt;&amp;lt;img src=&amp;quot;2.gif&amp;quot; alt=&amp;quot;2&amp;quot; style=&amp;quot;width:85px;height:35px; border:none;&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&amp;amp; nbsp; &amp;amp; nbsp;&lt;br /&gt;&amp;lt;a href=&amp;quot;3.html&amp;quot;&amp;gt;&amp;lt;img src=&amp;quot;3.gif&amp;quot; alt=&amp;quot;3&amp;quot; style=&amp;quot;width:85px;height:35px; border:none;&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&amp;amp; nbsp; &amp;amp; nbsp;&lt;br /&gt;&amp;lt;/p&amp;gt;&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;Now, neither are technically wrong, but both are just plain bad form. The question I always ask myself when I see code like these examples is ... &lt;em&gt;"Why would you put yourself through that editing hell?"&lt;/em&gt; Alas, people do it all the time. There is a much more semantically appropriate way to handle your lists. Let me give some example alternatives utilizing the &amp;lt;ul&amp;gt; and &amp;lt;li&amp;gt; tags.&lt;br /&gt;&lt;br /&gt;&lt;h3&gt;The Vertical&lt;/h3&gt;&lt;br /&gt;Let's make a simple list that could be used for a vertical navigation bar. Additionally, remember that these should go in a &amp;lt;div&amp;gt; called whatever it is that you want to call your navigation area. The code is as follows:&lt;br /&gt;&lt;br /&gt;&lt;h4&gt;HTML&lt;/h4&gt;&lt;p class="code"&gt;&amp;lt;div id=&amp;quot;navigation&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;ul id=&amp;quot;vertical&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;1.html&amp;quot;&amp;gt;Link1&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;2.html&amp;quot;&amp;gt;Link2&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;3.html&amp;quot;&amp;gt;Link3&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;/ul&amp;gt;&lt;br /&gt;&amp;lt;/div&amp;gt;&lt;/p&gt;&lt;br /&gt;&lt;h4&gt;CSS:&lt;/h4&gt;&lt;br /&gt;&lt;p class="code"&gt;#vertical&lt;br /&gt;{&lt;br /&gt;padding-left: 0;&lt;br /&gt;margin-left: 0;&lt;br /&gt;}&lt;br /&gt;#vertical li&lt;br /&gt;{&lt;br /&gt;list-style: none;&lt;br /&gt;margin: 0;&lt;br /&gt;padding: 0.5em;&lt;br /&gt;padding-left: 0;&lt;br /&gt;}&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;So to compare the two ways of doing it:&lt;br /&gt;&lt;h4&gt;Original&lt;/h4&gt;&lt;br /&gt;&lt;p&gt;&lt;a href="1.html"&gt;Link1&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="2.html"&gt;Link2&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="3.html"&gt;Link3&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;h4&gt;With Lists&lt;/h4&gt;&lt;div style="width:200px;"&gt;&lt;br /&gt;&lt;p&gt;&lt;ul style="padding-left:0; margin-left:0;"&gt;&lt;br /&gt;&lt;li style="list-style: none; margin: 0; padding-top: 0.15em; padding-bottom: 0.5em;"&gt;&lt;a href="1.html"&gt;Link1&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li style="list-style: none; margin: 0; padding-top: 0.5em; padding-bottom: 0.5em;"&gt;&lt;a href="2.html"&gt;Link2&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li style="list-style: none; margin: 0; padding-top: 0.5em; padding-bottom: 0.5em;"&gt;&lt;a href="3.html"&gt;Link3&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;/p&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;They should look the same to you. However, I'm betting you are asking yourself, &lt;em&gt;"Why do it that way? My original way took less code!"&lt;/em&gt; True enough. But, the strength is not only in the use of semantic markup, but in the fact that it inherently contains the power of the cascade. When it comes time to make style changes to the first list, the difference is obvious. The first list would require you to manually update all the styles. However, let me show you a couple of changes to the CSS and what that can do to this simple list:&lt;br /&gt;&lt;br /&gt;&lt;h4&gt;Quick Changes With Lists&lt;/h4&gt;&lt;div style="width:200px;"&gt;&lt;br /&gt;&lt;p&gt;&lt;ul style="padding-left:0; margin-left:0; text-align:center;"&gt;&lt;br /&gt;&lt;li style="list-style: none; margin: 2px; padding-top: 0.5em; padding-bottom: 0.5em; border: 1px outset #000; background-color:#99f;"&gt;&lt;a href="1.html"&gt;Link1&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li style="list-style: none; margin: 2px; padding-top: 0.5em; padding-bottom: 0.5em; border: 1px outset #000; background-color:#99f;"&gt;&lt;a href="2.html"&gt;Link2&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li style="list-style: none; margin: 2px; padding-top: 0.5em; padding-bottom: 0.5em; border: 1px outset #000; background-color:#99f;"&gt;&lt;a href="3.html"&gt;Link3&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;/p&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;What did I change? Nothing complicated, only basic CSS. Here's the new style (changes in bold):&lt;br /&gt;&lt;p class="code"&gt;#vertical&lt;br /&gt;{&lt;br /&gt;padding-left: 0;&lt;br /&gt;margin-left: 0;&lt;br /&gt;&lt;strong&gt;text-align:center;&lt;/strong&gt;&lt;br /&gt;}&lt;br /&gt;#vertical li&lt;br /&gt;{&lt;br /&gt;list-style: none;&lt;br /&gt;&lt;strong&gt;margin: 2px;&lt;/strong&gt; /* was 0 */&lt;br /&gt;padding: 0.5em;&lt;br /&gt;padding-left: 0;&lt;br /&gt;&lt;strong&gt;border: 1px outset #000; &lt;br /&gt;background-color:#99f;&lt;/strong&gt;&lt;br /&gt;}&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;h3&gt;The Horizontal&lt;/h3&gt;&lt;br /&gt;I think the most common thing people say about this is, &lt;em&gt;"Wait, the &amp;lt;li&amp;gt; is only a vertical list."&lt;/em&gt; That is wholly inaccurate. It is simply a list. Whether it goes up and down or side to side, it's just a list.&lt;br /&gt;&lt;br /&gt;Below is the code you can use to make your horizontal list using the unordered lists tags. If you don't recall the original code of the first type, you can scroll up and see it near the top of this post.&lt;br /&gt;&lt;br /&gt;&lt;h4&gt;HTML&lt;/h4&gt;&lt;p class="code"&gt;&amp;lt;div id=&amp;quot;navigation&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;ul id=&amp;quot;horizontal&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;1.html&amp;quot;&amp;gt;&amp;lt;img src=&amp;quot;1.gif&amp;quot; alt=&amp;quot;1&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;2.html&amp;quot;&amp;gt;&amp;lt;img src=&amp;quot;2.gif&amp;quot; alt=&amp;quot;2&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;3.html&amp;quot;&amp;gt;&amp;lt;img src=&amp;quot;3.gif&amp;quot; alt=&amp;quot;3&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;/ul&amp;gt;&lt;br /&gt;&amp;lt;/div&amp;gt;&lt;/p&gt;&lt;br /&gt;&lt;h4&gt;CSS:&lt;/h4&gt;&lt;br /&gt;&lt;p class="code"&gt;#horizontal&lt;br /&gt;{&lt;br /&gt;padding-left: 0;&lt;br /&gt;margin-left: 0;&lt;br /&gt;}&lt;br /&gt;#horizontal li&lt;br /&gt;{&lt;br /&gt;display: inline;&lt;br /&gt;list-style-type: none;&lt;br /&gt;padding-right:.5em;&lt;br /&gt;}&lt;br /&gt;#horizontal img {&lt;br /&gt;width:85px;&lt;br /&gt;height:35px; &lt;br /&gt;border:none;&lt;br /&gt;}&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;For the sake of simplicity, I'm going to show the examples using the same image, but you can change the images accordingly.&lt;br /&gt;&lt;h4&gt;Original&lt;/h4&gt;&lt;br /&gt;&lt;p&gt;&lt;br /&gt;&lt;a href="#"&gt;&lt;img src="http://www.websitestyle.com/blog/buttons-em3.gif" alt="1" style="width:85px;height:35px; border:none;" /&gt;&lt;/a&gt;&amp;nbsp; &amp;nbsp;&lt;a href="#"&gt;&lt;img src="http://www.websitestyle.com/blog/buttons-em3.gif" alt="2" style="width:85px;height:35px; border:none;" /&gt;&lt;/a&gt;&amp;nbsp; &amp;nbsp;&lt;a href="#"&gt;&lt;img src="http://www.websitestyle.com/blog/buttons-em3.gif" alt="3" style="width:85px;height:35px; border:none;" /&gt;&lt;/a&gt;&amp;nbsp; &amp;nbsp;&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;&lt;h4&gt;With Lists&lt;/h4&gt;&lt;br /&gt;&lt;ul style="padding-left:0; margin-left:0;"&gt;&lt;br /&gt;&lt;li style="display: inline; list-style-type: none; padding-right:.5em;"&gt;&lt;a href="#"&gt;&lt;img src="http://www.websitestyle.com/blog/buttons-em3.gif" alt="1" style="width:85px;height:35px; border:none;" /&gt;&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li style="display: inline; list-style-type: none; padding-right:.5em;"&gt;&lt;a href="#"&gt;&lt;img src="http://www.websitestyle.com/blog/buttons-em3.gif" alt="2" style="width:85px;height:35px; border:none;" /&gt;&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li style="display: inline; list-style-type: none; padding-right:.5em;"&gt;&lt;a href="#"&gt;&lt;img src="http://www.websitestyle.com/blog/buttons-em3.gif" alt="3" style="width:85px;height:35px; border:none;" /&gt;&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;The one CSS rule that makes this list go horizontal instead of vertical is the &lt;code&gt;display: inline;&lt;/code&gt; rule.&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;You could have a lot more use with this if, for instance, you planed to use one consistent background image and place text on top. Then you can simply change that background image in the style sheet.&lt;br /&gt;&lt;br /&gt;Overall, lists are great. CSS makes them powerful and flexible. So instead of having to change all your lists by hand in each page, try pulling out all the formatting and using an actual list tag for your lists.&lt;br /&gt;&lt;br /&gt;For more references and ideas on making better lists, try stopping over at &lt;a href="http://css.maxdesign.com.au/index.htm"&gt;CSS Maxdesign&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://nicole.enrogue.com/index.php/2006/02/17/lists-using-the-list-tags/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114330412992187078?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://nicole.enrogue.com/index.php/2006/02/17/lists-using-the-list-tags/' title='Lists Using the List Tags'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330412992187078'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330412992187078'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/lists-using-list-tags.html' title='Lists Using the List Tags'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114330272064281897</id><published>2006-02-14T10:03:00.000-06:00</published><updated>2006-03-25T10:05:40.383-06:00</updated><title type='text'>Valentines Day - from ALA</title><content type='html'>&lt;h3&gt;What Developers Love &amp;amp; Hate About the Web&lt;/h3&gt;&lt;br /&gt;&lt;br /&gt;A very interesting couple of posts on ALA today is titled &lt;a href="http://www.alistapart.com/articles/vdaymassacre"&gt;Valentines Day Massacre&lt;/a&gt; and &lt;a href="http://www.alistapart.com/articles/valentines"&gt;Valentines to the Web&lt;/a&gt;. Why? Well, the first one is all about the things that web developers hate about the web. The second is about what we love about it. &lt;br /&gt;&lt;br /&gt;&lt;b&gt;On the Massacre&lt;/b&gt;&lt;br /&gt;&lt;br /&gt;Reading through it, I found myself laughing quite a few times, and nodding along in absolute agreement with much of it.&lt;br /&gt;&lt;br /&gt;Summarizing what many of the contributors had to say, it seems like these are the most commonly noted things we hate (no particular order):&lt;br /&gt;&lt;ul&gt;&lt;li&gt;Microsoft.&lt;/li&gt;&lt;li&gt;Internet Explorer.&lt;/li&gt;&lt;li&gt;Pop-up ads.&lt;/li&gt;&lt;li&gt;Non-standard code.&lt;/li&gt;&lt;li&gt;Sites designed / requiring Internet Explorer.&lt;/li&gt;&lt;li&gt;Trying to keep up with the speed of new technologies.&lt;/li&gt;&lt;li&gt;Blogs with no real content.&lt;/li&gt;&lt;li&gt;Lousy (or overuse of) Macromedia Flash on sites.&lt;/li&gt;&lt;li&gt;Typography display issues.&lt;/li&gt;&lt;li&gt;Lack of ability to have PNG's used globally (read: More Hate for IE).&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;&lt;b&gt;On the Good Stuff&lt;/b&gt;&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;CSS&lt;/li&gt;&lt;li&gt;Dynamic online apps (RoR, Ajax, etc...).&lt;/li&gt;&lt;li&gt;The sheer amount of innovation going on.&lt;/li&gt;&lt;li&gt;Blogging.&lt;/li&gt;&lt;li&gt;The new 'social' web.&lt;/li&gt;&lt;li&gt;Massive amounts of information.&lt;/li&gt;&lt;li&gt;RSS feeds.&lt;/li&gt;&lt;li&gt;The new ideas every day.&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;There were definitely others mentioned, but those are the ones I saw repeated several times. A good post, and a fun read.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Crossposted to &lt;a href="http://nicole.enrogue.com/index.php/2006/02/14/valentines-day-massacre-from-ala/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114330272064281897?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://nicole.enrogue.com/index.php/2006/02/14/valentines-day-massacre-from-ala/' title='Valentines Day - from ALA'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330272064281897'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330272064281897'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/valentines-day-from-ala.html' title='Valentines Day - from ALA'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114330250630074289</id><published>2006-02-14T09:57:00.000-06:00</published><updated>2006-03-25T10:02:26.300-06:00</updated><title type='text'>Target Falls Short</title><content type='html'>&lt;h3&gt;Lawsuit Filed for Lack of Accessibilty&lt;/h3&gt;&lt;br /&gt;One would expect, or are we just hoping, that the larger the company, the more capable they are of affording to have their sites made accessible. The idea to this, of course, is that those with the financial power of a mega-chain should be able to hire people experienced in web standards and knowledgeable enough. On the other hand - they could just contract one of the companies or private consultants that specialize in making websites accessible. Obviously, this was not the case with Target.&lt;br /&gt;&lt;br /&gt;Apparently, some 10 months ago, original complaints were made to Target about the lack of accessibilty of their website. It was never fixed. Ten months is far beyond the amount of time needed to fix the problems cited. Those problems noted were fairly straightforward:&lt;br /&gt;&lt;br /&gt;&lt;ol&gt;&lt;li&gt;Pages were lacking the requisite alt text.&lt;/li&gt;&lt;li&gt;Pages used image maps (without alt text) for navigation, but there was no function on the page to do the same as the images in a text version alternative.&lt;/li&gt;&lt;li&gt;The pages required the visual input use of a mouse - inherently pushing keyboard-only users away.&lt;/li&gt;&lt;/ol&gt;&lt;br /&gt;&lt;br /&gt;Simple changes. Any web developer worth their salt could manage those changes quickly. Apparently Target either lacks those kinds of web developers, lacks motivation to please their customers, or blatantly has disregard for the &lt;a href="http://justaddwater.dk/2006/01/20/one-of-four-web-users-are-disabled-users/"&gt;25% of all web users&lt;/a&gt; who are disabled. None of those are exactly what I would consider good options.&lt;br /&gt;&lt;br /&gt;In any event, the &lt;a href="http://www.nfb.org/"&gt;National Federation of the Blind&lt;/a&gt; (NFB) has filed a suit against the U.S. based (California) Target company. They are attempting to have it done as a class-action suit. (&lt;a href="http://www.dralegal.org/downloads/cases/target/nfb_v_target_complaint.pdf"&gt;Full document available here in PDF.&lt;/a&gt;) Now, apparently just in the last few days (after the suit was filed) there have been some changes made to the website to help improve some of the accessibility.&lt;br /&gt;&lt;br /&gt;I find it truly pitiful that a fear of losing money in a lawsuit has to be the motivator for a change so simple to do. In this time, when web standards are absolutely necessary for any business (and eventually, we can hope, across all websites), I find it very disappointing that a major company would go to such lengths to alienate customers. Obviously they are concerned about their bottom line -- are their analysts so entirely behind as to not realize the percentage of people who would be lost as potential customers due to this? It would seem not. &lt;br /&gt;&lt;br /&gt;Again, another reason to learn standards. I hope that this case goes through successfully for the NFB, and that Target is penalized for its blatant disregard to its customers, and its lack of consideration toward those with a physical handicap. Hopefully, this case will set a new &lt;em&gt;'standard'&lt;/em&gt; (a legal one this time), that might make people sit up and pay attention to what is going on in the world of the web.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://nicole.enrogue.com/index.php/2006/02/14/target-falls-short/#comment"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114330250630074289?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://nicole.enrogue.com/index.php/2006/02/14/target-falls-short/' title='Target Falls Short'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330250630074289'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330250630074289'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/target-falls-short.html' title='Target Falls Short'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-114330106350090661</id><published>2006-02-13T09:34:00.000-06:00</published><updated>2006-03-25T10:03:34.773-06:00</updated><title type='text'>TAC Test</title><content type='html'>Okay, so as some know, I'm a fiend for online quizzes. I love toying around with the things, and I ran across this one tonight. Had a bit of fun taking it.&lt;br /&gt;&lt;br /&gt;This one was called &lt;em&gt;The Tits, Ass, and Cuteness Test&lt;/em&gt;. The following are my results:&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Curvy and Naughty&lt;/strong&gt;&lt;br /&gt;Raw score: 59% Big Breasts, 68% Big Ass, and 40% Cute!&lt;br /&gt;&lt;img src="http://is0.okcupid.com/graphics/chicken_pot_pie/jolie.jpg" alt="Angelina Jolie" style="width:80%;" /&gt;&lt;br /&gt;&lt;br /&gt;Thanks for taking the T and A and C test! Based on your selections, the results are clear:  You show an attraction to &lt;strong&gt;larger breasts, larger asses, and sexier composures&lt;/strong&gt; than others who've taken the test.&lt;br /&gt;&lt;br /&gt;Note that &lt;strong&gt;you like women overall curvier than average&lt;/strong&gt;. &lt;br /&gt;&lt;br /&gt;My third variable, &lt;strong&gt;"cuteness"&lt;/strong&gt; is a mostly objective measure of how innocent a given model looked. It's determined by a combination of a lot of factors: lack of dark eye makeup, facial expression, posture, etc. If you scored high on that variable, you are either really nice OR you're into deflowering teens. If you scored low, you are attracted to raunchier, sexier, women. &lt;em&gt;In your case, your lower than average score suggests you appreciate a sexier, naughtier look. Kudos!&lt;/em&gt;&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Recommended Celebrities:&lt;/strong&gt; Supermodel Laetitia Casta and Actress Angelina Jolie.&lt;br /&gt;&lt;br /&gt;My test tracked 3 variables How you compared to other people &lt;em&gt;your age and gender&lt;/em&gt;:&lt;br /&gt;&lt;br /&gt;You scored higher than 74% on tit-size.&lt;br /&gt;You scored higher than 79% on ass-size&lt;br /&gt;You scored higher than 9% on cuteness&lt;br /&gt;&lt;br /&gt;So... my results were amusing and quite accurate. Overall, I think I've got some decent taste. If you want to try the test, the link is here: &lt;a href="http://www.okcupid.com/tests/take?testid=15912893200295081418"&gt;The Tits, Ass, and Cuteness Test&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;Cross-posted to &lt;a href="http://nicole.enrogue.com/index.php/2006/02/13/tac-test/#comment" title="Link to Article Comments"&gt;take your comments&lt;/a&gt; on Beyond Caffeine.&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-114330106350090661?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://nicole.enrogue.com/index.php/2006/02/13/tac-test/' title='TAC Test'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330106350090661'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/114330106350090661'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/02/tac-test.html' title='TAC Test'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113718472337802600</id><published>2006-01-13T14:23:00.000-06:00</published><updated>2006-01-13T14:38:43.893-06:00</updated><title type='text'>Random Ajax - Fun with Lists 1</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Random Ajax - Fun with Lists&lt;/h3&gt;&lt;p&gt;There are a lot of ways to use Ajax, some of which are definitely better than others. People have been working on some great encompassing scripts that will simplify the handling of multiple Ajax uses on a website. A few of the most notable are script collections from &lt;a href="http://script.aculo.us/"&gt;Script.aculo.us&lt;/a&gt;, &lt;a href="http://prototype.conio.net/"&gt;Prototype&lt;/a&gt;, and &lt;a href="http://bennolan.com/behaviour/"&gt;Behaviour&lt;/a&gt;. Note, that I did not include the now famous &lt;a href="http://www.rubyonrails.com/"&gt;Ruby on Rails&lt;/a&gt; script collections that have become a framework for Ajax development with Ruby. The reason I did not was because it is specific to Ruby. The script packages that appeal the most to me are the ones that can easily interface with multiple languages (see those three named above).&lt;/p&gt;&lt;p&gt;I have made a little test page (one of many more I hope) that shows how you can script and implement some simple Ajax using the Script.aculo.us and Prototype base scripts. Feel free to look at the source code of &lt;a href="http://www.websitestyle.com/blog/ajax/samples/lists1.html"&gt;sample page&lt;/a&gt; and see the underlying code. The only header script references actually needed in the document itself are these:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;script src=&amp;quot;http://www.websitestyle.com/blog/prototype.js&amp;quot; type=&amp;quot;text/javascript&amp;quot;&amp;gt;&amp;lt;/script&amp;gt;&lt;br /&gt;&amp;lt;script src=&amp;quot;http://www.websitestyle.com/blog/behaviour.js&amp;quot; type=&amp;quot;text/javascript&amp;quot;&amp;gt;&amp;lt;/script&amp;gt;&lt;/p&gt;&lt;p&gt;There is an additional script that goes in the page also, and that can also be linked to separately. However, in order for the two scripts above to work, the rest of the collection (just a few extra js files) should reside on in files on your server also so they can be called if needed. There is an explantion of how to use those base scripts &lt;a href="http://wiki.script.aculo.us/scriptaculous/show/Usage"&gt;here&lt;/a&gt; on the Script.aculo.us site.&lt;/p&gt;&lt;p&gt;When you look at the &lt;a href="http://www.websitestyle.com/blog/ajax/samples/lists1.html"&gt;draggable lists demo&lt;/a&gt; you will see some extra things added to it for formatting purposes. However, the only things actually required to make it run are labling the &lt;code&gt;&amp;lt;ul&amp;gt;&lt;/code&gt; section for each list with the appropriate id (in this case either id=firstlist or id=secondlist), the script directly below the lists in the page, and those two scripts referenced above. Everything else is just to make it pretty or to enhance useability.&lt;/p&gt;&lt;p&gt;I will try to add more of these example pages, and go into some of the fun little ways you can toy with Ajax. In fact, I plan to actually do more with this example, so perhaps it will get updated later with additions). For now, hopefully this will be a fun little thing to take a look at.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113718472337802600?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113718472337802600/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113718472337802600' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113718472337802600'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113718472337802600'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/01/random-ajax-fun-with-lists-1.html' title='Random Ajax - Fun with Lists 1'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113711105248171512</id><published>2006-01-12T17:33:00.000-06:00</published><updated>2006-01-12T18:20:33.773-06:00</updated><title type='text'>Generated Content</title><content type='html'>&lt;/p&gt;&lt;h3&gt;CSS - Generated Content&lt;/h3&gt;&lt;p&gt;After spending some of today in discussion with a friend on how to work with generated content in CSS, I've decided to take that discussion a bit further and go over the basics here. First, a great reference for generated content is on the W3C site, and can be &lt;a href="http://www.w3.org/TR/REC-CSS2/generate.html"&gt;found here.&lt;/a&gt;&lt;/p&gt;&lt;p&gt;Typically you are going to use generated content in combination with a pseudo class. For instance, the &lt;code&gt;:before&lt;/code&gt; pseduo class is often associated with generated content. To elaborate on that, consider this simple example:&lt;/p&gt;&lt;p&gt;Goal: Create a list of links, and flag some links a generated 'New!' text that is red to indicate which of those links has been updated recently.&lt;/p&gt;&lt;p&gt;So, start by making the simple unordered list (code shown after).&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="#"&gt;Section Foods&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="#"&gt;Section Books&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="#"&gt;Section Links&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;p class="code"&gt;&amp;lt;ul&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Section Foods&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Section Books&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;li&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Section Links&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;br /&gt;&amp;lt;/ul&amp;gt;&lt;/p&gt;&lt;p&gt;Now, we have a list a you probably have some general formatting that should apply to the list elements (in your CSS file). But, you can now add some generated content. It's very simple to do. You'll add these two rules to your CSS file:&lt;/p&gt;&lt;p class="code"&gt;li.updated:before { content: &amp;quot;New! &amp;quot;;}&lt;/p&gt;&lt;p&gt;Then you want to change it so that the color of that text is red, so you simply modify that code as follows:&lt;/p&gt;&lt;code&gt;li.updated:before { content: &amp;quot;New! &amp;quot;;color: red }&lt;/code&gt;&lt;p&gt;Now you can continue on by adding the &lt;code&gt;class="updated"&lt;/code&gt; indicator to the list items where they have been updated. For example:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;li class=&amp;quot;updated&amp;quot;&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Section Foods&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;&lt;/p&gt;&lt;p&gt;Pretty simple eh? You could do the same thing with an image of course. Another great use for this ability to generate content is for quotes. I have used this quite a few times, and though pseudo-classes are not supported by Explorer, it is still quite a nice feature to tinker with. You can easily generate an open quote and an end quote around your blockquoted text. You just need to add the following rules to your CSS:&lt;/p&gt;&lt;code&gt;blockquote:before { content: open-quote }&lt;br /&gt;blockquote:after { content: close-quote }&lt;/code&gt;&lt;p&gt;There are lots of little things you can do with the generated content, just keep in mind that since pseudo classes are not globally supported by browsers, in order to stay true to accessibility, they should only be used to enhance. Don't make your content rely on them.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113711105248171512?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113711105248171512/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113711105248171512' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113711105248171512'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113711105248171512'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2006/01/generated-content.html' title='Generated Content'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113388381111115740</id><published>2005-12-06T09:23:00.000-06:00</published><updated>2005-12-06T09:43:31.333-06:00</updated><title type='text'>BBC News Embraces the Blog</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Another Step Toward Tech&lt;/h3&gt;&lt;p&gt;It appears that the BBC has decided to &lt;a href="http://blogs.bbc.co.uk/nickrobinson/2005/12/the_beauty_of_b.html"&gt;try out blogging&lt;/a&gt; using &lt;a href="http://blogs.bbc.co.uk/nickrobinson/2005/11/about_nick_robi.html"&gt;Nick Robinson&lt;/a&gt; as their guinea pig. Probably not a bad idea really, since Robinson wrote his &lt;a href="http://news.bbc.co.uk/1/hi/uk_politics/1656482.stm"&gt;Newslog&lt;/a&gt; for quite some time, so he has some experience in this sort of thing. They are starting out with one blog, but say that this is only a trial and that more will be added. The seem to be using Typepad, and it is being hosted by the folks over at &lt;a href="http://www.sixapart.com"&gt;Six Apart&lt;/a&gt;.&lt;/p&gt;&lt;p&gt;So far, looking at that amount of comments they are getting, it seems to be working out well. It is good to see the BBC getting on the blogging bandwagon. MSNBC already has been sucessfully &lt;a href="http://msnbc.msn.com/id/3032105/"&gt;blogging&lt;/a&gt; for some time now. That I am aware of, &lt;a href="http://www.cnn.com/"&gt;CNN&lt;/a&gt; isn't blogging, except for a couple of major events they did back in the 2004 elections. Fox News has a rather &lt;a href="http://www.foxnews.com/index.html#blogs"&gt;small selection&lt;/a&gt; of blogs that they run. Of those, the &lt;a href="http://www.foxnews.com/story/0,2933,177683,00.html"&gt;Gretawire&lt;/a&gt;, the blog of &lt;a href="http://www.foxnews.com/story/0,2933,44364,00.html"&gt;Greta Van Susteren&lt;/a&gt; who is the anchor for the &lt;em&gt;On the Record&lt;/em&gt; show, seems to be the most active.&lt;/p&gt;&lt;p&gt;Overall, a small step but good step for the BBC. I like the increased interaction between the news people and the community, and I think that there could be some real feedback that comes from it.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113388381111115740?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113388381111115740/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113388381111115740' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113388381111115740'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113388381111115740'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/12/bbc-news-embraces-blog.html' title='BBC News Embraces the Blog'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113388156841787317</id><published>2005-12-03T08:54:00.000-06:00</published><updated>2005-12-06T09:10:32.600-06:00</updated><title type='text'>When Design is an Issue</title><content type='html'>&lt;/p&gt;&lt;h3&gt;The Coders Challenge - Good Design&lt;/h3&gt;&lt;p&gt;I have to admit that when it comes to actual design, I often find myself at a loss. I can certainly look at a website and spot good design when I see it, but alas, when it comes to doing it for my own sites I tend to hit a brick wall.&lt;/p&gt;&lt;p&gt;I can very easily admit that I've never been the most creative or artistic of people, but I personally find it very frustrating to not have that ability to gain those moments of 'insight' into design elements. More often than not, what begins as a simple design ends up becoming more and more complex until I no longer like it. Somewhere along the line I lose that element of simplicity that I find so appealing in other sites.&lt;/p&gt;&lt;p&gt;So, I find myself wondering how it is that people with this particular limitation can change that. I am most assuredly, a coder - not a designer. While I understand that statement is considered the universal excuse for poor design, it became that for a reason. I know I'm not the only one who has this issue. So, where to begin with that good design?&lt;/p&gt;&lt;p&gt;In business, I prefer to work with designers who will create a layout for me, and simply make the code work marvelously for those sites. A bit of a stubborn streak on my end is intent upon designing my own sites myself. However, having just revamped the design of this blog and my website, I find that I am already displeased with it and feeling the urge to redesign again.&lt;/p&gt;&lt;p&gt;All that really tells me is that I either felt it was 'good' because I'd finally finished wrangling with it but that it never really was, or that I simply have one of the most short-term interest levels in the world. I'd prefer to lean toward the latter, because the former is definitely one that rings more true but is also a reflection of what I would consider a consistent issue of design failure.&lt;/p&gt;&lt;p&gt;So, here I sit this morning, browsing through some various designs and trying to find that 'flash' of inspiration. A design that I will like for more than a couple of weeks. I'm certain that somewhere in the midst of all the coding languages floating around in my mind, there are a few creative brain cells somewhere. Perhaps they just like to sleep in late in the morning.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113388156841787317?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113388156841787317/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113388156841787317' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113388156841787317'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113388156841787317'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/12/when-design-is-issue.html' title='When Design is an Issue'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113357764667914444</id><published>2005-12-02T20:13:00.000-06:00</published><updated>2005-12-04T18:16:24.383-06:00</updated><title type='text'>CSS - When To Embed</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Addressing a Common Problem&lt;/h3&gt;&lt;p&gt;One of the questions that I have been asked a lot lately is: &lt;i&gt;"How do I know when it's appropriate to use embedded or inline styles?"&lt;/i&gt; The answer is one that I will give from my perspective and experience.&lt;/p&gt;&lt;p&gt;In an ideal world, I'd love to see everyone use external style sheets exclusively so that the complete separation between the content and style is truly enforced. However, practicality often comes crashing through that dreamy ideal.&lt;/p&gt;&lt;p&gt;There are a lot of web programmers out there who have many projects to handle, or maintain very large sites. Each of those has unique aspects, and not all fit the 'ideal' mold for fully extenal style sheet use. Keeping this in mind, I'm going to draw the line very clearly and simply. This is when I think you can use an embedded and inline style:&lt;/p&gt;&lt;quote&gt;You &lt;em&gt;can&lt;/em&gt; use an embedded style when you are adding a style element to a page that will not exist on any other page on the website. If it is used on other pages, it is more appropriate to use an external style. I don't think it is ever truly acceptable to use inline styles. Any inline style should fit the criteria for when it is acceptable to use an embedded style. I think that inline styles are better placed in an embedded style.&lt;/quote&gt;&lt;p&gt;Now, you can surely do anything using external style sheets. However, when handling a website that has many many pages, the concept of having to manage a style sheet that contains hundreds (if not thousands) of lines of various style rules can seem daunting. There is another alternative.&lt;/p&gt;&lt;p&gt;A common solution to dealing with a website project that contains periodic changes throughout is to create a secondary style sheet that is for the 'special' exceptions that take place in your pages. For instance, let's say that all of your pages have the same layout - well, then you can put all of that style information into one css file (ex: base.css). However, let's say that you have various small style rules. Perhaps it is red text for the word 'New' on the products page, or something similar.&lt;/p&gt;&lt;p&gt;Now, an acceptable thing to do is to make a secondary style sheet that holds all of the extra styles that you use infrequently on your website (ex: extra.css). On those pages, you would call both style sheets, but remember to list the link to the secondary style sheet &lt;em&gt;after&lt;/em&gt; after the style sheet that holds all your primary formatting. Example:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;link rel=&amp;quot;stylesheet&amp;quot; href=&amp;quot;base.css&amp;quot; type=&amp;quot;text/css&amp;quot; /&amp;gt;&lt;br /&gt;&amp;lt;link rel=&amp;quot;stylesheet&amp;quot; href=&amp;quot;extra.css&amp;quot; type=&amp;quot;text/css&amp;quot; /&amp;gt;&lt;/p&gt;&lt;p&gt;Following the rules of the cascade, the second style sheet will override any rules of the first one. That is one alternative to using an embedded sheet if you have a lot of random extra styles. However, overall, only use embedded styles when it only applies to a rare instance. If you have a lot of those single instances, you can choose to put them all together in an extra style sheet to make them easier to maintain.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113357764667914444?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113357764667914444/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113357764667914444' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113357764667914444'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113357764667914444'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/12/css-when-to-embed.html' title='CSS - When To Embed'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113335998156063001</id><published>2005-11-30T08:10:00.000-06:00</published><updated>2005-11-30T09:12:00.770-06:00</updated><title type='text'>Linux Survey Results</title><content type='html'>&lt;/p&gt;&lt;h3&gt;The Trend Continues&lt;/h3&gt;&lt;p&gt;Yesterday saw the release of &lt;a href="http://www.desktoplinux.com/news/NS5481370522.html"&gt;some new data&lt;/a&gt; on the 2005 Linux desktop survey over at &lt;a href="http://www.desktoplinux.com"&gt;DesktopLinux.com&lt;/a&gt;. There are a few interesting results from this survey, and also some that are reflected when you examine the Linux flavor usage from the last couple of years. For instance, let's take a look at the 2003/2004 results for Linux flavor choice:&lt;/p&gt;&lt;p&gt;&lt;a href="http://img360.imageshack.us/img360/7330/dldistros23uu.jpg"&gt;&lt;img src="http://img360.imageshack.us/img360/7330/dldistros23uu.th.jpg" alt="2003/2004 Survey Results" title="2003/2004 Survey Results" style="float:left; padding-right: 3px; margin: 1px; border: 0px;"/&gt;&lt;/a&gt;You can see that in 2003 the winner was, by far, Debian with about 34%. However, one year later, Debian's popularity slipped drastically, dropping to about 14% and just barely below RedHat. On the other hand, we saw Mandrake and Suse go head to head in the results to win the flavor of choice.&lt;/p&gt;&lt;p&gt;&lt;a href="http://img366.imageshack.us/img366/4256/osdldtlsurvey122or.jpg"&gt;&lt;img src="http://img366.imageshack.us/img366/4256/osdldtlsurvey122or.th.jpg" alt="2005 Survey Results" title="2005 Survey Results" style="float:right; padding-left: 3px; margin: 1px; border: 0px;" /&gt;&lt;/a&gt; Just one year later we see yet another change in the leader, as it would seem that the new Ubuntu takes the slot with 53% of the vote. However, I don't think it is quite as clear cut as that. The survey separated the Novell Suse and the new Open Suse as two separate options. Having used both personally, I can say that they are nearly identical - the Open version only having all open source packages and none of the extra software. In 'look and feel' though, they are the same. That considered, if we interpret the graph with both of those being the same, Suse as a whole actually takes a total of 60% of the vote. Debian is going back up slowly with 27% now, and RedHAt is continuing its very slow but steady climb. (I do think that the new push to have RedHat installed on the $100 Laptops may change this in the future) Okay, you may have noticed that those don't add up to 100% -- that is because respondents can indicate that they are using more than one of the types of Linux (a rather common occurance among Linux users).&lt;/p&gt;&lt;p&gt;This survey asked more questions than previous years have. When asked what the top reasons for choosing to deploy Linux, there was a bit of a surprise.&lt;/p&gt;&lt;blockquote&gt;[&lt;a href="http://www.desktoplinux.com/news/NS5481370522.html"&gt;Source.&lt;/a&gt;]"What was most surprising to us was probably the top two reasons given for deploying Linux on the desktop," OSDL's Principal Analyst Dave Rosenberg told Ziff Davis Internet. "It's not TCO (total cost of ownership), or security, or lack of license fees. It was 'employees requesting Linux (user demand)' and because 'my competitors have successfully deployed Linux.'"&lt;/blockquote&gt;&lt;p&gt;&lt;a href="http://img371.imageshack.us/img371/2244/osdldtlsurvey111lq.jpg"&gt;&lt;img src="http://img371.imageshack.us/img371/2244/osdldtlsurvey111lq.th.jpg" style="float:left; padding-right: 3px; margin: 1px; border: 0px;" /&gt;&lt;/a&gt; Unsurprisingly, the top three most critical applications to these respondents were for (in order) email, office productivity suites, and browsers. I was also a bit surprised that so many were making a full shift to Linux, not just a partial migration. The majority of respondents reported that they would be running Linux solely on a machine, rather than dual-booting it with another operating system (most commonly Windows).&lt;/p&gt;&lt;p&gt;Perhaps this is reflecting the environment in which more and more companies are finally making the switch. As so many responded that they chose to change to Linux because their competitors had - perhaps it's a scenario of 'Well, if they can go all Linux and No Windows, then so can we.' I'm not sure, but I find it interesting. Linux has really developed as an operating system, and the many flavors of it make for a lot of choice (and at times, a lot of confusion), nevertheless, there are still some very noteable Windows-based programs that don't have a truly comparable Linux equivalent yet. On the other hand - with the speed at which Linux is catching up in the software realm, it may not be too much longer.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113335998156063001?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113335998156063001/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113335998156063001' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113335998156063001'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113335998156063001'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/linux-survey-results.html' title='Linux Survey Results'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113335674196029415</id><published>2005-11-29T23:38:00.000-06:00</published><updated>2005-11-30T07:56:08.636-06:00</updated><title type='text'>Firefox 1.5 - Product Review</title><content type='html'>&lt;/p&gt;&lt;h3&gt;The Next Version - 1.5&lt;/h3&gt;&lt;p&gt;I've been a steady Firefox user for some time now, and wrote a review &lt;a href="http://usefulwebsites.blogspot.com/2005/02/firefox-product-review.html"&gt;previously&lt;/a&gt; about my thoughts on the browser. Today, the most recent version was released to the public, and there are some differences that made me very curious to try it out. Here are the new features that are different from the last public version (1.0):&lt;/p&gt;&lt;blockquote&gt;# Automated update by default and improved.&lt;br /&gt;# Rearranged and improved options / preferences (lets you search your downloads and cookies easily).&lt;br /&gt;# Faster back and forward navigation (using new caching).&lt;br /&gt;# Drag and drop reordering for tabs (as well as via keyboard buttons).&lt;br /&gt;# You can now drag a link to the new window/tab button to open.&lt;br /&gt;# Better popup blocking.&lt;br /&gt;# Clear Private Data feature provides an easy way to quickly remove personal data through a menu item or keyboard shortcut.&lt;br /&gt;# Answers.com added to the search engine list.&lt;br /&gt;# Better support for Mac OS X (10.2 and greater) including profile migration from Safari and Mac IE.&lt;br /&gt;# Many security enhancements.&lt;br /&gt;# Tab thumbnails (when viewing an image only page, a thumbnail of the image is shown as the tab icon)&lt;br /&gt;# New 'Safe Mode'&lt;br /&gt;# Dragging text to the find box intiates a search.&lt;br /&gt;# Allows for integration of custom themes that involve translucent windows (for Win and Linux)&lt;/blockquote&gt;&lt;p&gt;So those alone are a lot of great new additions, but as someone who is involved in standards coding - the following new features really stuck out to me:&lt;/p&gt;&lt;blockquote&gt;# Improvements to product usability including descriptive error pages, and RSS discovery.&lt;br /&gt;# Support for DHTML accessibility.&lt;br /&gt;# Support for assistive technologies (like Window-Eyes 5.5 beta screen reader)&lt;br /&gt;# New support for Web Standards including SVG, CSS 2, CSS 3, and JavaScript 1.6.&lt;br /&gt;# New 'report a site' feature that allows you to report sites that don't display well in Firefox.&lt;/blockquote&gt;&lt;p&gt;Overall, a list of the web standards support in this version is as follows:&lt;/p&gt;&lt;blockquote&gt;# Hypertext Markup Language (HTML) and Extensible Hypertext Markup Language (XHTML): HTML 4.01 and XHTML 1.0/1.1&lt;br /&gt;# Cascading Style Sheets (CSS): CSS Level 1, CSS Level 2 and parts of CSS Level 3&lt;br /&gt;# Document Object Model (DOM): DOM Level 1, DOM Level 2 and parts of DOM Level 3&lt;br /&gt;# Mathematical Markup Language: MathML Version 2.0&lt;br /&gt;# Extensible Markup Language (XML): XML 1.0, Namespaces in XML, Associating Style Sheets with XML Documents 1.0, Fragment Identifier for XML&lt;br /&gt;# XSL Transformations (XSLT): XSLT 1.0&lt;br /&gt;# XML Path Language (XPath): XPath 1.0&lt;br /&gt;# Resource Description Framework (RDF): RDF&lt;br /&gt;# Simple Object Access Protocol (SOAP): SOAP 1.1&lt;br /&gt;# JavaScript 1.6, based on ECMA-262, revision 3: ECMA-262&lt;/blockquote&gt;&lt;p&gt;For the new CSS changes specifically, you will find quotes nesting and support for the quotes property, and for CSS3 we now have :only-child support, columns, overflow-x and overflow-y properties, cursors and uri values for the cursors, as well as the CSS outline property. Now, Firefox 1.5 can lay claim to be the first browser with full DHTML support, and the first browser to meet goverment standards for accessibilty (They've added tons of new features for this purpose, and keyboard shortcuts for everything. You can read the full list &lt;a href="http://www.mozilla.com/firefox/vpat.html"&gt; here.&lt;/a&gt;).&lt;/p&gt;&lt;p&gt;Overall, lots of improvements when it comes to web standards and accessibilty really make this version a boon for any standards enthusiast. I've downloaded and found that many of my extensions are already updated to be compatible with the new version, as well as my themes. It does seem to run faster, but the different isn't overly large. Overall, I look forward to trying out all of the new features over the next weeks.&lt;/p&gt;&lt;p&gt;~Nicole&lt;/p&gt;&lt;p style="font-size: smaller; text-style: italic"&gt;[Details primarily from &lt;a href="http://www.mozilla.com/firefox/releases/1.5.html#new"&gt; here&lt;/a&gt; and &lt;a href="http://www.squarefree.com/burningedge/releases/1.5-comprehensive.html"&gt; here.&lt;/a&gt;]&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113335674196029415?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113335674196029415/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113335674196029415' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113335674196029415'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113335674196029415'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/firefox-15-product-review.html' title='Firefox 1.5 - Product Review'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113322905733316538</id><published>2005-11-28T19:21:00.000-06:00</published><updated>2005-11-29T13:01:39.616-06:00</updated><title type='text'>MIT $100 Laptop - New Updates</title><content type='html'>&lt;/p&gt;&lt;h3&gt;More News on the $100 Wonder&lt;/h3&gt;&lt;p&gt;It has been a while since I've seen much on the $100 MIT laptop that was talked about some months ago. However, there was &lt;a href="http://arstechnica.com/news.ars/post/20051128-5639.html"&gt;an article&lt;/a&gt; today talking about some of the most recent developments. It seems that they have decided to go with RedHat for the operating system. On first hearing that, I was a bit surprised that they were not going to go with the current favorite for user-friendliness and a small install - &lt;a href="http://www.ubuntu.org/"&gt;Ubuntu.&lt;/a&gt; However, after reading on and seeing that one of the sponsors for this massive project is actually RedHat - it makes much more sense now.&lt;/p&gt;&lt;p&gt;In fact, RedHat isn't the only recognizable name in the bunch. &lt;a href="http://www.google.com"&gt;Google&lt;/a&gt; has ponied up $2 million for the project, and Rupert Murdoch (of News Corporation) is a noted player in the project. Of course, one must count in the massive amount of fund-raising done by the OLPC (One Laptop Per Child) foundation, which is run by the man behind the project - Nicholas Negroponte. Apparently Steve Jobs (Macintosh) didn't particularly get on board with the idea at first, but is now helping out with ideas. Michael Dell helped by discounting hardware components, and Bill Gates is (unsurprisingly) trying to convince them to use Windows on the computers instead of open-source software.&lt;/p&gt;&lt;p&gt;As far as the technical specifications go, here is what it looks like it will be so far.&lt;/p&gt;&lt;blockquote&gt;&lt;a href="http://img210.imageshack.us/my.php?image=mitlaptop35qz.jpg" target="_blank"&gt;&lt;img src="http://img210.imageshack.us/img210/8156/mitlaptop35qz.th.jpg" border="0" alt="$100 laptop"/&gt;&lt;/a&gt;[From &lt;a href="http://www.tectonic.co.za/viewr.php?id=731"&gt;here.&lt;/a&gt;]"Hardware specs: 500Mhz AMD processor, 1GB flash memory (no hard drive), SVGA 8" diagonal display (dual LCD Color/Black &amp; White mode for power conservation and outdoor reading), 128MB of DRAM, AC Cord that doubles as carrying strap as the power source and a hand-crank (one minute of cranking gives enough power for 10 minutes of operation)."&lt;/blockquote&gt;&lt;p&gt;The laptop will ship with the basic software one would expect on an open-source, Linux based machine. Also, it was said that in addition to basic word-processing, programming, and browser software, it will apparently have built in networking support.&lt;/p&gt;&lt;blockquote&gt;[From &lt;a href="http://arstechnica.com/news.ars/post/20051128-5639.html"&gt;here.&lt;/a&gt;] "The laptop also features support for a unique, peer-to-peer wireless mesh network that will work right out of the box, and MIT researchers are currently investigating various ways to facilitate low cost internet access for the laptop systems."&lt;/blockquote&gt;&lt;p&gt;Overall, the project sounds very interesting, and with large-scale production slated to begin in the fall of 2006, it will be quite the thing to watch. Also, it has been said that these laptops will be available for regular consumer purchase (at a cost of $200) when they are successful in their production.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113322905733316538?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113322905733316538/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113322905733316538' title='2 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113322905733316538'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113322905733316538'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/mit-100-laptop-new-updates.html' title='MIT $100 Laptop - New Updates'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113315708078984015</id><published>2005-11-26T23:33:00.000-06:00</published><updated>2005-11-27T23:51:21.046-06:00</updated><title type='text'>CAPTCHA Accessibility Issues</title><content type='html'>&lt;/p&gt;&lt;h3&gt;CAPTCHA - What are the Alternatives?&lt;/h3&gt;&lt;p&gt;In a very &lt;a href="http://www.w3.org/TR/2005/NOTE-turingtest-20051123/"&gt;interesting document&lt;/a&gt; published by the working group over at &lt;a href="http://www.w3.org"&gt;W3C&lt;/a&gt;, it was discussed in detail how CAPTCHA's are very bad for accessibility.&lt;/p&gt;&lt;p&gt;In case you don't recall, CAPTCHA is that nice acronym for the terribly long phrase &lt;em&gt;"Completely Automated Public Turing test to Tell Computers and Humans Apart"&lt;/em&gt;. Yes, it's much easier to say CAPTCHA. A Turing test is something that many websites use nowadays to verify that the person filling in a log-in form, or posting on a message board or blog is actually a person - not a spamming program. Picture one of those little images with letters all crunched together, skewed this way and that, and you have to type what it says into the little input box nearby to enter.&lt;/p&gt;&lt;p&gt;You know, I have a confession to make. I have a turing test active to post to the comments for this blog. By default, it also gives me one of those darn things every time I edit a post of my own, or create one. I probably enter the letters wrong at least 1 out of every 5 times. (And that's being nice to myself.) The document points out:&lt;/p&gt;&lt;blockquote&gt;This type of visual and textual verification comes at a huge price to users who are blind, visually impaired or dyslexic. Naturally, this image has no text equivalent accompanying it, as that would make it a giveaway to computerized systems. In many cases, these systems make it impossible for users with certain disabilities to create accounts, write comments, or make purchases on these sites, that is, CAPTCHAs fail to properly recognize users with disabilities as human.&lt;/blockquote&gt;&lt;p&gt;I think that summarizes it quite well. They are not good for accessibility. And if:&lt;/p&gt;&lt;blockquote&gt;many of the systems can be defeated by computers with between 88% and 100% accuracy, using optical character recognition.&lt;/blockquote&gt;&lt;p&gt;is true... then why are we using them? But what are the alternatives. Some were suggested, but most had their own set of accessibility problems also. One was the idea of logic puzzles instead -- but that would not meet accessibility standards for people with mental / cognitive disabilities. Another was sound based -- but that disqualifies for a number of reasons (lack of a sound card, poor or no hearing, etc..).&lt;/p&gt;&lt;p&gt;In the end, the working group suggests that the CAPTCHA's stick around for websites that have users in the millions, but not for those with a small user base (i.e., most blogs). For smaller sites, spam-filering and heuristic checks were suggested in the place of CAPTCHA's. I don't know about you, but I've decided to turn my CAPTCHA off.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113315708078984015?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113315708078984015/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113315708078984015' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113315708078984015'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113315708078984015'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/captcha-accessibility-issues.html' title='CAPTCHA Accessibility Issues'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113297839051200960</id><published>2005-11-24T21:28:00.000-06:00</published><updated>2005-11-25T22:18:40.916-06:00</updated><title type='text'>Microsoft Gets Opensource Removed From Vienna Conclusions</title><content type='html'>&lt;/p&gt;&lt;h3&gt;The Software Monopoly - At it Again&lt;/h3&gt;&lt;p&gt;In what seems to be part of a new tactical run to try kill Opensource software, Microsoft apparently was able to score one point on this one.&lt;/p&gt;&lt;p&gt;A document called the Vienna Conclusions was presented during the &lt;a href="http://www.wsa-conference.org/" target="_blank"&gt;WSIS (World Summit on the Information Society) conference&lt;/a&gt; last week.&lt;/p&gt;&lt;p&gt;The WSIS self-titles as being about encouraging and discovering 'ICT &amp;amp Creativity.' There is a second phase to those things discussed in the Vienna Conclusions that work toward the World Summit Award (WSA).&lt;/p&gt;&lt;p&gt;The official Vienna Conclusions have been published, and are available to download in PDF format &lt;a href=""&gt;here.&lt;/a&gt; However, one rather large beast of a surprise came out as the folks at the conference were reading the conclusions.&lt;/p&gt;&lt;p&gt;It seems that Microsoft requested that all references to free software, and Linux in particular, be removed from the Vienna Conclusions document. &lt;em&gt;Worse even than that - they were.&lt;/em&gt;&lt;/p&gt;&lt;p&gt;In the &lt;a href="http://www.wsa-conference.org/blog/" target="_blank"&gt;WSA blog&lt;/a&gt;, Thomas Lutz, manager of public affairs for Microsoft Austria, had some revision requests.&lt;/p&gt;&lt;p&gt;On the paragraph p5/2 (Digital Rights/Creative Commons) the following was said, but requested the text be removed entirely:&lt;/p&gt;&lt;blockquote&gt;Increasingly, revenue is generated not by selling content and digital works, as they can be freely distributed at almost no cost, but by offering services on top of them. The success of the Free Software Model is one example.&lt;/blockquote&gt;&lt;p&gt;Lutz explained the Microsoft reasoning for wanting it removed:&lt;/p&gt;&lt;blockquote&gt;..it contains only an one-sided perspective on the ICT industry. The rationale for this is, that the aim of free software is not to enable a healthy business on software but rather to make it even impossible to make any income on software as a commercial product. We don´t see this neither as a viable not as a desirable path for the future economy of Europe.&lt;/blockquote&gt;&lt;p&gt;Fascinating. Well, I suppose on one hand it is interesting that Microsoft is being more vocal about their fear of Opensource, for what it really is in their minds - something that 'makes it impossible to make any income.' Ah well, while there were other requests in that post that was made, the other one that really stands out as blatant paranoia is the following one in which Microsoft requests that the word 'Linux' be removed from the document per the following quote.&lt;/p&gt;&lt;blockquote&gt;P6/3. eLearning and eScience … Deletion of “…like the linux project” as this is only one particular – anti-commercial – specificity of the open source landscape. You could use instead of “Linux” the more broader term of “open source project”.&lt;/blockquote&gt;&lt;p&gt;Interesting, don't you think? Well, probably not as interesting as the &lt;a href="http://www.fsfe.org/fellows/greve/freedom_bits/the_next_vienna_conclusion_so_it_was_microsoft_that_asked_to_delete_free_software" target="_blank"&gt;blog reaction&lt;/a&gt; of &lt;a href="http://fsfeurope.org/about/greve/" target="_blank"&gt;Georg Greve&lt;/a&gt;. Mr. Greve is the President of the &lt;a href="http://fsfeurope.org/index.en.html" target="_blank"&gt;Free Software Foundation - Europe&lt;/a&gt;. He had a very miffed reaction, understandably, to the sudden change in the document, as you can understand why from one of his statements on the topic here:&lt;/p&gt;&lt;blockquote&gt;Given this was a conference with hundreds of high-level participants and discussing a rather hot topic, do you wonder why are there only five entries in this blog? Do you wonder why noone tore the Microsoft propaganda apart? There is an easy answer to this: Noone on the panel ever knew this blog existed. I just learned this now.&lt;/blockquote&gt;&lt;p&gt;In a reaction to this, we now see this: &lt;a href="http://www.fsfe.org/en/news/eu_vs_microsoft_application_for_leave" target="_blank"&gt;The Free Software Foundation Europe (FSFE) today filed an application for leave to intervene in the antitrust suit against Microsoft.&lt;/a&gt;. Personally, I think it's nice to see the FSFE standing up to the old bully on the block who still thinks he owns the street - because apparently not everyone at the convention did.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113297839051200960?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113297839051200960/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113297839051200960' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113297839051200960'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113297839051200960'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/microsoft-gets-opensource-removed-from.html' title='Microsoft Gets Opensource Removed From Vienna Conclusions'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113295936010139461</id><published>2005-11-23T16:55:00.000-06:00</published><updated>2005-11-25T22:15:18.390-06:00</updated><title type='text'>Amusing Name Change - OSM</title><content type='html'>&lt;a href="http://photos1.blogger.com/blogger/731/433/640/screen001.jpg" style="width:640px;"&gt;&lt;img src="http://photos1.blogger.com/blogger/731/433/320/screen001.0.jpg" alt="Difficult Design Choices" style="display:block;margin 0px auto 10px; cursor:hand; text-align:center; border:0px" /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;I bet their graphic artist went through a lot of stress coming up with that unique name change. Was definitely worth a good laugh - though I much prefer OSM over Pajamas Media.&lt;/p&gt;&lt;p&gt;By the way, the picture is real. I took it a couple of days ago, but if you go to &lt;a href="http://www.osm.org" target="_blank"&gt;www.osm.org&lt;/a&gt; and take a look - they put up a new one. Gee, I wonder why.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113295936010139461?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113295936010139461/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113295936010139461' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113295936010139461'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113295936010139461'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/amusing-name-change-osm.html' title='Amusing Name Change - OSM'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113283527926913837</id><published>2005-11-22T21:27:00.000-06:00</published><updated>2005-11-24T06:28:56.773-06:00</updated><title type='text'>W3C Adds Feed Validator</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Online Feed Validation from W3C&lt;/h3&gt;&lt;p&gt;In a list notice by &lt;a href="http://www.w3.org/People/olivier/" target="_blank"&gt;Oliver Thereaux&lt;/a&gt; at the W3C, we found out about the new web tool for &lt;a href="http://validator.w3.org/feed/" target="_blank"&gt;Feed validation&lt;/a&gt;. Well, let me amend that, it's not an entirely new tool actually.&lt;/p&gt;&lt;p&gt;This 'new' online validator is &lt;span style="text-decoration:underline"&gt;based on&lt;/span&gt; the opensource FeedValidator software that you can find hosted both at the &lt;a href="http://sourceforge.net/projects/feedvalidator" target="_blank"&gt;Sourceforge&lt;/a&gt; location, as well as it being the software for &lt;a href="http://www.feedvalidator.org" target="_blank"&gt;FeedValidator.org&lt;/a&gt;.&lt;/p&gt;&lt;p&gt;The Feed validator can validate RSS (0.90, 0.91, 0.92, 0.93, 0.94, 1.0, and 2.0) as well as Atom feeds. What is it validating these feeds against? Why the &lt;a href="http://validator.w3.org/feed/docs/rss2.html" target="_blank"&gt;RSS 2.0 specs&lt;/a&gt; of course.&lt;/p&gt;&lt;p&gt;However, in addition to what the FeedValidator software already did, W3C had to (of course) make it a little better. They added in a SOAP web service, and are providing the &lt;a href="http://validator.w3.org/feed/docs/api.html" target="_blank"&gt;online help&lt;/a&gt; to implement it in software (where it could be used for batch processing).&lt;/p&gt;&lt;p&gt;So... go online and try it out if you like. You can read the basic barebones &lt;a href="http://validator.w3.org/feed/about.html" target="_blank"&gt;FAQ&lt;/a&gt; they have on it, and the validator itself is &lt;a href="http://validator.w3.org/feed/" target="_blank"&gt;here.&lt;/a&gt;&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113283527926913837?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113283527926913837/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113283527926913837' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113283527926913837'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113283527926913837'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/w3c-adds-feed-validator.html' title='W3C Adds Feed Validator'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113280733677643809</id><published>2005-11-21T22:29:00.000-06:00</published><updated>2005-11-24T06:42:29.343-06:00</updated><title type='text'>CSS Reboot - Fall 2005</title><content type='html'>&lt;/p&gt;&lt;h3&gt;CSS Reboot Complete!&lt;/h3&gt;&lt;p&gt;For those folks out there who don't know what the great &lt;a href="http://www.cssreboot.com/" target="_blank"&gt;CSS Reboot&lt;/a&gt; frenzy is all about, let me give you an overview. It's about taking some time to redesign with standards. We know it's a good practice to keep the look of a site 'fresh' and give it a facelift periodically, and this is what that challenge is all about. Most of the &lt;a href="http://www.cssreboot.com/rebooters/" target="_blank"&gt;CSS Rebooters&lt;/a&gt; who signed up put in some serious effort toward giving a fresh look to their sites.&lt;/p&gt;&lt;p&gt;While I didn't formally participate this time around, I did reskin The Useful Web and upgrade quite a few features to it. I'm also in the middle of (going kind of slow) entirely upgrading my business site. For now, I'd like to give a big thumbs up to a few of the Rebooters that really caught my eye.&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="http://www.ldufrane.com/blog/" target="_blank"&gt;Designer Diary&lt;/a&gt; -- Has a nice clean layout, but I particularly like the top graphics with the silver fading on the edges. Adds a slick touch to a very clean design.&lt;/li&gt;&lt;li&gt;&lt;a href="http://www.ridaalbarazi.com/" target="_blank"&gt;Rida Al Barazi&lt;/a&gt; -- Very nice color and graphic use in this one. I definitely think the color theme appeals, but I'd probably have used a bit of a more rich color of yellow, instead of the brighter one used. I do like the graphic hover effect of the graphics around the 'R' in the top left. I do not, however, like the static bar that always makes the pages drag. I would have preferred that to move on with the rest of the page and avoid the jumping text. Overall, nice.&lt;/li&gt;&lt;li&gt;&lt;a href="http://www.error500.de/" target="_blank"&gt;Error500&lt;/a&gt; -- I definitely love the clean lines of this layout. I do not, however, have a great fondness for the background wood look. Just doesn't seem to fit in an smoothly, and I would suggest swapping that out for a background of a more burgundy color with not so much in the way of pattern as the wood has. Other than the background used (super easy to change) I love this layout.&lt;/li&gt;&lt;li&gt;&lt;a href="http://www.robertsable.com/" target="_blank"&gt;Robert Sable Consulting&lt;/a&gt; -- I think this design really has it all put together nicely. The rebooter managed to blend in a highly patterned background well with the color scheme, and I think the layout of the sections is something to that should inspire quite a few bloggers out there.&lt;/li&gt;&lt;li&gt;&lt;a href="http://philrenaud.com/" target="_blank"&gt;Phil Renaud&lt;/a&gt; -- A good layout, risky colors and a bold scheme used. I think my only complaint about it is that the amount of posts shown on the main page make that page super long, and you might miss the great graphics at the bottom. The appeal of this one is definitely all about the graphics.&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;If I come up with some more, I'll add them on to here, but for now, those are my favorites as I review the &lt;a href="http://www.cssreboot.com/rebooters/" target="_blank"&gt;Rebooters list.&lt;/a&gt;&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113280733677643809?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113280733677643809/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113280733677643809' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113280733677643809'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113280733677643809'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/css-reboot-fall-2005.html' title='CSS Reboot - Fall 2005'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113248759157039795</id><published>2005-11-20T05:41:00.000-06:00</published><updated>2005-11-29T07:26:07.136-06:00</updated><title type='text'>Tutorial - Nightfall - Step 3</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Continuing with Style&lt;/h3&gt;&lt;p&gt;Now that we have seen the strenghts of inline CSS (remember that this is when you have the style in the line of the code) we need to broaden this further. While it would save you typing to get rid of the old style coding we've talked about so far, that is not the whole use CSS - though it is a benefit. One of the fundamental purposes behind the web standards is:&lt;/p&gt;&lt;blockquote&gt;Separating the style from the code.&lt;/blockquote&gt;&lt;p&gt;Everything within your code should be (ideally) only code for the function of the website. All of the graphics, colors, etc... should are style aspects, and should be the 'icing on the cake,' so to speak.&lt;/p&gt;&lt;p&gt;Now, there are three primary ways to show incorporate styles into your webpage, and you've already learned one of those - the inline style. Now we're going to learn how to put the styles in the top of the webpage. This is called embedded style. Let's begin by looking at the code of the page again, and this particular block near the top.&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;title&amp;gt;Nightfall&amp;lt;/title&amp;gt;&lt;br /&gt;&amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;gt;&amp;lt;!--body         { margin: 0; padding: 0 }&lt;br /&gt;--&amp;gt;&amp;lt;/style&amp;gt;&lt;br /&gt;&amp;lt;/head&amp;gt;&lt;/p&gt;&lt;p&gt;The block of code there is commented out to hide it from old browsers (ex: Navigator 1 and Explorer 2). If you have monitored your visitors and know that few to none of them use those browsers (which most do not), you can change that to the following:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;title&amp;gt;Nightfall&amp;lt;/title&amp;gt;&lt;br /&gt;&amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;gt;&lt;br /&gt;body { margin: 0; padding: 0 }&lt;br /&gt;&amp;lt;/style&amp;gt;&lt;br /&gt;&amp;lt;/head&amp;gt;&lt;/p&gt;&lt;p&gt;What is shown is the format that &lt;em&gt;must&lt;/em&gt; be used if you are going to embed a style in the top of a webpage. First of all:&lt;/p&gt;&lt;ul&gt;&lt;li&gt;It must be in the &lt;code&gt;&amp;lt;head&amp;gt;&lt;/code&gt; element.&lt;/li&gt;&lt;li&gt;It begins with &lt;code&gt;&amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;gt;&lt;/code&gt; and ends with &lt;code&gt;&amp;lt;/style&amp;gt;&lt;/code&gt;&lt;/li&gt;&lt;li&gt;Each element within must be surrounded by brackets { }&lt;/li&gt;&lt;li&gt;Just like inline styles, multiple attributes of a single element are separated with the ';' symbol.&lt;/li&gt;&lt;li&gt;Any inline style attributes of the same element will override the embedded styles.&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;So let's begin by turning what we have done in an inline style into an embedded style. First, let's look at what we did with the navigation links on the left hand side of the page.&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50px; font-weight: bold; font-size: 13px; font-family: Verdana; color:#000000;&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;Now, we want to put that in the embedded style at the top. What we will do is simply duplicate all of the style information there. Copy and paste it into your embedded style, and remember that it needs to be surrounded by { }. It should look like this:&lt;/p&gt;&lt;p class="code"&gt;body { margin: 0; padding: 0 }&lt;br /&gt;{line-height: 150%; margin-left: 50px; font-weight: bold; font-size: 13px; font-family: Verdana; color:#000000;}&lt;br /&gt;&amp;lt;/style&amp;gt;&lt;/p&gt;&lt;p&gt;Now, it needs a name so we can reference this section in the code. We'll call this &lt;code&gt;leftlinks&lt;/code&gt;. There is only one instance of that in the webpage, so we can consider it unique. Styles that will only need to be used once are preceeded with a pound sign (#) before their name. So your final product should look like this:&lt;/p&gt;&lt;p class="code"&gt;#leftlinks {line-height: 150%; margin-left: 50px; font-weight: bold; font-size: 13px; font-family: Verdana; color:#000000;}&lt;/p&gt;&lt;p&gt;As a brief note, it is just as accurate to put a line break after the ';' signs, if you prefer to write it that way. I prefer them all together, but the choice is yours. This works also:&lt;/p&gt;&lt;p class="code"&gt;body {&lt;br /&gt;margin: 0;&lt;br /&gt;padding: 0&lt;br /&gt;}&lt;/p&gt;&lt;p&gt;Additionally you'll note that you do not need to have a ';' symbol following the very last attribute you list, only if there is another following. Again, it's optional, but I prefer to always tag one on the end. So, now that we have our new &lt;code&gt;leftlinks&lt;/code&gt; in the embedded style, let's put it to use. Scroll down to the section where we declared the inline style in the paragraph where we made our links in the code. It should look like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50px; font-weight: bold; font-size: 13px; font-family: Verdana; color:#000000;&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;Now, we no longer need the inline style because we added it to the top embedded style. At this point, all we need to do is identify which style we want to apply to this paragraph. We do that by referencing the id name we created in the embedded style. Go ahead and delete out all of that style info in the paragraph code, and change your code to this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p id=&amp;quot;leftlinks&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;You can now save and refresh the page. If it was done right, you should see no difference at all in the page. Let's now look at the other styles we created in the last part. You should scroll down and find this chunk of code you worked in before:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;/blockquote&amp;gt;&lt;br /&gt;&amp;lt;p style=&amp;quot;margin-left: 15px; font-family: Arial; font-size: 13px; color:#FFFF99; font-weight:bold;&amp;quot;&amp;gt;More Info&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;blockquote style=&amp;quot;font-family: Arial; font-size: 13px; color:#FFFFFF;&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;Delete this text, but keep the formatting and colours if you wish.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;It is recommended that you give this page your own title and description.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;Good luck with your site :)&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;/blockquote&amp;gt;&lt;/p&gt;&lt;p&gt;Looking at your browser page of Nightfall, you should notice that there are only three styles of text for the entire content section: The yellow header text, the plain white content text, and the links that are done in that light blue color. Looking at the code inside the page, we'll see that all of the text on the page, except for the left links, was specified to have an Arial font. So, let's make that a global declaration for any paragraph in the page. The embedded style will allow you to reference most global tags by themselves, and in this case, we are dealing with the &lt;code&gt;&amp;lt;p&amp;gt;&lt;/code&gt; tag. Go ahead and add this to your embedded style:&lt;/p&gt;&lt;p class="code"&gt;p {font-family: Arial;}&lt;/p&gt;&lt;p&gt;When you save and refresh, you'll see that your left links are still Verdana, even though they are in a paragraph also. That's because you declared those as having the &lt;code&gt;id="leftlinks"&lt;/code&gt;. Another thing that you can do is notice that all of the  text sizes are the same. We earlier decided that 13px seemed to reflect that vague description it previously had, and all of the basic text, aside from the yellow headers and the links should be white, so let's throw that in also. Change the &lt;code&gt;p&lt;/code&gt; declaration to this:&lt;/p&gt;&lt;p class="code"&gt;p {font-family: Arial; font-size: 13px; color:#ffffff;}&lt;/p&gt;&lt;p&gt;Save and refresh. The text will probably move up a bit on the page, but that's fine, we are going to add the padding back in later. Now, remember this block of text?&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;/blockquote&amp;gt;&lt;br /&gt;&amp;lt;p style=&amp;quot;margin-left: 15px; font-family: Arial; font-size: 13px; color:#FFFF99; font-weight:bold;&amp;quot;&amp;gt;More Info&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;blockquote style=&amp;quot;font-family: Arial; font-size: 13px; color:#FFFFFF;&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;Delete this text, but keep the formatting and colours if you wish.&amp;lt;/p&amp;gt;&lt;/p&gt;&lt;p&gt;Let's really make that style apply to the whole page by deleting out the things that are duplicated. We can now remove the &lt;code&gt;font-family&lt;/code&gt;, the &lt;code&gt;font-size&lt;/code&gt;, and the one reference to the &lt;code&gt;color:#FFFFFF&lt;/code&gt;. Oh, wait a second... that would leave absolutely no style in the &lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt; part. That's entirely correct. You no longer need it. Change the code to look like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;/blockquote&amp;gt;&lt;br /&gt;&amp;lt;p style=&amp;quot;margin-left: 15px; color:#FFFF99; font-weight:bold;&amp;quot;&amp;gt;More Info&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;blockquote&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;Delete this text, but keep the formatting and colours if you wish.&amp;lt;/p&amp;gt;&lt;/p&gt;&lt;p&gt;Save and refresh, and you'll see that it looks the same. Now, here comes the fun part. That is a global style we set for the paragraphs right? So we no longer need to specifically tell the code 13px (referenced just as size=2 in the improper code), nor do we need anything that is telling it to be Arial font that is white. Let's strip out all the other references in the code just above that section. It looks like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;margin-left: 15; margin-right: 0&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font color=&amp;quot;#FFFF99&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;Welcome to Nightfall Free Website Template&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/font&amp;gt;&lt;br /&gt;&amp;lt;blockquote&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFFFF&amp;quot;&amp;gt;This is one of the free website templates available from &amp;lt;/font&amp;gt;&amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#00FFFF&amp;quot;&amp;gt;Pegaweb &lt;br /&gt;Web Design &amp;amp;amp; Photoshop Tutorials.&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFFFF&amp;quot;&amp;gt; I hope you find this template useful.&amp;lt;/font&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFFFF&amp;quot;&amp;gt;There are no fees or charges associated with downloading or using this site.&amp;lt;/font&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFFFF&amp;quot;&amp;gt;The full version of this &lt;br /&gt;template, with no Pegaweb Logo, can be purchased at &amp;lt;/font&amp;gt;&amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#00FFFF&amp;quot;&amp;gt;www.pegaweb.com&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;/blockquote&amp;gt;&lt;/p&gt;&lt;p&gt;Now, after you've taken out all references to the sized 13px (or 2) white Arial text, it should look like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;margin-left: 15; margin-right: 0&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font color=&amp;quot;#FFFF99&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;Welcome to Nightfall Free Website Template&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&lt;br /&gt;&amp;lt;blockquote&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;This is one of the free website templates available from &amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font color=&amp;quot;#00FFFF&amp;quot;&amp;gt;Pegaweb &lt;br /&gt;Web Design &amp;amp;amp; Photoshop Tutorials.&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/a&amp;gt; I hope you find this template useful.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;There are no fees or charges associated with downloading or using this site.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;The full version of this template, with no Pegaweb Logo, can be purchased at &amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font color=&amp;quot;#00FFFF&amp;quot;&amp;gt;www.pegaweb.com&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;/blockquote&amp;gt;&lt;/p&gt;&lt;p&gt;Very good. On a refresh you'll see that it's the same. Now, let's look at what specific style is left in that code. We've got the links to handle next, so we need to go add that to our embedded style. Do you remember or use &lt;code&gt;LINK&lt;/code&gt; (for regular links), &lt;code&gt;VLINK&lt;/code&gt; (for visited links), and &lt;code&gt;ALINK&lt;/code&gt; (for active links)? Well, no longer. You'll do those in the style now. We use the &lt;code&gt;a&lt;/code&gt; indicator name for that. From the links in the code, you can easily see that they are given their color, and surrounded in tags to make them bold. So, let's just do that in the style. Add the following to your embedded style:&lt;/p&gt;&lt;p class="code"&gt;a {color:#00FFFF; font-weight:bold;}&lt;/p&gt;&lt;p&gt;Save and refresh. You should see it look the same except for one thing, the links on the left are now the same color as those. We'll fix that in a second, but let's first clean up that code the rest of the way. You can now remove all the color and bold declarations around the two links in the code. The code should look like this now:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;margin-left: 15; margin-right: 0&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font color=&amp;quot;#FFFF99&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;Welcome to Nightfall Free Website Template&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&lt;br /&gt;&amp;lt;blockquote&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;This is one of the free website templates available from &amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;Pegaweb Web Design &amp;amp;amp; Photoshop Tutorials.&amp;lt;/a&amp;gt; I hope you find this template useful.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;There are no fees or charges associated with downloading or using this site.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;The full version of this template, with no Pegaweb Logo, can be purchased at &amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;www.pegaweb.com&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;/blockquote&amp;gt;&lt;br /&gt;&amp;lt;p style=&amp;quot;margin-left: 15px; color:#FFFF99; font-weight:bold;&amp;quot;&amp;gt;More Info&amp;lt;/p&amp;gt;&lt;/p&gt;&lt;p&gt;Looks like there is only one of the font tags left. But wait... didn't we already fix that once? Yep, look down at the style you put around the 'More Info' text. Well, since we are going to use that more than once, we need to add that style to our embedded text. Ah, but I said &lt;em&gt;more than once&lt;/em&gt; didn't I? Remember what I said earlier about using the pound sign (#) only if you were going to use it just once. If you are going to use it more than once, you are creating a class for that style. You put a period (.) before the name instead of the pound (#) sign for classes. Let's add a style class for these headers called 'header', and put it in our embedded style. Your style section should look like this now:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;gt;&lt;br /&gt;body { margin: 0; padding: 0 }&lt;br /&gt;#leftlinks {line-height: 150%; margin-left: 50px; font-weight: bold; font-size: 13px; font-family: Verdana; color:#000000;}&lt;br /&gt;p {font-family: Arial; font-size: 13px; color:#ffffff;}&lt;br /&gt;a {color:#00FFFF; font-weight:bold;}&lt;br /&gt;.header {margin-left: 15px; color:#FFFF99; font-weight:bold;}&lt;br /&gt;&amp;lt;/style&amp;gt;&lt;/p&gt;&lt;p&gt;I hope you see that I just copied and pasted the attributes in that &lt;code&gt;header&lt;/code&gt; class that you had done before in the inline style around the 'More Info' yellow text. Now that we have that new class &lt;code&gt;header&lt;/code&gt; declared, we can get rid of the other styles in that section of code and point them to the class instead. It should look like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p class=&amp;quot;header&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;Welcome to Nightfall Free Website Template&lt;br /&gt;&amp;lt;blockquote&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;This is one of the free website templates available from &amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;Pegaweb Web Design &amp;amp;amp; Photoshop Tutorials.&amp;lt;/a&amp;gt; I hope you find this template useful.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;There are no fees or charges associated with downloading or using this site.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;The full version of this template, with no Pegaweb Logo, can be purchased at &amp;lt;a href=&amp;quot;http://www.pegaweb.com&amp;quot;&amp;gt;www.pegaweb.com&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;/blockquote&amp;gt;&lt;br /&gt;&amp;lt;p class=&amp;quot;header&amp;quot;&amp;gt;More Info&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;blockquote&amp;gt;&lt;/p&gt;&lt;p&gt;*CHEERS* No More &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; tags exist in this code!! We'll continue on in the next section when we go back to add one &lt;em&gt;tiny&lt;/em&gt; thing to make those left links black. Also! I ran this page through the W3C Validator and we are down to just 17 errors from our original 45. HTML 4.01 Strict is getting closer!&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-2.html"&gt;Step 2&lt;/a&gt; &amp;lt;-- Back -OR- Continue on: Step 4 --&amp;gt; *Coming Soon*&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113248759157039795?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113248759157039795/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113248759157039795' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113248759157039795'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113248759157039795'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-3.html' title='Tutorial - Nightfall - Step 3'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113238688602059677</id><published>2005-11-19T01:38:00.000-06:00</published><updated>2005-11-29T07:27:25.596-06:00</updated><title type='text'>Tutorial - Nightfall - Step 2</title><content type='html'>&lt;span style="font-style:italic"&gt;An Ode to An Old Friend&lt;br/&gt;"&amp;lt;font&amp;gt; has passed away. Kicked the bucked. Been buried. Sung it's last hurrah. Let it be remembered for many long nights of 'search and replace' and for having one heck of an ability to pack on the kilobytes. We shall remember you, as we look back upon what the web once was. Adios."&lt;/span&gt;&lt;/p&gt;&lt;h3&gt;Relearning fonts.&lt;/h3&gt;&lt;p&gt;So you may have heard that the &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; tag is dead, but if you haven't had the time to study up on the standards, you may be keeping it around for lack of a substitute. Worry not, I'm going to show you exactly how to transfer over what you used to do with &amp;lt;font&amp;gt; in a way that will validate properly as standardized code.&lt;/p&gt;&lt;p&gt;First, take a look at something that you should find interesting. Reload your working copy of Nightfall - the version with the changes you made in Step 1. You should see that something curious has happened to the navigation links on the left hand side of the page. Look up a little higher on the left, and you'll see that the alignment of the graphic is now gapped. Why did this happen? The answer is this: You added in the document type definition (DTD). That told the browser to interpret the code following HTML 4.01 Strict definitions. Since much of that area of the code consists of non-validating code -- it is not showing properly. We'll fix that little by little.&lt;/p&gt;&lt;p&gt;Let's begin by opening up our code again. We are going to jump down to around line 28, which is our first instance of the &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; tag. It looks like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;td width=&amp;quot;100%&amp;quot; valign=&amp;quot;top&amp;quot; background=&amp;quot;images/waterfallmenu.jpg&amp;quot; height=&amp;quot;395&amp;quot;&amp;gt;&amp;amp;nbsp;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;amp;nbsp;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font size=&amp;quot;2&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;font color=&amp;quot;#000000&amp;quot;&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot; color=&amp;quot;#000000&amp;quot;&amp;gt;Home&amp;lt;/font&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;/font&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot; color=&amp;quot;#000000&amp;quot;&amp;gt;Latest News&amp;lt;/font&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;/font&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot; color=&amp;quot;#000000&amp;quot;&amp;gt;Information&amp;lt;/font&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;/font&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot; color=&amp;quot;#000000&amp;quot;&amp;gt;Designs&amp;lt;/font&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;/font&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot; color=&amp;quot;#000000&amp;quot;&amp;gt;Contact Us&amp;lt;/font&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;/font&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot; color=&amp;quot;#000000&amp;quot;&amp;gt;Links&amp;lt;/font&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/font&amp;gt;&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;amp;nbsp;&amp;lt;/td&amp;gt;&lt;/p&gt;&lt;p&gt;This will be the section we'll be working in. Now, you should see something quite obvious about these links, and I'm sure you've seen and done the same thing before. All of these links are the same colors and sizes and font face. So... let's examine what we actually have here. We have a &lt;code&gt;&amp;lt;td&amp;gt;&lt;/code&gt; that is a container for this section and is holding one of the images on the left for the background. Then inside that is an empty paragraph break, then the paragraph section starts for our links. When we are done with the links, it closes the paragraph and the &lt;code&gt;&amp;lt;td&amp;gt;&lt;/code&gt;. Okay. So every thing inside that &lt;code&gt;&amp;lt;td&amp;gt;&lt;/code&gt; (except the background image) is about our links. No question about it. Did you notice this little chunk of text?&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;If so, give yourself a brownie point. This is a snippet of CSS called inline style (because it's writting within a line of code). However, it's been used incorrectly. Take a look at that line and ask yourself... 50 what? Percent? Pixels? There was a percent used for the line-height... What does the 50 mean? Yep, that's what the browser wondered too, and that is why the links have no left margin now that the DTD says to read this strictly. That part is improper code, so it was ignored. Let's take a wild guess that they don't mean that they want the margin to be huge, so it's not percent.  Change it to say:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50px&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;Now save and refresh your page. Voila! You have fixed that part. See, CSS isn't so terrible eh? ;) Now we're going to use this little style section again, but back to the &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; tag for a bit. Right after that section you just set the margin is a &lt;code&gt;&amp;lt;b&amp;gt;&lt;/code&gt; tag. At the end of the links section you'll see that the tag is closed. Okay, so we want all of these links to be bold. Gotcha. Let's do it a different way, because the &amp;lt;b&amp;gt; tag is another one you'll have to unlearn - might as well start now. The equivalent to the &lt;code&gt;&amp;lt;b&amp;gt;&lt;/code&gt; tag is to use &lt;code&gt;&amp;lt;style= font-weight: bold&amp;quot;&amp;gt;&lt;/code&gt;. To see how this will work, first go ahead and delete both the start and end bold tags (lines 28 and 35). Now, we already have a style started for this paragraph, so let's just add that in to there. You can see that you separate attributes in there with a ';' sign, so just change it to:&lt;/p&gt;&lt;p class= "code"&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50px; font-weight: bold;&amp;quot;&amp;gt;&amp;lt;font size=&amp;quot;2&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;/p&gt;&lt;p&gt;Save and refresh your page. It should look the same as before with nicely bolded text without the tag. Now let's take a look at that first tag after the style: &lt;code&gt;&amp;lt;font size=&amp;quot;2&amp;quot;&amp;gt;&lt;/code&gt; and see how we put the size of text into the style. The conversion is pretty easy. But again, I ask you... 2 what? Pixels? Em's? Ex's? Points? You have to be specific because there are many things it can be. We'll just say it's supposed to be 2ex because 2px would be far too small. (Note: 2ex would be approximately 12px, so you can use whichever you prefer.) The conversion from the old &lt;code&gt;&amp;lt;font size=&amp;quot;2&amp;quot;&amp;gt;&lt;/code&gt; tag to the new one is &lt;code&gt;&amp;lt;style=&amp;quot;font-size: 2ex&amp;quot;&amp;gt;&lt;/code&gt;. So, that considered, let's delete the &lt;code&gt;&amp;lt;font size=&amp;quot;2&amp;quot;&amp;gt;&lt;/code&gt; on line 28, as well as that last &lt;code&gt;&amp;lt;/font&amp;gt;&lt;/code&gt; before the closing paragraph tag on line 35. Now let's add in that new way of writing the size into the existing style, as follows:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50px; font-weight: bold; font-size: 2ex&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;Good. Now save and refresh. Should look about the same. I think it might look a bit better at a 13px size, but it really doesn't matter for this. We'll cover aesthetics later. Now, moving on. Let's do something about that font face and color in the next lines - and this is where you will really see the power of CSS. Starting on line 30, let's learn the conversion for this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;font color=&amp;quot;#000000&amp;quot;&amp;gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot; color=&amp;quot;#000000&amp;quot;&amp;gt;Home&amp;lt;/font&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;font face=&amp;quot;Verdana&amp;quot;&amp;gt;&amp;lt;br&amp;gt;&lt;br /&gt;&amp;lt;/font&amp;gt;&lt;/p&gt;&lt;p&gt;Can be easily converted to a style as this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;style=&amp;quot;font-family:Verdana; color:#000000;&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;So, let's go ahead and do the most fun part of all of this. Strip out all of the &amp;lt;font&amp;gt; tags in that section of code. Then add in those new styles for the font family and color to the existing style. While you are at it, please change all of those &lt;code&gt;&amp;lt;br&amp;gt;&lt;/code&gt; tags to their actually proper format as &lt;code&gt;&amp;lt;br /&amp;gt;&lt;/code&gt; (yes, the space is important). Those break tags are openers but they are assumed to be self closing, we need to make them actually be self-closing tags, and that is how you do it. This is what your code should now look like:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;line-height: 150%; margin-left: 50px; font-weight: bold; font-size: 2ex; font-family: Verdana; color:#000000;&amp;quot;&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Home&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Latest News&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Information&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Designs&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Contact Us&amp;lt;/a&amp;gt;&amp;lt;br /&amp;gt;&lt;br /&gt;&amp;lt;a href=&amp;quot;#&amp;quot;&amp;gt;Links&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;/p&gt;&lt;p&gt;Wow. Looks a lot neater doesn't it? Save and reload. Eep! My text is blue! Actually, that's what it should be because they are &lt;em&gt;links&lt;/em&gt; and not just plain text and we haven't set the color for the links yet. Not to worry, it's super simple to do. But look first at how much cleaner that code is and imagine how easy you can change things.&lt;/p&gt;&lt;p&gt;Think you can do the same thing on your own to this chunk of code that you'll find on lines 52 - 57? I bet so. Just put the style information for line 52 in the paragraph style that is already started, and then put the other style for the text below inside the blockquote tag. It should start like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;margin-left: 15&amp;quot;&amp;gt;&amp;lt;b&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFF99&amp;quot;&amp;gt;More Info&amp;lt;/font&amp;gt;&amp;lt;/b&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;blockquote&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFFFF&amp;quot;&amp;gt;Delete this text, but keep the formatting and colours if you wish.&amp;lt;/font&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFFFF&amp;quot;&amp;gt;It is recommended that you give this page your own title and description.&amp;lt;/font&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;lt;font face=&amp;quot;Arial&amp;quot; size=&amp;quot;2&amp;quot; color=&amp;quot;#FFFFFF&amp;quot;&amp;gt;Good luck with your site :)&amp;lt;/font&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;/blockquote&amp;gt;&lt;/p&gt;&lt;p&gt;And end up looking like this:&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;p style=&amp;quot;margin-left: 15px; font-family: Arial; font-size: 13px; color:#FFFF99; font-weight:bold;&amp;quot;&amp;gt;More Info&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;blockquote style=&amp;quot;font-family: Arial; font-size: 13px; color:#FFFFFF;&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;Delete this text, but keep the formatting and colours if you wish.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;It is recommended that you give this page your own title and description.&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;p&amp;gt;Good luck with your site :)&amp;lt;/p&amp;gt;&lt;br /&gt;&amp;lt;/blockquote&amp;gt;&lt;/p&gt;&lt;p&gt;Notice that I did add the px to the margin that was listed just as a number again, so now that 'More Info' text is aligned as it was in the original. Also, I did decide to use the 13px for the font this time, and I think it looks a better size than the 2ex. I suggest going back and changing that text size in your links. But! The good part is that you don't have to change it for every single &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; tag :) Are you feeling a bit less sad to have buried the &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt;? Hopefully. And now if you go back to what we did in Step 1, and run the page through the W3C validator - you should come up with only 28 errors, from where we started at 45. Progress.&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-1.html"&gt;Step 1&lt;/a&gt; &amp;lt;-- Back -OR- Continue on: &lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-3.html"&gt;Step 3&lt;/a&gt;&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113238688602059677?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113238688602059677/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113238688602059677' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113238688602059677'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113238688602059677'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-2.html' title='Tutorial - Nightfall - Step 2'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113221600132401710</id><published>2005-11-17T02:30:00.000-06:00</published><updated>2005-11-24T04:41:12.870-06:00</updated><title type='text'>Tutorial - Nightfall - Step 1</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Beginning with the Basics&lt;/h3&gt;&lt;p&gt;Now that you have the file unzipped, you'll see that it is a single index file with a images folder. That was not how it was orginally, as it included duplicate renamed pages (named for each of the links), so I just deleted those out since we are going to change the code that's duplicated anyway.&lt;/p&gt;&lt;p&gt;So, first of all, I want to tell you what our primary goal is going to be: &lt;span style="font-weight:bold;"&gt;We are going to make this page validate as HTML 4.01 Strict.&lt;/span&gt; What is that? Well, you'll see as we go along, but that is the highest standard for HTML (not XHTML) that the &lt;a href="http://www.w3.org/" target="_blank"&gt;W3C&lt;/a&gt; follows currently.&lt;/p&gt;&lt;p&gt;Now, we first of all have to lable our document so that we know, and a validator software can recognize, that this webpage will be HTML 4.01 Strict. Doing this is called adding the Document Type Definition (DTD).&lt;/p&gt;&lt;p&gt;For now, open up the webpage in your plain text editor. Now you are going to enter the following chunk of code as follows:&lt;/p&gt;&lt;p&gt;Put this...&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;!DOCTYPE HTML PUBLIC &amp;quot;-//W3C//DTD HTML 4.01//EN&amp;quot;&lt;br /&gt;            &amp;quot;http://www.w3.org/TR/html4/strict.dtd&amp;quot;&amp;gt;&lt;/p&gt;&lt;p&gt;Here...&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;!DOCTYPE HTML PUBLIC &amp;quot;-//W3C//DTD HTML 4.01//EN&amp;quot;&lt;br /&gt;            &amp;quot;http://www.w3.org/TR/html4/strict.dtd&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;html&amp;gt;&lt;br /&gt;&amp;lt;head&amp;gt;&lt;br /&gt;&amp;lt;meta http-equiv=&amp;quot;Content-Type&amp;quot; content=&amp;quot;text/html; charset=windows-1252&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;meta http-equiv=&amp;quot;Content-Language&amp;quot; content=&amp;quot;en-us&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;meta name=&amp;quot;GENERATOR&amp;quot; content=&amp;quot;Microsoft FrontPage 5.0&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;meta name=&amp;quot;description&amp;quot; content=&amp;quot;insert description here&amp;quot;&amp;gt;&lt;br /&gt;.....&lt;/p&gt;&lt;p&gt;Actually, while you are right there, go ahead and strip out all of the generator stuff that is unimportant now because we are not using FrontPage and really don't care to see it. &lt;span style="font-weight:bold;"&gt;Make your code look like this:&lt;/span&gt;&lt;/p&gt;&lt;p class="code"&gt;&amp;lt;!DOCTYPE HTML PUBLIC &amp;quot;-//W3C//DTD HTML 4.01//EN&amp;quot;&lt;br /&gt;&amp;quot;http://www.w3.org/TR/html4/strict.dtd&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;html&amp;gt;&lt;br /&gt;&amp;lt;head&amp;gt;&lt;br /&gt;&amp;lt;meta http-equiv=&amp;quot;Content-Type&amp;quot; content=&amp;quot;text/html; charset=windows-1252&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;meta http-equiv=&amp;quot;Content-Language&amp;quot; content=&amp;quot;en-us&amp;quot;&amp;gt;&lt;br /&gt;&amp;lt;title&amp;gt;Nightfall&amp;lt;/title&amp;gt;&lt;br /&gt;....&lt;/p&gt;&lt;p&gt;Now, save the page, and then let's try and validate it and see how many errors we come up with, shall we? Point your browser to &lt;a href="http://validator.w3.org/" target="_blank"&gt;http://validator.w3.org/&lt;/a&gt;, and in the 'Validate by Upload' section, select your index page and click 'Check.' When I did this, it returned the following:&lt;/p&gt;&lt;blockquote&gt;Result: Failed validation, 45 errors&lt;/blockquote&gt;&lt;p&gt;Ugh. Well, that's quite a few errors (trust me, I've seen much much worse - in the thousands - for a highly developed page). I'm betting that you probably looked down on the results page more and paused a bit if you are unfamiliar with the new standards. The first one should catch the eye of most developers who have not been coding in this new way yet. It says:&lt;/p&gt;&lt;blockquote&gt;Line 12 column 14: &lt;span style="font-weight:bold;"&gt;there is no attribute "BGCOLOR".&lt;/span&gt;&lt;/blockquote&gt;&lt;p&gt;Which is, of course, a somewhat curious way to phrase it, but it's honestly the best way to think about it. Yes, there is a bgcolor tag -- but it's better in the long run if you forget that it exists.&lt;/p&gt;&lt;p&gt;However, the vast majority of the errors are those that are displaying as&lt;/p&gt;&lt;blockquote&gt;element "FONT" undefined.&lt;/blockquote&gt;&lt;p&gt;The notorious &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; tag -- another tag that should disappear from our memories. So shall we fix those first? I think so. Let's move on to learning how we'll do what we used to do with the &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt;, but in a way that is following standards -- and subsequently make those errors go away.&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-intro.html"&gt;Intro&lt;/a&gt; &amp;lt;-- Go Back -OR- Continue on: &lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-2.html"&gt;Step 2&lt;/a&gt;&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113221600132401710?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113221600132401710/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113221600132401710' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113221600132401710'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113221600132401710'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-1.html' title='Tutorial - Nightfall - Step 1'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113221243041959462</id><published>2005-11-17T01:12:00.000-06:00</published><updated>2005-11-24T04:42:22.830-06:00</updated><title type='text'>Tutorial - Nightfall - Intro</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Introduction&lt;/h3&gt;&lt;p&gt;[Note:] This tutorial is for people who have already been making websites. It is not for beginners. For this tutorial I will assume that you understand the basic uses of tags, images, fonts, can use a text editor (I recommend &lt;a href="http://usefulwebsites.blogspot.com/2005/11/pspad-product-review.html"&gt;PSPad&lt;/a&gt;), and have overall general experience in web design. This first step will not get into the advanced topics, so webmasters with only mild experience should feel at ease. This tutorial does assume no knowledge of web standards or CSS. [End Note.]&lt;/p&gt;&lt;p&gt;Web Developers have been coding in various ways for a long time. If you are reading this, then perhaps you've decided that you are ready to make the transition to web standards. While there are plenty of tutorials that start with the bare basics of how to code following standards, many seasoned web developers/masters want to know what actually applies to their sites. I'm going to attempt to do that in a step-by-step fashion.&lt;/p&gt;&lt;p&gt;This tutorial will walk you through the steps needed to actually take an existing web page that is not following standards, show you where the problems are so that you can find them in your own sites, explain what the substitutions are from the old way to the new way, and let you learn to start coding to standards on a beginning level.&lt;/p&gt;&lt;h3&gt;The First Project&lt;/h3&gt;&lt;h4&gt;Codename: Nightfall&lt;/h4&gt;&lt;p&gt;We will be doing our first project using the free version of a template that was available online from &lt;a href="http://www.pegaweb.com/" target="_blank"&gt;Pegaweb.com&lt;/a&gt;. I am providing this template to you in a zip file, and we'll be taking that webpage, and actually turning it into a standard following piece of beauty.&lt;/p&gt;&lt;p&gt;I'm going to explain quite a lot as we move along, but the first thing that you should do is download the template by going to &lt;a href="http://mistycabal.mi.funpic.org/blog/examples/" target="_blank"&gt;this page&lt;/a&gt; and grabbing 'Nightfall - Intro Starting Files.'&lt;/p&gt;&lt;p&gt;Now, some of you may wonder if I'm using this template because I hate the design and I want to make an example of it. That is absolutely not the case. The designer at Pegaweb is actually a very good graphic artist, but like many people who are good artists, the code behind the page is not up to par. That's perfectly fine. Artists do not need to know how to code wonderfully. Coders do. I am most definitely not an artist, and I have a great amount of respect for people who can work magic with computer art. This template has managed to do something that is very hard - use a lot of colors without them clashing, and still focus the eye on the main content part of the page. Additionally, this design has a very lively and playful design that I found relatively unique and perhaps good for a business that sells crafts or curious objects. So, I picked the template not because it was bad, but because it was &lt;span style="font-weight:bold;text-decoration:underline;"&gt;worth&lt;/span&gt; making up to standards.&lt;/p&gt;&lt;p&gt;So, without further ado... let's start by unzipping that download into a folder. Then move on to the &lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-1.html"&gt;next step&lt;/a&gt;.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113221243041959462?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113221243041959462/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113221243041959462' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113221243041959462'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113221243041959462'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-intro.html' title='Tutorial - Nightfall - Intro'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113200525912948313</id><published>2005-11-14T15:20:00.000-06:00</published><updated>2005-11-24T04:45:48.476-06:00</updated><title type='text'>PSPad - Product Review</title><content type='html'>I edit a lot of text files. Alot. The short list of file types that I open on a regular basis include plain text files, web pages, php pages, css files, and javascripts. That's just before lunch. I've had to juggle through various different programs to get the features that I need. For the most part, the integrated Notepad on Windows handles much of it, however, Notepad is terrible at formatting files that come in with distinct spaces. For those, I have to open in Wordpad. Overall, bouncing around through various file types and the software it takes to open them is a pain.&lt;/p&gt;&lt;p&gt;Then one day I ran across &lt;a href="http://www.pspad.com" target="_blank"&gt;PSPad&lt;/a&gt;. Talk about a time saver. This little piece of Freeware is something I would definitely pay for. The only downside to this little gem is that it's only for Windows users. I saw this on their main page and my jaw hit the floor. &lt;span style="font-style: italic;"&gt;"Wow..."&lt;/span&gt; was about the only thought in my head as I read:&lt;/p&gt;&lt;blockquote style="font-style:italic"&gt;"Editor PSPad supports file types: C++, Cobol, MS-Dos batch, CSS, Forth, Fortran, FoxPro, HTML, XHTML, INI, Inno Setup, Java, JavaScript, KixStart, Object Pascal, Perl, PHP, Python, RSS, SQL, TCL/TK, Unix ShellScript, VBScript, Visual Basic, X86 assembler + 90 other languages included as user highlighter definition."&lt;/blockquote&gt;&lt;p&gt;That's exactly what I was looking for. Okay, so I had pretty much already decided to download it right there, but I wanted to pretend that I needed to be 'sold' on it more. I also noticed the little image that was boasting "No Spyware, No Adware, No Viruses." So, I took a look at the 'Characteristics' page. A few things caught my eye specifically as features that would be really helpful to me. Integrated Tidy library, HTML preview, reformat and compress HTML code, syntax highlighting, and ....&lt;span style="font-style: italic;"&gt; "Wait, does that mean what I think it means??"&lt;/span&gt;&lt;/p&gt; &lt;blockquote style="font-style:italic"&gt;"Text difference with color-coded differences highlighted"&lt;/blockquote&gt;&lt;p&gt;&lt;span style="font-style: italic;"&gt;*drools*&lt;/span&gt; Okay, now, if case you don't know what this kind of thing means to a coder, let me explain. This means that I can open two text files at once, and it will compare the two and show differences in code. This is &lt;span style="font-weight: bold;"&gt;extremely&lt;/span&gt; helpful, and I &lt;span style="text-decoration: line-through;"&gt;have&lt;/span&gt; had, two programs on my computer to handle that for different types of files. Okay. That's enough 'selling' to me. I hit the download page. I briefly notice that it's a pretty lightweight download, coming in just under 3 megs. Nice little perks.&lt;/p&gt;&lt;p&gt;Install was a breeze. Okay, so starting it up my first thought is &lt;span style="font-style: italic;"&gt;"Wow, that loaded fast."&lt;/span&gt; It does still. It's a very slimmed down program which, in my mind, is superb. One of the reasons I preferred to use Notepad before was because it loads so quick if I just need to make a small adjustment. This loads in not much longer and gives me tons more features.&lt;/p&gt;&lt;p&gt;I've tried out plenty of them, and haven't found any problems yet. Overall, it's really a great program. Definitely worth the download if you do any kind of coding at all. You can pick up the little gem at &lt;a href="http://www.pspad.com" target="_blank"&gt;PSPad.com&lt;/a&gt;.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113200525912948313?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113200525912948313/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113200525912948313' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113200525912948313'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113200525912948313'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/pspad-product-review.html' title='PSPad - Product Review'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113182061335100137</id><published>2005-11-12T11:35:00.000-06:00</published><updated>2005-11-24T04:49:13.860-06:00</updated><title type='text'>Complimentary Color Scheme</title><content type='html'>&lt;/p&gt;&lt;h2&gt;How To Pick A Good Site Color Scheme&lt;/h2&gt;&lt;p&gt;Website colors are extremely important. One second. Let's say that again.&lt;span style="font-weight:bold"&gt; Color is VERY important.&lt;/span&gt; Allright. Now let's continue.&lt;/p&gt;&lt;p&gt;To begin to illustrate why colors are so very important, we have to list a few basic aspects of color:&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;span style="font-weight:bold"&gt;Color evokes emotion.&lt;/span&gt; (More specifically: People subconsciously react emotionally to colors.)&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight:bold"&gt;Color guides the eye.&lt;/span&gt; (Meaning that colors are used by the user to follow a trail across a page.)&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight:bold"&gt;People see colors differently.&lt;/span&gt; (Ever have someone tell you that your dark-blue shirt looks black?)&lt;/li&gt;&lt;li&gt;&lt;span style="font-weight:bold"&gt;Computers limit color.&lt;/span&gt; (Computer monitors and operating systems will limit and change how colors are shown.)&lt;/li&gt;&lt;/ul&gt;&lt;h3&gt;&lt;span style="text-decoration:underline;"&gt;Color Evokes Emotion&lt;/span&gt;&lt;/h3&gt;&lt;p&gt;These things are pretty much standard after much research and testing, so I'm just going to give you a quote from a nice article on this topic found &lt;a href="http://www.coolhomepages.com/cda/color/" target="_blank"&gt;here.&lt;/a&gt;&lt;/p&gt;&lt;blockquote style="font-style:italic"&gt;"&lt;span style="color:#CC0000"&gt;Red&lt;/span&gt; is associated with blood, and with feelings that are energetic, exciting, passionate or erotic. Most colors carry both positive and negative implications. The downside of red evokes aggressive feelings, suggesting anger or violence.&lt;br /&gt;&lt;br /&gt;&lt;span style="color:#FF9900"&gt;Orange&lt;/span&gt; is the color of flesh, or the friendly warmth of the hearth fire. The positive implications of this color suggest approachability, informality. The negative side might imply accessibility to the point of suggesting that anyone can approach-- a lack of discrimination or quality.&lt;br /&gt;&lt;br /&gt;&lt;span style="color:#FFFF00"&gt;Yellow&lt;/span&gt; is the color of sunshine. This color is optimistic, upbeat, modern. The energy of yellow can become overwhelming. Therefore yellow is not a color that tends to dominate fashion for long periods of time.&lt;br /&gt;&lt;br /&gt;&lt;span style="color:#00FF00"&gt;Green&lt;/span&gt; In its positive mode, green suggests nature (plant life, forests), life, stability, restfulness, naturalness. On the other hand, green in some tones or certain contexts (such as green skin) might instead suggest decay (fungus, mold), toxicity, artificiality.&lt;br /&gt;&lt;br /&gt;&lt;span style="color:#3399FF"&gt;Blue&lt;/span&gt; suggests coolness, distance, spirituality, or perhaps reserved elegance. Some shade of blue is flattering to almost anyone. In its negative mode, we can think of the "blues"-the implication being one of sadness, passivity, alienation, or depression.&lt;br /&gt;&lt;br /&gt;&lt;span style="color:#CC99FF"&gt;Violet&lt;/span&gt; is the color of fantasy, playfulness, impulsiveness, and dream states. In its negative mode, it can suggest nightmares, or madness."&lt;/blockquote&gt;&lt;p&gt;Now, there are quite a few websites that have really gone into detail on this topic, I definitely suggest you give &lt;a href="http://www.google.com" target="_blank"&gt;Google.com&lt;/a&gt; a whirl. However, I'm going to point you toward a couple of sites that are really helpful.&lt;br/&gt;&lt;br /&gt;One website called &lt;a href="http://www.returnofdesign.com/" target="_blank"&gt;ReturnofDesign&lt;/a&gt; has a excellent sampling of popular color schemes that are pleasing to the eye on &lt;a href="http://www.returnofdesign.com/colors/" target="_blank"&gt;their color page.&lt;/a&gt; That site is great if you want a tried and true color scheme.&lt;br/&gt;&lt;br /&gt;Another favorite of mine is &lt;a href="http://www.webwhirlers.com/colors/" target="_blank"&gt;WebWhirlers&lt;/a&gt;. This site includes some indepth discussion on color theory, and has a lovely little online software program called &lt;a href="http://www.webwhirlers.com/colors/wheel.asp" target="_blank"&gt;'The Color Wheel'&lt;/a&gt; (free) that lets you create your own complimentary color scheme.&lt;/p&gt;&lt;h3&gt;&lt;span style="text-decoration:underline;"&gt;Color Guides the Eye&lt;/span&gt;&lt;/h3&gt;&lt;p&gt;Where you place your colors, and how you use them, will influence where your viewer looks. Whether you are looking at a webpage or someones living room, some things will always attract the eye better than others. Various things do factor in, such as size, shape, and placement - but color is one of the key elements involved. A careful balance between using color to help guide the eye, and maintaining accessibility standards for the visually impaired is something that will be addressed in another section. For now, let's focus on some steps.&lt;/p&gt;&lt;ul&gt;&lt;li&gt;Step 1) Analyze what your website is for.&lt;/li&gt;&lt;li&gt;Step 2) Decide on no more than four important visual components of your site. (Remember that your site name is always one.)&lt;/li&gt;&lt;li&gt;Step 3) Use a common visual model, or make one that guides the eye on its own.&lt;/li&gt;&lt;li&gt;Step 4) Use emotion specific colors from your color scheme to influence the response to the points.&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;These things will help some, but the real test is to watch someone visit your site for the first time. Ask a friend, coworker, or relative to take a look at your site. Watch their eyes and their face.&lt;/p&gt;&lt;p&gt;When someone hates a color, they tend to squint when their eyes go near it, somewhat in a way of 'blocking it out.' The same with things they can't see clearly and applies especially to small text. Also watch to see if their eyes follow a natural and easy flow or if they are darting all over the place. Ask them to find you some things on your site. Do they naturally go to the right place or are they not sure where to find it and start searching?&lt;/p&gt;&lt;p&gt;Overall, it's very important to get actual user feedback on a website.&lt;/p&gt;&lt;h3&gt;&lt;span style="text-decoration:underline;"&gt;People See Color Differently&lt;/span&gt;&lt;/h3&gt;&lt;p&gt;I gave the example earlier about the person who thinks your dark-blue shirt is black. Everyone has a different 'range' of color that they can see really well, and this is affected by various vision issues that you have no control over. However, what you can do to control it is to follow three small rules in your color design:&lt;/p&gt;&lt;ul&gt;&lt;li&gt;Make sure that you have a drastic color contrast for things that should look different.&lt;/li&gt;&lt;li&gt;Make borders fade gracefully by using a series of small changes in background colors around the edge, rather than one start line.&lt;/li&gt;&lt;li&gt;Remember that people always recall and see information better if it is light text on a dark background better than they recall dark text on a light background.&lt;/li&gt;&lt;/ul&gt;&lt;h3&gt;&lt;span style="text-decoration:underline;"&gt;Computers Limit Color&lt;/span&gt;&lt;/h3&gt;&lt;p&gt;This is a somewhat intricate topic, so I'll just give a non-technical overview. Some colors will not show up properly on your users monitor. To compensate for that, the web community has distinguished 216 'Web Safe' colors. An 8-bit monitor displays 256 colors, but not all of those are Web Safe colors. &lt;a href="http://www.webdevelopersjournal.com/articles/websafe1/websafe_colors.html" target="_blank"&gt;This article&lt;/a&gt; explains the entire reasoning behind the 'Web Safe' colors. That is definitely some good reading. However, if you'd just like to see what the colors are, you can take a look at the &lt;a href="http://www.w3schools.com/html/html_colors.asp" target="_blank"&gt;Web Safe colors&lt;/a&gt; that &lt;a href="http://www.w3schools.com" target="_blank"&gt;W3Schools&lt;/a&gt; has on their site. Also, &lt;a href="http://www.visibone.com" target="_blank"&gt;Visibone&lt;/a&gt; has a great little &lt;a href="http://www.visibone.com/colorlab/" target="_blank"&gt;color lab program&lt;/a&gt; on their website that you can use online. This program will not show you the colors that look best together, but it will show you how the colors look together, and it only uses web safe colors.&lt;br /&gt;&lt;br /&gt;&lt;span style="font-weight:strong"&gt;Overall, remember:&lt;/span&gt; Color Evokes Emotion. Color Guides the Eye. People See Color Differently. Computers Limit Color.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113182061335100137?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/113182061335100137/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=113182061335100137' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113182061335100137'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113182061335100137'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/11/complimentary-color-scheme.html' title='Complimentary Color Scheme'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112800634228278869</id><published>2005-09-29T09:06:00.000-05:00</published><updated>2005-11-24T04:50:41.550-06:00</updated><title type='text'>Accessibility Compliance</title><content type='html'>&lt;/p&gt;&lt;h3&gt;What is Accessibility Compliance?&lt;/h3&gt;As was mentioned in the previous discussion on code compliance, there is some substantial overlap between code and accessibility compliance. However, the one distinction is that code compliance is more geared toward coding a webpage in a way that it will be functional for all methods of viewing it, and accessibility deals more with ensuring that it is easily comprehensible by all people viewing it.&lt;br /&gt;&lt;br /&gt;The common association with accessibilty standards is that these are for viewers with disabilities. That is not wholly accurate, but it is part of what they are for. Overall, you want to create your site in a way that you do not alienate your visitors due to either technical or physical limitations. For technical limitation, think of how your website would be viewed by someone using an alternative method of accessing the Internet (such as a small cell phone or PDA display, or even an in-vehicle dash display). For physical limitations, you should keep in mind that millions of people accessing the Internet are disabled in some way. An easy comparison is that your business would not be considered respectable if you didn't allow for handicap access ramps, or other accomodations for those with limitations, so why would you consider doing that with your online business presentation.&lt;br /&gt;&lt;br /&gt;These standards are, most certainly, considered something that is not only proper etiquette for a website to use, but also extremely good for business. However, U.S. government websites are now required to make their websites accessible, and anyone who plans to work as a web developer in any sector or sub-sector of the U.S. government should make certain they understand how to make a site accessible.&lt;br /&gt;&lt;br /&gt;The &lt;a href="http://www.w3.org/WAI/"&gt;Web Accessibility Initiative&lt;/a&gt; (WAI) which is a large subgroup of the &lt;a href="http://www.w3.org/"&gt;W3C&lt;/a&gt;. When you are dealing with creating a webpage(site) that follows the standards set by the WAI, you will be following the &lt;a href="http://www.w3.org/WAI/intro/wcag.php"&gt;Web Content Accessbility Guidelines&lt;/a&gt; (WCAG). The current standards set for WCAG is version 1.0 and contains 14 general principles of accessible web design. Keep in mind that these are just categories, and there are many elements within each.&lt;br /&gt;&lt;br /&gt;&lt;span style="font-weight: bold;font-size:130%;" &gt;14 General Principles of for WCAG 1.0&lt;/span&gt;&lt;br /&gt;&lt;ol&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Provide equivalent alternatives to auditory and visual content.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(ex: using alternative text for images that don't display)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Don't rely on color alone.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(making sure that there is proper color use, and that the site is still understandable if it was all black &amp;amp; white)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Use markup and style sheets and do so properly.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(this goes along with code compliance &amp;amp; separating design from code)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Clarify natural language usage.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(indicating the site language in code, and explaining any abbreviations)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Create tables that transform gracefully.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(use tables for tabular data mostly, and make sure to lable your tables using headers and footers to describe what they are)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Ensure that pages featuring new technologies transform gracefully.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(make sure that your page still is understandable without all the frills - like scripts and flash)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Ensure user control of time-sensitive content changes.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(anything that is active on your page - like scrolling or blinking or sound - should be able to be turned off by the user)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Ensure direct accessibility of embedded user interfaces.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(again, making sure your site layout follows guidelines)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Design for device-independence.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(take into account that users may be using various methods to access your site, and provide alternate ways to get to information - like shortcuts and links)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Use interim solutions.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(Don't wait, start changing your site now.)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Use W3C technologies and guidelines.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(Be sure to use the current coding standards.)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Provide context and orientation information.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(ex: Clearly lable your page and data sections - especially if you use frames.)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Provide clear navigation mechanisms.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(ex: Use a consistent navigation layout for your whole site - not putting the links on the left on one page, then the right on the next.)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Ensure that documents are clear and simple.&lt;/span&gt; &lt;span style="font-size:78%;"&gt;(Keep your information relavant, and use language that is understandable by your readers.)&lt;/span&gt;&lt;br /&gt;&lt;/li&gt; &lt;/ol&gt; Now, as I said above, there are subaspects to each, and those will be addressed in a later article. However, if you want to jump ahead you can take a look at the full page explanation of the &lt;a href="http://www.w3.org/TR/WCAG10/"&gt;WCAG 1.0 list of 14&lt;/a&gt; needed aspects.&lt;br /&gt;&lt;br /&gt;&lt;span style="font-size:130%;"&gt;&lt;span style="font-weight: bold;"&gt;The 3 Priority Levels &amp;amp; Conformance&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;Each of the 14 guidelines has checkpoints within it. For instance, let me give you an example of one of the checkpoints for the first guideline.&lt;br /&gt;&lt;blockquote&gt;&lt;span style="font-style: italic;font-size:85%;" &gt;&lt;span style="font-weight: bold;"&gt;Guideline 1.&lt;/span&gt;  Provide equivalent alternatives to auditory and visual content.&lt;br /&gt;&lt;span style="font-weight: bold;"&gt;Checkpoint 1.1.&lt;/span&gt; Provide a text equivalent for every non-text element (e.g., via "alt", "longdesc", or in element content). This includes: images, graphical representations of text (including symbols), image map regions, animations (e.g., animated GIFs), applets and programmatic objects, ascii art, frames, scripts, images used as list bullets, spacers, graphical buttons, sounds (played with or without user interaction), stand-alone audio files, audio tracks of video, and video.&lt;br /&gt;&lt;span style="font-weight: bold;"&gt;Priority Level:&lt;/span&gt; 1&lt;/span&gt;&lt;br /&gt;&lt;/blockquote&gt;Each checkpoint is assigned a specific priority. There are 3 levels of priorities possible for each checkpoint.&lt;br /&gt;&lt;ul&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Priority 1&lt;/span&gt; : A Web content developer &lt;strong&gt;must&lt;/strong&gt; satisfy this checkpoint. Otherwise, one or more groups will find it impossible to access information in the document. Satisfying this checkpoint is a basic requirement for some groups to be able to use Web documents.&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Priority 2:&lt;/span&gt; A Web content developer &lt;strong&gt;should&lt;/strong&gt; satisfy this checkpoint. Otherwise, one or more groups will find it difficult to access information in the document. Satisfying this checkpoint will remove significant barriers to accessing Web documents.&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Priority 3:&lt;/span&gt; A Web content developer &lt;strong&gt;may&lt;/strong&gt; address this checkpoint. Otherwise, one or more groups will find it somewhat difficult to access information in the document. Satisfying this checkpoint will improve access to Web documents.&lt;/li&gt; &lt;/ul&gt; Now, based on whether or not you followed each of the checkpoints for the 14 guidelines, and which priorities you completed, your website may lay claim to a certain level of conformance. If you've seen websites with a little button that says 'AA' or 'AAA' then you will understand where that comes from in the following list.&lt;br /&gt;&lt;ul&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Conformance Level "A":&lt;/span&gt; All Priority 1 checkpoints are satisfied.&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Conformance Level "AA":&lt;/span&gt; All Priority 1 and 2 checkpoints are satisfied.&lt;/li&gt;   &lt;li&gt;&lt;span style="font-weight: bold;"&gt;Conformance Level "AAA":&lt;/span&gt; all Priority 1, 2, and 3 checkpoints are satisfied.&lt;br /&gt;&lt;/li&gt; &lt;/ul&gt; So, overall, you want to aim for following the conformance to the highest level that you can. Aiming for 'A' is a minimum. You want to always aim for the 'Triple-A' ranking.&lt;br /&gt;&lt;br /&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112800634228278869?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/112800634228278869/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=112800634228278869' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112800634228278869'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112800634228278869'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/09/accessibility-compliance.html' title='Accessibility Compliance'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112794355076746331</id><published>2005-09-28T15:59:00.000-05:00</published><updated>2005-11-24T04:53:36.890-06:00</updated><title type='text'>Standards Compliant Code</title><content type='html'>&lt;/p&gt;&lt;p&gt;&lt;span style="font-weight: bold;font-size:130%;" &gt;What is Standards Compliant Code?&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;Well, it actuall is more of an overall category than a single thing, however, I'll define it as this:&lt;/p&gt;&lt;br /&gt;&lt;blockquote style="font-style: italic;"&gt;&lt;span style="font-size:85%;"&gt;"Standards Compliant Code is the utilization of the current standards combinations, as set forth by the W3C Recommendations, in order to create code that uses certain standards to ensure that it is readable by the greatest number of people and systems. Essentially, the common feature is to compartmentalize in a way that you keep the code separate from the appearance of a page and (in some cases) from the data displayed on the page."&lt;/span&gt;&lt;/blockquote&gt;&lt;p&gt;Now, you'll notice that I said the 'utilization of the current standards combinations' and that is a key point to make. The HTML language is not the only option, there are variations that have come about through the incorporation of XML, and thus the use of XHTML. Also, you can see that I mentioned that the appearance of a page should be kept separate from the page code. That is where the use of CSS will take place.&lt;/p&gt;&lt;p&gt;&lt;span style="font-weight: bold;font-size:130%;" &gt;What is the benefit of following the W3C Standards?&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;There are many, but I'll highlight some of the most important.&lt;br /&gt;&lt;br /&gt;The first thing to consider is that when you write code not following W3C standards your page may look different in different browsers. Yes. There are other browsers besides Internet Explorer, in fact, I personally don't touch IE anymore. I use FireFox as my primary browser and Opera as my alternate. Why would they look different? Well, unfortunately not all browsers interpret poorly written code in the same way. Some are more forgiving than others, so your page may display in a variety of ways.&lt;br /&gt;&lt;br /&gt;Another thing to keep in mind is that, without standards compliance, your page may also look different depending on operating system. Yes. There are other operating systems besides Windows. There is a very active group of Linux users in the world, as well as those who use Macintosh, Unix, etc... Again, why would it look different? Many reasons, but one is that different operating systems come with different fonts (for example) and if you use a font in your page that someone doesn't have on their computer to be able to read -- then they won't see it the way you made the page.&lt;br /&gt;&lt;br /&gt;Additionally, without standards compliance, your page may look different depending on the screen size of the person viewing your page. Your page should be flexible enough to accomodate a variety of screen sizes, but if its not, it may end up looking far too huge or too small on various screens.&lt;br /&gt;&lt;br /&gt;Also, standards compliance often encompases accessibility compliance, though accessibility expands the concept further (including coding and designing your page in a way that will not be difficult for a person with disabilities or physical limitations to still be able to access) -- but I'll be addressing those aspects later.&lt;br /&gt;&lt;br /&gt;Overall, there are many reasons why you want to use the standards compliance, and it is to your benefit to learn now, not later, how to do it.&lt;br /&gt;&lt;br /&gt;&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112794355076746331?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/112794355076746331/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=112794355076746331' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112794355076746331'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112794355076746331'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/09/standards-compliant-code.html' title='Standards Compliant Code'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112792546975619038</id><published>2005-09-27T11:15:00.000-05:00</published><updated>2005-11-24T04:55:08.040-06:00</updated><title type='text'>Elements of Good Web Design</title><content type='html'>&lt;span style="font-weight: bold;font-size:130%;" &gt;"The Overview"&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;The Internet is chock full of webpages, and it is growing at an amazing rate, but I think that most people can agree that not everyone has an eye for good web design. I bet you have run across many webpages that just made you cringe and click the 'X' as fast as you could.&lt;br /&gt;&lt;br /&gt;In the late 90's everyone was following the 'more is better' concept. Remember all the webpages filled with butterflys floating across the screen, a bouncing rabbit in the corner, a spinning '@' for email, images of books flipping open repeatedly wanting you to sign the guest book, and little space stars following your mouse pointer around -- all on one page? *smiles* I remember it too, but thankfully, only in nostalgia for what we have moved past.&lt;br /&gt;&lt;br /&gt;Some things are easier to give up than others. We have all this neat stuff! So much technology, and we want to use it all! It reminds me of the 80's, when it was about how much jewlery and makeup we could wear, and how big we could spike our hair out. :P Admittedly, I do miss some of the things about the 80's, and I do think it was a great time of growth, but much like that we have to look at how things are in technology now, and see the mistakes we made then as growth.&lt;br /&gt;&lt;br /&gt;There are several elements to really good webdesign, but I will be focusing on what I feel are the most vital:&lt;/p&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/09/standards-compliant-code.html"&gt;Standards Compliant Code&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/09/accessibility-compliance.html"&gt;Accessibility Compliance&lt;/a&gt;&lt;br /&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/complimentary-color-scheme.html"&gt;Complimentary Color Scheme&lt;/a&gt;&lt;/li&gt;&lt;li&gt;'User-in-Mind' Navigation/Layout &lt;span style="font-style: italic; color: rgb(51, 153, 153);font-size:78%;" &gt;(*coming soon*)&lt;/span&gt; &lt;/li&gt;   &lt;li&gt;Useful Content &lt;span style="font-style: italic; color: rgb(51, 153, 153);font-size:78%;" &gt;(*coming soon*)&lt;/span&gt; &lt;/li&gt; &lt;/ul&gt;&lt;p&gt;Now, these things may seem basic to some people. Sure, you want to use code that doesn't break, you want it to be something that people can access, you don't want the colors to look awful, nor do you want to make it hard to use, and of course your content is useful!&lt;br /&gt;&lt;br /&gt;However - you may be surprised exactly how much more goes in to designing a truly good website. Each of these elements listed means so much more than it may seem at first glance, and this will be the start of a new article and tutorial series on how to make a really good site.&lt;br /&gt;&lt;br /&gt;Please feel free to comment along the way.&lt;br /&gt;&lt;br /&gt;&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112792546975619038?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/112792546975619038/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=112792546975619038' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112792546975619038'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112792546975619038'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/09/elements-of-good-web-design.html' title='Elements of Good Web Design'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112774476499981351</id><published>2005-09-26T09:08:00.000-05:00</published><updated>2005-11-24T04:56:26.993-06:00</updated><title type='text'>FreeRAM - Product Review</title><content type='html'>My discovery of FreeRAM began after at least a year of frustration at not having enough RAM on my computer for the things I do daily. Granted, I suppose I could just go buy more, but I use my laptop predominantly, and my RAM has to be custom ordered for this one and costs a fortune. So, I've not done it. Instead, day in and day out, I'd dealt with a computer that would start lagging severely after a few hours. I really wanted another solution.&lt;br /&gt;&lt;br /&gt;I decided to look around for something that would speed up my computers RAM, and better allocate the memory I had to the programs I was using. Lo and Behold! I found one that did that, and was free! It's called FreeRAM. I ran across the YourWare Solutions website, and found a free download of &lt;a href="http://www.yourwaresolutions.com/software.html"&gt;FreeRAM XP Pro&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;The two features in their list that really drew my attention were:&lt;/p&gt;&lt;br /&gt;&lt;blockquote style="font-style: italic;"&gt;"Automatic, real-time memory monitoring and optimization.&lt;br /&gt;AutoFree option intelligently optimizes RAM without sacrificing performance."&lt;/blockquote&gt;&lt;p&gt;That was enough for me, and exactly what I was looking for. I downloaded, installed, and ran it immediately. I have it set to run on start-up, and free my RAM as soon as all my programs are done loading. Then, I set it to auto-free my RAM every time my RAM drops below 25megs.&lt;br /&gt;&lt;br /&gt;After only a few days, I saw a huge difference in what it was like to use this computer. My lovely custom laptop with the horridly expensive RAM could now wait longer to get more. This was freeing my RAM regularly while I was using it, and it handles it for me in the background.&lt;/p&gt;&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112774476499981351?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/112774476499981351/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=112774476499981351' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112774476499981351'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112774476499981351'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/09/freeram-product-review.html' title='FreeRAM - Product Review'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112774305379497107</id><published>2005-09-24T08:32:00.000-05:00</published><updated>2005-09-26T09:45:33.760-05:00</updated><title type='text'>Avast! - Product Review</title><content type='html'>About four months ago I started getting that familiar pop-up window on my computer. My McAfee VirusScan software was so kindly reminding me that I needed to renew my virus updates subscription - repeatedly. I'd be in the middle of something, and there pops this annoying red and white box - again. Now, if it had been just once a day, that might not have pushed me over the edge, but it wasn't just at load time, it was periodically while I was using it. And these people thought I was now going to pay them money to renew my subscription? Ha!&lt;br /&gt;&lt;br /&gt;So I started looking for some alternatives, and came across the &lt;a href="http://www.avast.com/"&gt;Avast website&lt;/a&gt;. Now, being the owner of a web design business, my first thought was "Oh, nice website." and so I paid a bit more attention to it. In my mind, people who take the time to make a nice and appealing site, have a product they are serious about getting out there. So, I browsed around on the site some, and came upon the &lt;a href="http://www.avast.com/i_kat_207.php?lang=ENG"&gt;Free Home Version of Avast! 4&lt;/a&gt;. (Note: They also have a version for Linux for home that is coming out next month.)&lt;br /&gt;&lt;br /&gt;I wanted three basic things out of a free anti-virus software. I wanted it to have automatic updating, take less active memory (RAM) from my computer to run than McAfee, and I wanted it to be updated frequently because new viruses come out so often. When looking at the features, I found that it did include everything I was looking for, and then some. Heck, they even have skins I could download to change the appearance! Not that I'm particularly concerned with my anti-virus software looking pretty, but it was just a neat little addition. Now, it did warn me that after 60 days I'd have to t register online for a free registration key to keep the software going. Then, annually, get a new key. But they made sure to highlight that those key codes are always free. So, I gave it a shot.&lt;span style=";font-family:Verdana,Arial,Helvetica;font-size:85%;"  &gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;I uninstalled my McAfee, said a none to remorseful 'Goodbye' to the red &amp;amp; white popup, and installed Avast! on my computer. The very first thing I noticed on reboot was that it didn't drag my system the way McAfee did. I took a look at the running processes, and noticed that it was taking significantly less RAM to run than McAfee. Woo! One promise fulfilled so far. It also has a very easy interface for picking and choosing what it should monitor in programs. If you want it to watch your email clients and online email, messenger programs, etc... it's very easy to set.&lt;br /&gt;&lt;br /&gt;The real test happened over the next few weeks. As I used it, I was seeing some very frequent updates come in for the software. So now, it had scored 3 for 3. I got my desire for auto-updating fulfilled, frequent updates, and less ram needed by my computer.&lt;br /&gt;&lt;br /&gt;I've been using it since then, and I cannot say I'm at all sad to see that annoying pop up gone.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112774305379497107?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/112774305379497107/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=112774305379497107' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112774305379497107'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112774305379497107'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/09/avast-product-review.html' title='Avast! - Product Review'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-110946268356766632</id><published>2005-02-26T18:04:00.000-06:00</published><updated>2005-11-24T04:57:59.723-06:00</updated><title type='text'>Firefox - Product Review</title><content type='html'>I used to be an Internet Explorer user, but IE has long been disabled on my computer. Then I became a Mozilla user. Now... I've fallen in love with Firefox. I still use Mozilla for web development, because it is a more 'heavyweight' program. However, all my browsing is now done in Firefox. &lt;br /&gt;&lt;br /&gt;Firefox is a wonderful program. It is an absolute &lt;strong&gt;Must Try.&lt;/strong&gt; If you've never heard the words 'Mozilla' and 'Firefox'... its time to catch up. &lt;br /&gt;&lt;br /&gt;This sleek, fast, powerful, and safe browser is customizable to the N'th degree. Internet Explorer doesn't hold a candle to all the things you can do with Firefox.&lt;br /&gt;&lt;br /&gt;It has a built-in popup blocker that works &lt;strong&gt;great.&lt;/strong&gt; Another bonus, unlike IE, Firefox is a small install, only about 4.7MB  for Windows. Also, its not just for Windows users. You can download it for Mac OS X, and Linux also... and in many different languages.&lt;br /&gt;&lt;br /&gt;It's been a wonderful program for me, and I've found some favorite plugins and theme's along the way that I'll share later. For now, visit the link and give it a try.&lt;br /&gt;&lt;a href="http://www.spreadfirefox.com/?q=user/register&amp;amp;r=77302"&gt;Firefox - Rediscover the web&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-110946268356766632?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://www.spreadfirefox.com/?q=user/register&amp;r=77302' title='Firefox - Product Review'/><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/110946268356766632/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=110946268356766632' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/110946268356766632'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/110946268356766632'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/02/firefox-product-review.html' title='Firefox - Product Review'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-110946178640023265</id><published>2005-02-26T17:49:00.000-06:00</published><updated>2005-02-26T17:49:46.400-06:00</updated><title type='text'>ImageVenue - Site Review</title><content type='html'>ImageVenue.com definitely qualifies as one of the most useful sites around. A huge bonus: It's completely free! You can upload your pictures, they give you a link for it, and they host it for you with unlimited bandwidth and unlimited amount of pictures. This is Great for bloggers and ebay'ers. I definitely suggest giving it a try.&lt;br /&gt;&lt;a href="http://www.imagevenue.com/faq.php"&gt;ImageVenue - Frequently Asked Questions about ImageVenue.&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Enjoy!&lt;br /&gt;&lt;br /&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-110946178640023265?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='related' href='http://www.imagevenue.com' title='ImageVenue - Site Review'/><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/110946178640023265/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=110946178640023265' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/110946178640023265'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/110946178640023265'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2005/02/imagevenue-site-review.html' title='ImageVenue - Site Review'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-109241788744870733</id><published>2004-08-13T12:23:00.000-05:00</published><updated>2004-08-13T12:24:47.446-05:00</updated><title type='text'>Research Results</title><content type='html'>Well, it looks like I have been able to come up with some very good finds for the research I was working on.&lt;br /&gt;&lt;br /&gt;There are excellent websites out there, and they will be coming soon with reviews.&lt;br /&gt;&lt;br /&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-109241788744870733?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/109241788744870733/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=109241788744870733' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/109241788744870733'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/109241788744870733'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/08/research-results.html' title='Research Results'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-109066436037286838</id><published>2004-07-15T05:12:00.000-05:00</published><updated>2004-07-24T05:19:20.373-05:00</updated><title type='text'>Other Things</title><content type='html'>Today I do not feel like reviewing the code of a website. It's very late for me, and I've been thinking about things that are completely different. I've been browsing the internet doing some research. Usually, when one of these needs to research hits me, it lasts a bit, so bear with me.&lt;br /&gt; &lt;br /&gt; I plan on making a few posts on the things that I find. I'm looking, right now, for research material regarding the topics of science (specifically the Volcanology - an area of Geology), and classics (such as latin and greek resources). &lt;br /&gt; &lt;br /&gt; I'll post what I find, then go back and review them (code wise) as time permits.&lt;br /&gt; &lt;br /&gt; ~Nicole~&lt;br /&gt; &lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-109066436037286838?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/109066436037286838/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=109066436037286838' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/109066436037286838'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/109066436037286838'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/07/other-things.html' title='Other Things'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108857372199774175</id><published>2004-06-30T00:35:00.000-05:00</published><updated>2005-11-24T05:19:11.216-06:00</updated><title type='text'>Review: Ebay.com (Grade B-)</title><content type='html'>Ebay. Most people have heard about it, or used it. It definitely qualifies as a Useful site. They supply an excellent service to consumers by having such a well used auction site. People are able to use the service to sell, buy, or just browse around. They have several payment options, and decent listing and commission fees.  &lt;br /&gt;&lt;br /&gt;The company, &lt;a href ="http://www.ebay.com" target="_new"&gt;Ebay.com&lt;/a&gt;, offers its visitors a huge assortment of products that they can purchase online. However, I found that Ebay may need to do a little upgrading on their website practices if they want to have even more customers.&lt;br /&gt;&lt;br /&gt;Here's the grade and the reasons why.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;WEBSITE GRADE FOR: &lt;a href="http://www.ebay.com" target="_new"&gt;Ebay.com&lt;/a&gt;&lt;/b&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;big&gt;&lt;span style="color:blue; font-weight:bolder;"&gt;A&lt;/span&gt;&lt;/big&gt; = &lt;b&gt;USEFUL CONTENT (4cr)&lt;/b&gt;&lt;br /&gt;&lt;big&gt;&lt;span style="color:green; font-weight:bolder;"&gt;B&lt;/span&gt;&lt;/big&gt; = &lt;b&gt;APPEALING DESIGN (3cr)&lt;/b&gt;&lt;i&gt;  (The layout is a bit too colorful in some places, and I would like to see a bit more refinement in their general layout.)&lt;/i&gt;&lt;br /&gt;&lt;big&gt;&lt;span style="color:green; font-weight:bolder;"&gt;B&lt;/span&gt;&lt;/big&gt; = &lt;b&gt;EASE OF NAVIGATION (3cr)&lt;/b&gt;  &lt;i&gt;(Moderately easy to navigate. However, it tends to vary by category section, and people like pages that feel the same so they know where to click.)&lt;/i&gt;&lt;br /&gt;&lt;big&gt;&lt;span style="color:orange; font-weight:bolder;"&gt;C&lt;/span&gt;&lt;/big&gt; = &lt;b&gt;VALID CODE SYNTAX (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://validator.w3.org/" target="_new"&gt;View Validator&lt;/a&gt; Well, finding 159 errors on a the main page of website is not so great. Their subpages are not coded much better. I've seen worse, but I definitely would like to see the code cleaned up and some better technologies used.)&lt;/i&gt;&lt;br /&gt;&lt;big&gt;&lt;span style="color:red; font-weight:bolder;"&gt;F&lt;/span&gt;&lt;/big&gt; = &lt;b&gt;DISABILITY AND BROWSER ACCESS (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://www.doctor-html.com/RxHTML/" target="_new"&gt;View this Validator&lt;/a&gt;, it came up with many many more problems that should be fixed. There were 97 unset image command tags on the main page, and most did not have their proper alt text. That is not conforming to Disability Access standards (WAI), and it slows down page loading time. This site is another that was obviously designed only for people using Windows and Internet Explorer also, because there are no fonts used that are compatible with Mac OS, and the webpage has multiple errors for Netscape and Opera browsers. However, it also caused errors in the most current version of Internet Explorer, so I may reconsider and say that it is just poor coding in general.)&lt;/i&gt;&lt;br /&gt;&lt;big&gt;&lt;span style="color:blue; font-weight:bolder;"&gt;A&lt;/span&gt;&lt;/big&gt; = &lt;b&gt;FINDABILITY (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent. No meta tag errors. But then, most people know about eBay anyway.)&lt;/i&gt;&lt;br /&gt;&lt;big&gt;&lt;span style="color:orange; font-weight:bolder;"&gt;C&lt;/span&gt;&lt;/big&gt; = &lt;b&gt;FRUSTRATION LEVEL (3cr)&lt;/b&gt;&lt;i&gt;  (There were two broken links, and the site would take approximately 21.6 seconds to load over a 28.8 kbps network connection. That is about 10 seconds too long, and its also assuming that the users browser doesn't lock up over the two HTML parse coding errors, and the unclosed code tags on the page. Again, I suggest fixing the code and marking up the images properly so that the page displays faster. The HTML code alone takes up 41.2k, which could be compressed to 38.3k (saving 7% of the page size and increasing speed. Every little bit counts when you are in business on the web.)&lt;/i&gt;&lt;/p&gt;&lt;br /&gt;&lt;hr /&gt;&lt;br /&gt;&lt;p&gt;Total Possible Credits = 20 Total Possible GPA = 4.0&lt;br /&gt;Total Quality Points Given = 56&lt;/p&gt;&lt;h2 style="font-weight:bold"&gt;Total Website GPA = &lt;span style="color:green"&gt;2.8 (B-)&lt;/span&gt;&lt;/h2&gt;&lt;p&gt;~Review conducted by &lt;a href="http://www.websitestyle.com"&gt;WebsiteStyle.com&lt;/a&gt;~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108857372199774175?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108857372199774175/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108857372199774175' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108857372199774175'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108857372199774175'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/review-ebaycom-grade-b.html' title='Review: Ebay.com (Grade B-)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108855819781803091</id><published>2004-06-29T20:06:00.000-05:00</published><updated>2005-11-24T05:22:14.503-06:00</updated><title type='text'>Article: Why do so few people use proper web coding?</title><content type='html'>When I speak to people about the revolutionary changes that occur EVERY day on the Internet, people are often surprised and curious enough to hop online and see for themselves. However, when I talk to web developers about the Internet, they typically react one of three ways...&lt;/p&gt;&lt;blockquote&gt;&lt;b&gt;1.&lt;/b&gt; They stare at me with a blank look when I use the terms DTD, XHTML and CSS.&lt;br /&gt;&lt;b&gt;2.&lt;/b&gt; This shift in their chairs uncomfortably, making it very obvious that they know about these things, but haven't taken the time to learn them, or they don't use them.&lt;br /&gt;&lt;b&gt;3.&lt;/b&gt; They jump right into the conversation and start chatting it up with someone who -also- knows what major changes are taking place online.&lt;/blockquote&gt;&lt;p&gt;So, why are most people unaware? Let me explain. First of all, many people don't use proper web coding standards because it takes work to change. People don't like change.&lt;br /&gt;&lt;br /&gt;Second, there are a great many web developers who do not feel they have the time to learn how. Perhaps they don't. It used to be, about 10 years ago, that a single Web Master would create and run the website for a company. That really is not the case any longer. There are multiple distinctions, and new job categories that have been created in recent years. There are now:&lt;/p&gt;&lt;blockquote&gt;&lt;b&gt;Web Designer&lt;/b&gt; &lt;i&gt;(Usually purely involved in the design element of a page, such as the graphics and perhaps even animation. That can vary.)&lt;/i&gt;&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Web Master / Network Administrator&lt;/b&gt; &lt;i&gt;(Usually involved in the maintenance of the Network for larger companies, and is often an outsourced position, or one whose duties are placed on the Web Developer also, for small companies.)&lt;/i&gt;&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Web Developer&lt;/b&gt; &lt;i&gt;(Usually this is the person who does the website coding, changes, and updates. They have to stay up-to-date on all the emerging and vital technologies such as XHTML, CSS, PHP, CGI, and Javascript, as well as knowing and following the rules for the WAI. Overall, a web developer has a hard and busy job.)&lt;/i&gt;&lt;br /&gt;&lt;br /&gt;&lt;b&gt;SEO Expert&lt;/b&gt; &lt;i&gt;(Some companies are choosing to outsource or hire an SEO Expert to help them with the Search Engine Marketing, and Advertising. Unfortunately, in many small and medium sized businesses this job is also given to the Web Developer.)&lt;/i&gt;&lt;/blockquote&gt;&lt;p&gt;There are other positions that have been created also, but that allowed me to illustrate the problem. For companies that are not able or willing to outsource or hire people specialized in various areas... the Web Developer has to do it all.&lt;/p&gt;&lt;p&gt;I think its very important for businesses to begin to understand that they should include outsourcing, or they will severely overburden their Web Developers during this time of extreme technological growth.&lt;/p&gt;&lt;p&gt;If companies give their Web Developers the time to learn what they need to know to keep up to date, their company will have an employee with the skill to make them a website with functionality that separates them from their business competitors.&lt;/p&gt;&lt;p&gt;&lt;b&gt;Perhaps it is something to think about...&lt;/b&gt;&lt;/p&gt;&lt;p&gt;~Article by &lt;a href="http://www.websitestyle.com/" target="_new"&gt;WebsiteStyle.com&lt;/a&gt; ~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108855819781803091?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108855819781803091/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108855819781803091' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108855819781803091'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108855819781803091'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/article-why-do-so-few-people-use.html' title='Article: Why do so few people use proper web coding?'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108844139576446526</id><published>2004-06-28T11:35:00.000-05:00</published><updated>2005-11-24T05:25:19.703-06:00</updated><title type='text'>Review: Gutenberg.net (Grade A-)</title><content type='html'>One of the largest and most active, publically assisted, and free resources for ebooks on the Internet is &lt;a href="http://gutenberg.net" target="_new"&gt;Project Gutenberg&lt;/a&gt;. The Project was founded by Michael Hart in 1971, and it has continued to prosper based only on volunteer efforts and donations. They have over 10,000 eBooks, and are helped and hosted by &lt;a href="http://www.ibiblio.org/" target="_new"&gt;Ibiblio&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://gutenberg.net" target="_new"&gt;Project Gutenberg&lt;/a&gt; offers internet users the ability to read online, download, print, etc... books in an all text format or various other formats that are easy to read. They also publish a smaller collection of movies and music. This resource is very valuable to the internet community, and has continued to prosper and add books regularly. &lt;br /&gt;&lt;br /&gt;This site is incredibly useful, highly organized, follows strict standards of development, and is Free! Here's the grade and the reasons why.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;WEBSITE GRADE FOR:&lt;br /&gt;&lt;a href="http://gutenberg.net" target="_new"&gt;Gutenberg.net&lt;/a&gt;&lt;/b&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;USEFUL CONTENT (4cr)&lt;/b&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;APPEALING DESIGN (3cr)&lt;/b&gt;&lt;i&gt;  (The layout is very clean and simple, which is what you should have for a site which will require the user to do a lot of reading, although it lacks some design elements. There are some options to change the look of the website, but not many.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;EASE OF NAVIGATION (3cr)&lt;/b&gt;  &lt;i&gt;(Very easy to navigate.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;VALID CODE SYNTAX (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://validator.w3.org/" target="_new"&gt;View Validator&lt;/a&gt; The pages are properly designed and conform to HTML 4.0 Strict Rules. Excellent!&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;DISABILITY AND BROWSER ACCESS (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://www.doctor-html.com/RxHTML/" target="_new"&gt;View this Validator&lt;/a&gt;, it came up with nearly no problems. There were 1 unset image command tags on the main page, and it had no alt text. There were some problems with Netscape browser access, and opera, and one form command that Internet Explorer does not like. I would like to see this fixed because I am someone who advocates Open Access for the Web.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FINDABILITY (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job on the Meta-Tags! Most people do not put their decriptor tags in multiple languages, but they did. That leads to us being able to find the site easier through search engines. However, it can cause some errors. I would suggest alternate doorway pages for each language as a proper alternative.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FRUSTRATION LEVEL (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job! There were no broken links. Also, the site would take approximately 6 seconds to load over a 28.8 kbps network connection. That's great! However, it looks like they might be able to save another 17.6% on the size of their web page by compressing the code.)&lt;/i&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Total Possible Credits = 20 Total Possible GPA = 4.0&lt;br /&gt;Total Quality Points Given = 75&lt;/p&gt;&lt;br /&gt;&lt;h2 style="font-weight:bolder;"&gt;Total Website GPA = &lt;span style="color:green"&gt;3.75 (A-)&lt;/span&gt;&lt;/h2&gt;&lt;p&gt;~Review conducted by &lt;a href="http://www.websitestyle.com"&gt;WebsiteStyle.com&lt;/a&gt;~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108844139576446526?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108844139576446526/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108844139576446526' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108844139576446526'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108844139576446526'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/review-gutenbergnet-grade.html' title='Review: Gutenberg.net (Grade A-)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108843757280144004</id><published>2004-06-27T10:43:00.000-05:00</published><updated>2005-11-24T05:28:36.273-06:00</updated><title type='text'>Review: A1Wireless.com (Grade C+)</title><content type='html'>In a time when more and more people are getting cellular phones, there is an increased need for being able to find the best deals. I have found a website that I feel is good for finding a great deal on a phone (in fact, getting paid to get a phone) but doesn't necessarily hold up when it comes to an analysis. They have great deals that should not be missed, but they definitely need to improve their website coding standards. Although the website works, and offers good resources, you will see why I feel it needs improvement.&lt;br /&gt;&lt;br /&gt;The company, &lt;a href ="http://click.linksynergy.com/fs-bin/click?id=/wBXCrEQhs4&amp;amp;offerid=61066.10000070&amp;amp;type=3&amp;amp;subid=0" target="_new"&gt;A1Wireless.com&lt;/a&gt; offers its visitors a large amount of options. They can take a look a multitude of different phones from various companies, compare rate plans, and... most of all... not only get a free phone with free shipping... but you also get paid up to $125 (the most I've seen) just to get one of the phones!&lt;br /&gt;&lt;br /&gt;Here's the grade and the reasons why.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;WEBSITE GRADE FOR:&lt;br /&gt;&lt;a href="http://click.linksynergy.com/fs-bin/click?id=/wBXCrEQhs4&amp;amp;offerid=61066.10000070&amp;amp;type=3&amp;amp;subid=0" target="_new"&gt;A1Wireless.com&lt;/a&gt;&lt;/b&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;USEFUL CONTENT (4cr)&lt;/b&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;APPEALING DESIGN (3cr)&lt;/b&gt;&lt;i&gt;  (The layout is very clean. Simple.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;EASE OF NAVIGATION (3cr)&lt;/b&gt;  &lt;i&gt;(Very easy to navigate, with the ability to click on various logos to change the phone category you want to see.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="red"&gt;F&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;VALID CODE SYNTAX (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://validator.w3.org/" target="_new"&gt;View Validator&lt;/a&gt; Oh dear. Well, finding 789 errors on a the main page of website is purely unacceptable. A quick check of one of the subpages yielded 1423 errors. And multiple HTML and BODY start and end tags??? After seeing that, I just stopped looking. What does that tell us? Poor coding, pure and simple.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="#000000"&gt;D&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;DISABILITY AND BROWSER ACCESS (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://www.doctor-html.com/RxHTML/" target="_new"&gt;View this Validator&lt;/a&gt;, it came up with more problems that should be fixed. There were 88 unset image command tags on the main page, and none had their proper alt text. I would like to see this fixed because I am someone who advocates Disability Access for the Web. Of course, the other bonus is faster loading time with predefined image sizes. This site is obviously designed only for people using Windows and Internet Explorer also, because there are no fonts used that are compatible with Mac OS, and the webpage has multiple errors for Netscape and Opera browsers.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FINDABILITY (3cr)&lt;/b&gt;&lt;i&gt;  (Pretty decent. But, don't use line breaks in your keywords! It will make it harder for robots to search and index your pages.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="red"&gt;F&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FRUSTRATION LEVEL (3cr)&lt;/b&gt;&lt;i&gt;  (Ack! There were no broken links but... The, the site would take approximately 48.7 seconds to load over a 28.8 kbps network connection. That is WAY too long. A 14.93 second culprit in that large amount is the huge 'refer a friend' image at the bottom that should be compressed. The HTML code alone takes up 51.1k, which could be compressed to 37k (saving 27.6% of the page size and increasing speed. Of course, writing the code properly would save a great deal of space, and setting the image tags also would help.)&lt;/i&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Total Possible Credits = 20 Total Possible GPA = 4.0&lt;br /&gt;Total Quality Points Given = 51&lt;/p&gt;&lt;h2 style="font-weight:bolder"&gt;Total Website GPA = &lt;span style="color:green"&gt;2.55 (C+)&lt;/span&gt;&lt;/h2&gt;&lt;p&gt;~Review conducted by &lt;a href="http://www.websitestyle.com"&gt;WebsiteStyle.com&lt;/a&gt;~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108843757280144004?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108843757280144004/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108843757280144004' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108843757280144004'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108843757280144004'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/review-a1wirelesscom-grade-c.html' title='Review: A1Wireless.com (Grade C+)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108829541169054928</id><published>2004-06-26T19:02:00.000-05:00</published><updated>2005-11-24T05:30:18.390-06:00</updated><title type='text'>Review: W3Schools.com (Grade A-)</title><content type='html'>We received a question asking where to on the net to go to find free HTML instruction. Well, of all the places on the internet today, this is still one of the strongest going sites. It is also one of the most properly done sites, and for a good reason: They not only teach the proper standards so that you learn the Right Way, rather than the quick and messy way, but they use W3 standards, and have won numerous awards for their site (which incidentally gets an average of 1,000,000 hits per day).&lt;br /&gt;&lt;br /&gt;Also, &lt;a href ="http://www.w3schools.com" target="_new"&gt;W3Schools.com&lt;/a&gt; does not just offer free education on HTML programming. They are the ultimate webmasters resource because the teach all of the major components of web design and development. The full list would be quite a long one, and you can see it on their site navigation bar, but I will say that finding a site that teaches HTML, XHTML, CSS, ASP, XSL, SOAP, SQL, PHP, and many many more technologies... all in one place... absolutely amazing and a resource that should be supported in every way (I would encourage you to click on some ads while you are there, just to help them out;). &lt;br /&gt;&lt;br /&gt;This site is incredibly useful, highly organized, follows strict standards of development, and is Free! Here's the grade and the reasons why.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;WEBSITE GRADE FOR:&lt;br /&gt;&lt;a href ="http://www.W3Schools.com" target="_new"&gt;http://www.W3Schools.com&lt;/a&gt;&lt;/b&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;USEFUL CONTENT (4cr)&lt;/b&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;APPEALING DESIGN (3cr)&lt;/b&gt;&lt;i&gt;  (The layout is very clean, which is what you should have for a site which will require the user to do a lot of reading. There are ads on the site, but they are arranged in such a manner as to not disrupt your experience much.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;EASE OF NAVIGATION (3cr)&lt;/b&gt;  &lt;i&gt;(Very easy to navigate. The subject areas are listed on the main page, and each category has proper sub navigation. In addition, each tutorial / course allows you to follow a step-by-step format.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;VALID CODE SYNTAX (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://validator.w3.org/" target="_new"&gt;View Validator&lt;/a&gt; How often do you see someone get an 'A' in this? Not very, I can tell you that. But their pages are properly designed and conform to XHTML 1.0 Transitional Rules. Their Cascading Style Sheets also verified as being properly designed. Excellent! But then... I would not expect less from the W3 Schools who teach the W3 standards.&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;DISABILITY AND BROWSER ACCESS (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://www.doctor-html.com/RxHTML/" target="_new"&gt;View this Validator&lt;/a&gt;, it came up with very few problems, but some, that should be fixed. There were 9 unset image command tags on the main page, and 3 had no alt text. I would like to see this fixed because I am someone who advocates Disability Access for the Web. Of course, the other bonus is faster loading time with predefined image sizes.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FINDABILITY (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job! There were no errors in the meta tags, and that leads to us being able to find the site easier through search engines, in fact, this site has very high search engine ratings.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FRUSTRATION LEVEL (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job! There were no broken links. Also, the site would take approximately 8.9 seconds to load over a 28.8 kbps network connection. That's simply wonderful.)&lt;/i&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Total Possible Credits = 20 Total Possible GPA = 4.0&lt;br /&gt;Total Quality Points Given = 78&lt;/p&gt;&lt;h2 style="font-weight:bolder;"&gt;Total Website GPA = &lt;span style="color:green"&gt;3.9 (A-)&lt;/span&gt;&lt;/h2&gt;&lt;p&gt;~Review conducted by &lt;a href="http://www.websitestyle.com"&gt;WebsiteStyle.com&lt;/a&gt;~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108829541169054928?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108829541169054928/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108829541169054928' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108829541169054928'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108829541169054928'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/review-w3schoolscom-grade.html' title='Review: W3Schools.com (Grade A-)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108667498389369674</id><published>2004-06-09T00:47:00.000-05:00</published><updated>2005-11-24T05:33:11.073-06:00</updated><title type='text'>Review: McAfee VirusScan v8.0 (Grade A-)</title><content type='html'>I have always had a bit of a predicament with my firewall and virus scan programs. They don't get along. In fact, they disagree so much that I have to uninstall one to install the other. However, I'm willing to do that because my firewall program, BlackICE, is the best (in my opinion), so I felt it was worth the effort of uninstalling it every month, installing a virus scan program, and running the scan, uninstalling the virus scan program, and reinstalling my BlackICE software. Whew! Finally an end to that!&lt;br /&gt;&lt;br /&gt;McAfee has come out with &lt;a href="http://click.linksynergy.com/fs-bin/click?id=/wBXCrEQhs4&amp;amp;offerid=50252.10000015&amp;amp;type=3&amp;amp;subid=0" target="_new"&gt;VirusScan v8.0&lt;/a&gt; and it is fully compatible with BlackICE. I'm truly thrilled, and the new VirusScan works great. The new version has tons of added features: Email Scanning, Instant Message Scanning, two new additions called ScriptStopper™ and WormStopper™, Spyware detection, Windows Explorer Integration, AutoClean of viruses, Self Updating, and more. &lt;br /&gt;&lt;br /&gt;Here's the grade and the reasons why.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;SOFTWARE GRADE FOR:&lt;br /&gt;&lt;a href="http://click.linksynergy.com/fs-bin/click?id=/wBXCrEQhs4&amp;amp;offerid=50252.10000015&amp;amp;type=3&amp;amp;subid=0" target="_new" &gt;McAfee VirusScan v8.0&lt;/a&gt;&lt;/b&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;USEFUL FEATURES (4CR)&lt;/b&gt;&lt;i&gt;  (Great features. Simple to use. Has some internal advertising for other McAfee products.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;EASE OF INSTALL (2CR)&lt;/b&gt;&lt;i&gt;  (Perfectly easy to install. Simple install wizard.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;COMPATIBILITY (1CR)&lt;/b&gt;  &lt;i&gt;(Very easy to navigate. The Quiz goes area by area, with a good category breakdown. Simple to follow.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;AFFORDABILITY (4CR)&lt;/b&gt;  &lt;i&gt;(Good price. Under $40.00, and they often have specials. Includes one year of free updates.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;MONEY BACK GUARANTEE (3CR)&lt;/b&gt;  &lt;i&gt;(30 Day Money back guarantee. I'd prefer 60, but 30 isn't so bad.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;TECHNICAL SUPPORT (3CR)&lt;/b&gt;&lt;i&gt;  (Complete Technical Support on the product. Have a complete online section dedicated to support, faq's, and live chat.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;UPDATES (3CR)&lt;/b&gt;&lt;i&gt;  (Updates free for one year with purchase. You have to purchase a yearly subscription to continue after that. It's not bad considering the frequency with which it gets updated with new virus alerts to watch for.)&lt;/i&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Total Possible Credits = 20 Total Possible GPA = 4.0&lt;br /&gt;Total Quality Points Given = 74&lt;/p&gt;&lt;br /&gt;&lt;h2 style="font-weight:bolder"&gt;Total Software GPA = &lt;span style="color:green"&gt;3.7 (A-)&lt;/span&gt;&lt;/h2&gt;&lt;p&gt;~Review conducted by &lt;a href="http://www.websitestyle.com"&gt;WebsiteStyle.com&lt;/a&gt;~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108667498389369674?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108667498389369674/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108667498389369674' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108667498389369674'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108667498389369674'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/review-mcafee-virusscan-v80-grade.html' title='Review: McAfee VirusScan v8.0 (Grade A-)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108667177820331629</id><published>2004-06-08T00:06:00.001-05:00</published><updated>2005-11-24T05:34:32.586-06:00</updated><title type='text'>Review: FindYourSpot.com (Grade B+)</title><content type='html'>While browsing the Internet one long ago day, considering the prospect of moving out of state, I decided to do a search to see what I could find to help me learn more about different places. I was born, raised, and have never moved from my city. I've traveled rarely, and limitedly. When I found this site, I realized I had landed a winner. &lt;br /&gt;&lt;br /&gt;&lt;a href ="http://www.findyourspot.com" target="_new"&gt;FindYourSpot.com&lt;/a&gt; really has a great method of helping people discover which places in the US might suit them, on a permanent basis. It's really simple to use. You 'Find Your Spot' by answering a series of questions about your likes / dislikes, needs / wants. It will also give you IMPORTANT information about average home prices, climate, crime rates, schools, and even recreation activities. What's really nice is that I bookmarked my quiz at the end, oh... about a year ago, and I just opened it up again to find all my quiz results still there. Quite nice.&lt;br /&gt;&lt;br /&gt;As I said, amazing content, and VERY Useful. Here's the grade and the reasons why.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;WEBSITE GRADE FOR:&lt;br /&gt;&lt;a href ="http://www.findyourspot.com" target="_new"&gt;http://www.findyourspot.com&lt;/a&gt;&lt;/b&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;USEFUL CONTENT (4cr)&lt;/b&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;APPEALING DESIGN (3cr)&lt;/b&gt;&lt;i&gt;  (The main page is Nice and Simple looking. There are a few page breakovers, but nothing major.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;EASE OF NAVIGATION (3cr)&lt;/b&gt;  &lt;i&gt;(Very easy to navigate. The Quiz goes area by area, with a good category breakdown. Simple to follow.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="orange"&gt;C&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;VALID CODE SYNTAX (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://validator.w3.org/" target="_new"&gt;View Validator&lt;/a&gt; The lack of a doctype declaration is quite unacceptable. This needs to be fixed. I  suggest going to: &lt;a href="http://www.w3.org/QA/Tips/Doctype" target="_new"&gt;Importance of DocType&lt;/a&gt; to learn more.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="#000000"&gt;D&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;DISABILITY AND BROWSER ACCESS (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://www.doctor-html.com/RxHTML/" target="_new"&gt;View this Validator&lt;/a&gt;, it came up with some problems that should be fixed. There were 10 images on the main page lacking alt text, and 24 browser support conflicts.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FINDABILITY (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job! There were no errors in the meta tags, and that leads to us being able to find the site easier through search engines.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FRUSTRATION LEVEL (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job! There were no broken links. However, the website (total size including all images that must be loaded: 57.3k) was estimated to take approximately 15.9 seconds to load over a 28.8 kbps network connection. That's not bad, especially considering that using the squished version (white space removed) of the webpage that this validation site offers, would save 16.3% on load time.)&lt;/i&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Total Possible Credits = 20 Total Possible GPA = 4.0&lt;br /&gt;Total Quality Points Given = 67&lt;/p&gt;&lt;h2 style="font-weight:bolder"&gt;Total Website GPA = &lt;font color="green"&gt;3.35 (B+)&lt;/font&gt;&lt;/h2&gt;&lt;p&gt;~Review conducted by &lt;a href="http://www.websitestyle.com"&gt;WebsiteStyle.com&lt;/a&gt;~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108667177820331629?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108667177820331629/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108667177820331629' title='4 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108667177820331629'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108667177820331629'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/review-findyourspotcom-grade-b.html' title='Review: FindYourSpot.com (Grade B+)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>4</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108666056472389652</id><published>2004-06-07T21:08:00.000-05:00</published><updated>2005-11-24T05:40:35.486-06:00</updated><title type='text'>Review: LearnTheNet.com (Grade B)</title><content type='html'>I came across this site, while hunting around for something to print off to help an elderly relative (who is trying to learn how to use a computer and the Internet for the first time). Being very much a tech myself, I was concerned that I might jump over some basics (some things that I normally assume people know). So, if you are looking for some information for people who are beginners to the Internet, this is a good site to try out. You will find information on how to Surf the Internet, Use Email, Find Information, Download files, Join Newsgroups, and much more.&lt;br /&gt;&lt;br /&gt;I found that the &lt;a href="http://www.learnthenet.com/english/section/intbas.html" target="_new"&gt;Master the Basics section&lt;/a&gt; was a great start, and well broken down. I would highly suggest taking a look at all of the links in the 'How To' section on the left navigation bar.&lt;br /&gt;&lt;br /&gt;However, though the content is good, the website itself leaves a bit to be desired. Here's the grade and the reasons why.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;WEBSITE GRADE FOR:&lt;br /&gt;&lt;a href="http://www.learnthenet.com/english/index.html" target= "_new"&gt;http://www.learnthenet.com/english/index.html&lt;/a&gt;&lt;/b&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;USEFUL CONTENT (4cr)&lt;/b&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;APPEALING DESIGN (3cr)&lt;/b&gt;&lt;i&gt;  (Nice and Simple looking.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;EASE OF NAVIGATION (3cr)&lt;/b&gt;  &lt;i&gt;(Personally I would suggest moving the Google search box to the right side of the page directly above the banner ad. Then, moving the menu up so that your website navigation is prominent.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="#000000"&gt;D&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;VALID CODE SYNTAX (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://validator.w3.org/" target="_new"&gt;View Validator&lt;/a&gt;, it came up with 270 errors. Although I do not expect most website designers to be able to design a 100% error free site, the error amount was excessive and the lack of a doctype declaration quite unacceptable. This needs to be fixed.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="orange"&gt;C&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;DISABILITY AND BROWSER ACCESS (2cr)&lt;/b&gt;  &lt;i&gt;(Upon running a validation check on the HTML behind this website, &lt;a href="http://www.doctor-html.com/RxHTML/" target="_new"&gt;View this Validator&lt;/a&gt;, it came up with some problems that should be fixed. All images but one were lacking an alt text.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="blue"&gt;A&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FINDABILITY (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job! There were no errors in the meta tags, and that leads to us being able to find the site easier through search engines.)&lt;/i&gt;&lt;br /&gt;&lt;b&gt;&lt;big&gt;&lt;font color="green"&gt;B&lt;/font&gt;&lt;/big&gt;&lt;/b&gt; = &lt;b&gt;FRUSTRATION LEVEL (3cr)&lt;/b&gt;&lt;i&gt;  (Excellent Job! There were no broken links. However, the website (total size including all images that must be loaded: 78.2k) was estimated to take approximately 21.7 seconds to load over a 28.8 kbps network connection. In that long, your visitor has already left the site. I suggest using an image cruncher so the images load faster, and removing as much whitespace from your code as possible)&lt;/i&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Total Possible Credits = 20 Total Possible GPA = 4.0&lt;br /&gt;Total Quality Points Given = 61&lt;/p&gt;&lt;h2 style="font-weight:bolder"&gt;Total Website GPA = &lt;font color="green"&gt;3.05 (B)&lt;/font&gt;&lt;/h2&gt;&lt;p&gt;~Review conducted by &lt;a href="http://www.websitestyle.com"&gt;WebsiteStyle.com&lt;/a&gt;~&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108666056472389652?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108666056472389652/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108666056472389652' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108666056472389652'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108666056472389652'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/review-learnthenetcom-grade-b.html' title='Review: LearnTheNet.com (Grade B)'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-108666027881151004</id><published>2004-06-06T21:00:00.000-05:00</published><updated>2004-06-30T00:03:31.623-05:00</updated><title type='text'>Grading System Explained</title><content type='html'>Allright... drift back in time (or dream ahead a bit for those of you who are a bit younger) and recall the days of GPA's and you will understand how the grading system works. &lt;br /&gt;&lt;br /&gt;The rating results will differ by the type of resource being reviewed. However, you will find that each resource gets a grade for different categories, as well as receiving an overall GPA.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Credit Amounts (CR)&lt;/b&gt;&lt;br /&gt;Each Area Being Evaluated has a Credit Amount, which is indicated in parenthesis. (This is the equivalent of each area being a class worth a certain number of credits.)&lt;br /&gt;&lt;b&gt;Letter Grade Per Area&lt;/b&gt;&lt;br /&gt;Each Area Being Evaluated is given a letter grade based on how well it did in that area. (The equivalent of your grade for a class.) Each letter has a point value: A=4, B=3, C=2, D=1, F=0.&lt;br /&gt;&lt;b&gt;Total Possible Credits&lt;/b&gt;&lt;br /&gt;This is the total amount of possible credits. You get this number by adding the CR value of each area.&lt;br /&gt;&lt;b&gt;Total Possible GPA&lt;/b&gt;&lt;br /&gt;This amount is always a 4.0, indicating a perfect score.&lt;br /&gt;&lt;b&gt;Quality Points&lt;/b&gt;&lt;br /&gt;This is the total number of the credit amounts multiplied by the point value of the letter grade given, per area.&lt;i&gt;Ex: Area1 is worth 3cr total. You make an A (which is worth 4 points) in the area. Your total quality points are -&gt; 3 * 4 = 12QP. For more than one area, you add the total QP's for each area.&lt;/i&gt;&lt;br /&gt;&lt;b&gt;GPA&lt;/b&gt;&lt;br /&gt;The GPA is equal to the number of Quality Points (QP) divided by the number of Total Possible Credits.&lt;br /&gt;&lt;b&gt;Total Letter Grade&lt;/b&gt;&lt;br /&gt;The Total Letter Grade is based on the Total GPA and uses the following equivalents:&lt;br /&gt;A = 4.0, A- = 3.7&lt;br /&gt;B+ = 3.3, B = 3.0, B- = 2.7&lt;br /&gt;C+ = 2.3, C = 2.0, C- = 1.7&lt;br /&gt;D+ = 1.3, D = 1.0, D- = .7&lt;br /&gt;F = 0.0&lt;br /&gt;&lt;b&gt;Exceptions&lt;/b&gt;&lt;br /&gt;There may be exceptions (such as in the case of the 'Perfect' site) in which a grade of an A+ or a 4.3 may be given.&lt;br /&gt;&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-108666027881151004?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://usefulwebsites.blogspot.com/feeds/108666027881151004/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=7239522&amp;postID=108666027881151004' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108666027881151004'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/108666027881151004'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/grading-system-explained.html' title='Grading System Explained'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112784950760731628</id><published>2004-06-01T14:29:00.000-05:00</published><updated>2005-12-05T15:54:44.363-06:00</updated><title type='text'>Articles</title><content type='html'>This is a full listing of the articles written thus far:&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/article-why-do-so-few-people-use.html"&gt;Why Do So Few People Use Proper Web Coding?&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/09/elements-of-good-web-design.html"&gt;Elements of Good Web Design&lt;/a&gt;&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/09/standards-compliant-code.html"&gt;Standards Compliant Code&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/09/accessibility-compliance.html"&gt;Accessibility Compliance&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/complimentary-color-scheme.html"&gt;Complimentary Color Scheme&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;Tutorial - Transitioning to Standards (For the web developer.)&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-intro.html"&gt;Nightfall - Introduction&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-1.html"&gt;Nightfall - Step 1&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-2.html"&gt;Nightfall - Step 2&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/tutorial-nightfall-step-3.html"&gt;Nightfall - Step 3&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;General News&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/css-reboot-fall-2005.html"&gt;CSS Reboot - Fall 2005 Results&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/w3c-adds-feed-validator.html"&gt;W3C  Adds Online Feed Validator.&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/amusing-name-change-osm.html"&gt;Amusing Name Change - OSM&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/microsoft-gets-opensource-removed-from.html"&gt;Microsoft Gets 'Opensource' removed from Vienna Conclusions&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/captcha-accessibility-issues.html"&gt;CAPTCHA Accessibility Issues&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/mit-100-laptop-new-updates.html"&gt;MIT $100 Laptop - New Updates&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/firefox-15-product-review.html"&gt;Firefox 1.5 Product Review&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/linux-survey-results.html"&gt;Linux Survey Results&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/12/css-when-to-embed.html"&gt;CSS - When to Embed&lt;/a&gt;&lt;br /&gt;&lt;/p&gt;&lt;br /&gt;More articles are on the way!&lt;br /&gt;&lt;br /&gt;If you have a topic you'd like to have discussed, please contact me and let me know. Also, if you have an article you'd like to contribute, feel free to email and talk to me about it.&lt;p&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112784950760731628?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112784950760731628'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112784950760731628'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/articles.html' title='Articles'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112784924072919003</id><published>2004-06-01T14:24:00.000-05:00</published><updated>2005-09-29T10:23:15.290-05:00</updated><title type='text'>Websites</title><content type='html'>This is a full listing of the Website Reviews done thus far. Note: You may want to take a look at the &lt;a href="http://usefulwebsites.blogspot.com/2004/06/grading-system-explained.html"&gt;Grading System Explained&lt;/a&gt; page.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/02/imagevenue-site-review.html"&gt;ImageVenue&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/review-ebaycom-grade-b.html"&gt;Ebay.com&lt;/a&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/review-gutenbergnet-grade.html"&gt;&lt;br /&gt;Gutenberg.net&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/review-a1wirelesscom-grade-c.html"&gt;A1Wireless.com&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/review-w3schoolscom-grade.html"&gt;W3Schools.com&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/review-findyourspotcom-grade-b.html"&gt;FindYourSpot.com&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/review-learnthenetcom-grade-b.html"&gt;LearnTheNet.com&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Have a website that you would like reviewed? Go here to see how to tell me about it.&lt;br /&gt;&lt;br /&gt;~Nicole&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112784924072919003?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112784924072919003'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112784924072919003'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/websites.html' title='Websites'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-113191357242203849</id><published>2004-06-01T14:21:00.000-05:00</published><updated>2005-11-24T05:46:55.033-06:00</updated><title type='text'>Contact</title><content type='html'>&lt;/p&gt;&lt;h3&gt;Contact Me&lt;/h3&gt;&lt;p&gt;Send a Business Email: &lt;a href="mailto:nicole@websitestyle.com"&gt;nicole AT websitestyle DOT com&lt;/a&gt;&lt;/p&gt;&lt;p&gt;Send a Personal Email: &lt;a href="mailto:txnicole@gmail.com"&gt;txnicole AT gmail DOT com&lt;/a&gt;&lt;/p&gt;&lt;p&gt;Send a Fax: 928.395.2718&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-113191357242203849?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113191357242203849'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/113191357242203849'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/contact.html' title='Contact'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry><entry><id>tag:blogger.com,1999:blog-7239522.post-112784859481922668</id><published>2004-06-01T14:15:00.000-05:00</published><updated>2005-11-24T05:47:54.230-06:00</updated><title type='text'>Software</title><content type='html'>This is a full listing of the Software Reviews done on the site thus far:&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/11/pspad-product-review.html"&gt;PSPad&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/09/freeram-product-review.html"&gt;FreeRAM&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/09/avast-product-review.html"&gt;Avast!&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2005/02/firefox-product-review.html"&gt;Firefox&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;a href="http://usefulwebsites.blogspot.com/2004/06/review-mcafee-virusscan-v80-grade.html"&gt;McAfee VirusScan&lt;/a&gt;&lt;/p&gt;&lt;p&gt;Have a piece of software that you would like reviewed? Go &lt;a href="http://usefulwebsites.blogspot.com/2004/06/contact.html"&gt;here&lt;/a&gt; to see how to tell me about it.&lt;div class="blogger-post-footer"&gt;&lt;script type="text/javascript"&gt;&lt;!--
google_ad_client="ca-pub-3332851978013203";
google_ad_width=234;
google_ad_height=60;
google_ad_format="234x60_as";
google_ad_type="text";
google_color_border="FFFFFF";
google_color_bg="FFFFFF";
google_color_link="999988";
google_color_url="999988";
google_color_text="555555";
//--&gt;&lt;/script&gt;
&lt;script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;
&lt;/script&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/7239522-112784859481922668?l=usefulwebsites.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112784859481922668'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/7239522/posts/default/112784859481922668'/><link rel='alternate' type='text/html' href='http://usefulwebsites.blogspot.com/2004/06/software.html' title='Software'/><author><name>Nicole</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://www.websitestyle.com/blog/nicolesm.jpg'/></author></entry></feed>
