Overclock.net › Forums › Software, Programming and Coding › Coding and Programming › Web Coding › Looking for feedback on layout
New Posts  All Forums:Forum Nav:

Looking for feedback on layout

post #1 of 13
Thread Starter 
I'm making a simple webpage for my college's gaming club & this is where I'm at. http://mikesplace.site88.net/mcckcgamingclub/gamerclub.html

Of course the member list is going to be larger but you get the idea of the layout. I'm also trying to find the code to make the background image stay put when scrolling down. The background image itself is really just a placeholder art for now, I just needed a frame of reference for my layout. I think that if I resize the youtube videos I can have them running inline at the bottom & take away from the lopsidedness. If you see any sloppy code let me know I want to improve my html.

Thanks in advance
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
post #2 of 13
hi there, it's pretty clear to me that you're fairly new at this. I highly recommend you go on http://w3schools.com/ and go through their HTML and CSS tutorials.

HTML shouldn't really be too much of a concern, with time it will become second nature, you should focus more on your styling. Obviously, seeing your work above, it's pretty clear you haven't had too much experience in web design, but that's ok the best way to get better is practice. Have a look around the net at other gaming/ clan websites and see how other people go about designing these types of websites.

Now regarding some feedback on what you showed us there, I'd go ahead and center everything, that is your content, fix the video players so that they fit in properly and go with a solid background rather than an image. Images tend to be disruptive if not used properly. Also, try making your tables a bit more natural. Take a look AT THIS for some tips smile.gif
ZA_PC
(14 items)
 
  
CPUMotherboardGraphicsRAM
E6750 @ 3.4Ghz GA-P35 DS3L PNY 8800GT 512MB 2 x 2GB GSkill @ 1020Mhz 
Hard DriveOptical DriveOSMonitor
2.04TB (2 caviars) Sony dual layer W7/Leopard/Ubuntu 2 x 22" Envision 
KeyboardPowerCaseMouse
Logitech 650W CM Real Power Antec 900 Razer Copperhead 
Audio
Fatal1ty Headset 
  hide details  
Reply
ZA_PC
(14 items)
 
  
CPUMotherboardGraphicsRAM
E6750 @ 3.4Ghz GA-P35 DS3L PNY 8800GT 512MB 2 x 2GB GSkill @ 1020Mhz 
Hard DriveOptical DriveOSMonitor
2.04TB (2 caviars) Sony dual layer W7/Leopard/Ubuntu 2 x 22" Envision 
KeyboardPowerCaseMouse
Logitech 650W CM Real Power Antec 900 Razer Copperhead 
Audio
Fatal1ty Headset 
  hide details  
Reply
post #3 of 13
Thread Starter 
Quote:
Originally Posted by cpt_alex View Post

hi there, it's pretty clear to me that you're fairly new at this. I highly recommend you go on http://w3schools.com/ and go through their HTML and CSS tutorials.
HTML shouldn't really be too much of a concern, with time it will become second nature, you should focus more on your styling. Obviously, seeing your work above, it's pretty clear you haven't had too much experience in web design, but that's ok the best way to get better is practice. Have a look around the net at other gaming/ clan websites and see how other people go about designing these types of websites.
Now regarding some feedback on what you showed us there, I'd go ahead and center everything, that is your content, fix the video players so that they fit in properly and go with a solid background rather than an image. Images tend to be disruptive if not used properly. Also, try making your tables a bit more natural. Take a look AT THIS for some tips smile.gif

I already have w3schools bookmarked. I already said the background image is a placeholder art. once i have the my table finished i was going to work on tweaking placement. After that I'll decide on the actual background. I have decided It wont be one big mess & I now plan to use multiple smaller images instead of one big one, I'll use a nice repeat on the right, a banner & a footer.
Edited by mcochran1998 - 10/18/12 at 3:39am
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
post #4 of 13
w3schools stinks.
My System
(30 items)
 
"Zeus"
(13 items)
 
 
CPUMotherboardGraphicsRAM
Intel Core i5 2500K (4.5ghz @ 1.320v) Gigabyte Z68X-UD3R-B3 MSI R7970 Lightning Corsair 16GB (4x4GB) 
Hard DriveHard DriveHard DriveHard Drive
Plextor PX-256M5S 256GB Crucial M4 128GB Hitachi HDS721010CLA332 Hitachi HDS723020BLA642 
Hard DriveHard DriveHard DriveOptical Drive
Hitachi HDS723020BLA642 Hitachi HUA722010CLA330 WDC WD10EARS-00Z5B1 TSSTcorp CDDVDW SH-S223B 
CoolingCoolingOSMonitor
Phanteks PH-TC14PE with TY-140's Lamptron FCv5 (x2) Windows 7 Ultimate 64-bit Dell U2412M 
MonitorMonitorMonitorKeyboard
Dell U2412M Dell U2212HM Dell U2212HM Ducky DK9087 G2 Pro 
PowerCaseMouseMouse Pad
Corsair AX-750 Corsair Obsidian 650D Microsoft IntelliMouse Optical  XTRAC Ripper XXL 
AudioAudioAudioAudio
Westone W3 IEMs RE-272 IEMs Shure SE-215 IEMs Schiit Bifrost DAC 
AudioAudio
Schiit Asgard 2 amp HiVi Swan M50W 2.1 
CPUMotherboardGraphicsRAM
Intel Core i7 950 GA-X58-UD3R Radeon HD 5450  24GB Corsair @ 1333mhz 
Hard DriveOSPowerCase
4x WD Cavair Red 1TB in RAID 0 Windows Server 2008 R2 x64 Corsair HX-520 LianLi LanCool 
  hide details  
Reply
My System
(30 items)
 
"Zeus"
(13 items)
 
 
CPUMotherboardGraphicsRAM
Intel Core i5 2500K (4.5ghz @ 1.320v) Gigabyte Z68X-UD3R-B3 MSI R7970 Lightning Corsair 16GB (4x4GB) 
Hard DriveHard DriveHard DriveHard Drive
Plextor PX-256M5S 256GB Crucial M4 128GB Hitachi HDS721010CLA332 Hitachi HDS723020BLA642 
Hard DriveHard DriveHard DriveOptical Drive
Hitachi HDS723020BLA642 Hitachi HUA722010CLA330 WDC WD10EARS-00Z5B1 TSSTcorp CDDVDW SH-S223B 
CoolingCoolingOSMonitor
Phanteks PH-TC14PE with TY-140's Lamptron FCv5 (x2) Windows 7 Ultimate 64-bit Dell U2412M 
MonitorMonitorMonitorKeyboard
Dell U2412M Dell U2212HM Dell U2212HM Ducky DK9087 G2 Pro 
PowerCaseMouseMouse Pad
Corsair AX-750 Corsair Obsidian 650D Microsoft IntelliMouse Optical  XTRAC Ripper XXL 
AudioAudioAudioAudio
Westone W3 IEMs RE-272 IEMs Shure SE-215 IEMs Schiit Bifrost DAC 
AudioAudio
Schiit Asgard 2 amp HiVi Swan M50W 2.1 
CPUMotherboardGraphicsRAM
Intel Core i7 950 GA-X58-UD3R Radeon HD 5450  24GB Corsair @ 1333mhz 
Hard DriveOSPowerCase
4x WD Cavair Red 1TB in RAID 0 Windows Server 2008 R2 x64 Corsair HX-520 LianLi LanCool 
  hide details  
Reply
post #5 of 13
Thread Starter 
Quote:
Originally Posted by tompsonn View Post

w3schools stinks.

I have it bookmarked but I'm really just using my "Web Development & Design Foundations with HTML5" book.
edit


already changed some of the layout, I'm porbably going to resize the banner & line up my table with the edge of it. none of the colors are set right now & the repeating image is just a scrap i had laying around to make sure i had my css right.
Edited by mcochran1998 - 10/18/12 at 4:20am
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
post #6 of 13
Quote:
Originally Posted by mcochran1998 View Post

I have it bookmarked but I'm really just using my "Web Development & Design Foundations with HTML5" book.

smile.gif

Check out these, too:
http://webplatform.org/
http://code.google.com/edu/submissions/html-css-javascript/
http://reference.sitepoint.com/
My System
(30 items)
 
"Zeus"
(13 items)
 
 
CPUMotherboardGraphicsRAM
Intel Core i5 2500K (4.5ghz @ 1.320v) Gigabyte Z68X-UD3R-B3 MSI R7970 Lightning Corsair 16GB (4x4GB) 
Hard DriveHard DriveHard DriveHard Drive
Plextor PX-256M5S 256GB Crucial M4 128GB Hitachi HDS721010CLA332 Hitachi HDS723020BLA642 
Hard DriveHard DriveHard DriveOptical Drive
Hitachi HDS723020BLA642 Hitachi HUA722010CLA330 WDC WD10EARS-00Z5B1 TSSTcorp CDDVDW SH-S223B 
CoolingCoolingOSMonitor
Phanteks PH-TC14PE with TY-140's Lamptron FCv5 (x2) Windows 7 Ultimate 64-bit Dell U2412M 
MonitorMonitorMonitorKeyboard
Dell U2412M Dell U2212HM Dell U2212HM Ducky DK9087 G2 Pro 
PowerCaseMouseMouse Pad
Corsair AX-750 Corsair Obsidian 650D Microsoft IntelliMouse Optical  XTRAC Ripper XXL 
AudioAudioAudioAudio
Westone W3 IEMs RE-272 IEMs Shure SE-215 IEMs Schiit Bifrost DAC 
AudioAudio
Schiit Asgard 2 amp HiVi Swan M50W 2.1 
CPUMotherboardGraphicsRAM
Intel Core i7 950 GA-X58-UD3R Radeon HD 5450  24GB Corsair @ 1333mhz 
Hard DriveOSPowerCase
4x WD Cavair Red 1TB in RAID 0 Windows Server 2008 R2 x64 Corsair HX-520 LianLi LanCool 
  hide details  
Reply
My System
(30 items)
 
"Zeus"
(13 items)
 
 
CPUMotherboardGraphicsRAM
Intel Core i5 2500K (4.5ghz @ 1.320v) Gigabyte Z68X-UD3R-B3 MSI R7970 Lightning Corsair 16GB (4x4GB) 
Hard DriveHard DriveHard DriveHard Drive
Plextor PX-256M5S 256GB Crucial M4 128GB Hitachi HDS721010CLA332 Hitachi HDS723020BLA642 
Hard DriveHard DriveHard DriveOptical Drive
Hitachi HDS723020BLA642 Hitachi HUA722010CLA330 WDC WD10EARS-00Z5B1 TSSTcorp CDDVDW SH-S223B 
CoolingCoolingOSMonitor
Phanteks PH-TC14PE with TY-140's Lamptron FCv5 (x2) Windows 7 Ultimate 64-bit Dell U2412M 
MonitorMonitorMonitorKeyboard
Dell U2412M Dell U2212HM Dell U2212HM Ducky DK9087 G2 Pro 
PowerCaseMouseMouse Pad
Corsair AX-750 Corsair Obsidian 650D Microsoft IntelliMouse Optical  XTRAC Ripper XXL 
AudioAudioAudioAudio
Westone W3 IEMs RE-272 IEMs Shure SE-215 IEMs Schiit Bifrost DAC 
AudioAudio
Schiit Asgard 2 amp HiVi Swan M50W 2.1 
CPUMotherboardGraphicsRAM
Intel Core i7 950 GA-X58-UD3R Radeon HD 5450  24GB Corsair @ 1333mhz 
Hard DriveOSPowerCase
4x WD Cavair Red 1TB in RAID 0 Windows Server 2008 R2 x64 Corsair HX-520 LianLi LanCool 
  hide details  
Reply
post #7 of 13
@tompsonn maybe for an advanced programmer/designer, but it's a fairly good place to start if you're a beginner, it's where I started learning html and css and I still use it for reference every now and then. smile.gif So I wouldn't say it stinks
ZA_PC
(14 items)
 
  
CPUMotherboardGraphicsRAM
E6750 @ 3.4Ghz GA-P35 DS3L PNY 8800GT 512MB 2 x 2GB GSkill @ 1020Mhz 
Hard DriveOptical DriveOSMonitor
2.04TB (2 caviars) Sony dual layer W7/Leopard/Ubuntu 2 x 22" Envision 
KeyboardPowerCaseMouse
Logitech 650W CM Real Power Antec 900 Razer Copperhead 
Audio
Fatal1ty Headset 
  hide details  
Reply
ZA_PC
(14 items)
 
  
CPUMotherboardGraphicsRAM
E6750 @ 3.4Ghz GA-P35 DS3L PNY 8800GT 512MB 2 x 2GB GSkill @ 1020Mhz 
Hard DriveOptical DriveOSMonitor
2.04TB (2 caviars) Sony dual layer W7/Leopard/Ubuntu 2 x 22" Envision 
KeyboardPowerCaseMouse
Logitech 650W CM Real Power Antec 900 Razer Copperhead 
Audio
Fatal1ty Headset 
  hide details  
Reply
post #8 of 13
Quote:
Originally Posted by cpt_alex View Post

@tompsonn maybe for an advanced programmer/designer, but it's a fairly good place to start if you're a beginner, it's where I started learning html and css and I still use it for reference every now and then. smile.gif So I wouldn't say it stinks

Its fine for reference... I wouldn't use it to learn, but. smile.gif But hey, to each their own tongue.gif
My System
(30 items)
 
"Zeus"
(13 items)
 
 
CPUMotherboardGraphicsRAM
Intel Core i5 2500K (4.5ghz @ 1.320v) Gigabyte Z68X-UD3R-B3 MSI R7970 Lightning Corsair 16GB (4x4GB) 
Hard DriveHard DriveHard DriveHard Drive
Plextor PX-256M5S 256GB Crucial M4 128GB Hitachi HDS721010CLA332 Hitachi HDS723020BLA642 
Hard DriveHard DriveHard DriveOptical Drive
Hitachi HDS723020BLA642 Hitachi HUA722010CLA330 WDC WD10EARS-00Z5B1 TSSTcorp CDDVDW SH-S223B 
CoolingCoolingOSMonitor
Phanteks PH-TC14PE with TY-140's Lamptron FCv5 (x2) Windows 7 Ultimate 64-bit Dell U2412M 
MonitorMonitorMonitorKeyboard
Dell U2412M Dell U2212HM Dell U2212HM Ducky DK9087 G2 Pro 
PowerCaseMouseMouse Pad
Corsair AX-750 Corsair Obsidian 650D Microsoft IntelliMouse Optical  XTRAC Ripper XXL 
AudioAudioAudioAudio
Westone W3 IEMs RE-272 IEMs Shure SE-215 IEMs Schiit Bifrost DAC 
AudioAudio
Schiit Asgard 2 amp HiVi Swan M50W 2.1 
CPUMotherboardGraphicsRAM
Intel Core i7 950 GA-X58-UD3R Radeon HD 5450  24GB Corsair @ 1333mhz 
Hard DriveOSPowerCase
4x WD Cavair Red 1TB in RAID 0 Windows Server 2008 R2 x64 Corsair HX-520 LianLi LanCool 
  hide details  
Reply
My System
(30 items)
 
"Zeus"
(13 items)
 
 
CPUMotherboardGraphicsRAM
Intel Core i5 2500K (4.5ghz @ 1.320v) Gigabyte Z68X-UD3R-B3 MSI R7970 Lightning Corsair 16GB (4x4GB) 
Hard DriveHard DriveHard DriveHard Drive
Plextor PX-256M5S 256GB Crucial M4 128GB Hitachi HDS721010CLA332 Hitachi HDS723020BLA642 
Hard DriveHard DriveHard DriveOptical Drive
Hitachi HDS723020BLA642 Hitachi HUA722010CLA330 WDC WD10EARS-00Z5B1 TSSTcorp CDDVDW SH-S223B 
CoolingCoolingOSMonitor
Phanteks PH-TC14PE with TY-140's Lamptron FCv5 (x2) Windows 7 Ultimate 64-bit Dell U2412M 
MonitorMonitorMonitorKeyboard
Dell U2412M Dell U2212HM Dell U2212HM Ducky DK9087 G2 Pro 
PowerCaseMouseMouse Pad
Corsair AX-750 Corsair Obsidian 650D Microsoft IntelliMouse Optical  XTRAC Ripper XXL 
AudioAudioAudioAudio
Westone W3 IEMs RE-272 IEMs Shure SE-215 IEMs Schiit Bifrost DAC 
AudioAudio
Schiit Asgard 2 amp HiVi Swan M50W 2.1 
CPUMotherboardGraphicsRAM
Intel Core i7 950 GA-X58-UD3R Radeon HD 5450  24GB Corsair @ 1333mhz 
Hard DriveOSPowerCase
4x WD Cavair Red 1TB in RAID 0 Windows Server 2008 R2 x64 Corsair HX-520 LianLi LanCool 
  hide details  
Reply
post #9 of 13
Thread Starter 


lots of work done.
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
blue devil
(17 items)
 
  
CPUMotherboardGraphicsRAM
AMD ATHLON II X2 265 DUAL CORE ASUS M4N68T-M V2 NVIDIA GEFORCE 630A sapphire raedon 5850 A-DATA GAMING SERIES 2GB DDR3 1600 x2 
Hard DriveHard DriveOptical DriveCooling
500 GB SATA II 3.0 GB 16MB 7200RPM 250 GB  mad dog dvdrw coolmaster hyper 212 
OSMonitorMonitorKeyboard
windows 7 64bit 19" samsung syncmaster 940bw 42" samsung 1080 hd tv Razer Lycosa 
PowerCaseMouseMouse Pad
500WATT SILVER/BLACK AZZA ORION BLUE LED Razer deathadder Razer sphex 
Other
intel x-25 v ssd 40 GB 
  hide details  
Reply
post #10 of 13
I got the following warning from my A/V:
The threat Mal/HTMLGen-A has been found on this website.
New Posts  All Forums:Forum Nav:
  Return Home
  Back to Forum: Web Coding
Overclock.net › Forums › Software, Programming and Coding › Coding and Programming › Web Coding › Looking for feedback on layout