SitePoint Sponsor

User Tag List

Results 1 to 5 of 5

Thread: Html & CSS?

  1. #1
    SitePoint Member
    Join Date
    Oct 2009
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Html & CSS?

    I'm kinda confused...I'm trying to create my website with CSS but I don't know where to even begin...I've been reading sitepoint's Build Your Own Website book...but I can't figure out how to apply it to my page.

    Let me explain what I'm trying to do...

    First of all I created everything in Photoshop.

    The page is pretty simple...it has the same background for every page including the main page so I saved that as one .gif file.

    I have an image based navigation that I was told would be easier to put in the CSS document...so I sliced out each "button" of the navigation in photoshop.

    Each "page" is really just a .gif image that is going to be overlaid on the background because I embedded the text into the image since it's not a common font. So really it's just background & navigation in CSS, & images for each "page" in html.

    I know basic coding but CSS is getting to me...idk how to write this up, and idk how to make the separate pages & connect them all....can anyone offer me some advice?

  2. #2
    Team ********* Louis Simoneau's Avatar
    Join Date
    Sep 2009
    Location
    Melbourne, Australia
    Posts
    228
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    If I understand you correctly, the only thing I can say is: "don't do that!"

    Putting all your site's content into images will make it impossible for search engines to see it, impossible for anyone to see it if they're using assistive technologies like screen readers, incredibly difficult to maintain (as you'll need to update the image every time you want to change something), and slower to load.

    If you've already got Ian's book, I'd recommend working all the way through it to really understand how to use CSS for background images and navigation, and then applying that to your site. As well, you'll learn how to mark up HTML pages and link them together.

    Regarding the font: this is a limitation of web design, at least for the moment. We can use fancy fonts for navigation elements by including them in images and using alt or title text for accessibility, but main body text should be assigned fonts using the CSS font-family property, which means that they'll likely be constrained to 10 or 12 common fonts. That being said, those fonts are very clear and legible, so that's probably a good thing for your site even if it's not what you'd like.
    Last edited by Louis Simoneau; Oct 11, 2009 at 22:56.

  3. #3
    SitePoint Wizard
    Join Date
    Jul 2003
    Location
    Kent
    Posts
    1,921
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    If you do it your way, you're creating pictures, not web pages.

  4. #4
    SitePoint Member
    Join Date
    Oct 2009
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is how I was told to put it together....mind you this isn't actually going to be posted to the web...its for a class. I don't know how else to do it at this point.

  5. #5
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Agreed, while you can make images using Photoshop it's no replacement for learning to code properly, the junk it exports is hideous!

    Golitely, the book explains how to apply CSS, go to the "Adding some style" page and it shows you how to embed CSS into your HTML in-line and how you can declare an external Stylesheet so that you can drop code into the document. If you can't read the book then you probably won't find our advice much help as it's going to be on the same kind of level. I would advise you re-read that section of the book (or at least tell us what part you are finding hard to understand - not everything!).


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •