home Twitter RSS feeds

Blog review: TwinkleTwinkleToess

Blogged by: Kitty on Tuesday, June 12, 2012  
Commentators:
Facebook comments: comments


Site name: TwinkleTwinkleToess
Site owner: Eryn
Review completed on: June 12, 2012


First impressions and site name

The name is nice however it is not as easy to remember. It would be better to insert a hyphen in between the twinkletwinkle as having two of the same word together can be rather confusing to the visitors.

The layout looks minimalistic and well-presented. It is not cluttered and is pleasing to the eyes.


Navigation

The location of your main menu links is obvious enough. They sit at the top center of the page and there's no problem locating them. However, you might want to increase the font size of the links since not everyone can read small letters.

All the links on the website are working fine so congratulations on that.


Layout and design

I'm not going to comment much on the layout and design since it was not created by you. As stated before, the layout looks well-presented and not cluttered. However there is a certain part about the design that needs to be taken note of. I will explain this under the browser compatibility section.


Content

The spacing between the lines are nicely spaced and it makes the paragraphs easier to read. And it is nice to see you punctuate your paragraphs with photographs as it gives the readers something to see other than chunks of texts.

The font size for the 'Posted on', 'affiliates', 'banner exchange', etc. is too small. Also, when I hover over the link for 'lovely comments', the font colour changes to a darker colour and blends with the black background thus I can't almost see the link. You may want to change the colour for the hover effect.


Profiles page

There are a few grammatical mistakes that can be overlooked so there's no big problem there.

You might want to change the font colour of 'Likes', 'Dislikes' and 'Favorite colors' since it is too bright against the light background.

faq should be re-written as 'F.A.Q.' since faq is not a word on its own.


Site page

I really like how you came up with the name of your website. Twinkle toes, catchy. Though I don't quite follow what is meant by 'Admitted on: March 2012'. Does it refer to the date when the blog is opened/created?

Wow you have a lot of things in your wishlist. I hope you'll be able to get most, if not all, of them.

In the credits section, proper crediting should be done, i.e. the names of the person/website should be stated clearly and not just referred to as 'x' because no one likes to be referred to as 'x'. It should be something like this: Layout by 'name of person or website here'.


Coding and validation

I'm not going to spent too long on this part since W3C doesn't actually validate Blogger tags. So I'm just going to skip through the validation comments on Blogger tags and focus on the other validation comments.

A quick look at your source code reveals that you do not have a correct coding structure. You do not have the doctype, character encoding, <HTML> and <body>. A correct, basic web page structure should look like this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>
</head>

<body>
</body>

</html>


Full details on this type of doctype can be found here on W3 website. Most of the errors are caused by the absence of the doctype declaration and this can be reduced had you included the doctype.

The id="box" appears multiple times. The usage of the id selector with an element limits it to once only, and if you want to use the element multiple times, it is better to use the class selector instead.

Your images do not have the "alt" alttribute specified. "alt" attribute is required for 'img' element because it will help your visitors to recognise what the image is about in the case if the images do not load up properly. So the line for img should be like this:

<img src="the link for image of a cat here" alt="my cat" />

You should have not used <textarea> to display your link back codes, or any codes for that matter. <textarea>s are for inputting texts. Instead, you should use <pre> or <code>.

There're about 24 errors and 20 warnings in your stylesheet, but most of them are due to W3C having not yet included a lot of the CSS3 hacks into their specification so nothing to fret here. But I'm just going to point out a few things here.

There's no value justify for height. So height: justify does not exist.

The text-transform property does not have normal as its value. The only values that text-transform can have are none, capitalize, uppercase, lowercase, inherit.

The same applies to text-decoration. The only values that it can have are none, underline, overline, line-through, blink, inherit.

You also get this warning: "Family names containing whitespace should be quoted. If quoting is omitted, any whitespace characters before and after the name are ignored and any sequence of whitespace characters inside the name is converted to a single space."
This refers to font-names that consist of more than one word. For example, Trebuchet MS. Every time you use a font that have more than one word, you must add quotation marks before and after the font name, like this:

font-family: "Trebuchet MS";
or
font-family: "Trebuchet MS", Arial, Verdana;


Browser compatibility

Congratulations, your layout looks about the same in the latest versions of major web browsers (Chrome, Firefox, Opera, Safari and Internet Explorer 8) as well as in screen resolutions 1280x800. However, in screen resolutions 1152x864 and below, the sidebar on the left seems to be overlapping with the main content thus some parts of the blog entry are blocked. Here's a screenshot of it:
Also, with 800x600 screens, your page has a horizontal scrolling. This is because your layout is positioned as fixed.


Errors

You will need to capitalise the words where appropriate, such as names and when starting a new sentence after a fullstop.

And also, work on the grammars. You can mix English and Malay together in your entry but do try to make sure the grammars are correct.


Comments (and suggestions)

You'd only need to remember to capitalise the first letter in every sentence and also for names as well as making the font-size slightly bigger. You would also have to work on the coding structure.

Labels:


Comments to Blog review: TwinkleTwinkleToess:


Post a Comment

Commenting policy:
1. Please leave comments that are relevant to the blog post.
2. Comments on posts that are more than 14 days old will be moderated.
3. Do not post advertisements to your own site/products here.
4. Do not post private information, it will be deleted.
5. Refrain from using abusive/vulgar words, if you have personal issues with me, contact me directly through the contact form or my email instead.

Facebook comments to Blog review: TwinkleTwinkleToess:


Blog review: TwinkleTwinkleToess

Blogged by: Kitty on Tuesday, June 12, 2012  
Commentators:
Facebook comments: comments


Site name: TwinkleTwinkleToess
Site owner: Eryn
Review completed on: June 12, 2012


First impressions and site name

The name is nice however it is not as easy to remember. It would be better to insert a hyphen in between the twinkletwinkle as having two of the same word together can be rather confusing to the visitors.

The layout looks minimalistic and well-presented. It is not cluttered and is pleasing to the eyes.


Navigation

The location of your main menu links is obvious enough. They sit at the top center of the page and there's no problem locating them. However, you might want to increase the font size of the links since not everyone can read small letters.

All the links on the website are working fine so congratulations on that.


Layout and design

I'm not going to comment much on the layout and design since it was not created by you. As stated before, the layout looks well-presented and not cluttered. However there is a certain part about the design that needs to be taken note of. I will explain this under the browser compatibility section.


Content

The spacing between the lines are nicely spaced and it makes the paragraphs easier to read. And it is nice to see you punctuate your paragraphs with photographs as it gives the readers something to see other than chunks of texts.

The font size for the 'Posted on', 'affiliates', 'banner exchange', etc. is too small. Also, when I hover over the link for 'lovely comments', the font colour changes to a darker colour and blends with the black background thus I can't almost see the link. You may want to change the colour for the hover effect.


Profiles page

There are a few grammatical mistakes that can be overlooked so there's no big problem there.

You might want to change the font colour of 'Likes', 'Dislikes' and 'Favorite colors' since it is too bright against the light background.

faq should be re-written as 'F.A.Q.' since faq is not a word on its own.


Site page

I really like how you came up with the name of your website. Twinkle toes, catchy. Though I don't quite follow what is meant by 'Admitted on: March 2012'. Does it refer to the date when the blog is opened/created?

Wow you have a lot of things in your wishlist. I hope you'll be able to get most, if not all, of them.

In the credits section, proper crediting should be done, i.e. the names of the person/website should be stated clearly and not just referred to as 'x' because no one likes to be referred to as 'x'. It should be something like this: Layout by 'name of person or website here'.


Coding and validation

I'm not going to spent too long on this part since W3C doesn't actually validate Blogger tags. So I'm just going to skip through the validation comments on Blogger tags and focus on the other validation comments.

A quick look at your source code reveals that you do not have a correct coding structure. You do not have the doctype, character encoding, <HTML> and <body>. A correct, basic web page structure should look like this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>
</head>

<body>
</body>

</html>


Full details on this type of doctype can be found here on W3 website. Most of the errors are caused by the absence of the doctype declaration and this can be reduced had you included the doctype.

The id="box" appears multiple times. The usage of the id selector with an element limits it to once only, and if you want to use the element multiple times, it is better to use the class selector instead.

Your images do not have the "alt" alttribute specified. "alt" attribute is required for 'img' element because it will help your visitors to recognise what the image is about in the case if the images do not load up properly. So the line for img should be like this:

<img src="the link for image of a cat here" alt="my cat" />

You should have not used <textarea> to display your link back codes, or any codes for that matter. <textarea>s are for inputting texts. Instead, you should use <pre> or <code>.

There're about 24 errors and 20 warnings in your stylesheet, but most of them are due to W3C having not yet included a lot of the CSS3 hacks into their specification so nothing to fret here. But I'm just going to point out a few things here.

There's no value justify for height. So height: justify does not exist.

The text-transform property does not have normal as its value. The only values that text-transform can have are none, capitalize, uppercase, lowercase, inherit.

The same applies to text-decoration. The only values that it can have are none, underline, overline, line-through, blink, inherit.

You also get this warning: "Family names containing whitespace should be quoted. If quoting is omitted, any whitespace characters before and after the name are ignored and any sequence of whitespace characters inside the name is converted to a single space."
This refers to font-names that consist of more than one word. For example, Trebuchet MS. Every time you use a font that have more than one word, you must add quotation marks before and after the font name, like this:

font-family: "Trebuchet MS";
or
font-family: "Trebuchet MS", Arial, Verdana;


Browser compatibility

Congratulations, your layout looks about the same in the latest versions of major web browsers (Chrome, Firefox, Opera, Safari and Internet Explorer 8) as well as in screen resolutions 1280x800. However, in screen resolutions 1152x864 and below, the sidebar on the left seems to be overlapping with the main content thus some parts of the blog entry are blocked. Here's a screenshot of it:
Also, with 800x600 screens, your page has a horizontal scrolling. This is because your layout is positioned as fixed.


Errors

You will need to capitalise the words where appropriate, such as names and when starting a new sentence after a fullstop.

And also, work on the grammars. You can mix English and Malay together in your entry but do try to make sure the grammars are correct.


Comments (and suggestions)

You'd only need to remember to capitalise the first letter in every sentence and also for names as well as making the font-size slightly bigger. You would also have to work on the coding structure.

Labels:



Comments to Blog review: TwinkleTwinkleToess:


Post a Comment

Commenting policy:
1. Please leave comments that are relevant to the blog post.
2. Comments on posts that are more than 14 days old will be moderated.
3. Do not post advertisements to your own site/products here.
4. Do not post private information, it will be deleted.
5. Refrain from using abusive/vulgar words, if you have personal issues with me, contact me directly through the contact form or my email instead.

Facebook comments to Blog review: TwinkleTwinkleToess:


Hire me to design your blog!

I offer designing and re-designing of Classic Blogger templates. Examples of my design can be found on my portfolio website.

The basic rate for a design starts from $25 USD. The rate is based on the complexity of the design. The more elaborate the design is, the higher the price is.

How to place your order

Send me an email via the contact form and state clearly how you want your design to be. This includes colour scheme, layout (with or without sidebar, number of columns, etc), any extra features, etc.

Your email should be in this format:
Name:
Design: Please give detailed explanation on how you want your template to look like
Preferred payment method: Paypal/Moneybookers/Payza/Bank transfer to Baiduri bank

I shall respond to your email within 3 (three) days. Your order will be placed into a Waiting Queue as orders are processed on a first come, first serve basis.

Payment methods

Payment has to be made to either by PayPal, or Moneybookers.

However, if you choose to pay via (international) bank transfer, be aware that you may be charged for the transfer service.

Other important information

Throughout the designing process, I may need to refer back to you for questions/opinions so do check your email frequently. This is to ensure the design can be done as soon as possible.

Depending on the design, your template make take up to over 1 (one) week to finish. You will be informed once the template is done.

I will send you an email requesting for the payment after the template is done. Once the payment is received, I will email you the complete template along with the necessary files.

All of my designs/templates will come with a credit section. This section must be left intact and you may not remove nor alter them. Resources that come with the designs/templates may not be redistributed or reproduced.

The designer

Kitty

Kitty. 29. Blogger, web design hobbyist, compulsive shopper and bibliophile based in Brunei. Enjoys creating and designing websites, dabbling with HTML, CSS and PHP.

I've been blogging since 2005 (or earlier) though my experience with the internet started back in 2000. My main interest is in web design and development. Other times you can see me wrapped around a book or glued to Astronomy and web design magazines.

The website

This website was created in January 2011 and the domain was purchased by me in late December 2010. Initially the website was intended to house tutorials for Classic Blogger/Blogspot only however over the time it has developed into what you see today.

Several of the tutorials and articles can also be found on Nekonette.com, which is the my main website where I mostly blog about my personal life. Also some of the tutorials here have been moved to that website.

Categories/Labels

Past layouts

These are the layouts that have been used on Codeislove.net previously.

Wooden board

Layout #1

Dark chic

Layout #2

Royal crimson

Layout #3

Articles, Tutorials and Contests

Articles


Please do not copy the articles verbatim and/or redistribute them on your site. And I'd appreciate it if you link back to me.

Tutorials


Please do not copy the tutorials verbatim and/or redistribute them on your site. And I'd appreciate it if you link back to me.

Popular tutorials:

Converting HTML layout to Wordpress series: How to code Classic Blogger template series:

Other tutorials:

Contests

Linkages

On-site navigation

Network

Looking for money-making opportunities? Check out these websites.

Blog Advertising - Advertise on blogs with SponsoredReviews.com

Business 2 Blogger

banner

Contact the webmistress

You can email me your messages/tutorial requests using the contact form:

Advertising

Codeislove: Geek Is Chic is a blog which houses various articles, tips and tutorials on web design as well as a mix of personal insights published by the website owner.

Simple site statistics:
Monthly Unique Visitors: 5000+
Monthly page views: 7,000 ~ 9,000

Also, if you think that you have a good advertisement offer to discuss with me, do contact me and let's discuss about it.

Get reviewed

You can have your website/blog reviewed here on Codeislove. Alternatively, you can also apply to get your website/blog reviewed on my other website, Amalina.org. You can request your review to be public or private. If you choose to have it public, it will be posted here on Codeislove. Similarly, if you want it to be private, I will send the review to you via email.

Please send an email to me in this format and I will get back to you as soon as I can:

Name:
Email:
Website/blog:
Do you want the review to be public/private?

Websites/blogs currently being reviewed:
Aroha - Ashleenah
Twinkle Toes - Eryn - completed
Gadis bermata cokelat - Nurul Nabila - completed

Related Posts Plugin for WordPress, Blogger...