Well, I got rid of the background entirely on the left column. Though, in the iframe, I'm leaving it there, because for the most part, it's okay; on a lot of the pages, it's not really going to be seen to begin with.Comosicus wrote:Looking good. However you might try to reduce the contrast in the background pattern, like reducing the opacity for the pattern layer. At this point it creates some distraction when trying to read the text, especially on the left column.verilon wrote:I just spent about 8 hours this morning putting this together. I'm quite proud of it.
The "WEB DESIGN" thread
Moderator: Beowulf
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
-
- Jedi Master
- Posts: 1162
- Joined: 2004-12-27 08:58pm
- Location: GO BU!
- Contact:
I added some alternate designs to the bead site, in case the first wasn't liked.
Parrothead | CINC HABNAV | Black Mage In Training (Invited by Lady T)
The Acta Diurna: My blog on politics, history, theatre tech, music, and more!
The Acta Diurna: My blog on politics, history, theatre tech, music, and more!
- Utsanomiko
- The Legend Rado Tharadus
- Posts: 5079
- Joined: 2002-09-20 10:03pm
- Location: My personal sanctuary from the outside world
I like *my* website. It makes me feel all jangly inside:
www.geocities.com/tonberimuyo/transformers/UTPP.html
Hand-coded in Notepad using less than a dozen html fuctions I learned from reverse-engineering old webpages my brother did back in highschool.
I really need to do my main project website, Head Cancer Productions, so I can list all my good photoshop artwork, maybe three or four videos, and links to that TF junk with all my various comics and stuff that I still have sitting around.
www.geocities.com/tonberimuyo/transformers/UTPP.html
Hand-coded in Notepad using less than a dozen html fuctions I learned from reverse-engineering old webpages my brother did back in highschool.
I really need to do my main project website, Head Cancer Productions, so I can list all my good photoshop artwork, maybe three or four videos, and links to that TF junk with all my various comics and stuff that I still have sitting around.
By His Word...
- Comosicus
- Keeper of the Lore
- Posts: 1991
- Joined: 2003-11-23 06:33pm
- Location: on the battlements of Sarmizegetusa
- Contact:
Two more layouts for two projects I'm working on these days:
Accounting firm
Firm developing software for Symbian phones
Accounting firm
Firm developing software for Symbian phones
Not all Dacians died at Sarmizegetusa
- Comosicus
- Keeper of the Lore
- Posts: 1991
- Joined: 2003-11-23 06:33pm
- Location: on the battlements of Sarmizegetusa
- Contact:
I finally managed to finish the site for the Symbian Software Company. The page can be seen here. I'll just be waiting for the final OK in order to deliver them the files.
Not all Dacians died at Sarmizegetusa
-
- Jedi Master
- Posts: 1162
- Joined: 2004-12-27 08:58pm
- Location: GO BU!
- Contact:
My newest: www.jdroger.com
I KNOW THE LINK TO TAWEB DOESN'T WORK YET. We haven't finished moving the forums and the CMS. So don't bug me about it.
I KNOW THE LINK TO TAWEB DOESN'T WORK YET. We haven't finished moving the forums and the CMS. So don't bug me about it.
Parrothead | CINC HABNAV | Black Mage In Training (Invited by Lady T)
The Acta Diurna: My blog on politics, history, theatre tech, music, and more!
The Acta Diurna: My blog on politics, history, theatre tech, music, and more!
-
- Jedi Master
- Posts: 1162
- Joined: 2004-12-27 08:58pm
- Location: GO BU!
- Contact:
Well, I completley redesigned The Admiral's Site...http://www.jdroger.com/taweb/TAS
Parrothead | CINC HABNAV | Black Mage In Training (Invited by Lady T)
The Acta Diurna: My blog on politics, history, theatre tech, music, and more!
The Acta Diurna: My blog on politics, history, theatre tech, music, and more!
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
I just revamped one of my sites to a simple fanlisting collective.
I also recently put up a La Résistance fanlisting (forgive the fact that I'm wrestling-obsessed).
I also recently put up a La Résistance fanlisting (forgive the fact that I'm wrestling-obsessed).
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
- Comosicus
- Keeper of the Lore
- Posts: 1991
- Joined: 2003-11-23 06:33pm
- Location: on the battlements of Sarmizegetusa
- Contact:
Interesting designs: simple and to the point.haas mark wrote:I just revamped one of my sites to a simple fanlisting collective.
I also recently put up a La Résistance fanlisting (forgive the fact that I'm wrestling-obsessed).
Not all Dacians died at Sarmizegetusa
- Dooey Jo
- Sith Devotee
- Posts: 3127
- Joined: 2002-08-09 01:09pm
- Location: The land beyond the forest; Sweden.
- Contact:
These "sites" are more focused around the technology, XHTML and PHP, so the design wasn't the primary concern. They did both, however, ahem, get the highest grade *bragsbrags*.
XML/XHTML school project
(Check out the Japanese in the "About us" section)
PHP school project "moonvampirism.net"
There isn't a single image in the design of this page. I'm fairly proud of that, and I rather like the colour scheme, too. There's actually quite a lot of nifty little features on this site that might take some time to notice. It's almost completely database driven.
BTW, Comosicus, I like it how all of your sites are standards compliant! Mine are too, but they had to be (at least the first one).
XML/XHTML school project
(Check out the Japanese in the "About us" section)
PHP school project "moonvampirism.net"
There isn't a single image in the design of this page. I'm fairly proud of that, and I rather like the colour scheme, too. There's actually quite a lot of nifty little features on this site that might take some time to notice. It's almost completely database driven.
BTW, Comosicus, I like it how all of your sites are standards compliant! Mine are too, but they had to be (at least the first one).
"Nippon ichi, bitches! Boing-boing."
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Thanks. I prefer my sites to be more minimalistic, because that's just how I am.Comosicus wrote:Interesting designs: simple and to the point.haas mark wrote:I just revamped one of my sites to a simple fanlisting collective.
I also recently put up a La Résistance fanlisting (forgive the fact that I'm wrestling-obsessed).
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
- Comosicus
- Keeper of the Lore
- Posts: 1991
- Joined: 2003-11-23 06:33pm
- Location: on the battlements of Sarmizegetusa
- Contact:
Some small nitpicksDooey Jo wrote:These "sites" are more focused around the technology, XHTML and PHP, so the design wasn't the primary concern. They did both, however, ahem, get the highest grade *bragsbrags*.
XML/XHTML school project
(Check out the Japanese in the "About us" section)
PHP school project "moonvampirism.net"
There isn't a single image in the design of this page. I'm fairly proud of that, and I rather like the colour scheme, too. There's actually quite a lot of nifty little features on this site that might take some time to notice. It's almost completely database driven.
BTW, Comosicus, I like it how all of your sites are standards compliant! Mine are too, but they had to be (at least the first one).
The first site has the background repeating itself on larger resolutions. You could try to have that image fading to black on the right and setting it with "repeat:no-repeat" or "repeat:repeat-y".
About the second site ... do you intend to fill it further with content? Or will it just remain as it is?
I've tried hard in the last year to have my code standard compliant, as I consider it a goal in my career. Recently I have also started to make tableless layouts, although I do find them more difficult to set up in a consistent way across multiple browsers.
Not all Dacians died at Sarmizegetusa
- Dooey Jo
- Sith Devotee
- Posts: 3127
- Joined: 2002-08-09 01:09pm
- Location: The land beyond the forest; Sweden.
- Contact:
Yes, I know. I was going to make the background tileable, but I figured it wouldn't really matter to the teacher so I left it the way it is now.Comosicus wrote:
Some small nitpicks
The first site has the background repeating itself on larger resolutions. You could try to have that image fading to black on the right and setting it with "repeat:no-repeat" or "repeat:repeat-y".
It will probably remain in its current state for some time. But I plan to eventually add more stuff, and make a better "home" page. Maybe have something in the right column too...About the second site ... do you intend to fill it further with content? Or will it just remain as it is?
Yes, I know. It can be a real pain (damn you IE ). But it makes the code so much easier to read. And it does also make it very easy to change the design later on, or having changing the CSS completely change the layout of the page... Well, I'm sure you already know what the advantages of a tableless layout areI've tried hard in the last year to have my code standard compliant, as I consider it a goal in my career. Recently I have also started to make tableless layouts, although I do find them more difficult to set up in a consistent way across multiple browsers.
"Nippon ichi, bitches! Boing-boing."
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Do either of you have tips on how to go about creating a tableless layout? I've wanted to try but have yet to really figure it out.
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
- Dooey Jo
- Sith Devotee
- Posts: 3127
- Joined: 2002-08-09 01:09pm
- Location: The land beyond the forest; Sweden.
- Contact:
Well, you'll have to use various CSS positioning techniques. For instance, if you wanted to do your La Résistance fanlisting site without tables, you could make a div-tag that wraps the whole page and in the CSS write something likehaas mark wrote:Do either of you have tips on how to go about creating a tableless layout? I've wanted to try but have yet to really figure it out.
html, body {
text-align: center;
}
div#wrapper {
width: 652px;
text-align: left;
}
This would put a 652 pixels long section in the middle of the page, in which you would then put the rest of the stuff.
I think the trick is to create sections using divs, instead of table cells (think, because I've never really used tables for layout so I don't know how one would plan such a site). Absolute positioning (position: absolute) is probably the easiest way of doing this. However, a certain browser have a tendency to screw things up, so you will probably have to add margin and padding values (which that very same browser will not interpret in accordance with the specifications, which in turn can cause you much headache).
W3Schools have many examples.
Positioning is everything has some useful articles and discussions and tips on how to make stuff work in IE.
"Nippon ichi, bitches! Boing-boing."
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Okay, because I've never actually worked with divs in CSS styles outside of classes, what is this:
I don't understand how that works, or what it does.
Code: Select all
div#wrapper {
width: 652px;
text-align: left;
}
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
- Comosicus
- Keeper of the Lore
- Posts: 1991
- Joined: 2003-11-23 06:33pm
- Location: on the battlements of Sarmizegetusa
- Contact:
div#wrapper is the rule for a div with the id "wrapper":haas mark wrote:Okay, because I've never actually worked with divs in CSS styles outside of classes, what is this:
I don't understand how that works, or what it does.Code: Select all
div#wrapper { width: 652px; text-align: left; }
Code: Select all
<div id="wrapper">
</div>
I think that is enough for a start. Let me know when you've "digested" these sites and I can send you more
Not all Dacians died at Sarmizegetusa
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Thanks. I've gotten this page done in completely no tables. It looks exactly like the main site so I'm happy with it. Again, thanks!
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Okay, got another question.
See the multicoloured tables here? Is it possible that I can do that with divs?
See the multicoloured tables here? Is it possible that I can do that with divs?
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Yeah, you just put each section in a different div, and style the divs such that you have one set as one color, the other the other, put no border around it, and stick all 4 divs in another one which does have a border.haas mark wrote:Okay, got another question.
See the multicoloured tables here? Is it possible that I can do that with divs?
"preemptive killing of cops might not be such a bad idea from a personal saftey[sic] standpoint..." --Keevan Colton
"There's a word for bias you can't see: Yours." -- William Saletan
"There's a word for bias you can't see: Yours." -- William Saletan
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Okay, now how about getting it so that the smaller div w/border isn't below the picture?Beowulf wrote:Yeah, you just put each section in a different div, and style the divs such that you have one set as one color, the other the other, put no border around it, and stick all 4 divs in another one which does have a border.haas mark wrote:Okay, got another question.
See the multicoloured tables here? Is it possible that I can do that with divs?
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
- Dooey Jo
- Sith Devotee
- Posts: 3127
- Joined: 2002-08-09 01:09pm
- Location: The land beyond the forest; Sweden.
- Contact:
You could try making the image left-floating, like so:haas mark wrote:Okay, now how about getting it so that the smaller div w/border isn't below the picture?Beowulf wrote:Yeah, you just put each section in a different div, and style the divs such that you have one set as one color, the other the other, put no border around it, and stick all 4 divs in another one which does have a border.
float: left;
However, since those multicoloured tables are, in fact, tables, the best thing to use might actually be tables (after all, that is what they are for). You could have a div with a border wrapping the image and and the table. Then you'd assign every second table-row a class that gives it a different background (or you might have to assign that class to the table-cells instead. Whichever that works...). Tables aren't evil when used to display tabularly information
Oh, and I noticed that I forgot one thing in my example up there. In order to get the div in the center, you'd have to add the line "margin: 0px auto;" somewhere in the div#wrapper section.
"Nippon ichi, bitches! Boing-boing."
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
Mai smote the demonic fires of heck...
Faker Ninjas invented ninjitsu
- haas mark
- Official SD.Net Insomniac
- Posts: 16533
- Joined: 2002-09-11 04:29pm
- Location: Wouldn't you like to know?
- Contact:
Robert-Conway.com | lunar sun | TotalEnigma.net
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
Hot Pants à la Zaia | BotM Lord Monkey Mod OOK!
SDNC | WG | GDC | ACPATHNTDWATGODW | GALE | ISARMA | CotK: [mew]
Formerly verilon
R.I.P. Eddie Guerrero, 09 October 1967 - 13 November 2005
- Comosicus
- Keeper of the Lore
- Posts: 1991
- Joined: 2003-11-23 06:33pm
- Location: on the battlements of Sarmizegetusa
- Contact:
This is one project I've finished last week:
Nova Epoc Systems
As the previous ones, it is tableless (except for the contact form, where I got lazy - and pressed by the deadline)
Nova Epoc Systems
As the previous ones, it is tableless (except for the contact form, where I got lazy - and pressed by the deadline)
Not all Dacians died at Sarmizegetusa
- Comosicus
- Keeper of the Lore
- Posts: 1991
- Joined: 2003-11-23 06:33pm
- Location: on the battlements of Sarmizegetusa
- Contact:
And the last one, that I've finished a couple of days ago:
Accounting firm
This is just made as a template, because the client didn't have the content prepared yet. And due to lazyness, top menu (and the relatively low payment) I decided to made it using plain old tables. In fact I used the table structure exported by ImageReady when I sliced the layout.
Also, this month, is the first one when the number of Firefox hits on my site is greater than IE:
Firefox - 789(57 %)
MS Internet Explorer - 530 (38.3 %)
Accounting firm
This is just made as a template, because the client didn't have the content prepared yet. And due to lazyness, top menu (and the relatively low payment) I decided to made it using plain old tables. In fact I used the table structure exported by ImageReady when I sliced the layout.
Also, this month, is the first one when the number of Firefox hits on my site is greater than IE:
Firefox - 789(57 %)
MS Internet Explorer - 530 (38.3 %)
Not all Dacians died at Sarmizegetusa