I feel like it’s 1997 again.  Not that I totally got out of the website building game, but it’s been a long time since I used pure HTML only.  Or in this case, HTML and CSS.  It has been so long that I can’t even remember what year it was when I first began using content management software. (E-gads, anyone else remember the horror of Movable Type? We thought it was so great, but really it was a great big PITA…and I think that was 2001?)

At any rate, there was a new challenge: Build a website using only HTML and CSS using a recent logo. Easy peasy, my Costumers’ Guild needs to decide if we want a website or if Facebook and an email group is good enough for us. Perhaps so in today’s age. Perhaps not.

So I unveil to you, a sample of our website I’ve been creating.  It is by no means finalized, however there’s a framework there that will allow us to decide where we want to go from here.

As you can see, I used our logo I created a few weeks ago. We still need to decide if this is good for the time being or not. Perhaps at our December meeting? I included sample pages for an “About Us” page which is always important as well as a photo gallery and tutorial page.  Currently we don’t have much, but the hope is to build upon that. I, of course, linked to our Facebook Page and I tried to include some news.  Mostly this stuff is filler content, I just tried to make it more interesting than Lorem Ipsum.

For software to write code, I recommend Notepad ++ for Windows and TextWrangler for Mac.  Hosting at Handcraft as I did for this site offers a built in code editor as well, and that’s actually pretty nice if you cannot add new software to your computer and want something more than a text pad.

I prefer to keep my websites more simple so I wrote the CSS code to utilize Impact and Arial for most of the cite . These fonts are fairly standard across the board.

I matched my color scheme to my logo, going again to the purples I chose before.

What I learned from this challenge is how I am used to the additional technological advances of the last 20 years in website creation.  I’m very grateful to have so many wonderful tools and resources, especially the various management softwares out there that I could not utilize at this time.

I wrote the CSS code from the ground up to meet the needs of the wireframe I created for this website, and then wrote the HTML code from the ground up as well.  Clearly, I knew going in to this design that the final product would make use of more than just HTML and CSS, however, I can create a look that’s fairly consistent on my own without needing to rely on the ability to access such items. I also set the page to handle different screen sizes, though I did not make it 100% optimized for a mobile phone.

Go ahead and investigate the link to my sample site and let me know what you think in the comments.  I know I’ve kept it fairly basic for now, but that’s OK.  It’s always good to start simple and build from there!

Obligatory video for because… because I never know what to say in these things but I know you enjoy me looking like a dork!

–Lady O