more webpage design

Printable View

07-21-2004
DavidP

more webpage design

well, i am at it again.

and yes, the same website.

my friend told me she thinks the website doesnt look professional enough, so i am redesigning it in hopes that it will look more professional. what do you guys think of the current menu system?

http://students.cs.byu.edu/~dprucs/dasavo/#

Right now I am trying to figure out what to put above the menu. I really have no clue, so if you guys have any pointers, please do tell.

she said she kind of likes the overall design of the following page:

www.tyraleang.com

Personally I think that although it does look somewhat professional, it isn't too great, so I am hoping to add upon that and make a better design.
07-22-2004
chrismiceli

Like it a lot better than the girly pink original. The site she likes it ugly. The only problem I have with yours is there is so much white space on the right. I am viewing at 1024x768.
07-22-2004
whistlenm1

Well, I like the first one more and I'm sure you already have ideas for improvements anyway you'll find that we all bend over backwards for the significant others in our lives! For me marriage can be enough of a project! sometimes :)
07-22-2004
gcn_zelda

Too bad it doesn't work in Firefox.

Unless my computer is screwed up.
07-22-2004
Thantos

The page she said she likes looks like crap. I mean that in the most literal way.
On your bio page I would try to move the text up so its next to the picture. That way they can see the picture and read the text at the same time.
07-22-2004
DavidP

yeah i am trying to that but nothing is working!!!!

on my normal website:

http://students.cs.byu.edu/~dprucs/

I do a very similary thing where I move the menu and the main content adjacent to each other, and I tried that same technique to move the image and text adjacent to each other but it isnt working!!! ahhh!!!
07-22-2004
Thantos

Quote:

yeah i am trying to that but nothing is working!

Add: align="right" to the <img> tag. And remove the <div> tags around the image. Also you need to close your <tr> before opening another one.
Two very good sites to use:
http://jigsaw.w3.org/css-validator/ (css validator)
http://validator.w3.org/ (html validator)
07-23-2004
DavidP

thanks thantos, that saved several hours of stress
07-23-2004
Jeremy G

Quote:

Originally Posted by Thantos

Add: align="right" to the <img> tag. And remove the <div> tags around the image. Also you need to close your <tr> before opening another one.
Two very good sites to use:
http://jigsaw.w3.org/css-validator/ (css validator)
http://validator.w3.org/ (html validator)

align tags are depreciated. What you really want is the css property float.
try
div.text {
display: inline;
float: right;
}
07-23-2004
Thantos

Good point dbgt. Of course I ran into a problem where I had to use a depreciated tag. It urked me so much to use a <center> tag.
07-23-2004
ober

You couldn't use a div tag to center?
07-23-2004
Thantos

I don't know. It just wouldn't.

Basically it was:

Code:

<div> <div>some stuff</div> <div>Some other stuff</div> </div>

But for some reason it wouldn't center the inner <div> stuff even if the outer div's class was told to center everything.
07-23-2004
ober

Try using spans. Divs make literal divisions in the page and I don't think they nest well.
07-23-2004
Thantos

Hmm I'll try it but I haven't had much luck with spans before. Ok back to DavidP's problem :)
07-23-2004
ober

OH... this was David's thread? :p
07-23-2004
DavidP

there's too much empty white space...how the crap am i going to fill it all up

a good background image/design would fill it up nicely...but it would have to work with the color scheme
07-23-2004
Thantos

Two words: Nude Pics
Barring that you could have some text on the first page
07-23-2004
DavidP

lol lol

how about not ;)

p.s. just put some text on the 1st page
07-24-2004
DavidP

is there some better way to align a picture other than using the float property? it is screwing things up.

for example, on the Bio page, I want to align things, but I want to keep them within the bounds of the current div tag.

There are 4 main segments to the bio page: the bio text, the picture, the "About Me" text, and the "Availability" text.

Depending on what browser you are using, the bio text can either go below the bottom of the picture or it never reaches the bottom of the picture.

In the case of the text not even reaching the bottom of the picture (those who use Mozilla will experience this), the picture will then overlap the boundary line of its current division, and the other two text fields wont even be within it.

In the other case (for those who use IE), everything looks dandy.

If I make the other two text fields not float, then the page looks fine, except for the fact that they are not adjacent to each other and I need them to be, and so then the page actually ISNT fine.

oi this is making me frustrated....
07-24-2004
DavidP

for all you Mozilla fans out there that say it "follows the standard" better than IE does:

Quote:

The float property sets where an image or a text will appear in another element.

Tell that to FireFox.

IE seems to comply with that just fine.

FireFox is gay.

[EDIT]

yes indeed after an extensive test I have concluded that Mozilla and Mozilla Firefox are gay.

After looking at the following site:

http://students.cs.byu.edu/~dprucs/dasavo/profile.php

With IE 6, Mozilla, Mozilla FireFox, and Opera, it turns out that IE and Opera were the ones that followed what the standard says about the float property aligning the text in another element. Meanwhile the Mozilla family of browsers completely took the text out of the parent element and threw it somewhere else when it saw the float property.

[/EDIT]
07-25-2004
Perspective

Quote:

Experience Level: Somewhat Experienced

this line definately needs to change. you might as well just say "I have no idea how to operate in the professional world"
07-25-2004
DavidP

tell her that, not me :)

she gave me the text for the bio, i just typed it up. i also thought that wasnt really a good line though. i will bring it up to her.
07-25-2004
Jeremy G

Hey DavidP you really struck something with your portfolio lay out, it almost came off across as professional. (Seriously that was a complement).
http://www.jeremygiberson.com/images/dasavo.jpg (large picture)

I think the design overall still has a bit too much white space.
This is another sketch I did that I think will really improve the site, basically all I added was an eastern kind of background (light) and really emphasized the border of the content. If you like the idea and want the background just ask. It's just a suggestion. At the very least I do think you should do all of your pages in the same method, keep it boxed as you have in the portfolio.php.

Nice job.
07-25-2004
DavidP

i think you mean profile.php ;)

edit:

A couple other things:

1. I do like the background. Can you send it to me? I will try it out and show it to her and see if she likes it. Thanks.

2. I notice that your "Dasa Vo .com" logo at the top of the page doesnt look the same as mine. I need to change that from just plain text to a .jpg file so it will appear the same in everyone's browser because I am using a font that probably not many people have.
07-25-2004
Jeremy G

Quote:

Originally Posted by DavidP

i think you mean profile.php ;)

yeah.

Quote:

edit:

A couple other things:

1. I do like the background. Can you send it to me? I will try it out and show it to her and see if she likes it. Thanks.

www.jeremygiberson.com/images/eastbg.jpg

Quote:

2. I notice that your "Dasa Vo .com" logo at the top of the page doesnt look the same as mine. I need to change that from just plain text to a .jpg file so it will appear the same in everyone's browser because I am using a font that probably not many people have.

3 options here:
1.) what you said, save it as an image
2.) use something called embeded fonts http://www.microsoft.com/typography/...ng/default.htm
3.) use php and create a script to output text in any font as a dynamic image... http://aspn.activestate.com/ASPN/doc...gettftext.html (this is how www.george-says.com works btw) Then you can use your script say like this

Code:

<img src="fontgen.php?font=supercool&text=Dasavo">

With said script you can use it to make fancy paragraph leaders--you know with one big letter all fancy at the beginning of a paragrapy.

Code:

<p><img src="fontgen.php?font=supercool&text=T">he first time I started modeling...</p>

Any way, thats an option that could lead to fun things.
07-25-2004
Thantos

oyi, I tried option #3 and its a pain in the arse to setup. From what I've been able to find, if it doesn't work then it won't work unless you can recompile php.

Edit: nm just had to restart apache after installing the library. Of course its still not working but at least its not giving me an error now
07-25-2004
Jeremy G

Quote:

Originally Posted by Thantos

oyi, I tried option #3 and its a pain in the arse to setup. From what I've been able to find, if it doesn't work then it won't work unless you can recompile php.

Edit: nm just had to restart apache after installing the library. Of course its still not working but at least its not giving me an error now

Yes, you do have to have the GD library available to do image work. However, most website hosts with php4 or greater have it included. I didn't bother to set it up on my home computer--too much trouble. I just test it out on my domain. I probably shoulda mentioned that.
07-25-2004
Thantos

well both my personal computer and my domain don't have it. I'm upgrading php from 4.1.2 to whatever version debain has setup with dselect

ok for some reason it didn't upgrade the version but I did find the php_gd package and installed it (I had already installed a GD package however). Now I just need to figure out the font issue :)