A query about Absolute Positioning

[Curtis Thompson]

hello…

a few responses/thoughts:

1. you get what you pay for wrt free hosting. you can get reliable hosting with a ton of great features for under $5/month – i know money is money, but you will be much better off in the long run. that’s just my $.02 though.

2. took a copy of your page local and messed with it. first thing – avoid image and css file names with spaces in them – it just makes creates potential issues. always best to use underscores instead of spaces in web file names.

3. wrt the margins – only very very rarely should you need to use negative margins. if you are using them, you are likely compensating for something, as you were here. better to find the culprit. in this case, your #topnav ul had a margin of “20px 0”, which means it had a margin of 20px on the top and bottom. if you just make that margin “0”, then you are set and that space disappears. as for the other gap beneath, just set your #banner css to have a width of “100%” (not needed for the fix, but while there it’s good) and then a height of the image that is in it, which is “300px” – then that other gap should go away.

sitruc

[Simon Matthews]

Hi,

Thanks so much for all your help!

I’ve cleaned up the margins now using the fixes you suggested. This reminds me very much of when I started to learn machine code and I couldn’t work out why my programmes weren’t working – there was always a logical reason, and you spotted the reasons why the margins weren’t working in my web page very well! This has been a great lesson for me and I will definitely take a lot from it and be more careful with my coding in future.

Well I joined 000webhosting.com, only to find out that Facebook won’t accept links to their site because they are regarded as spammers, so I joined Biz.nf, which was at the top spot on a top ten list I found. I think I’ll use this service whilst I’m building a website and then when it’s more complete I will definitely take your advice and upgrade to a more professional service.

Here is a link to the page on Biz.nf:

https://triangledesignmedia.co.nf/#

When it’s finished I’m hoping to have the picture in the middle fading to other images like a slideshow, and I think I’ll produce a demo reel of my work for the video at the bottom right of the page.

Thanks so much again for all your help, it’s been a real pleasure and I look forward to learning much more yet!

Simon.

[Curtis Thompson]

hello…

ya – if somebody is giving away hosting they are making their money somehow – and your domain could be flagged because of it. don’t point your domain at any of these free sites; rather just use them for development and keep the domain separate. you don’t want your domain to be flagged anywhere as bad, because that is just about impossible to undo…

keep us posted – site looks nice!

sitruc

[Simon Matthews]

Thanks man, will do. I haven’t bought a domain name yet, using their free subdomain name for the time being.

Will keep you posted!

[Simon Matthews]

Hi,

Just thought I’d bring you up-to-date on the website I was working on for practice. I’ve got all the links working now, with each link taking you to pages containing various examples of my work. I’ve just embedded my YouTube videos for now, but when I learn more I may use custom videos. The banner on the homepage cross fades between a selection of different images that I produced. I didn’t write the code for that myself. I’ll add bits to the site as I go. The contact page doesn’t include a form because I don’t have a proper domain name yet, and apparently you need a proper domain name to use forms.

Here’s a link to the site, which is made using the non-absolute positioning methods that you instructed me on earlier:

https://triangledesignmedia.co.nf/matte-painting.html

Simon.

[Simon Matthews]

Hi, just to let you know I mistakenly sent you a link to the Matte Painting page of my site, but clicking on home will take you to the home page 🙂

Here’s a link to the homepage anyhoo:

https://triangledesignmedia.co.nf/index.html

Simon.

[Curtis Thompson]

hello…

nice! a warning though – you have 12 images that average around 300kb or so (it seems) for that top art block – that’s 3.6mb of data your page has to load. a good web page should be around 100kb – 200kb total, so you might want to consider making those jpgs and compressing them a bit. note also that most people won’t spend anywhere enough time on your home page to see all 12 anyway, so you could easily pick 3-4 and put the rest in a clickable gallery somewhere…

sitruc

[Simon Matthews]

Hi,

Thanks for the advice, will consider that in future. Was wondering what problems my images can cause? The home page seems to load quickly on my computer, much quicker than some other sites I’ve visited. Takes under a second to load. The other pages take longer to load though, especially the Motion Graphics page, because of all the video links.

Simon.

[Curtis Thompson]

hello…

well – when it loaded for me there was unpleasant layering of images as they somewhat filled in/loaded. the problem is that you are at about 15 times what is considered a good size for people to have to download. if i tried to visit your site on a mobile network, it would take several minutes to load all those images, for example.

also trust me – people will maybe stay on the home page for 5-10 seconds…so you are loading several images that they just won’t see there – why load that content for nothing? think about creating a gallery where the person can see your work and they know what they are getting into ahead of time.

sitruc

[Simon Matthews]

Hi,

Ok, cool, thanks for the tips. Was shocked to find how much larger than average my page was! Will shrink those images down a bit and choose just a few for the homepage instead of 12. I’ll probably end up designing another site from scratch anyway, it was only intended to be for practice, but might as well keep it available as being as it’s done!

Thanks again for the tips and for your time!

Simon.