Here’s a website I worked on for a couple hours last night for class. View source or firebug it, talk about it and let me know if you have any questions about how it was made. Enjoy

Click Here.


This is an apology for missing my post. Yeah apparently I had written up my Moar CSS post on my Cobb Blog from last quarter. Yeah, 4 blogs at once ftl. Well hopefully commenting everyone in the class can make up for it.

Fine fine, and yes I know more is mispelled, it’s done so for creative purposes. So last post we started with divs and borders right? Well lets build further on that with color and float.

To start off, let’s dissect some code and learn from there.

#content_main          {border: 1px solid #990000;

                                       float: left; }

This is the CSS for the content_main div defined in the HTML. Of course we covered the border already, but the two differeneces here are the float and the color. The hexidecimal color at the end of the first line of the border is a web-safe color. That’s a dark red if  my memory serves me right. There’s tons of web-safe colors your code editor may already have a chart you can just use for whatever you like. In this instance though, the red changes the border and that’s it.

Then we have the float. Floats are somewhat strange and I’ll admit I don’t know EVERYTHING I would like to know about them but in a nutshell it basically just sends whatever your div is all the way to the left or right pending on how you define it. Then of course you could always stack stuff with it, but the main purpose for this is for column structures on the internet. You could just use one column but that’s not fun is it? 

Most people in the class know by now I’m a 5th quarter student and took intro to scripting. While intro is barely even scratching the surface of where to go in web design, for me I found it to be a good foundation to build on.

 I checked out the W3schools site and found there CSS tutorials to be uninteresting. So I’ll spare you the time of looking at it and give my synopsis of beginning in CSS and HTML.

First and foremost is HTML, or Hyper Text Markup Language, a big fancy acronym for your content. In a nutshell HTML is where all the content is placed, CSS is how you wanna display said content. Obviously it’s more complicated than that, but lets go from there.

In HTML your first great place to start out in is <div> or the div tag. Anything placed in those brackets there is called a tag. When you see div think division, or how you want to divide your content.

As a general rule of thumb usually you have your branding div for you company up top with the logo. Your navigation div, content divs, then your site info div in the footer at the bottom.

Now for your divs, you have to name them like so:

<div id=”branding”>


Notice a couple things here. First is the quotations marks, you need to set your name in the quotes or it doesn’t work. Also is the div tag at the bottom with /. That / closes the div, or simply a closing div. If you don’t close your div that you made then it simply goes on forever. Now browsers can see that it should be closed, but that’s just bad coding. So, whatever you open, close.

So now that you have some divisions setup, decide what content should be placed inside. Text, graphics, video, links whatever. Don’t worry about how it’s going to look as much, worry more about stacking it.

HTML works with stacking, which is why you always put branding up top and site info footer on bottom. It stacks. Back to the task at hand, once you’ve placed all your content and have it ordered the way you want, then you can go to CSS and fix the way it looks.

Now there’s two ways I know of to do your CSS, one is to place it inside the same file as your HTML. Internal CSS overides any outside CSS files. On the otherhand, you have external stylesheets which are linked to the HTML which are great for larger files that you need to change. It gets to be extremely tedious as the files get bigger (I learned the hard way) so External CSS is our friend.

By the way CSS stands for Cascading Style Sheets. Just think style, simpler that way. Ok now for code, lets say you want to give your div a border. Remember what you named your div? branding right? Yeah this is where the naming comes back to bite you.

What we do is type a #divname  (tab)  define code

 So in our border example we do this:
#branding     border: solid 1px #000;

I defined what div I wanted to change in this case branding, then the code for border is border: with the colon instead of the = sign. Solid tells the CSS to make the line around the division a solid line. 1px defines the size of the line, or 1 pixel. Finally, the #000 is a websafe color, in this case black. When you’re done defining make sure you close the code with a semicolon or like in the div HTML example your code will continue on forever until it’s closed which will cause headaches.

Well that should give a small sample of what basic CSS and HTML is like, the code gets kinda boring and tedious to post it all here. At they have more in depth tutorials about the code and how to use it. Also browsing Google will give you some more variety. Another place to look is in Firefox, there’s an add-on called Firebug which allows you to look at the existing code of a website you’re on and edit it as you wish.

Now, I don’t claim to be a mathmetician (or a great speller) but I am a thinker. When one looks at this word Podcasting you might think about deploying emergency space pods onto a strange planet. If you’re normal though you’ll most likely think about Ipods.

 Now, the reason I didn’t say Ipod + Internet in the title is because you don’t need one to recieve a podcast. Nope! Just a MP3 player that recieves feeds.

I’ll admit, I’m new to this so called casting of the pods. (whatever that means) I’ve been a talk radio fan for about a year or so now, so at first glance the whole concept of getting audio and video feeds wherever I want sounds not only intriguing, but palpatating. (salivating is also a good word here.)

Basically the concept is simple, go to podcasting site, sign up for feed, play on MP3 player. Easy right? Well the catch is…there is no catch. That’s it.

I have a gaming blog now dedicated to my pursuits in the gaming world and also my experiences at GameStop. If you’d like to check it out here’s the link to B.F.Games

So my class has been presented with a question: What do you want to learn? In all truth I want to learn how to make a clean, simple, and consistent layout for a website. Our class is after all called Design Fundamentals, and their are 5 basic fundamental rules to web design. I’m not trying to be uncouth here, but it’s just my belief that I should have that foundation for future classes.

In all fairness, learning how to learn has been very resourceful for me at the Art Institute. It’s says to the student, “Ok you want to be a designer? Here’s the tools to do it. Now make something of yourself, we’re just not going to hand it to you.” That’s exactly the kind of reality check we all need. In the real world, your parents don’t pay the bills, companies expect results, people that do well get payed better. That’s life.

To be more specific in what I want to learn, I think one of the most important things we can all learn about websites is layouts. What makes a good one and what fails? I’ve found through my own research in my User Centered Design class that consistency is fundamentally most important. Consistency make or breaks all websites. It tells the user that they’re still in the same website for one. It gives the impression of loudness or softness. It goes as far as to grid spacing and making sure everything is even.

 Here’s some links to catch up on consistency in web design:
Web Style Guide 

In this article by Etienne Wenger talks about communities of practice. What I picked up out of this most was that our lives revolve around our communities. Ever wonder why it’s better to have experience than a degree? This is why.These communities we learn in give us the edge over everyone else who’s not in the know so to speak.Where I’m going with this is that this is the internet. However the community is so large there is the good, bad, and the ugly to deal with. My community is at GameStop where I work. I’ve learned a lot over there in the past year and a half, good and bad. I’ve learned to become more confident with myself and comfortable in who I am. Another community of practice I closely identify with are gamers (hence GameStop). Gamers learn constantly in an ever-changing medium. Every 5 years the industry changes itself which is why a community of practice is the only resource we gamers can trust; i.e. the people that actually play and make the games. If we can wake up to our own communities of practice and how we learn through them, then there’s no boundary to what we can learn. 

Earlier I touched upon why we should blog at all, but why should we be heard? What does that contribute?I think it depends on what your goals and interests are. Some people don’t even care if they’re heard or not they just want to write. Others feel the need that if you aren’t listening to them then something is wrong. Again I believe it depends on the person you are.Lets say though you’re going into the Web industry though (like me) now you may have a reason to be heard for your company. Say you have problems or found something really awsome the world should know about, well that changes your goals now doesn’t it? It also gives you ample content to contribute to the world forum of blogs.The problem mostly arises when you contribute something not really useful. That’s our job to find out what’s good and not, and if you’re blog is composed of crap, then guess what? Your readership will also be crap.

Been reading “How to be Heard”  by Stephen Downes here:

Really none of this is a surprise to me, but actually getting the whole process into my head brings the picture clear into my head about what to do: planning, designing, setting aside time.

Hell if I did this with my life more, I’d probably be an unstoppable force of nature. Right now though I’m kinda thinking why do we even need these blogs? Why should we learn from other people when we have schools and newspapers and countless other resources?

I think that’s a valid question, but I’ll answer that question with another question: are those resources really informing you? I don’t read half the newspapers cause of their political agenda. Even the sources that I agree with politically give me one side but sometimes not enough of the other side.

So where do we go for information? Blogging. Blogging is simply another alternative for better or worse. Back to being heard. Now we have blogging as a resource, but going off of Downes’ article here you can write all you want but you won’t reach anybody unless you plan.

My plan: Finishing School.

I know it’s not quite what you might expect, but the whole blogging universe is still pretty new to me at the moment. Right now I’m just trying to absorb and learn as much as I can before I could ever think I could contribute to society. Now for my classmates I’m there in person to show them my mistakes and successes and for blogging I’ll devote myself to that goal.

Design: Simple, Clean, Effective.

This is my philosophy not only for design but life itself, my room is the very antithesis of this, but it doesn’t mean I like to keep things efficient.