My Resume Website

Started by ElfManDan, August 09, 2011, 10:02:32 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

ElfManDan

So this isn't the website I was thinking of making a few weeks ago. In talks for a graphic design job they asked me to make a resume website (or something like that anyway) and I figured I probably should do that anyhow.

http://www.danielelfers.com

It was quite a learning experience. I learned some HTML, CSS, general web development, design, arts, and of course patience. I find I do learn really well by actually just doing it and also under pressure. Though I'm thinking a full redo is in order to finish the art stuff I really wanted to do and get all the coding right next time, though I feel very accomplish at this. So anyway with this simple work of art that took me less than 5 days to do everything what do you guys think?

Also thanks to Rico I got a sweet deal on Dreamhost and I think I'm definitely ready to do some more websites, given a little more learning about web development of course. I actually did rather enjoy this to be honest.

turtlesrock


Rico

Looking good Daniel.  Can't wait to see more of what you do on the big WWW.  Glad the Dreamhost discount helped.  :)

billybob476

Very cool design! If you don't mind my 2 cents:

1. in the body style tag, drop position:relative, the really isn't much reason to have it there and CSS positioning calls usually jank things up unless you need them for a very specific reason.

2. add 'margin-left:auto;margin-right:auto;' to the body style tag, that should center your table in the screen, on widescreen displays the site is left-aligned.

3. on your img tags, make sure you either add 'border="0"' to all of them or add a global css definition like img { border:none; } In IE9 all your image links have blue boxes around them right now, that's default behaviour for img tags embedded within anchors.

But definitely a great base! Keep it up!

ElfManDan

Quote from: billybob476 on August 10, 2011, 09:07:59 AM
Very cool design! If you don't mind my 2 cents:

1. in the body style tag, drop position:relative, the really isn't much reason to have it there and CSS positioning calls usually jank things up unless you need them for a very specific reason.

2. add 'margin-left:auto;margin-right:auto;' to the body style tag, that should center your table in the screen, on widescreen displays the site is left-aligned.

3. on your img tags, make sure you either add 'border="0"' to all of them or add a global css definition like img { border:none; } In IE9 all your image links have blue boxes around them right now, that's default behaviour for img tags embedded within anchors.

But definitely a great base! Keep it up!

Thanks for the tips. This was such a rushed project and I'm planning to do it again with a little more study of coding and testing in multiple browsers. This was so on the fly cause I had to have it done in such a short time, but I actually liked doing it a lot more than I thought I would. And now that I've done it ones I can do it again a lot easier. Now I'm a lot more confident in all this stuff.

billybob476

Practice is really the only way to get good at this stuff. A cool challenge for your next site would be to try it without the layout table, using <div> tags and CSS instead.

http://www.csszengarden.com is a site of cool examples of how you can change the look of static content just by applying different style sheets.

ElfManDan

Quote from: billybob476 on August 10, 2011, 10:50:40 AM
Practice is really the only way to get good at this stuff. A cool challenge for your next site would be to try it without the layout table, using <div> tags and CSS instead.

http://www.csszengarden.com is a site of cool examples of how you can change the look of static content just by applying different style sheets.

I was thinking that too. I started with the table and halfway through this thing I started wishing I'd done it more CSS, but I had to finish it that way due to time restrains. Next time though definitely.

On a side note here do you know of a good site to test different browsers?

billybob476

Depends on what you mean by test.

ElfManDan

Testing what it what the code is gonna look like on each of the browsers.

billybob476

Quote from: Sheppard on August 10, 2011, 11:43:18 AM
Testing what it what the code is gonna look like on each of the browsers.
Easiest way to do that is to download all the browsers and look at your site in them :)

I usually aim for IE/Firefox/Chrome

ElfManDan

My only issue is I can't get current IE on a Mac.

billybob476

#11
To my knowledge, the best way is to get access to a windows machine, bootcamp or run a windows VM on your mac. Even old IE for mac doesn't render in the same way as IE on windows. Any emulator you could get your hands on won't render it 100% reliably.

As much as it sucks to do it, you need to make sure the site works in at least the last two versions of IE. I usually aim for IE7+, thank god we can stop supporting the abomination that was IE 6.

Meds

I have no idea what you crazy kids are talking about ;)

Nice site Dan.

ElfManDan

Quote from: HawkeyeMeds on August 10, 2011, 01:30:12 PM
I have no idea what you crazy kids are talking about ;)

Nice site Dan.

Probably cause I fixed some of it thanks to Joe. Thanks though.


Quote from: billybob476 on August 10, 2011, 12:57:03 PM
To my knowledge, the best way is to get access to a windows machine, bootcamp or run a windows VM on your mac. Even old IE for mac doesn't render in the same way as IE on windows. Any emulator you could get your hands on won't render it 100% reliably.

As much as it sucks to do it, you need to make sure the site works in at least the last two versions of IE. I usually aim for IE7+, thank god we can stop supporting the abomination that was IE 6.

Well I'll get it figured out. A lot of this I learned as well in school, but there are gaps in my knowledge, which I discovered trying to do this. Once I do move I'll be able to set up my PC as well so I won't be working just off my MacBook. Anyway thanks a bunch for the help.