XHTML and CSS

TechShop:XHTML and CSS

this should be your one reference if you are getting all confused with all the links.
http://htmldog.com/guides/

The background

Please vists http://movielibrary.lynda.com/html/modPage.asp?ID=216
All of videos to get a good background on where the web is are part of the free videos they offer from Lynda.com . Watch all of the introduction chapter. You can also by 2 disc DVD series from Lynda.com the full 7.5 hours of CSS Training. £70 approx. Alternatively you can get a 1 month online subscription for £18 (approx) However that training is more advanced you need to get to grips with the basics outlined here first.

Slides from Lecture

PDF presentation on meaningful and standards based markup and CSS.

Why web standards

http://www.w3schools.com/Site/site_standards.asp

New Link to web standards open curriculum

http://interact.webstandards.org/

Video to get you started with JEdit (XHTML editing) and CSS Edit (CSS editing)

Semantic Markup
http://microformats.org/wiki/semantic-html

XHTML basic starter code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Starter</title>
</head>
<body>
</body>
</html>

Download zip file containing a number of sample files (including the starter.html) demonstrating attaching stylesheets to html files.

Reset CSS http://meyerweb.com/eric/tools/css/reset/reset.css
Direct link to the reset.css file you should attach to all your html documents to remove any browser inconsistency.

Your university webspace

Instructions on using this space can be found at http://www.soton.ac.uk/isolutions/computing/info/www/publish.html

Books

Transcending CSS (4 in WSA Library)
Web Standards Creativity: Innovations in Web Design with XHTML, CSS, and DOM Scripting (1 in WSA Library)
CSS Mastery Advanced Web Standards Solutions
The CSS Anthology: 101 Essential Tips, Tricks & Hacks

Further Reading

Microformats
http://www.microformats.org/

AJAX
http://en.wikipedia.org/wiki/Ajax_(programming)

script.aculo.us
http://script.aculo.us/

CSS3
http://sixrevisions.com/interviews/six-questions-eric-meyer-on-css3/

PHP & MYSQL
http://en.wikipedia.org/wiki/Php

PHP Framework
http://codeigniter.com/

Expression Engine
http://expressionengine.com/

JQuery
http://jquery.com/

Links

Some older but valid bookmarks (long list)

http://www.toxel.com/design/2009/01/11/top-50-best-css-articles-and-resources/
http://www.htmldog.com/guides/
http://www.w3schools.com/xhtml/default.asp
http://www.w3schools.com/css/default.asp
http://themaninblue.com/
http://alistapart.com
http://www.designmeltdown.com/
http://www.cssimpress.com/
http://cssvault.com/
http://cssbeauty.com/
http://www.cssbasics.com/
http://www.smashingmagazine.com/2007/05/10/70-expert-ideas-for-better-css-coding/
http://www.csszengarden.com/
http://www.webstandards.org/
http://www.addedbytes.com/cheat-sheets/css-cheat-sheet/
http://begoodnotbad.com/article/css_cheat_sheet/

Design links

Please bear in mind these are examples of design, not necessarily of good meaningful markup and css.
http://www.e4.com/skins/index.html
http://www.ninachakrabarti.com/linkspage.htm
http://www.nieves.ch/
http://www.whitecube.com/artists/
http://www.re-title.com/search/quick/default.asp
http://www.silasandmaria.com/silas4
http://www.riflemaker.org/s-index
http://www.savilleparriswakefield.com/temp2008/
http://www.manandeve.co.uk/artists/Helga-Steppan
http://www.graphicthoughtfacility.com/projects/58
http://www.jogordon.com/new_about.html
http://www.mikemillsweb.com/
http://www.tomato.co.uk/
http://www.chosilkil.com/

Tips

Do you find that jedit just bounces in the dock on your Mac ?
If so this is because your mac has a newer version of Java and jedit does not like it

To fix this follow these steps

  • Get rid of the MacOS.jar from /Applications/jEdit.app/Contents/Resources/Java/jars/ - to get to this folder control or right click on jEdit in Application and click Show Package Contents
  • Replace it with the experimental MacOSX.jar http://mijav.dk/download/MacOSX.jar
  • Edit /Applications/jEdit.app/Contents/Info.plist and change the Java/JVMVersion to '1.6+' from '1.5+'.

Comments

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License