Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

html only website

Options
  • 30-12-2010 11:01am
    #1
    vedwards
    Registered Users Posts: 244 ✭✭


    Hi Guys 'n' Gals,

    I'm doing a L5 FETAC course with a syllabus that's a little outdated as it does not touch on CSS. My project within the scope of the syllabus is to design a website based on html so a lot of div tags etc... I've been finding it impossible to find pure html websites on the www to look at the source code or see how others had worked with html solely.
    Anyone help? Templates?

    Happy New Year to all my boards.ie friends


Comments

  • Options
    #2
    Eoin
    Moderators, Category Moderators, Motoring & Transport Moderators Posts: 21,238 CMod ✭✭✭✭Eoin


    Do you mean you're looking for sites that specifically don't use CSS?


  • Options
    #3
    dlofnep
    Closed Accounts Posts: 20,759 ✭✭✭✭dlofnep


    Divs tags are traditionally used for grouping content together with CSS. If it's just HTML, go through the tizag HTML tutorial: http://www.tizag.com/htmlT/ (Rest of the sections are on the left).

    HTML is very easy. You can learn it in a day or two.


  • Options
    #4
    Eoin
    Moderators, Category Moderators, Motoring & Transport Moderators Posts: 21,238 CMod ✭✭✭✭Eoin


    It takes a bit longer to learn how HTML should be used though. Using the appropriate tags for the content you're displaying etc.


  • Options
    #5
    dlofnep
    Closed Accounts Posts: 20,759 ✭✭✭✭dlofnep


    eoin wrote: »
    It takes a bit longer to learn how HTML should be used though. Using the appropriate tags for the content you're displaying etc.

    Aye, true enough.. But as a rule of thumb, it's a pretty easy learning curve.


  • Options
    #6
    DonkeyStyle \o/
    Closed Accounts Posts: 7,145 ✭✭✭DonkeyStyle \o/


    This is fairly rotten and probably won't validate or win any design awards (though fingers-crossed), it's a skeleton table layout which you could throw a few images into and get away with (Or at least get some ideas from) ... I'm guessing they're not expecting miracles anyway.


    [HTML]<html>
    <head>
    <title>MY AWESOME HTML WEBSITE</title>
    </head>

    <body bgcolor="#142144">

    <table width="860" align="center" border="0" bgcolor="#FFFFFF" cellpadding="8">
    <tr>
    <td colspan="2"><img src="banner.gif" width="860" height="150"></td>
    </tr>

    <tr bgcolor="#456789">
    <td colspan="2">
    <font face="Arial" color="#456789">-- <a href="#"><font color="white">Home</font></a> - - - <a href="#"><font color="white">Things</font></a> - - - <a href="#"><font color="white">Stuff</font></a></font>
    </td>
    </tr>

    <tr>
    <td width="600" valign="top">
    <h1><font face="Arial">Website title</font></h1>
    <p><font face="Arial">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</font></p>
    <p><font face="Arial">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</font></p>
    <br><br>
    </td>
    <td valign="top" width="200">
    <img src="sidebanner.gif" width="200" height="300">
    </td>
    </tr>

    <tr bgcolor="#456789">
    <td colspan="2">
    <blink><center><font face="Arial" size="2" color="#FFFFFF">© Blahcorp 2010</font></center></blink>
    </td>
    </tr>

    </table>

    </body>
    </html>

    [/HTML]


  • Advertisement
  • Options
    #7
    Dean820
    Registered Users Posts: 2,099 ✭✭✭Dean820


    Are you sure you're not supposed to do CSS? I did a FETAC Level 5 Web Authoring course, and we learned it.


  • Options
    #8
    Dave!
    Closed Accounts Posts: 27,857 ✭✭✭✭Dave!


    Would you not get extra credit or something for going beyond the requirements? It'll look like pox if you just use HTML! There's no real reason why you would need to just use HTML. Just ensure that you use semantic HTML that validates, and then use CSS to make it look good.


  • Options
    #9
    TitoPuente
    Closed Accounts Posts: 549 ✭✭✭TitoPuente


    dlofnep wrote: »
    Aye, true enough.. But as a rule of thumb, it's a pretty easy learning curve.

    It's easy to learn the basics very quickly although getting your front end code to a professional standard and being confident enough to properly code complex layouts is going to take a lot longer than a few days.


  • Options
    #10
    vedwards
    Registered Users Posts: 244 ✭✭vedwards


    Thanks everyone; all positive comments and very helpful. I will probably end up doing the website using three methods (1) the required html as per syllabus which I'll submit (2) embedded css (3) separate style sheet [sorry if the terminology is not correct] I have a few weeks so no problem. I intend getting the extra marks by explaining how to go about gathering the content and wire-frame (sitemap), customer requirements etc..

    Again, happy new year to you all.


  • Options
    #11
    Liam Byrne
    Closed Accounts Posts: 18,163 ✭✭✭✭Liam Byrne


    vedwards wrote: »
    Thanks everyone; all positive comments and very helpful. I will probably end up doing the website using three methods (1) the required html as per syllabus which I'll submit (2) embedded css (3) separate style sheet [sorry if the terminology is not correct] I have a few weeks so no problem. I intend getting the extra marks by explaining how to go about gathering the content and wire-frame (sitemap), customer requirements etc..

    Again, happy new year to you all.

    It might just be your phrasing that's throwing me, but you are aware that "wire-frame" and "sitemap" are two completely different things ?


  • Advertisement
  • Options
    #12
    fitzcoff
    Registered Users Posts: 528 ✭✭✭fitzcoff


    I'm doing the same subject, we covered HTML and we were told that if we wanted to we could do CSS if we wanted, it wasn't be taught to us but if we carried out or own research there was no issue with it. I was thinking about it, any advise on how best to learn the basics of CSS.

    If I am putting work into something I'd like it to be done as proper as I can:)


  • Options
    #13
    Dave!
    Closed Accounts Posts: 27,857 ✭✭✭✭Dave!


    just google 'css tutorial', there are heaps of them for free online

    w3schools.com gives a good overview


  • Options
    #14
    vedwards
    Registered Users Posts: 244 ✭✭vedwards


    A couple of question n relation to the same thread (topic: html only website)

    (1) Is it possible to construct a HTML nav bar with drop down selection menu or is that only accomplished in CSS?

    (2) Based on DonkeyStyle \o/ HTML sample template above I have a problem in the nav bar; I have HOME - OPENING HOURS - MENU - CONTACT - SPECIALS. When I click on the nav bar say MENU I have it so it goes bold. From the template there is an underline which in some browsers goes from white to red/purple (nice). But no matter what I do when I click on OPENING HOURS all the underlines remain white!

    The html is simple enough and I can see no errors or difference between the code on other lines.

    Any ideas?


  • Options
    #15
    Abelloid
    Registered Users Posts: 3,495 ✭✭✭Abelloid


    Are you sure you're not to use CSS? This seems like a very unusual way of teaching HTML, I could understand if they wanted you to concentrate on the HTML for print or screen readers before adding the CSS, but constructing the entire page in HTML alone?

    The unusual link display differences are being caused by each browsers default CSS, so you can't avoid it altogether.

    BTW font tags are no longer supported, in HTML5...


  • Options
    #16
    DonkeyStyle \o/
    Closed Accounts Posts: 7,145 ✭✭✭DonkeyStyle \o/


    I suspect the lack of css in your html syllabus is down more to ignorance than by design. If that's the case, your html probably won't even be looked at, let alone poured over to see if you cheated using css. (if you could even call it that)
    Personally I'd just go with the css tutorials on w3c-schools and just not worry about it.
    Is there nobody from the course you can run this by?


  • Options
    #17
    vedwards
    Registered Users Posts: 244 ✭✭vedwards


    Thanks for getting back to me guys.

    The html effort based on Donkey Style doesn't look so bad as it stands! Nice images and content with no side scroll bar so looks tidy. But I'm told that I have too many pages on my nav bar. But I guess from replies that it is not possible to have other page links displayed in a drop down nav bar in html.

    I'll start using the css this week. There is a lot of emphasis placed on the content which I think is great as it focuses the aims of the website and target audience.

    Thanks again
    (wonder why there were so many page views about on a thread dealing with html?)


  • Options
    #18
    Liam Byrne
    Closed Accounts Posts: 18,163 ✭✭✭✭Liam Byrne


    vedwards wrote: »
    But I'm told that I have too many pages on my nav bar. But I guess from replies that it is not possible to have other page links displayed in a drop down nav bar in html.

    It would require JavaScript to work.

    I'm confused, though - how many is "too many" ?

    The general rule for options is "seven plus-or-minus two", and even that is gone by the wayside on most websites.

    How many do you have ?


  • Options
    #19
    vedwards
    Registered Users Posts: 244 ✭✭vedwards


    9 Liam

    You can view them here and here

    Thanks


  • Options
    #20
    fitzcoff
    Registered Users Posts: 528 ✭✭✭fitzcoff


    I think the requirement is to have 6 pages including the home page.

    Like the look of the design so far. I've an interest as trying to do this at the mo with little success!!


  • Options
    #21
    vedwards
    Registered Users Posts: 244 ✭✭vedwards


    A little plagiarism with the images but its only for a personal project i.e FETAC.
    Don't laugh, but I find Picasa a very good tool when dealing with images :o. I can type text on the image and it go can select the banner dimension and it saves them automatically for your next banner.


  • Advertisement
  • Options
    #22
    fitzcoff
    Registered Users Posts: 528 ✭✭✭fitzcoff


    I'm sitting at the laptop and wrecking my head, I've "cheated" and used the code kindly suggested here:D

    I'm basing my site on a day care centre and want to include a page with photos on it, ideally it would have a list of hyperlinks which would link to the photos. More than likely it'll just be a page with the photos on it.

    i can get the il list and the links but looking for some inspiration as to how to layout the photos.

    Not sure if I'm making sense but the link would be St Patricks Day which would open a page with photos from that, I'm asssuming that a table with the images sourced into the cells.

    I would love if when a photo is clicked/selected it enlarges - any chance of any kind boardsie helping with the code ;);)


  • Options
    #23
    Abelloid
    Registered Users Posts: 3,495 ✭✭✭Abelloid


    A little Javascript (Lightbox) perhaps?

    http://www.huddletogether.com/projects/lightbox2/#how

    Put the thumbnails in a table and link them to the full size images, like this

    [HTML]<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>[/HTML]


  • Options
    #24
    fitzcoff
    Registered Users Posts: 528 ✭✭✭fitzcoff


    JustinOval wrote: »
    A little Javascript (Lightbox) perhaps?

    http://www.huddletogether.com/projects/lightbox2/#how

    Put the thumbnails in a table and link them to the full size images, like this

    [HTML]<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>[/HTML]

    Thanks for that, I'll give it a shot tomorrow when the brain is a bit more awake.


  • Options
    #25
    vedwards
    Registered Users Posts: 244 ✭✭vedwards


    JustinOval wrote: »
    Are you sure you're not to use CSS? This seems like a very unusual way of teaching HTML, I could understand if they wanted you to concentrate on the HTML for print or screen readers before adding the CSS, but constructing the entire page in HTML alone?

    The unusual link display differences are being caused by each browsers default CSS, so you can't avoid it altogether.

    BTW font tags are no longer supported, in HTML5...

    It turned out the I had a declaration on all pages except 'Opening Hours' :o
    hence the difference between the nav bar selection. Don't know why :confused:


Advertisement