Design 4.5 by B9
Welcome to Blue Too Two, my latest (and I think my best) design for the community at Open Web Design. I have spent quite a bit of time on this one, notably in the creation and selection of graphics. I have also taken the time to heavily comment the code both in the xhtml page and the stylesheet. This should provide a good learning opportunity for those just starting out or wanting to see how certain things are done.
The name is in reference to the fact that this is my second template which is devoted to my favorite non-black color, and B2B9 is short and sweet.
This template is a work in progress, but I feel that it is worth releasing at this point since I don't have the time to add all of the features I plan for this, and I feel that it is a nice-looking and functional design at the moment.
back to top »Features
Blue Too Two is hand coded in xhtml 1.1 and CSS2 - it validates, but more importantly, the 'spirit' of web standards compliance dictated many design choices above and beyond simple compliance. It is far from semantically perfect, but this template is fairly robust and portable, and I intend to update this template in an effort to make it as versatile and accessible as I can while also preserving simplicity and flexibility.
This section uses the .hilite class to set off a bit of text- note that it uses the same background image that tiles across the top of the page - so if the section will be longer than that image is tall, you may want to change the image or just change the .hilite style to not use a background image- the background color which is specified should work fine by itself.
The navbar below the header uses the id #navbar. I have used it for linking to various sections on this page, so that you can 'jump' to each section - use it as you wish. The navbar at the very top of the page uses the id #topnav - I have used it for global site related links, but as I said . . .
back to top »This is a section which uses the blockquote element - it is used for (you guessed it) quoting. Sometimes web authors like to use this element to highlight sections of text, but that is not 100% semantically accurate. Of course, you may do what you wish. Note I have created the .hilite class shown above for drawing attention to nonquoted text.
Caveats
The design works fine at 800x600 screen resolution and I made a little effort to avoid total ugliness at higher resolutions. This is a fixed-width template, but it was designed to (hopefully) work well and look good at a variety of resolutions and font sizes.
Blue Too Two now has alternate layouts, as well as a basic print stylesheet.
You can view the alternate styles in Firefox without changing html pages- note that they won't work well, as I changed the xhtml code to use the different layouts . . . but you can . . .
back to top »Terms of Use
This is an Open Source template. This means it is free to use and modify. I do not place any restrictions on this template, but I do ask that you respect my work. See below for ways you can do this.
All graphics were created by myself, using source images in the public domain or made from scratch. The use of these images is not restricted in any way.
While I do not in any way restrict the use of this template, I would appreciate it if you observed some or all of the following:
- Leave the comments in the source code
- Leave a link to Open Web Design, at least in the source
- Contact me with any questions, comments, or links
- Try out NASA WorldWind
- I would love to be hired to do web design
- Enjoy this template, and tell others about Open Web Design
- Respect and promote Open Source as a philosophy
Open Source Ideals
Open Source is more than just free- it is an entire philosophy which drives the benefits of technology to the common person- Open Source is about freedom and empowerment to all. Open Source technologies help to 'level the playing field' in a world driven by greed and profit, where a few wealthy individuals control vast amounts of resources while billions grow poorer.
- Free
- Educational
- Fun
- Real Value -
- Get What Works
- Don't Pay for Crap
- Your Choice
- Revolutionary
Thank you for viewing/downloading this template and helping to spread the use of Open Source designs.
Please check out the many incredible designs featured at Open Web Design, and tell others about this site.
Cheers - Barnacle 9