Leon79

Hey guys!

I am looking at building my website. It's for my portfolio of film and radio productions I have helped/made in my life.
 
My idea is to have it one single page where the background moves along when you scroll and changes when you move into a different section. Have text/videos/photos pop out in each section.

Basically like these two.

http://www.jacoblewisroberts.com/
http://jackdavidevans.com/
 
Hopefully I'm clear by what I mean.
 
Both of these were made in Dreamweaver which I own and my host is iPage. I believe it's simple as, create the website in DW, save the file and upload it to the FTP. Yep?

What I am looking for is help. Templates, tut videos etc etc. I rather learn this myself so I know for later on the line if I need to update it.

Many thanks!

Link or code would be helpful.

Try putting the code for the floated image at the place in the text that you want it to start floating.

<p> Morbi quis dolor vel nisl interdum blandit vita. Morbi quis dolor vel nisl interdum blandit vitae a dolor. Phasellus mattis egestas urna, quis accumsan libero tempus ac. Nunc tempor tellus pellentesque augue sodales faucibus. Suspendisse euismod mi nec eros suscipit sagittis. Ut ac ante ac tortor viverra lacinia. Duis libero augue, euismod a fringilla vitae, commodo et eros. Aliquam pretium turpis consectetur leo placerat eget hendrerit elit blandit. <div id="leonphoto" class="image"> <img id="picleon" src="file://localhost/Users/leonfassbender/Documents/Graphic%20Design/Projects/leonfassbender.com/Images/leon2.gif" alt="leon2" width="100" height="100" /> </div><!-- /leonphoto --> Vivamus ultricies risus a nibh ornare ut lobortis elit condimentum. My name is Leon Fassbender, I'm a Web Designer and Perch CMS Specialist. Morbi quis dolor vel nisl interdum blandit vitae a dolor. </p> <!-- /paragraph --> </div>
 
Note, the text above isn't the same as the text in your desired effect so I can't show you exactly where to put the image code, but in your desired effect it might be just before quisque rutrum. Since text varies a little between browsers you may find it looks slightly different in other browsers.

As mentioned, you need to put the image towards the bottom of the content, if that is where you want it to appear.
 

<style type="text/css"> p img { float: left; margin: 0px 10px 0px 0px; } </style> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc molestie sapien eu magna lobortis elementum. Ut adipiscing felis ac risus commodo eu elementum purus porttitor. In in odio odio. Suspendisse potenti. Nam a suscipit erat. Duis pulvinar rutrum dolor, non fermentum velit consequat vitae. Nullam tristique ipsum vitae odio bibendum non euismod odio bibendum. Duis venenatis hendrerit velit eu fermentum. Integer suscipit mauris ut odio posuere sit amet sodales enim consectetur. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc molestie sapien eu magna lobortis elementum. Ut adipiscing felis ac risus commodo eu elementum purus porttitor. In in odio odio. <img src="" width="100" height="100" /> Suspendisse potenti. Nam a suscipit erat. Duis pulvinar rutrum dolor, non fermentum velit consequat vitae. Nullam tristique ipsum vitae odio bibendum non euismod odio bibendum. Duis venenatis hendrerit velit eu fermentum. Integer suscipit mauris ut odio posuere sit amet sodales enim consectetur. </p>
 
The rest is pretty simple, float the image left and give a bit of margin so that the text doesn't touch.
 
You shouldn't have any cross browser issues if the text and images are contained in a div, avoid absolute positioning and just stick with floats.
 
This isn't exactly your desired affect but it hopefully helps.

Glad to be of help.

No worries.

I would suggest putting a css reset in there before you go any further

can we see the whole code

Yea I suppose you are right! Just a pain in the ass when you work your ass off to gain one client and they seem to get them dead easy!

Hi Leon,
 
I would much agree with SniderDK, something need not be considered too difficult simply because it prepares a user for the future, such that functions and options are there when ever needed in the future.
 
I'm forever recommending Magento, so I'd be reluctant to change now, the reason simply is that it is the Wordpress of shopping carts, simple, clean but functional and easy to expand on. Templates on the other hand aren't as strait forward however with a year and a realistic budget even purchasing something off the shelf to tinker, modify or learn from wouldn't hurt.
 
As for teaching the client to using the cart or perhaps understanding it, we have helped computer illiterate builders and carpenters to run successful magneto shores with little hassle and there is plenty of help and documentation available.
 
Price being your last issue, personally I would ether use an hourly rate or fixed price, due to the nature of the client (friend) the latter would be the cost effective approach (for the client) however does not cover your time required to learn the respective material.
 
Thus my advice would simply fall on research, create a magento store and delve deeper into the code and setup, make a mock up or simply modify the theme and identify the layouts.. then estimate the time required to create a full design. Based on this make the judgement whether you are confident to meet the time requirements of a fixed price or if not is the client comfortable to pay you for your time (hourly rate).
 
As for the amount, browse off the shelve unique prices prehaps?

Hiya,
 
its a common client misconception that not using a decent cart system will make an easier site... thats crap, if your friend is interested in actually making money online with growth he will be intrested in using a simple web system to manage it.... even magneto is not rocket science... if they can use facebook theres no reason they cant use a cart system.
 
since you have a long ETA for the project completion i would suggest following @owltd on twitter as we have a service in private beta right now that would be perfect...
 
as for price it really depends on the design, if you make a highly converting design the benefits will pay off sooner... maybe a small monthly to cover on going costs with a sales commission.
 
if you get stuck along the way feel free to PM me, i get a email instantly letting me know ive got one. for your info i run the technical & marketing aspect of around 20 shops running my custom made e-commerce software package, and quite often work as a consultant for other developers breaking into e-commerce for the first time... sometimes out of the kindness of my heart because i enjoy watching people grow
 
hope i don't sound pompous just trying to help

Great Review, very precise and well placed. Many thanks and totally take your point obout slide show, we are already working on it, just have not implemented yet as CSS for IE9 was not showing it properly but once fixed then would be reverting back to slide show.

It's not a bad design at all but I would try to give the elements some more space to breath. Why not make a slideshow of the services you offer instead of cranking them one beside the other in a relatively small space? Creating a slideshow would make visually cleaner and more interesting. Also it would communicate your message better IMO.
 
All the other elements are placed quite well I would say. In general, give the whole page a bit more white space and room to breath. As for the background; seems you are repeating the same image with the plane three times. To me it's a bit distracting but that's personal. Try to replace the background with a solid color and some nice gradient, it may put the focus back to your message and not to your background.
 
Overall, well done this is a potentially great site if you fine tune it a bit more. Good luck with that. Cheers!

You can try tomatocart or opencart or u can simply add paypal buy now button below each product

That isn't bad at all....actually a pretty good/ clean design. Like with most things in life practice makes perfect so wish you good luck with further fine tuning that site.
 
Where many people talk, you have taken the time and effort to actually put your knowledge in practice which, according to me, is the best way to learn.
 
It's not a question of winning awards or not, it's a question of learning and knowing what you're doing and why you're doing it.....
 
I'm in the same boat as you :-)....also a beginner, working on a site and the people on this forum have been a tremendous help so far.
 
Really good to see there's good honest people out there who are willing to help.
 
Good luck with your further development, you'll get there....

Hi Stuart,
 
Just had a look through your website, it's a really nice idea - a way of documenting your progress through your web design journey.
 
My feed back would be something like this:
 
Positive
- Site over all is easy to understand, navigating to the sections I was interested in was simple from the outset.
- You have a site search feature which I think is a very useful tool for a site of this type.
- All your text is readable and it's clear to me what service you are offering the reader.
- Other pages seem good as they follow the same structure.
 
Negative
- First negative would probably be on the portfolio bits of the website, I would like to see more of your work, if there is any of course.
- It's always good to have a link next to your piece of artwork linking through to the live site, so maybe you can include this?
- Maybe try and inject a bit more creativity into the images maybe have your portfolio screenshots the width of the #content section... maybe with a height of 100px and a nice short description with the link below it?
 
 
This is a good site one of the better ones I've seen on here, so just keep trying to push your skills and better yourself with every attempt.
 
Hope this helped. Looking forward to hearing your thoughts.

and what's the XML line all about? :S

and if it doesn't can you post your css file in code tags?

yeah, worth a try, can't see what it's used for and maybe screwing things up

Your site looks very clean and to the point. Navigation and usability are very good. What I would try is making it look a bit more creative/ artistic. Overall I like it very much. Well done!