CSS or CSS2, PHP4 or PHP5, these are the questions.

[iN8]

I have been a print only graphic designer for 10 years and have finally gotten around to teaching myself how to design and develop websites.I am not a total novice, I have a good working knowledge of HTML and I can find my way around Dreamweaver/Golive etc. Software is the easy part, I am more concerned about the code.

So you know, I already have just about every piece of software I could need (BBEdit, Stylemaster, Dreamweaver, GoLive, Transmit, etc.) at least I think I do. I also have a domain and hosting account at DreamHost.

My question is, what is necessary for me to learn and what shouldn't I bother with?

Should I learn CSS or move stright to CSS2? PHP4 or 5? XML? XHTML?
What's all this chatter about Ruby on Rails?

Throw all the acronyms that are in your arsenal at me, don't worry I can take it.

Thanks

 

[tideshark]

All a web designer needs to know is CSS and HTML. XHTML is just a variant of HTML that's XML-compatible. Confused yet? Learn HTML first, get the Webmonkey Cheat Sheet. It'll help quite a bit.

Use your Dreamhost account to test out pages. As you get better you can dive into CSS. CSS is usually a single file that holds all the formatting info. So in CSS you're saying put X here with a Y background, and put B there with a G background and make all the text in M and N look like a certain style. The HTML files still hold the text, images, etc. So later on if you want to change the look/style of your page, you can simple change your CSS file and all your HTML files will be displayed differently. I learned using this tutorial, although eventually you'll probably want a reference book with ALL of the elements (I have one, consulted very frequently):
http://webmonkey.wired.com/webmonkey/authoring/stylesheets/tutorials/tutorial1.html

The difference between CSS/CSS2 is browser compatiblity. CSS is across the board. CSS2 is hit-and-miss on browsers like Internet Explorer. They're the exact same "code style" except CSS2 has more options. Most people don't differentiate between CSS and CSS2, if they're talking about CSS it's probably CSS2 (not like there's a huge difference anyway).

PHP is a server-side language. Fancy web sites such as MacRumors, Apple, Google, etc. (anything with user-driven content) is powered by a server-side language. It takes input (usually from a user or another web site) and dynamically changes the output (to the user or another web sever). PHP, ASP, ColdFusion, JSP are all server-side languages and are meant for experienced developers, not designers. Making errors in a server-side language can pose dangerous risks to your web site/server if you're inexperienced.

XHTML should be learned as soon as you understand HTML well (which you said you do). You could get an expensive book, but I'll simplify what the differences are in XHTML:

1. All tags that don't have an end tag (ex. <img>) have to end in a "/>":

<img src="(url)" />

2. Tags that have an end tag (ex. <b></b> or <i></i>) need to be enclosed:

<b><i>text</i></b>

You can't write this:

<b><i>text</b></i>

<i> must be closed before a tag that began before it (<b>) can be closed

3. Some elements like <table width="100%"> the "width" is not allowed, there are TONS of elements that are no longer allowed, they're being replaced by CSS:

<table style="width: 100%;">

There are a ton of uses for XML, none of which a designer would need to know. Ruby on Rails, a framework for Ruby, again nothing a designer would ever need to touch.

 

[Mitthrawnuruodo]

Learn the XHTML 1.1 standard (which is heavily based on the HTML 4.01 specification, but with some stricter (pun intended ) rules). Even if tools like Dreamweaver will generate all teh code you need, it never hurts to know the standard.

CSS2 is the standard at the moment, but to learn the basics it doesn't really matter if you're looking at CSS or CSS2. CSS3 shouldn't be too far off, but to learn the basics, just stick with CSS2.

Now, with PHP it's more tricky. What does your web host run? Many hosts still run PHP4, and then it wouldn't make any sense to start learning PHP5, since there's actually is quite a bit of difference between PHP4 and PHP5. Of course if you learn 4 you shouldn't have too much trouble switching to PHP5, later. But if your host already runs PHP5, then I don't see any reason for not going directly for PHP5.

XML is handy to know, but that's not any trouble, in particular if you know XHTML, which is basically just a special form of XML. PHP5 has some very interesting functions for reading/writing XML, which doesn't exist in PHP4, and XML might just take over MySQL's role as the "default" way of saving content for complex PHP sites.

Forget about Ruby, for now at least. There are other more essential stuff to learn, and enough quirks and incompatibility issues as it is...

 

[tideshark]

XML might just take over MySQL's role as the "default" way of saving content for complex PHP sites.

I agreed with everything except that. That's just not true at all, that'd be essentially the equivalent of returning to flat file .txt bulletin boards. XML will never replace databases or vice-versa. They have completely different uses.

 

[whocares]

(...)XHTML should be learned as soon as you understand HTML well (which you said you do). You could get an expensive book, but I'll simplify what the differences are in XHTML:

1. All tags that don't have an end tag (ex. <img>) have to end in a "/>":

<img src="(url)" />

2. Tags that have an end tag (ex. <b></b> or <i></i>) need to be enclosed:

<b><i>text</i></b>

You can't write this:

<b><i>text</b></i>

<i> must be closed before a tag that began before it (<b>) can be closed

3. Some elements like <table width="100%"> the "width" is not allowed, there are TONS of elements that are no longer allowed, they're being replaced by CSS:

<table style="width: 100%;">

(...)

4. All tags MUST be in lower-case!

5. You need to declare a doctype!

For all your HTML/XHTML and CSS specification/validation needs, check out w3c.org

 

[pulsewidth947]

Just to throw in my newbie input -

I'd say stick with CSS (not 2) for now, to allow backwards compatibility better. This is based on the assumption that you arent going to have different external style sheets that correspond with the intended browser (for example, one of IE, one for real browsers ).

As far as PHP is concerned - Mitthrawnuruodo's advice is ideal - just use what your server allows. Mine is currently on PHP4, so thats what I learnt. From googling your hosting provider, it looks like it supports both, so why not try PHP5? Cant say I know the difference, as I havent looked into it, but I'll say which ever you choose, PHP has the potential to make your live much much easier if you have a lot of content to put up (dynamic pages rock!) - especially when paired with MySQL.

The W3C validation is superb. It should remove a lot of the sloppy code that may creep in if you have a lot to hand write. I'm ashamed to say I havent verified my site yet, but I will probably sort that out tonight.

 

[Mitthrawnuruodo]

I agreed with everything except that. That's just not true at all, that'd be essentially the equivalent of returning to flat file .txt bulletin boards. XML will never replace databases or vice-versa. They have completely different uses.

XML is not a database, I know that... and I didn't mean that XML will take over all MySQL's uses. I just meant that for all those sites which contains lots of articles, and which doesn't necessarily need a database, like most online magazines and sorts, all those sites might just as well use XML to save and format their articles instead of using some quasi html and putting that in a database.

Very few sites really use the power of MySQL, and for many of those XML will be a option which, as it looks, will be easier to build and maintain.

When even Microsoft will use XML as a document format that's a good indication it may be in widespread use within short time, no matter if it's a good idea or not...

 

[rendezvouscp]

We can make suggestions best on what kind of websites you're making. If it's a personal site, then sinking yourself into XHTML, CSS, and JS is a good idea. If you're trying to create web applications, then you need to be familiar with AJAX, PHP, and MySQL. If you're all about looking at data more than anything, XML and XSLT will be your friend.

XHTML is the current standard set by the W3 web standards group. This is what you'll want to use for your pages.

CSS is all for styling. This makes the XHTML pretty. CSS is absolutely wonderful since you can have your styling information in a different document and use it over and over again throughout your site.

JS is great for user interactivity. Perhaps you want to make a slideshow available on your website—JS can handle it. It too is in a different file, and that's how you want to keep things.

These three different technologies can be used together in appropriate ways to create a clean, semantic website. They shouldn't be intertwined together on a single page, but they should be connected. For example, you don't want CSS and JS littering your XHTML document—you want them linked from the XHTML document, and then have each one do their job separately.

AJAX is a buzzword for using JS and XML together. AJAX enables you to deliver new content to a web page without making the user load another page in their browser. AJAX is useful for things like shopping carts. Let's say you've got a product page and a shopping cart in the sidebar. Users can add things to the shopping cart, and the page will visually change as they add items. They can change the number of items, etc. without needing to go to a different page. Additionally, they can click an order button and their order can be processed from that page if you're using a one-click technology. AJAX is very powerful, but isn't a W3 standard.

PHP (5 in your case) is handy for dynamic documents. MySQL is a great database technology. Together, you can retrieve things using PHP from the MySQL database.

XML is a universal document format. You can properly create your data, and something like PHP can read it. While not a strict database, XML can be used as one. Your iTunes library is organized through an XML document.

XSLT is CSS for XML. You can link to an XSLT document through an XML document, and XSLT can style the document as you like it, just like CSS.

These technologies for the web are extremely powerful, and work best when used semantically. For great starter information on how to use these technologies, go to the W3 School's website and look at the information they have there.
-Chase

 

[iN8]

Thanks for all your responses, much appreciated.

I think I have a good grasp of what I need to start learning from what you all have said.

To start off, I will be creating a site for my design studio. Nothing to fancy, just an online capabilities brochure for now. Then I'll probably do a Wordpress based site for my wife's business.

Any recommended books to read. I hear Designing with Web Standards (Zeldman) is good. Any prefered publishers for code books.

Thanks again.

 

[mrjamin]

XSLT is CSS for XML. You can link to an XSLT document through an XML document, and XSLT can style the document as you like it, just like CSS.

That's not strictly true - you can style XML using a CSS document.

XSL, however, is what CSS is to (X)HTML for XML, and XSLT is a step on from XSL.

XSLT is a user-defined set of rules for how to transform an XML document into another XML document, like an XHTML document for example.

XML and all the technologies surrounding it can get very, very complicated - its not worth using it for the web unless you have an XML data-source (like an RSS feed) you want to work from. The principals of XML are simple, but the possibilities are what causes the headaches!

As for the CSS vs CSS2 questions, you can pretty much get away with using pure CSS2 and CSS2 specific features BUT you need to be aware of what doesn't work where, and how to get around it.

As for PHP4 vs PHP5 - the main differences are with handling XML, and working with Objects. PHP5 is much more of a credible language, in that its becoming more feasible for use outside the web as you can now compile code, and develop full blown PHP applications (using PHP-GTK). Some would argue that its just becoming more like Python or Perl, which is rendering it less useful as you may as well just opt for Pyth/Perl. However, that's all bullcrap if you ask me!

While most, if not all PHP4 geared scripts will work on PHP5 equiped servers, I'd say if you're starting from scratch, then opt for PHP5, and get yourself a PHP5 host as it wouldn't do you any harm to start learning where the technology's at. It will be another 12 - 18 months before the majority of hosts are using nothing but php5 - few hosts had adopted PHP4 until it hit version 4.1, and php5.1 betas are a good 6 months away yet. I've been a professional web application developer for a good few years now and still haven't even taken the time out to brush up on what's what with PHP5!

For PHP books, I can recommend Larry Ulman's Visual Quickstart Guide to PHP (ISBN: 0321245652), which is ideal if you're starting from scratch. The O'Reilly books are also superb, but not the easiest to follow for a beginner. An excellent book for CSS is The Zen of CSS Design (ISBN: 0321303474) which has loads of really great applications of CSS - made by the creators of http://www.csszengarden.com. This book is ideal for people who have come from a design background and looking to venture into designing for the web.

Hope that helps,

 

[rendezvouscp]

That's not strictly true - you can style XML using a CSS document.

XSL, however, is what CSS is to (X)HTML for XML, and XSLT is a step on from XSL.

'Tis true. One little letter in an acronym makes a huge difference. I did mean XSL... Additionally, you can include XML in XHTML, and style it with CSS, right? But it'd be weird to style XHTML with XSL, or pure XML with CSS, right?

I'd like to add another one of these questions. I was reading about future standards, and I was curious where XHTML was going. I had a huge surprise: XHTML 2.0 is coming with these huge renovations that are "really weird" (for example, the <a> tag isn't really needed anymore since you can attach the href attribute to almost anything, like <li>).

So here's my question. Does anyone know where the web technologies will end up? It seems like XML is trying to take over content, while XHTML is just a step to make people start using XML. What's really going on, and is there any way to keep at the real forefront of it all?
-Chase

 

[mrjamin]

So here's my question. Does anyone know where the web technologies will end up? It seems like XML is trying to take over content, while XHTML is just a step to make people start using XML. What's really going on, and is there any way to keep at the real forefront of it all?
-Chase

The idea is to make the fabric of websites extendible, so you can take the content of a website, and aggregate it elsewhere, or even take the content, define your own styles and then pump it into a DTP app etc. According to Tim Burners Lee:

Q: What sort of technology should the forward-looking geeks in my company be looking at?

You probably have a lot of people using XML by now. You should have someone looking at the next level - RDF. Tell them not to worry about the syntax, but check out the model. This is a question of looking the data your company is storing and transferring, and making sure that it can be represented in that simple circles-and-arrows RDF way. This is very simple. An important trick is that you use URIs to identify the arrows as well as the circles. Doing this homework will ensure that you have a well-defined data model, which will allow you data to be combined, merged with any other RDF-model data. It will mean you will be able to multiply the power of separate application areas by running RDF queries and new RDF-based applications across both areas. It will mean that you will be there with talent which understands the basic model as the Semantic Web becomes all-important.

Other things to watch: SVG - Scalable Vector Graphics - at last, graphics which can be rendered optimally on all sizes of device. The user interface world is rapidly becoming competent at voice input and output an W3C has standards in that area coming along. XML Signature will let you to digitally sign XML documents - find out how. But in general, always check out the W3C home page for what's new.

If your company/organization/self is a W3C member, then your Advisory Committee representative has the task of understanding everything which is happening in W3C, and everything in your company, and seeing where they should be introduced.

Back when HTML was in its infancy, only a very basic set of tags existed, and it was very much geared towards being easy to code, so HTML could be sloppy as the browser didn't actually have too much work to do to render it as a website. As the WWW got a little more advanced, HTML became very messy - using (God-forbid) tables to lay out a website, poorly nested elements, unclosed tags etc. With CSS, a lot of internal styling became completely redundant, so XHTML 1.0 Transitional was, as it suggests, a transitional set up with a view to easing the way forward to XHTML Strict.

Now one of the fundamental things of the web is structuring content, with a view to that content being processed, indexed, parsed and even created by a machine as opposed to it being easily created by humans, so well-formed HTML was necessary, and XHTML Strict (almost) conforms to XML schema. XHTML 1.1 is basically pure XML, but still recognisably a website - XHTML 2 is pretty much pure XML, so you could feasibly grab it, and import it into InDesign, for example.

One of the big things coming about in XML for the web (and computing in general) is meta-data, which is what RDF does for your code.