3 Quick(?!?) Questions

Discussion in 'HTML' started by Dr. Compynei, Mar 13, 2007.

  1. Dr. Compynei

    Dr. Compynei Guest

    Hi All,

    I'm knew around here so please excuse me, however I'm stuck with a few
    things.

    As part of my degree I am studying Web Development, and now I better
    understand websites I am designing up the website of a charity (local
    theatre) in CSS and XHTML 1.0 Trans.

    Moving away from tables due to accessability problems etc etc. Can anyone
    help me out with the following:

    http://www.blt.org.uk/css/index.htm

    1. Image Mapping. How is best to map the image to turn graphics into
    hyperlinks. Splitting the image maybe?

    2. Scrolling. This is my main problem at the moment. When the page gets
    longer the content div just keeps going down the page, what I want is for
    the site to be x% sizes of the screen (leaving some red border) no matter
    what the resolution (upto a min of 800x600).
    I want the content layer to scroll, not the whole page. I'm not sure I've
    explained clear there actually.
    - Page to be displayed without main scrolling bar
    - Container division (the whole white area) to be x% size - lets say 80%
    - Content layer to scroll down if the content becomes too much

    3. Margins. Defining CSS margins sends the layout funny. I would like to
    indent the text, and poster image so that they are not so close to the edge.

    Many thanks for your help!

    Neil
     
    Dr. Compynei, Mar 13, 2007
    #1
    1. Advertising

  2. Dr. Compynei

    dorayme Guest

    In article <et4tf4$r77$>,
    "Dr. Compynei" <compynei*isnt*@ntlworld.com> wrote:

    > I'm knew around here so please excuse me, however I'm stuck with a few
    > things.


    What did you do when you came in, knock the vase over or
    something?

    > As part of my degree I am studying Web Development, and now I better
    > understand websites I am designing up the website of a charity (local
    > theatre) in CSS and XHTML 1.0 Trans.
    >


    You are unlikely to be needing XHTML then, stick to 4.01 Strict
    for a while

    > Moving away from tables due to accessability problems etc etc. Can anyone
    > help me out with the following:
    >
    > http://www.blt.org.uk/css/index.htm
    >
    > 1. Image Mapping. How is best to map the image to turn graphics into
    > hyperlinks. Splitting the image maybe?
    >


    You can image map, meaning you define areas of one image (no
    "splitting") by coordinates and link to the areas. You can google
    up and have a go first on this.

    But don't bother in your case, the nav div is best to be a simple
    inline list. An image is bad for this purpose, at least for the
    good reason that it does not scale.

    Look at:

    <http://alistapart.com/articles/taminglists/>

    > 2. Scrolling. This is my main problem at the moment. When the page gets
    > longer the content div just keeps going down the page, what I want is for
    > the site to be x% sizes of the screen (leaving some red border) no matter
    > what the resolution (upto a min of 800x600).


    You will buy yourself more problems and trouble achieving this.
    Let it scroll and keep it simple.

    > 3. Margins. Defining CSS margins sends the layout funny. I would like to
    > indent the text, and poster image so that they are not so close to the edge.
    >


    How do other sites that you admire do this? Have you looked? If
    you want a canvas area then one way to do it is very simple, you
    wrap all your code under the body in a wrapper div and set the
    margin for this wrapper in px or in em. Try it and see what you
    like. It is not a bad look done with modest numbers for some
    sites. Take a look at the css instruction of "margin" and set for
    all sides as you like, eg:

    #wrapper {margin:5px 20px 5px 20px;}

    This gets top, right, bottom and left respectively.

    As for grace with text within the wrapper and other boxes, apply
    a modest bit of padding, best in em.

    --
    dorayme
     
    dorayme, Mar 13, 2007
    #2
    1. Advertising

  3. Dr. Compynei

    Chaddy2222 Guest

    "Dr. Compynei" <compynei*isnt*@ntlworld.com> wrote in message
    news:et4tf4$r77$...
    > Hi All,
    >
    > I'm knew around here so please excuse me, however I'm stuck with a few
    > things.
    >
    > As part of my degree I am studying Web Development, and now I better
    > understand websites I am designing up the website of a charity (local
    > theatre) in CSS and XHTML 1.0 Trans.
    >

    Why?
    You should use Strict as it's a new project.

    > Moving away from tables due to accessability problems etc etc. Can anyone
    > help me out with the following:
    >
    > http://www.blt.org.uk/css/index.htm
    >

    For a start, you should end all file names with .html as Unix / Linux
    servers are case sensitive.

    > 1. Image Mapping. How is best to map the image to turn graphics into
    > hyperlinks. Splitting the image maybe?
    >


    Ug, use text links and style them with CSS.

    > 2. Scrolling. This is my main problem at the moment. >When the page
    > gets longer the content div just keeps going down the page, >what I want
    > is for the site to be x% sizes of the screen (leaving some red >border) no
    > matter what the resolution (upto a min of 800x600).
    > I want the content layer to scroll, not the whole page. >I'm not sure I've
    > explained clear there actually.
    > - Page to be displayed without main scrolling bar
    > - Container division (the whole white area) to be x% >size - lets say 80%
    > - Content layer to scroll down if the content becomes too much
    >
    > 3. Margins. Defining CSS margins sends the layout >funny. I would like
    > to indent the text, and poster image so that they are not so >close to the
    > edge.
    >
    > Many thanks for your help!
    >
    > Neil
    >

    You could start by using % or me units for all elements, including
    font-size, PT is for printing.
    Then just remove the width of everything and make the container div how ever
    big you want it. Then just add margins and padding where necessary.

    --
    Regards Chad.
    http://freewebdesign.cjb.cc
     
    Chaddy2222, Mar 13, 2007
    #3
  4. On Tue, 13 Mar 2007 06:31:41 GMT, "Chaddy2222" <> wrote:

    > > http://www.blt.org.uk/css/index.htm
    > >

    > For a start, you should end all file names with .html as Unix / Linux
    > servers are case sensitive.


    Yes, I can certainly see the logic here.

    --
    Steven
     
    Steven Saunderson, Mar 13, 2007
    #4
  5. Chaddy2222 wrote:

    > For a start, you should end all file names with .html as Unix / Linux
    > servers are case sensitive.


    Huh? That's a non-sequitur.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Geek of ~ HTML/SQL/Perl/PHP/Python*/Apache/Linux

    * = I'm getting there!
     
    Toby A Inkster, Mar 13, 2007
    #5
  6. Dr. Compynei

    Dr. Compynei Guest

    "Bergamot" wrote:
    > Dr. Compynei wrote:
    >>
    >> As part of my degree I am studying Web Development, and now I better
    >> understand websites I am designing up the website of a charity (local
    >> theatre) in CSS and XHTML 1.0 Trans.

    >
    > Were you instructed to use XHTML Transitional? If so, your instructor is
    > incompetent.


    Yes I was! Not for this specific project, but for a similar website, just
    different content.
    The instructor is a leading figure on sitepoint I believe.

    >
    >> Moving away from tables due to accessability problems etc etc.
    >>
    >> http://www.blt.org.uk/css/index.htm
    >>
    >> 1. Image Mapping. How is best to map the image to turn graphics into
    >> hyperlinks.

    >
    > As someone else mentioned, the most accessible method would be plain
    > text links styled with CSS. Using list mark up for navigation menus has
    > become the accepted norm.
    > http://css.maxdesign.com.au/listamatic/
    >
    > You can embellish with background graphics to get pretty much the same
    > effect as the site has now and still be scalable with varying window and
    > text sizes, but that is a bit advanced for a newbie. Keep it simple and
    > you'll get better results.


    Thanks for that, I will work with it.

    >
    >> 2. Scrolling. This is my main problem at the moment. When the page
    >> gets
    >> longer the content div just keeps going down the page, what I want is for
    >> the site to be x% sizes of the screen (leaving some red border) no matter
    >> what the resolution (upto a min of 800x600).

    >
    > Stop wanting this. If you're dropping layout tables for accessibility
    > reasons, putting in a scrolling div would be substituting one
    > accessibility problem with another, perhaps worse one. Scrolling divs
    > are a navigation nightmare for keyboard users. They are cumbersome at
    > best, unusable at worse.


    That clears alot up. Many thanks for this.

    > Were you instructed to use a scrolling div, too? :-(


    No ;-). Just a thought.
     
    Dr. Compynei, Mar 13, 2007
    #6
  7. Dr. Compynei

    Dr. Compynei Guest

    "Chaddy2222" <> wrote in message news:45f6454a$1@wasat...
    >
    >
    >
    > "Dr. Compynei" <compynei*isnt*@ntlworld.com> wrote in message
    > news:et4tf4$r77$...
    >> Hi All,
    >>
    >> I'm knew around here so please excuse me, however I'm stuck with a few
    >> things.
    >>
    >> As part of my degree I am studying Web Development, and now I better
    >> understand websites I am designing up the website of a charity (local
    >> theatre) in CSS and XHTML 1.0 Trans.
    >>

    > Why?
    > You should use Strict as it's a new project.


    We were instructed to use transitional. But I shall move away from this :)

    >
    >> Moving away from tables due to accessability problems etc etc. Can anyone
    >> help me out with the following:
    >>
    >> http://www.blt.org.uk/css/index.htm
    >>

    > For a start, you should end all file names with .html as Unix / Linux
    > servers are case sensitive.
    >
    >> 1. Image Mapping. How is best to map the image to turn graphics into
    >> hyperlinks. Splitting the image maybe?
    >>

    >
    > Ug, use text links and style them with CSS.
    >
    >> 2. Scrolling. This is my main problem at the moment. >When the page
    >> gets longer the content div just keeps going down the page, >what I want
    >> is for the site to be x% sizes of the screen (leaving some red >border)
    >> no matter what the resolution (upto a min of 800x600).
    >> I want the content layer to scroll, not the whole page. >I'm not sure
    >> I've explained clear there actually.
    >> - Page to be displayed without main scrolling bar
    >> - Container division (the whole white area) to be x% >size - lets say 80%
    >> - Content layer to scroll down if the content becomes too much
    >>
    >> 3. Margins. Defining CSS margins sends the layout >funny. I would like
    >> to indent the text, and poster image so that they are not so >close to
    >> the edge.
    >>
    >> Many thanks for your help!
    >>
    >> Neil
    >>


    > You could start by using % or me units for all elements, including
    > font-size, PT is for printing.
    > Then just remove the width of everything and make the container div how
    > ever big you want it. Then just add margins and padding where necessary.


    Thanks for the info, I'll keep playing!
     
    Dr. Compynei, Mar 13, 2007
    #7
  8. Dr. Compynei

    Dr. Compynei Guest

    "dorayme" <> wrote in message
    news:...
    > In article <et4tf4$r77$>,
    > "Dr. Compynei" <compynei*isnt*@ntlworld.com> wrote:
    >
    >> I'm knew around here so please excuse me, however I'm stuck with a few
    >> things.

    >
    > What did you do when you came in, knock the vase over or
    > something?


    It was more of, an excuse me as I'm not exactly sure how this group works.

    >
    >> As part of my degree I am studying Web Development, and now I better
    >> understand websites I am designing up the website of a charity (local
    >> theatre) in CSS and XHTML 1.0 Trans.
    >>

    >
    > You are unlikely to be needing XHTML then, stick to 4.01 Strict
    > for a while


    Being taught int XHTML so it seems sensible to move that way.

    >
    >> Moving away from tables due to accessability problems etc etc. Can anyone
    >> help me out with the following:
    >>
    >> http://www.blt.org.uk/css/index.htm
    >>
    >> 1. Image Mapping. How is best to map the image to turn graphics into
    >> hyperlinks. Splitting the image maybe?
    >>

    >
    > You can image map, meaning you define areas of one image (no
    > "splitting") by coordinates and link to the areas. You can google
    > up and have a go first on this.


    Yes, I've done this before, but I was wondering how was best to do it within
    this project.

    > But don't bother in your case, the nav div is best to be a simple
    > inline list. An image is bad for this purpose, at least for the
    > good reason that it does not scale.
    >
    > Look at:
    >
    > <http://alistapart.com/articles/taminglists/>


    And theres the answer. Thanks, I'll read up.

    >> 2. Scrolling. This is my main problem at the moment. When the page
    >> gets
    >> longer the content div just keeps going down the page, what I want is for
    >> the site to be x% sizes of the screen (leaving some red border) no matter
    >> what the resolution (upto a min of 800x600).

    >
    > You will buy yourself more problems and trouble achieving this.
    > Let it scroll and keep it simple.


    Will do :)

    >> 3. Margins. Defining CSS margins sends the layout funny. I would like
    >> to
    >> indent the text, and poster image so that they are not so close to the
    >> edge.
    >>

    >
    > How do other sites that you admire do this? Have you looked? If
    > you want a canvas area then one way to do it is very simple, you
    > wrap all your code under the body in a wrapper div and set the
    > margin for this wrapper in px or in em. Try it and see what you
    > like. It is not a bad look done with modest numbers for some
    > sites. Take a look at the css instruction of "margin" and set for
    > all sides as you like, eg:
    >
    > #wrapper {margin:5px 20px 5px 20px;}
    >
    > This gets top, right, bottom and left respectively.
    >
    > As for grace with text within the wrapper and other boxes, apply
    > a modest bit of padding, best in em.


    Thanks for your help, even if you do seem a little stressed by point 3.
    Perhaps I could buy your a beer <g>
     
    Dr. Compynei, Mar 13, 2007
    #8
  9. Dr. Compynei

    Chaddy2222 Guest

    Toby A Inkster wrote:
    > Chaddy2222 wrote:
    >
    > > For a start, you should end all file names with .html as Unix / Linux
    > > servers are case sensitive.

    >
    > Huh? That's a non-sequitur.
    >

    Ahh, yes I see what you mean. I think what I was talking about was not
    useing capitals in file names but that is another issue. But most
    Linux servers are set-up to recognise the .html extension by default
    are that not? I was always under the impression that they were and
    that if that extension for the index page did not exist that they
    would then look for a .htm extension. I personally now just use re-
    directs through .htaccess so don't need to concern myself with this
    stuff as much (although I do to an extent.
    --
    Regards Chad. http://freewebdesign.cjb.cc
     
    Chaddy2222, Mar 13, 2007
    #9
  10. Dr. Compynei

    Bergamot Guest

    Dr. Compynei wrote:
    >
    > As part of my degree I am studying Web Development, and now I better
    > understand websites I am designing up the website of a charity (local
    > theatre) in CSS and XHTML 1.0 Trans.


    Were you instructed to use XHTML Transitional? If so, your instructor is
    incompetent.

    > Moving away from tables due to accessability problems etc etc.
    >
    > http://www.blt.org.uk/css/index.htm
    >
    > 1. Image Mapping. How is best to map the image to turn graphics into
    > hyperlinks.


    As someone else mentioned, the most accessible method would be plain
    text links styled with CSS. Using list mark up for navigation menus has
    become the accepted norm.
    http://css.maxdesign.com.au/listamatic/

    You can embellish with background graphics to get pretty much the same
    effect as the site has now and still be scalable with varying window and
    text sizes, but that is a bit advanced for a newbie. Keep it simple and
    you'll get better results.

    > 2. Scrolling. This is my main problem at the moment. When the page gets
    > longer the content div just keeps going down the page, what I want is for
    > the site to be x% sizes of the screen (leaving some red border) no matter
    > what the resolution (upto a min of 800x600).


    Stop wanting this. If you're dropping layout tables for accessibility
    reasons, putting in a scrolling div would be substituting one
    accessibility problem with another, perhaps worse one. Scrolling divs
    are a navigation nightmare for keyboard users. They are cumbersome at
    best, unusable at worse.

    Were you instructed to use a scrolling div, too? :-(

    --
    Berg
     
    Bergamot, Mar 13, 2007
    #10
  11. "Dr. Compynei" wrote:

    > "Chaddy2222" <> wrote in message news:45f6454a$1@wasat...


    >> You should use Strict as it's a new project.

    >
    > We were instructed to use transitional.


    Then you should ask for your money back.

    --
    Richard.
     
    Richard Formby, Mar 13, 2007
    #11
  12. Dr. Compynei

    Bergamot Guest

    Dr. Compynei wrote:
    > "Bergamot" wrote:
    >>
    >> Were you instructed to use XHTML Transitional? If so, your instructor is
    >> incompetent.

    >
    > Yes I was!
    > The instructor is a leading figure on sitepoint I believe.


    "a leading figure" doesn't mean anything. There are countless number of
    "experts" that are in reality quite clueless. University instructors for
    HTML and web design for the most part seem to be the worst of the worst.

    Using XHTML Transitional for any project is questionable at best. For
    rewriting an existing site, or for a new project it's just wrong. Stick
    with HTML 4.01 Strict.

    --
    Berg
     
    Bergamot, Mar 13, 2007
    #12
  13. Dr. Compynei

    dorayme Guest

    In article <et68ec$td4$>,
    "Dr. Compynei" <compynei*isnt*@ntlworld.com> wrote:

    > "dorayme" <> wrote in message
    > news:...
    > > In article <et4tf4$r77$>,
    > > "Dr. Compynei" <compynei*isnt*@ntlworld.com> wrote:
    > >
    > >> I'm knew around here so please excuse me, however I'm stuck with a few
    > >> things.

    > >
    > > What did you do when you came in, knock the vase over or
    > > something?

    >
    > It was more of, an excuse me as I'm not exactly sure how this group works.
    >
    > >


    That's a nice and fair enough answer. I just cannot abide
    anything lowly and snivelling, which is not the case, as you
    explain, in yours. <g>

    > >> As part of my degree I am studying Web Development, and now I better
    > >> understand websites I am designing up the website of a charity (local
    > >> theatre) in CSS and XHTML 1.0 Trans.
    > >>

    > >
    > > You are unlikely to be needing XHTML then, stick to 4.01 Strict
    > > for a while

    >
    > Being taught int XHTML so it seems sensible to move that way.
    >


    Let me back up my point with a lowly and snivelling argument by
    authority by an authority:

    "The expert advice is to use HTML 4.01, but you can of course use
    technobabble-XHTML _if_ you are careful enough to follow
    guidelines that effectively make it HTML 4.01 with pointless
    kludges."

    and

    "In practical terms, XHTML is pointless as a delivery format of
    WWW documents for the time being. It's just an exercise in
    futility, though some day things might change, in some direction."

    > > #wrapper {margin:5px 20px 5px 20px;}
    > >
    > > This gets top, right, bottom and left respectively.
    > >
    > > As for grace with text within the wrapper and other boxes, apply
    > > a modest bit of padding, best in em.

    >
    > Thanks for your help, even if you do seem a little stressed by point 3.
    > Perhaps I could buy your a beer <g>


    I drink beer in order to be seen to drink it and so lessen the
    chances of deportation (Australia is hard on aliens). For stress,
    I prefer a good shot of bourbon.

    --
    dorayme
     
    dorayme, Mar 13, 2007
    #13
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Mark
    Replies:
    3
    Views:
    380
  2. JS

    Two quick questions

    JS, Jan 18, 2006, in forum: Java
    Replies:
    7
    Views:
    363
    Roedy Green
    Jan 18, 2006
  3. Geoff Hague
    Replies:
    5
    Views:
    450
    Mark Parnell
    Jul 15, 2004
  4. Horny Porno-thologist

    Just two quick questions

    Horny Porno-thologist, Jan 27, 2004, in forum: XML
    Replies:
    2
    Views:
    398
    Paul Lee
    Jan 27, 2004
  5. JKop
    Replies:
    11
    Views:
    938
Loading...

Share This Page