CSS

Discussion in 'Web Development & Web Hosting' started by philbenson, Jan 13, 2006.

  1. philbenson

    philbenson Byte Poster

    208
    1
    20
    I am just starting to find myself around the complex world that is web designing. Clearly CSS is a big thing in this field, and so far I understand that there are both internal (page specific) style sheets, and external (site wide) style sheets.

    Is there an intermediate level which allows you to define a style and then apply that style to specific pages? For example I'm desigining a site about different versions of Windows. I want to apply a different heading style to pages which relate to Windows XP and Windows Server 2003.
     
    Certifications: MCP, MCP+I, MCSE, MCSA, MCTS
    WIP: CCNA(?)
  2. JonnyMX

    JonnyMX Petabyte Poster

    5,257
    220
    236
    Hi Phil.

    There is nothing to stop you having more than one external style sheet and applying it to different pages.
    You can run a script to detect browser and OS, but it starts to get a bit complicated.
    You need to think hard about weather this is an actual requirement of your site or a toy.
    We usually detect just the browser as that's what makes the difference to how you need to display the page.
    You can also create different page templates to accomodate PC based browsing, palm-tops and mobile phones.
     
    Certifications: MCT, MCTS, i-Net+, CIW CI, Prince2, MSP, MCSD
  3. philbenson

    philbenson Byte Poster

    208
    1
    20
    Many thanks. When I mentioned about different versions of Windows, what I mean't was that my site will be about different versions of Windows. For example there will be a section which is about Windows XP, and another section about Windows Server. I'd like to 'theme' the pages within each respective section towards the version of Windows they relate to. Therefore, from what you say, I assume I can create an external style sheet for each section and then link them to the relevant pages.

    I'm also looking quite seriously into Flash as a way to produce some Powerpoint type dynamic effects. So far I've learned for instance that by converting graphics to symbols, you can then create as many copies as you like to the stage without significantly affecting the end file size.

    I am always concious that there is a compromise to be made between making a site informative and functional, but at the same time not going OTT on the cosmetics.
     
    Certifications: MCP, MCP+I, MCSE, MCSA, MCTS
    WIP: CCNA(?)
  4. nugget
    Honorary Member

    nugget Junior toady

    7,796
    71
    224
    Phil, CSS is definately the way to go with your website. It makes it all clean and tidy and has the benefit of being fast too. If you check out my litttle site (in the sig) it's done with CSS completely.

    As to whether to use external (linked) stylesheets or embedded, I think external are better if you have a large amount of styles. AFAIK embedded stylesheets are on every page that you create so will eventually increase the size.
     
    Certifications: A+ | Network+ | Security+ | MCP (270,271,272,290,620) | MCDST | MCTS:Vista
    WIP: MCSA, 70-622,680,685
  5. philbenson

    philbenson Byte Poster

    208
    1
    20
    I agree on the CSS. It makes things so much easier. Also agree on using the external sheets. I have set up one page with styles and then exported these to a separate file. Now of course I can link these to any number of other pages and maintain a consistent theme to each. Also after playing around with Photoshop and Fireworks fro graphics, I have now decided to use soley Photoshop.

    Incidently do you write CSS from scratch or use DW or Frontpage to generate it for you? I tend to to a bit of both - especially while I'm learning.
     
    Certifications: MCP, MCP+I, MCSE, MCSA, MCTS
    WIP: CCNA(?)
  6. JonnyMX

    JonnyMX Petabyte Poster

    5,257
    220
    236
    var OSName="Unknown OS";
    if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
    if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
    if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
    if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";

    document.write('Your OS: '+OSName);


    That will detect the OS version on a machine, but how you use it is a bit of a nightmare. Problem is, as it is JavaScript it will execute on the client and tell them what OS they have but it's no good for your website.
    You may be able to put a hyperlink on which they can click which returns the OS details to the server as a parameter. You could then use postback to refresh the page with the appropriate content.

    Personally, I wouldn't even attempt it.
    I'd put a home page saying 'click the button showing your OS version' to launch a customized page(s) for that user.

    I often tend to let FrontPage or Dreamweaver do my CSS for me, but you're right, you need to know what's going on in order to tweek it.

    Using CSS takes a lot of discipline. I've seen so many sites get cocked up because the designer wants to make something bold. Instead of going all the way to the external style sheet and creating a style for it they just highlight it and click bold. Easy.

    Then the next guy comes along and changes the style sheet and wonders why nothing is happening...
     
    Certifications: MCT, MCTS, i-Net+, CIW CI, Prince2, MSP, MCSD
  7. JonnyMX

    JonnyMX Petabyte Poster

    5,257
    220
    236
    Certifications: MCT, MCTS, i-Net+, CIW CI, Prince2, MSP, MCSD

Share This Page

Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.