One soccer game canceled and one local girl scout event postponed so my day is suddenly open. Of course there is still that small matter of sewing those Halloween costumes...
Anyways Sarabeth asked for some HTML and CSS help websites. After one month of using a Blogger template, I've been coding my pages ever since. With help of course. When I'm unable to find something online I turn to two real life people, my brother in law and an old Everquest friend.
Here's the trick to HTML. Everything is a sandwich. You need the top piece of bread, the beginning code < *something* >, your stuff in the middle like Blogger code or whatever, and then the bottom piece of bread to keep it all together < /*something* >. The most common beginner HTML coding mistake is not closing with a < /*something* > ***
While HTML is required for coding, CSS is a little more optional but very helpful. It's a handy tool that cuts down on repeating HTML code. Say you have several titles that you want coded the same way (font, size, etc). You created a CSS code that specifies all those things, give it a name (header1, etc), and with the proper codes, use that name where you want those titles. Most Blogger templates include CSS, it'll be in an area marked < style type="text/css" > and uses . and { }
Confused yet? Here's my secret: Lissa Explains it All, HTML Help and Tutorial for Kids. Yes it's for kids. But that makes it super simple for those of us who don't understand the difference between padding and margins. The best part of this website is she gives the codes for basic web page templates, 2 column, 3 column, 2 columns with a header, etc. Most blog templates are just 2 columns and a header and then fancied up with graphics and colors. Check out her examples here. I always start with one of these and then tweak to my heart's content. If you want a background (like my blue stripes), she lists how to do a background code here and then you need to make your columns a bit narrower (margins and pixels) so the background picture or color shows.
Before you start going crazy with a new template, please, PLEASE! save a copy of your current template in Notepad (it's nicer to code than Word). Not only does this give you a quick way to return to your original code if you totally screw up, you can quickly cut and paste elements into your new template. Do you really want to type out the code for your 50 favorite links again? I didn't think so.
And now the rest of the links I find helpful:
HTML Color Codes Basic color codes, although there are more colors out there if you change around the numbers and letters, make sure you always have 6. (The background behind this text? #CED6DE)
HTML and CSS tricks
CSS: An Interactive Tutorial for beginners
Starting with HTML + CSS Similar to the above link, helps you write your first style sheet (CSS) and incorporate it into HTML.
Mandarin Design Advanced tricks and tips.
Google When all else fails, google what you want + HTML (or CSS) + code. Sometimes it's good to add in "free" because there are websites out there that will sell you the code you want. And there's definitely someone out who will have your answer for "free."
Soon you'll be coding in your sleep! < head > < /a > < font color="#000000" > < br > hehe
*** Minus the spaces, I just added those so the code would actually show.
All Content at katiefleck.com is Copyright 2003-2008 by Katie Fleck, All Rights Reserved.
