back to Completed Reviews
Site Name: Playhouse
Owner: Carla
Reviewed by: Georgina
Reviewed on: 14th September 2009
Site Name
I distinctly remember a website called “Playhouse” quite a few years back, but I still remember the name. I wouldn’t say that website is around still. I think it suits the name of your website.
Coding and Validation
Your coding has 2 errors and 3 warnings.
Firstly, you need a doctype to declare your document as an HTML document. You have good basic structure but are missing these fundamentals. The doctype below, HTML 4.01 Frameset, best matches your coding since you are using an iframe. You need to place this at the very beginning of every page, before <html>.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
You also need a character encoding to define the character set of your webpage. The most common one is UTF-8. You should place this in between the head tags.
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
I’m not surprised that your internal pages – those that open in your iframe – are not valid. These too need to have the correct structure.
Attempt to use <strong> instead of <b> and <em> instead of <i> from now on, for semantic – more meaningful – purposes. Screen readers for the blind can read this in a more meaningful manner.
Your CSS is valid but only on the main page. Your stylesheet (css1.css) isn’t valid. You’re using coloured scrollbars, which don’t always work and are invalid.
Additionally, text-decoration: bold is incorrect; I believe you’re after font-weight: bold.
Rather than using a div like this, use CSS:
<div style="left:118px;top:104px;position:absolute;">Change to:
#divname { left: 118px; top: 104px; position:absolute; }And call on the div like so:
<div id="divname">
This is called assigning an ID, which you can read more about in this tutorial.
Browser Compatibility & Usability
Your site looks the same in most browsers, and it is navigable and functions in Internet Explorer, Mozilla Firefox and Safari.
I would suggest fixing the navigation. The “tag” link is barely clickable because the area shape is so small, as is the “Faith” link. Also, you should not be relying on image navigation. You have not specified alt text for the area shapes in your imagemap, therefore if people could not view images on your website they would be completely lost. Providing an alternate text navigation is essential in this case.
You’re using iframes, which is not recommended. Iframes are not accessible. They do not work on all browsers and operating systems, and they make your website harder to navigate. Iframes can easily lock up and freeze. Another disadvantage for the visitor is that they will not be able to bookmark a single page on your website because it’s trapped in an iframe. Also, your pages are not even indexed by search engines if they open in an iframe. Emily has written a great article about why you should make the switch to PHP includes and include your layout on each individual page.
Also try to avoid using so much Javascript. It doesn’t work on all platforms and browsers and you shouldn’t depend on it all the time.
Layout
It’s a very nice layout but it’s much too big. That’s the first thing I notice. There’s too much going on in the layout. If you had used less large elements it would leave more focus for the smaller details such as the trees and the creative navigation. Alternatively, if you had left the large girl with the lollipop on the layout and removed everything else, it would produce a much less outrageous effect on the layout and focus on that aspect.
At the moment everything looks cluttered. What really irks me is the style of the text “Playhouse” and the baboushka doll on the layout. They look out of place. The realistic texture on them plays no accompaniment to the cute graphics you have created on the layout, and the rainbow stands out oddly because it appears to be of a different style.
It’s one thing to have a cluttered layout in terms of making a collage and a scrapbook style layout, but when you’re working with pixels or vector graphics, due to the detail in these graphics, it’s best to keep it simple. Your layout would look a lot better if you made it a bit smaller and focused on one cute thing in the layout rather than having so many all over the place. Additionally the large size of the layout means that it takes longer to load and doesn’t look as impressive on screens with smaller resolutions.
Content
You
This section would be better named as “visitor” or “pixels”. “You” is a bit ambiguous. It’s used quite a lot but it’s just somewhat confusing. What’s the visitor going to think? “You”?
There aren’t many adoptables but they’re cute and well made! I like how some of them are animated as well.
The scribbles are great. I really like the shading on them as I don’t usually see scribbles shaded so accurately and so well.
Again the layout pixels are very cute. I don’t really like the squarish shape of the last three pixels; they look a bit sharp.
The cliques haven’t been around for a while; it’s nice to see something brought back. You should be using <code> for displaying the code. Textarea should not be used as it is intended for user input only. You should be displaying them in the appropriate tags and converting the HTML into its entities. You might want to explain a bit about the cliques and how they work.
The backgrounds are nice and I like that you’ve used a script to show how they look. Make sure you note on this page that Javascript must be enabled for it to work; some devices don’t allow for Javascript.
You should not be redistributing the fonts at all. They were not made by you and a lot of these fonts are not allowed to be redistributed by anyone except the creator.
Me
This would be better named as “owner” or “Carla”, if you prefer. “Me” and “you” are a bit out of hand; something more semantic or unique would really make a difference!
The link “portfolio” should really be “profile” or “about me”. A portfolio is where you place your works; I don’t know why you have named it so.
Eating,Pixeling,Webdesign should be Eating, pixelling, webdesign
on boys(eew!) should be in boys (eew!).
Everything else in this section seems to be fine.
Web/Site
Some inanimate link buttons would be nice; not everyone wants to see animated buttons.
On the rules page:
Have Fun! should be Have fun!
Don’t Redistribute should be Don’t redistribute
No Direct Linking should be No direct linking
No Spamming should be No spamming.
On the tagboard page:
No Advertising should be No advertising
No Spamming should be No spamming
No Rude Comments should be No rude comments.
On the admired sites page, I admired this sites should be I admire these sites.
You need to add Cutenews and Photobucket to your credits page.
Originality & Creativity
You’ve got an original and creative style; nothing to complain about here.
Organisation & Errors
Quite well organised; only a few errors spotted.
Overall Comment
You’ve got a great site but you need to look into accessibility and improving in that sense. Your layout also really needs to be made smaller; it’s much too large and cluttered. In comparison to your small text, it doesn’t work well together.
You’ve got great content, but I feel that you could add more. There are just some things you need to improve on, but keep up the great work.
Subscribe to Heartdrops