HTML, CSS and so on - will it be worth it?

simpletom

simpletom

simpletom

Associate
Joined
3 Feb 2009
Posts
1,759
Hi

Okay, I am not a coder, not particularly creative and a little short on time.

I do a lot of the Moodle VLE work where I work but I am also building up my own VLE portfolio. This is in case I wish to 'spread my wings', so to speak, and find a place that will allocate me time for the work I do. They do exist!

Having got a domain and webspace (cheers optitech-uk), uploaded Moodle and so on, I really do need a front end to the Moodle area. A few pages that are simple but not scrappy and naff looking.

I have Dreamweaver CS4 though work and yes, I can make a front end. A grey, dull one at that. Is it worth me looking deeper into this or is it hideously time-consuming? Are there any decent templates out there that don't look like a throwback to the 90s?

And WTF is CSS all about?

Cheers for laughing at a noob!
 
I wouldn't say it's hard at all, definitely worth it if you're going to be creating a portfolio website.

CSS is used to stylise the whole webpage: what colour everything is, positioning etc.

Start learning now!

:o;)
 
Tr Insanity said:
I wouldn't say it's hard at all, definitely worth it if you're going to be creating a portfolio website.

CSS is used to stylise the whole webpage: what colour everything is, positioning etc.

Start learning now!

:o;)
Click to expand...

Well, as I was up until 2am working on Moodle (and a student was on as well!), I have a spare couple of hours :(

So, where do I start? Books or, as I usually do things, mess around until I get it? Any good online tutorials that you would recommend? Dont forget, the closest I got to this was 68000 assembly language in 1988 :D
 
An accessible site shouldn't be something you have to 'change to'. That's the point :)

CSS is for presentation.
XHTML is for content markup.

Keeping them seperate has many benefits.

HTML mixes content and presentation. But so does bad XHTML/CSS (like that generated by Dreamweaver).
So using Dreamweaver sacrifices a lot of the benefits of these standards.
 
They may not be the best, but these tutorials really helped me when I started :
http://www.tizag.com/

The beauty with CSS is that you can create 2 separate styles (2 separate .CSS files), and with a click of a button the whole appearance of the site can change, so this enables you to have a "normal" site and then another for those with a visually imparity.

Or do what billysielu says and design the whole site so that it's accessible to everyone ;)
 
Tr Insanity said:
They may not be the best, but these tutorials really helped me when I started :
http://www.tizag.com/

Or do what billysielu says and design the whole site so that it's accessible to everyone ;)
Click to expand...

I think what I am trying to get at is that it can be more accessible. Some students I have simply cannot use ICT without having a massive typeface which, frankly, renders the site unreadable to others. Having black on grey or cream is certainly readable for person A but not person B.

It sounds like some reading up on CSS is what I need. Changing the background colour of the frames and englarging the font are the two most important elements.

Many thanks for the responses.
 
simpletom said:
Hi
Click to expand...
Hi. :) Moodle eh? Work in a school then? I do and I've got to look after the Moodle setup for my school. Would you mind dropping me a line at marclister at gmail dot com to see just how more advanced than mine your Moodle knowledge is? :p

I don't get much time to work on our Moodle site and so when I do have work to do I take a while to work out what on earth I'm meant to be doing and how to do it.

Oh and CSS is pretty cool. ;)
 
Best example of what CSS can do is http://www.csszengarden.com

The HTML is the same (aside from links) on every page, yet they all look completely different from the style sheets. Designing in this way means you can change the look of an entire website by editing the single .css (style sheet) file, without editing each HTML file.

Might want to dump Dreamweaver as well, and use Notepad or Notepad++, you'll probably learn a lot more looking at the code all day than using that fancy GUI.

http://www.w3schools.com is another site similar to tizag that will explain what tags are etc.
 
simpletom said:
It sounds like some reading up on CSS is what I need. Changing the background colour of the frames and englarging the font are the two most important elements.
Click to expand...

The background colour isn't important. The importance is that there is high contrast between text and background. There's no reason to have another stylesheet for this, it's something you should be doing anyway.

Font size can be changed by the user, by using their browser to zoom. You need to make sure your layout doesn't break when the user zooms.
 
Longbow said:
Might want to dump Dreamweaver as well, and use Notepad or Notepad++, you'll probably learn a lot more looking at the code all day than using that fancy GUI.
Click to expand...
Agreed. I would forget about Notepad and use Notepad++ or another Notepad but on steroids. I did a website for a lecturer at Uni for my final year project. I evaluated a CMS, Plone *shudder*, Dreamweaver and hard/hand-coded XHTML/CSS. I went with the latter option and I thought it looked pretty good for my first ever website.

Dreamweaver will put the code in for you but you don't know what it's for and if you've got too much code to achieve what you need to.
 
Also get a copy of FireFox installed with the FireBug addon, it has lots of useful features for web development. You can change the XHTML markup and CSS properties as you are viewing the page and see what happens, one of the best ways to play around with it.
 
MarcLister said:
Hi. :) Moodle eh? Work in a school then? I do and I've got to look after the Moodle setup for my school. Would you mind dropping me a line at marclister at gmail dot com to see just how more advanced than mine your Moodle knowledge is? :p

I don't get much time to work on our Moodle site and so when I do have work to do I take a while to work out what on earth I'm meant to be doing and how to do it.

Oh and CSS is pretty cool. ;)
Click to expand...

No probs - I run four Moodle courses. I get an hour a week deducted form class contact for that :( I am actually a tutor, not an IT guy.

I will mail you when I have my own Moodle site up sometime tomorrow. It will avoid any issues using the college ones.

As for learning using notepad++, it is great in theory but there are limits to my time. I will take note though and have a look. It will give me something to read on the train.

I currently use Firefox as a browser so will get Firebug.
 
Longbow said:
Best example of what CSS can do is http://www.csszengarden.com

The HTML is the same (aside from links) on every page, yet they all look completely different from the style sheets. Designing in this way means you can change the look of an entire website by editing the single .css (style sheet) file, without editing each HTML file.

Might want to dump Dreamweaver as well, and use Notepad or Notepad++, you'll probably learn a lot more looking at the code all day than using that fancy GUI.

http://www.w3schools.com is another site similar to tizag that will explain what tags are etc.
Click to expand...


That site is quality :)
 
simpletom said:
No probs - I run four Moodle courses. I get an hour a week deducted form class contact for that :( I am actually a tutor, not an IT guy.

I will mail you when I have my own Moodle site up sometime tomorrow. It will avoid any issues using the college ones.

As for learning using notepad++, it is great in theory but there are limits to my time. I will take note though and have a look. It will give me something to read on the train.

I currently use Firefox as a browser so will get Firebug.
Click to expand...
Cheers. I've got a few blank template pages that I use for web dev stuff. It is just a blank page with the necessary beginnings of a page such as the declaration and body sections along with a link to a default.css file. When I get your email tomorrow I'll reply with some attachments for you. ;)

I do this so that I know I've got something that is valid in XHTML and saves me a few minutes getting the basics ready each time.

I'm an IT guy but I don't really get any dedicated time for our Moodle. The IT teacher who was the IT guy before I turned up definitely didn't get any time off to do general ICT stuff let alone Moodle stuff.

No need to say that he likes having me around. :D
 
Longbow said:
Might want to dump Dreamweaver as well, and use Notepad or Notepad++, you'll probably learn a lot more looking at the code all day than using that fancy GUI.
Click to expand...

Dreamweaver CS4 codeview is actually quite superb and got me to switch over from notepad2.
I can open a single file and DW automatically opens every file which is linked from within into tabs. (js and css). Makes for easy editing.
 
MarcLister said:
Cheers. I've got a few blank template pages that I use for web dev stuff. It is just a blank page with the necessary beginnings of a page such as the declaration and body sections along with a link to a default.css file. When I get your email tomorrow I'll reply with some attachments for you. ;)

I do this so that I know I've got something that is valid in XHTML and saves me a few minutes getting the basics ready each time.

I'm an IT guy but I don't really get any dedicated time for our Moodle. The IT teacher who was the IT guy before I turned up definitely didn't get any time off to do general ICT stuff let alone Moodle stuff.

No need to say that he likes having me around. :D
Click to expand...

You've been emailed with the required details.
 
You must log in or register to reply here.
Back
Top Bottom