JungleJar.com - Web Design & Development

Photoshop Tutorial: Get Smart with Smart Objects

admin — Sun, 31 Jan 2010 17:13:37 +0000

In this tutorial you will learn how to use Smart Objects to save out individual images from a layout that you have created. If you are designing and developing websites and/or interfaces this is perhaps the most powerful tool that Photoshop has to offer.

Photoshop Help defines a Smart Object as a layer that contains image data from raster images Photoshop. What does this mean exactly? Essentially it mean that you can create mini-Photoshop files related to assets in your full Photoshop files and these mini-Photoshop files can be modified and saved out as images individually and not dependant on their parent Photoshop file. Follow along with this tutorial and you will better understand what Smart Objects are and why they are so useful.

Steps to follow:

Open Photoshop and create some image assets all on different layers. Group some together in a folder if you like. In my example I have a header used for this website, its composed on a ’subscribe’ image, a ‘twitter’ image, and my logo which is made up of several assets put into a folder.
Convert layer into Smart Object: Move your mouse over the chosen layer and right-click when you are over top of the layer name. Click on the option that says “Convert to Smart Object”.
Now you the layer should have an Smart Object icon on it and should look like the image below. Double-click on that icon.
You have now opened the Smart Object. Notice that it is named the same as the layer name you gave it except it uses the .psb extension. This is basically like a mini photoshop file. From here you can modify the image and save it out as an image (jpeg, png, etc). You can resize, crop, and do pretty much anything to this small file. When you close the Smart Object Photoshop will ask if you want to save any changes and they will be retained for future use.

You can also convert a folder into a Smart Object and it will retain the structure of the folder when you open the Smart Object.

I hope by now you are realizing how powerful this tool is for creating interfaces where you are constantly saving out various components of the full layout. It basically allows you to create many mini-Photoshop files within one parent Photoshop file.

I hope you have found this tutorial useful and would love to hear your feedback : )

New Free Wordpress Template: Ipsum.ak

admin — Sat, 16 Jan 2010 19:06:17 +0000

Christopher Hennis has created another great FREE wordpress template for all to enjoy. This one features a sleek design and as a bonus we have also included the psd files for all the images used in the template.

Features of this free Wordpress Template:

XHTML 1.0 Strict and has successfully performed a formal validation via the W3C’s Validation Service which can be found at http://validator.w3.org/.
This Wordpress Template has successfully performed a formal validation check for CSS Level 2.1 which can be found at http://jigsaw.w3.org/css-validator/.
Template takes full advantage of new template tags available in the newest version of Wordpress.
Nicely styled comments system.
Page links are automatically added to the navigation bar in the header to make your life a bit easier. Just create the page, and it will be visible to your visitors instantly.
Gravatar supported comments.
Nicely integrated for Twitter users and the template displays your last 5 tweets in the right sidebar without the use of any plugins.
Cross web browser compatible.
Associated Photoshop .PSD files included.

Installation Instructions

Find the template’s archive file. This would be something along the lines of wordpressrocks.zip if my template’s name was wordpressrocks and of course the .zip is the file extension. If this sounds like latin to you, it doesn’t matter because you don’t need to know anything at all about it.
Unzip the archived template file to a directory named ‘ipsumak’ minus the single quotations in the appropriate directory in relation to your Wordpress installation.
Usually this is /wp-content/themes/. So, if I installed ipsumak, it would reside in /wp-content/themes/ipsumak/
Login to your Wordpress Admin Panel, go to Design –> Themes, find the ipsum.ak theme and activate it.

Image Posting Instructions

To post images to the index area, when writing your post, scroll down to the Custom Field area and enter img as the key and the URL of your image as the value.

Images in the index area look best at a size of 130 pixels in width by 98 pixels in height.
You may use any sized images you wish.

Twitter Instructions

Open up sidebar2.php and scroll down until you see..
script type=”text/javascript” src=”http://twitter.com/statuses/user_timeline/aukyo.json?callback=twitterCallback2&count=5″
and where it says aukyo, change that to your Twitter username to display your last 5 Twitter tweets.

Hope you enjoy this free wordpress template. I’ve also included a ‘Donate’ button if you would like to contribute to this site to encourage more free templates.

JungleJar’s New Layout and Ownership

admin — Wed, 09 Dec 2009 16:22:25 +0000

I’m pleased to announce that JungleJar.com is now under new management. My name is Anders Bergman and I am the new owner of JungleJar. Christopher Hennis, the original creator of JungleJar.com sold the site to me a few weeks ago. Christopher has moved onto other projects and has agreed to contribute article’s once in awhile.

JungleJar is a great site full of great content focusing on web design and development. I have been designing and developing websites for about 8 years. Currently I have career in the Video Game Industry as an User Interface Designer/Developer specializing in Flash and Actionscript. I look forward to sharing my knowledge and inspirations on JungleJar. I also welcome any authors that would like their content posted on JungleJar.

Some new features include:

New simplified layout and logo!
The RSS feed now displays full content (not just excerpts anymore!).
Related Posts at the end of each article!
Most popular posts in the sidebar!

Features to be implemented at some later date:

Author Biographies attached to every article.
Community Link and News posting in the sidebar.
Some syndicated content from our favorite feeds.
Full category listing in the footer
Contact form for link exchanges and website promotion
Many more great articles!

Over the next few weeks there will be some minor tweaks to enhance the functionality and the look and feel of this site. I hope you enjoy it and continue to check up out our high quality content.

Please comment and let me know if you like/dislike the new layout and what sort of article’s you are most interested in reading as this site goes forward. Your feedback is valuable and I’ve love to hear your thoughts Have a great day and enjoy!

Anders Bergman

October’s Digital Art Inspirations (37 images)

Anders — Tue, 27 Oct 2009 04:19:22 +0000

The following are some amazing creations of digital art. Starting this month JungleJar will feature monthly inspirations to help get you inspired to go out and create something amazing. Click on each image to find out more about who the talented individuals who created them.

Winners of the One Flag Adbusters Competition

Anders — Fri, 16 Oct 2009 04:34:36 +0000

Okay so this is kind of old news since this competition was held in late 2008. However the designs that the winners came up with are quite compelling. The idea behind this competition was to create a flag that was free from language and well-worn clichés – that embodies the idea of global citizenship.

Following are the winners:

Marc’s Flag

First Place: Marc Arroyo Ortiga from Berlin

Flag Description: I’m from a minority nation submitted to a flag that I don’t feel, but they say it has to be mine. With this the concept of a meaningful flag changes completely and becomes a symbol of oppression. Because of this, I don’t like flags in general. For this reason the idea of creating one was personally very challenging. A flag for the idea of global citizenship, free from any establishment or language. First I thought that a flag can’t achieve this project. It has too much symbolism in itself. It shouldn’t be a flag. But maybe, it should be a flag that doesn’t need to be a flag. It needs to be a kind of spirit that people all over the world know and understand in their own way.

Flag of the Union

Second Place: Luba Mikhnovsky from Montreal

Flag Description: While creating the concept for my version of the universal flag, I established two constraints. The first, simplicity, and the second, effectiveness. With little detail, I gave it a narrative side, so it would be understandable and accessible. I chose an uncomplicated image of the world by uniting all the continents together, which adds a dynamic to the design. White represents peace, togetherness, and life. Blue is the color of sky, water, tranquility and the planet earth itself. My idea for One Flag was to represent our planet’s unification, where each part of the world contributes to its whole.

All for One

Third Place: LBizhan Khodabandeh from Richmond

Flag Description: The black flag has been used to embody the idea of global citizenship since the 1880’s. It represents the absence of a flag, therefore, the absence of nations and of borders. The addition of the circle is intended – like many tribal cultures – to illustrate a decentralized social structure. The circle doubles as a globe without any natural distinctions or borders. The flag is asymmetrical allowing for it to be displayed in such a way that it implies times of distress or of peace. The simple flag design allows for easy reproduction. Anybody can easily draw a rectangle with an offset circle in it. Symbols easy to reproduce ensure longevity and have a viral effect. One need not rely on expensive reproduction methods to create their own flag or scrawl it’s image on a wall.

Below are some other entries I thought were pretty cool:

Fundamental Equality by Anna Logan Napoli

Global Conscious Collective by Frédéric Chabot

Hands United by Edward Baricevic

For more about this contest and other entries go to the Adbusters One Flag Campaign. Also let me know if you like this kind of stuff and I’ll put more up on this site.

Wordpress.com Introduces a New PicApp Shortcode For The Bloggers

Christopher Hennis — Tue, 06 Oct 2009 19:11:41 +0000

“We all love adding great images to our blog posts, and today we’ve enabled a new WordPress.com Shortcode that adds millions of available premium images to the mix, all for free.”

“The Shortcode is for a service called PicApp, which offers up to the minute sports, news, and celebrity images from some of the top photographers and agencies throughout the world.”

View this official blog posting at Wordpress.com.

Visit PicApp.com, the provider of the free image web application.

Looking at Wordpress Custom Fields and Images Further

Christopher Hennis — Tue, 06 Oct 2009 04:07:21 +0000

You may remember a previous article I wrote here on JungleJar.com called Using Custom Fields To Post Your Images, but if not, I’m going to reintroduce a few of the code snippets and methods I wrote about in the tutorial about how to save and display image data from custom fields within Wordpress.

In this article I’m also going to cover a few of the small yet robust code block methods I myself tend to practice quite a bit that I didn’t previously touch on.

Who Does This and Why?

I believe this is the best starting point for this tutorial. I for one would want to know exactly how essential this bit of Wordpress knowledge is to know, how often other experienced webmasters and Wordpress Theme authors incorporate this knowledge into their websites/templates, and why this is still a very useful alternative to using a Wordpress Plug-in to handle the article thumbnail postings.

This method of displaying a website post’s thumbnail became ultimately popular with the advance of the “Magazine Style” Template craze. Basically what this means is that the website is set up to resemble an online magazine of sorts with aesthetically relevant thumbnail images used to offer a bit of personality and intrigue to the related article. Template authors found that the easiest method to quickly incorporate these images directly into the website with the image placement, enhancements, etc automatically accounted for via CSS style sheets was by using the Wordpress Custom Fields section of the write page.

So, is this method still widely used? Yes, and I really don’t see this changing. This method of incorporating the aesthetics into the article is so straight forward that really there is no need for the complexities of a plug-in.

So, in my opinion, you should become at least somewhat familiar with this technique even if you have no plans to take advantage of it at all. It could offer you solutions to other problems, as the custom fields do not exist solely for any one thing such as images, and associating the usage of images with the custom fields is a fantastic way to begin learning about them and utilizing them if you’re new to Wordpress.

The Custom Field

First off, let’s take a look at an actual Wordpress Custom Field filled in with a key or name (‘img’) and a value which is the URL of the thumbnail we’ll be using to symbolize our article.

Essentially what this does is tell Wordpress to assign the value we’ve entered (in this case the URL to our thumbnail image) to the key (‘img’) which will act very much, if not exactly like a simple variable. That is, we will refer to ‘img’ later on to display our image since ‘img’ will stand for the URL of our image.

The Wordpress Loop

This is the absolute bare bones functionality of my method of capturing data from Wordpress Custom Fields within the Page / Post editing section of Wordpress.

 while (have_posts()) : the_post(); ?>
 $image = get_post_meta($post->ID, 'img', true); ?>
 echo $image; ?>
 endwhile; ?>

Essentially what you have here is little more than the Wordpress Loop which every Wordpress website / template must have. This begins with the PHP while statement and ends with the PHP endwhile statement.

The section that takes advtange of the data stored in ‘img’ is..

1	$image = get_post_meta($post->ID, 'img', true); ?>

which takes that data and assigns it to the PHP variable we’ve created named $image.

The next line basically takes this information and prints the URL (not the image yet) to the screen.

In the section below you can really see how the usage of the IMG HTML tag, the Wordpress specific PHP and the CSS image class all come together.

CSS Styling of Images

More than likely you’re going to want to manipulate the styling, especially the positioning of your blog post’s thumbnail, and one of the most common CSS attribute added to the specified CSS image class is a float attribute.

 while (have_posts()) : the_post(); ?>
 $image = get_post_meta($post->ID, 'img', true); ?>
 echo $image; ?>" alt="Our Image" />
 endwhile; ?>

img.yourimageclass {
 float:left;
 width:auto;
 height:auto
}

While setting the width and height attributes won’t do much in the way of speeding up the actual image loading speeds, which is what setting the width and height of images before the boom of big-time broadband was most importantly used for, but what setting these values to ‘auto’ does do is just as important in the new era of things.

The auto attributes allow you to specify the attributes which is required in order for the XHTML file to validate by the W3C’s standards which also allows you the flexibility of not having a static image size. That is, you are free to use a thumbnail of any size while also having your XHTML files validate via the validator at w3.org.

This is a neat little trick you’ll most likely want to remember in the future.

A lot of Wordpress Theme authors still do not take advantage of this very simple validation fix to allow their template users the flexibility of choosing the size of the post thumbnail for themselves.

Assign a Default Image

If no image is entered into a custom field when publishing your blog post, would you like a default image to be displayed instead? A useful example of this would be a semi-large magazine or book icon to be displayed to represent the fact that your blog post is an article essentially.

 while (have_posts()) : the_post(); ?>
 $image = get_post_meta($post->ID, 'img', true); ?>
 if(empty($image)) { 
         $image = "http://www.anydomain.com/img/document.png"; 
} ?>
 echo $image; ?>" alt="Our Image" />
 endwhile; ?>

Another good example of using this technique would be to display your personal avatar to bring personality to a blog post even if you didn’t assign a specific thumbnail to the post.

A visual example of this can be seen below which is just a snapshot of a post display while using vexed.box — a free and premium Wordpress Template created by us here at JungleJar.com for the masses to enjoy.

No Image? No Problem.

And of course occasionally you’re going to want to post a blog post without using any thumbnails to symbolize the article or take up any unnecessary space.

 if ( isset($image) && !empty($image)) { ?>
 the_permalink(); ?>" title=" the_title(); ?>">
 echo $image; ?>" alt="Featured:  echo $loopnum; ?>" />
  } ?>

This code above will assist you in doing just that. It checks to see if the variable $image exists and contains data, and if it does, it will display the thumbnail with the CSS image class ‘thumbnailclass’ providing the styling. If no image data exists, the code will simply carry on without forcing the boundaries of an image when one does not exist.

JungleJar Interviews Christopher Muniz of DesignGive.com

Christopher Hennis — Mon, 05 Oct 2009 04:03:03 +0000

DesignGive.com essentially sells apparel online that is designed by some of the world’s most skilled graphic designers, but more than just this fact separates them apart from the rest of the online t-shirt design companies amidst the recent explosion of the…well, the t-shirt design companies. I mean, even CNN is getting in on the action! So, to give you a better understanding of why DesignGive rocks moreso than the rest in the boom, I think the best way for me to tell you about them is to post to you directly what they say they are about, so here it is:

“Designgive is a web site for designers, by designers. We are here to give artists like us opportunities to create, to promote themselves and to better society by contributing designs for apparel that can be purchased on our site. A portion of the proceeds from each item sold will go to a charity of the buyer’s choosing. A cause for design, plain and simple. As artists we were given a talent to create, it’s up to you to use those talents to try and make a difference in the world.”

And after my constant bothersome attempts to contact them, the Design Give team finally cracked and made time to finish up our interview, and honestly, I never once resented the fact it took nearly half a year for us to get together and finish up this interview. I mean, cmon, these guys are taking a fantastic idea that became a very successful business and with it attempting to make the world a better place and save lives.

And with that said, that makes this particular interview my most rewarding to date, and I truly thank them for their efforts and have nothing but the up most respect for their work and who they are as people.

And with that said, let’s get this started…

(Christopher): What was your main inspiration for deciding to donate a portion of your profits to charity? The reason I ask this is because many designers would gladly donate t-shirt designs to your website anyway just for the self-promotion and a link to their portfolio, even if you were keeping all of the profits and the charitable donations were non-existant.

(Christopher Muniz): I have always wanted to get into t-shirt design since early 2000. However, it wasn’t until early 2007 that my schedule cleared up enough to devote the time needed to make it something viable. I agree, designers are much more inclined to donate designs to better network their capabilities and make a name for themselves, but I wanted to do more than that. I saw that there were no other t-shirt companies currently doing it and decided it would not only garner attention, but would be doing something good for humanity in the process.

(Christopher): While browsing your website and learning a bit more about the inner-workings of DesignGive, I noticed that you have quite a team. Are they also designers, and if so, have they submitted any designs for the t-shirts?

(Christopher Muniz): There are only a handful of designers here at DG. Most of them are helpers and work part time and wear the many hats of keeping the engine running so to speak. Darren Ansley (besupercharged.com) and myself (theycreative.com) offer freelance services in-between DG releases, so we are probably the one’s that have the most design experience and pursue that outside of DG. The others are quickly learning and enjoying their creative expression on a few designs in their free time.

(Christopher): Do you currently have any plans to broaden the range of merchandise being sold on DesignGive.com?

(Christopher Muniz): There have been discussions on offering other mediums of the artwork, but nothing has come to fruition as of yet.

(Christopher): Who was the initial person, or who were the initial group of people who first came up with the concept of DesignGive.com?

(Christopher Muniz): Well, that would be me. Like I mentioned earlier it was an aspiration of mine to get involved with t-shirts in some way or form either designing them or submitting designs to other sites. After the initial concept came to be, I contacted Darren and started bouncing ideas of off him to see how we could break into the ever so crowded t-shirt market. Darren was instrumental in getting DG 1.0 off the ground and later 2.0 with his supernatural CSS and design abilities. Both versions went back and forth like a Photoshop Tennis Match until we were both happy and DG was born.

(Christopher): How has the design community received DesignGive? Are there any design oriented websites or individuals that have gone above and beyond to spread the word about your website and what separates it from others?

(Christopher Muniz): Designgive has been embraced by the design community as I frequented design forums and communities for feedback during the first release. Of course we only had a handful of designs at the time, but that didn’t stop people from purchasing as they knew it was something different and best of all worthwhile.

(Christopher): Are there any charities you are considering adding to the donation list?

(Christopher Muniz): This has been the hardest issue surrounding DG. We would like to give to everyone, but the more hands in the bucket results in smaller cuts to each charity. I personally selected 7 charities that I feel have a more global impact than others. That way people in other countries can contribute to a charity that helps people closer to them. Maybe in the future we can add more charities as we continue to grow.

(Christopher): While all of the designs for the shirts are great, is there any one submitted design from an artist that really stands out to you as something special or stands out to your team as a whole?

(Christopher Muniz): Good question. Although each design has it’s own style and inspiration behind it, they are all our favorites. It’s kind of like asking a person with children, which child is their favorite. :)

(Christopher): Has there been a rush of designers donating their designs to your website in hopes of having it on a shirt and doing something fantastic for charity as well, or has the submission process been a relatively slow moving process?

(Christopher Muniz): Design submissions have been more of a roller coaster. Although we receive submissions through our site, most designers actually take the time to write us an email with a link to their portfolio and eagerness to participate in what we are doing. We really wish we could print all submissions, as they are done from the heart with no strings attached. It’s that outpouring of generosity that makes designgive what it is today.

(Christopher): Do you or the members of your team spend any significant amount of time surfing Design / Web Design / other artistically related websites on the internet? If so, do you or any members of your team who might be participating in this question have any favorites?

(Christopher Muniz): Another good question. Darren is fond of alistapart.com for the web standards and best practices. I personally frequent QBN.com (aka Newstoday.com) for design inspiration, feedback, and witty banter. Also, any CSS Gallery site is a great inspirational tool for seeing the latest initiatives in design.

(Christopher): Has DesignGive received much press coverage? What about interviews and things of that nature? Is this your first?

(Christopher Muniz): Designgive has been written about a few times, but this is the first official interview. I personally enjoy reading artist interviews since you only get to see their work and not really the though process or inspiration behind their goals. You learn things about that person that you obviously couldn’t get from looking at their works.

(Christopher): If someone reading this wanted to support and promote your website, what is the best way to do so?

Are there any readily available banners/buttons for others to use when linking to DesignGive.com?

(Christopher Muniz): We have some older banners that you are welcome to use, and as new ones become available you can download them from our site. We will provide a link on our site for banner ad promotions in the near future.

(Christopher): In closing, is there anything you would like to say to all of the JungleJar.com visitors who might be reading this? Are there any websites you would like to plug, upcoming events, things of that nature? Consider this an unstructured question — anything goes; you could write five or so haiku poems here, and I’ll publish it.

(Christopher Muniz): I would personally like to thank each and everyone who has had their hand in turning designgive into a reality. Also, to the contributing artist for their generosity, time and consideration. And, a special thanks to the customers for not only their purchases, but also their feedback to bring a better product to everyone. Thanks for the interview and consideration and wish the best to you and your readers.

(Christopher): Is Ashlee Ewing currently single? Haha, kidding, of course. That is, unless she has plans to re-locate to the Raleigh-Durham area of North Carolina.

(Christopher Muniz): Be careful what you wish for, she is a firecracker for sure.

Ashlee was recently married and is expecting her first child any day now.

I’d like to give Mr. Christopher Muniz my absolute appreciation noted in a public forum, in this case it being JungleJar.com, for finding the time to offer our JungleJar.com readers an interview, and to also help spread the word and realization that charity has a place in all social / work cultures. I personally hope that this interview and our focus on Design Give in this article and possible future articles will inspire other web and graphic designers to integrate a way to give something back to the community or charities themselves via their online creations..

I’d also like to give Ashlee from the Design Give Team a huge congratulations from myself and the entire Jungle Jar Team on her recent marriage and the miracle in her belly which is soon to be tweeting any day now!

You can read more about the charities you can donate to through the purchasing of the DesignGive.com apparel, as well as see the team behind the website by going to the official about page which I’ve linked here.

And of course the main page of the Design Give.com website can be checked out by clicking here, or simply by going to http://www.designgive.com.

Got a RSS Feed reader? Do you actually use it? If so, why not subscribe to the Design Give RSS Feed?.

Do you Tweet? Yeah, who doesn’t. Anyway, just give a follow to @designgive to stay up to date with their latest fantastic items via Twitter.

Don’t forget to also check out my interview with Graphic Designer Andhika Nugraha here on JungleJar.com.

Andhika was one of the more impressive t-shirt designers I came across on the website, and really introduced me to the Design Give efforts.

You can view Andhika’s t-shirt for sell at DesignGive.com entitled “God” by clicking here. Below is a preview of the tee.

Why not check out They Creative.com — another project created by Christopher Muniz?

Oh, and if you’re wondering, Oiled by artist Vanja Vikalo will most likely be the next tee I’ll be ordering.

From Vanja: “Unfortunately the voice of wildlife is never heard in global oil catastrophes, so this is my illustrated way of voicing it for them.”

Believe it or not, I’ve never enjoyed the color yellow before these t-shirts, haha.

A Closer Look at CSS Tab Designer

Christopher Hennis — Fri, 25 Sep 2009 04:38:17 +0000

Do you ever find yourself sitting in front of Photoshop for hours trying to mock up a decent navigation menu, or searching the web for the most aesthetically pleasing color palettes for your users to click on that doesn’t remind them of McDonalds or a funeral parlor?

Face it, sometimes we all lose our mojo for a moment or two, and then we are forced to validate ourselves not just to the W3C, but also to our website visitors, design clients and portfolio piranhas.

And then we remember that through the general kindness of a group of web designers and/or developers, and through organizations such as The Creative Commons who work to guarantee that kind freedom, we don’t always have to be the Picaso of style sheets.

CSS Tab Designer

CSS Tab Designer is a clean and very small desktop application for the Windows Operating System which doesn’t really bring much new to the drawing board, but what the application does nicely is it displays many various popular and well designed CSS menus, both vertical and horizontal. Some of which you’re likely to have seen on other websites, but through the flexibility of the menus’ respective Creative Commons Licenses, all have been incorporated into this small desktop application making it a snap to browse through over 60 designs to find that perfect one to serve as a base template to build upon, or to simply use as is.

In the image above (click for a better view) you can see how easily the program is set up and the true value of the program comes to life a bit.

If using a pre-designed CSS menu seems the better choice for you, you can simply select the design you prefer, edit your text links in the sidebar the application provides, and click the “Generate HTML & Images” button in the menu, and voila. You’ll have yourself a beautiful CSS menu completely customized to your needs with all of the images and XHTML valid code ready to be copy and pasted into your existing website.

The application isn’t all about using other designers’ CSS menus, although it absolutely prides itself on giving you that option. You can construct your own CSS menu with a bit of CSS (of course) and XHTML and view a live preview of how the menu might be interpreted by IE, Netscape, Opera, Firefox, Konqueror, Safari and Camino.

CSS Tab Designer is a freeware desktop application created by the OverZone Software development team.

Visit the official CSS Tab Designer webpage at OverZone Software.

CSS Tab Designer Contributors list.

List Of Markup Validation For Common Websites

Christopher Hennis — Wed, 16 Sep 2009 09:39:11 +0000

I was browsing the W3C Markup Validation Service entry on Wikipedia awhile back, and came across a very interesting little thing they did. They had the idea of checking a list of some of the most common or popular websites on the internet such as Google, Apple, AOL, MSN, etc.

What I saw back then was relatively surprising to me. What I saw today when I went back to that entry on Wikipedia was even more shocking as they updated their list by nearly double and only had one website to add to the ones that came back valid…

The above picture was the old snapshot that was taken off the W3C Wikipedia page. If I had to say, I would say it’s around a year old. Give or take a month or three.

The above image is the new snapshot taken off the W3C Wikipedia page. One of the first things I noticed was Google.com didn’t validate, and I can’t see why. I mean, the simplicity of the Google.com website, its main index, is incredibly simple with an image, a few lists, and a text area form.

I was even more surprised about Twitter and Apple not validating to the W3C standards.

In the article on Wikipedia concerning the W3C Markup Validation Service, it wasn’t stated whether the above websites were scanned for valid XHTML in Transitional Markup, Strict Markup or else. My best bet however is that they scanned these websites for Valid Transitional XHTML, as that gives the website being scanned a bit of head way, but certainly doesn’t make it a piece of absolute cake to validate.

Read about the W3C Markup Validation Service at Wikipedia

Visit the W3C Markup Validation Service

I also highly recommend reading the Help and FAQ for the Markup Validator as it answers most fundamental questions nearly anyone would have about what exactly the W3C Markup Validation Service is.

As defined by their very own FAQ..

” The Markup Validator is a free service by W3C that helps check the validity of Web documents.

“Most Web documents are written using markup languages, such as HTML or XHTML. These languages are defined by technical specifications, which usually include a machine-readable formal grammar (and vocabulary). The act of checking a document against these constraints is called validation, and this is what the Markup Validator does.

“Validating Web documents is an important step which can dramatically help improving and ensuring their quality, and it can save a lot of time and money Validation is, however, neither a full quality check, nor is it strictly equivalent to checking for conformance to the specification.”

Continue reading the official about page.

JungleJar.com - Web Design & Development

Photoshop Tutorial: Get Smart with Smart Objects

Related posts on JungleJar:

New Free Wordpress Template: Ipsum.ak

Related posts on JungleJar:

JungleJar’s New Layout and Ownership

Related posts on JungleJar:

October’s Digital Art Inspirations (37 images)

Related posts on JungleJar:

Winners of the One Flag Adbusters Competition

Related posts on JungleJar:

Wordpress.com Introduces a New PicApp Shortcode For The Bloggers

Related posts on JungleJar:

Looking at Wordpress Custom Fields and Images Further

Who Does This and Why?

The Custom Field

The Wordpress Loop

CSS Styling of Images

Assign a Default Image

No Image? No Problem.

Related posts on JungleJar:

JungleJar Interviews Christopher Muniz of DesignGive.com

I’d also like to give Ashlee from the Design Give Team a huge congratulations from myself and the entire Jungle Jar Team on her recent marriage and the miracle in her belly which is soon to be tweeting any day now!

Related posts on JungleJar:

A Closer Look at CSS Tab Designer

CSS Tab Designer

Related posts on JungleJar:

List Of Markup Validation For Common Websites

Related posts on JungleJar: