Jul
5
2012

Web Design Tutorial – CSS Backgrounds

Nick and James form Creare demonstrate the basics of implementing backgrounds in CSS for you website. The tutorial covers standard colour, tiling a graphic, applying gradiants and fixed graphic backgrounds. Check out the supporting blog post at www.crearedesign.co.uk

In this week’s web design video blog from Creare, James talks the basics in making pop-up or drop-down menus in Adobe Fireworks CS4. Check out the supporting blog at www.crearedesign.co.uk

48 Comments+ Add Comment

  • The tutoriel is nice but can you make a video on how i can design like that navigation in photoshop!

  • how do i make a state in cs3?

  • What font did you use for that navigation bar! and settings!

  • can you make a tutorial on how can i create a navigation bar on fireworks!

  • States are called ‘Frames’ in CS3.

  • Hypatia Sans Pro. The typeface was a selected free gift that came with Adobe CS3. (Bold & Uppercase).

  • I may possibly do a follow-up tutorial this week. Keep an eye on the Channel on Friday.

  • Thanks i will keep eye!

  • thanks

  • You see the done is the problem im having. It just seems to do piss all when i have a really good looking sub menu and don’t add it after.

    My whole year in uni depends on using this bullshit piece of software that they aint told us jack shit about how to use. The worst part is that im not even doing a course that don’t even relate in one way to websites.

  • I did all of this, the behaviour is mouse over, and I can see its all green. and the blue pop up menu frame, but when I preview it on safari, nothing happens when my mouse goes over it….

  • Thank you, you should accept donations. I feel i should have paid for that.

  • Thanks RepowerWall, if you’re ever in Lutterworth UK, you can always come and buy us a drink! James.

  • Thank you so much! this video was so helpful!

  • Thank you for tutorial, this is owesome!!!!

  • Nice!!!… very goods TIPs!!… realy Thanks!

  • Good tutorial… I just think its alot easier to do each individual button as a button in the first place… The you don’t have to slice it. Buy good tutorial.

    How does one get those lines that split the buttions small only splitting about half way down? I can only get ones that go all the way down, by adding an outline to my rectangle button shape…

    Thanks!

  • nice, shor and precise tutorial!!
    thanks

  • nice and clear thanks

  • are u using mac?
    can i use this in windows?

  • Great Tutorial – thanks for sharing
    The popup menu effect can be seen if you select preview F12 in fireworks. This will open your browser where you can see the menu rollovers and drop down.

  • check out my web design

    good or bad?

  • Thanks for the great video!  If you need help installing, configuring, or setting up zen cart, check out our channel for lots of Easy Help Zen Cart Tutorials:

  • Thank you very much

  • Anyone here knows what is the best web design right now???

  • the best design is always the one that is most user-friendly for the targeted user group and doesnt interfer with the information… in general a good rule to me is always “less-is-more”

  • Thanks for the discussion.Really gained a lot of knowledge from it.

  • thats what i’m trying to do. have a background image fixed in the same position even as you would scroll down but for some reason it doesn’t stay in place. Ive tried switching the setting to background-attachment:scroll but it still does the same thing.

  • Very kind Latino Lady for marriage **rockmycity.info**

  • latino wives waiting **rockmycity.info**

  • If you want to see some REALLY awesome web design stuff,||Want to see some seriously cool web design stuff?} look at ww w. interkiwi web developers . c om. Some pretty cool stuff there}.

  • what type of software are you useing??

  • Thanks guy!!!!

  • Very helpful videos. Could you put up a video of an image wrapping behind the container like the “menu dropdown” in cnet.com. thanks.

  • Very helpful videos. Could you put up a video of an image wrapping behind the container like the “menu dropdown” in cnet.com. thanks.

  • Thanks for the great video! If you need help installing, configuring, or setting up zen cart, check out our channel for lots of Easy Help Zen Cart Tutorials:

  • Thanks for the good tips 🙂

    Изработка и поддръжка на уеб сайт от New Soft Com

  • get assistance from Professional web design and SEO call the folks at White Hope Productions, you can call them at 1.877.312.7575

  • Thank for this video James & Nick, is very well explained

  • Thanks for the great tips. I like how you keep it very basic and less complicated.

  • I am always finding a perfect web designing video tutorial for my company, this tutorial help me a lot, thanks a lot James and Nick 🙂

  • This tutorial makes it seem very easy…great job guys.

  • If your website has alot of pages on it will it make it run slower?

  • sosoo.info

  • so good

  • It is very informational! Thank you so much for these works
    I really aprreciated it.

  • Hello @crearegroup ,
    Can you explain why do you use *.gif files ? I dont understand that, because GIF has only 256 colors….. Isn’t *.png better ?

  • Design a Website in best price
    Skype : mamata.khanore
    Gtalk: zosterwebsolutions@gmail.com
    email : contact@zoster.comlu.com