My first decent HTML & CSS website template
- Thread starter Korey
- Start date
Magic
Posting Freak
- Oct 11, 2012
- 1,026
- 196
Has potential just some things to think about:
- The background repeats itself which is clunky, try make it adjust to full screen.
- Consider the background, when you add content will it be really hard to see since the background is quite "busy"
- Make the footer sit at the bottom of the page and not up the page, this is just taking up unnecessary space
- Remove the horizontal scroll, make the width 100%
Macemore
Circumcised pineapples
- Aug 26, 2011
- 1,681
- 819
that's because you have a different resolution:
You must be registered for see links
that's what it looks like to the rest of the world
Magic
Posting Freak
- Oct 11, 2012
- 1,026
- 196
The way I have it on my website is like following:
Which has a CSS class of fullBgImg
Code:
<img src="img/main_1.jpg" width="1920px" height="1200px" class="fullBgImg">
Code:
.fullBgImg {
z-index: 1;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: auto%;
background-image: no repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
Sysode
Front-End Developer
- Dec 11, 2012
- 1,673
- 848
I take it you've solved the background issue?
Anyway, neat idea of a splash page for your portfolio. However I think it could be improved by maybe...
- using a background that doesn't have copyright info on it, it just looks a bit unprofessional
- center the buttons to the page, for example at the moment I have a left margin (from the buttons) of about 470px and a right margin of 580px so it doesn't really feel like it's flowing..
- Avoid using the "<body background="">" attribute as it's not supported by HTML5 and best practice to set backgrounds using CSS
- Add a custom font via CSS, not inline. At the moment your buttons are default font whilst your footer is inline set to Verdana.
Here's a couple tips on improving the points I made:
centering the buttons: Best way to do would be to set a parent element and give that parent element text-align:center; in css so that it centers everything inside of it.
Alternative to body background: As I said this attribute is not the best way to do. Try setting the background in CSS on the body/html selector. Here's a
You must be registered for see links
.Adding custom fonts: There are many ways to do this, best bets for someone starting out would be to use machine fonts (such as Arial, Verdana and so on) as these are supported by default.
Anyway, best of luck man, making some good progress - keep at it and keep us updated on how you improve this site. Sorry if what I say seems like a lot, it's not, it's just broken down in to detailed bits of info to try and help.
