I’m a nerd. A serious nerd. I’m so nerdy I will stay up past midnight on a Friday working on a web site.
I recently attempted to [re]design my online portfolio.
My last semester of graduate school I spent an entire semester developing, organizing, and synthesizing to articulate a professional identity and design a web space to present my work from the last three years. I was pleased and proud of the result. That was then.
Despite the long hours and tremendous thought I put into the portfolio, somehow that representation of my work was no longer accurate or adequate for my current professional needs. I’ve been in the workforce for two years now and the way that I think about my work has changed.
About the time I started to realize all of this (a year or so into my job) I took down my online portfolio. I was embarrassed of the pink and grey color scheme and the table-based web design — certainly this was not the way I wanted to represent myself. At that time I was not ready to invest the amount of work needed to make the changes. So for at least a year, I had no web presence at all.
Fast-forward to Friday, April 18, 2008. For several reasons I decided I needed a web presence. Now.
I really wanted the site to be built using CSS – no tables this time — although I must admit, I did go to Insert >> Table on my Dreamweaver page and even counted out how many rows and columns I would need. But how can I claim to be knowledgeable about web design and good Internet practices and still take the cheap and easy road? I deleted the page.
Thankfully, I have stumbled upon some great resources out there that allow even a “knows-enough-to-be-dangerous” type like me to build a site without tables. I’ve used many CSS templates before, usually with less than thrilling results, but I think I’ve finally found my go-to site for good CSS layouts.
Code Sucks is AWESOME (it doesn’t suck at all, actually). I downloaded one of the templates and had a great layout in no time. I am even learning more about coding just by working within the template and customizing it to fit my needs.
For example, I wanted to create div specific link colors — I knew this could be done, but my attempts weren’t working. I stumbled upon a post on Webmaster World (which, as luck would have it, I can’t find anymore) that explained the code and how it worked! Marvelous!
Thanks to Hicks Design, I was also able to set my CSS navigation menu to a “current page” color and Listamatic helped me create the menu, too.
And just in case you are curious, this is the CSS code I used to create the div specific link colors:
#Maincontent {
width: 600px;
background: #F2F2E6;
float:left;
height:auto;
}
#Maincontent A:link,
#Maincontent A:visited,
#Maincontent A:active,
#Maincontent A:hover
{
color: #475062;
text-decoration: underline;
}
Here is the link to my current (and ever-changing) online portfolio: http://www.msu.edu/~latourli/
Suggestions and comments are welcome and appreciated.
Tags: CSS, HTML, Online Resources