Page layout and styling questions/hopes

[guy]

Apologies if I get things wrong, I am new here and not really a language developer anyway - just a dumb page designer. I have four pet hates for HTML 4/XHTML, which I am hoping HTML 5 will address:
- No wiki-style "transclusion" (beyond the rudimentary idea of frames). This makes it hard to re-use standard objects like navbars, without resorting to an alien scripting language.
- Minimal page layout features, requiring hijacking of table semantics to do pretty much anything.
- Use of a confusingly different language, CSS, for styling.
- No "menu bar" style drop-down lists, so I can't do desktop-lookalike "application windows" without more of that alien scripting.

Firstly, will the new iframe stuff allow usable transclusion (e.g. wiki-type template functionality)? If so, something equivalent to <includeonly> and <noinclude> would be very cool.

Secondly, I can see nothing in the spec to do page layout or element styling, other than heavy use of CSS - shudder! Is that intentional? Much of the commoner CSS stuff could be so easily adopted into an HTML-flavor syntax. I am darned sure that if no better (i.e. equally easy, which CSS is not) alternative to using Tables is provided, we dumb bunnies will continue to lay our pages out that way - and there are more of us.

Thirdly, the spec does include those drop-down menus, doesn't it? I find it hard to interpret from a dumb bunny perspective.

[wgabrie]

1. The real power for embeding external pages is to use Server-side includes with PHP. But if you use a free server than chances are you can't use it. There are only three choices for client side includes: <iframe>, <object>, and javascript. Yes, it is a pain.

2. HTML 4 set CSS as the style direction. If you liked HTML 3.2 you'll also like CSS. It can do everything previously possible and more. If you want to use styles yourself look at the CSS section of w3schools.com. There are also free CSS layouts and tools online already made.

I can find nothing in the HTML 5 spec about inline CSS styles. This is odd because html and xhtml 1.0 lets you add a style attribute to any tag, though it was taken out of xhtml 1.1.

3. If you are looking for drop-down menus, you'll want to look at a List of CSS tools (scroll down to the navigation section). CSS is the real secret behind the fancy navigation on many websites. Drop-down menus are really just bulleted lists with style added.

[guy]

Thanks for that. I'll follow up those CSS menus, though I'd rather hoped that a Form element could be used.

The main pain of it all is that as a simple designer I am expected to know (X)HTML, CSS, javascript and PHP (or ColdFusion or ASP or...) - that's at least four languages, each with a wildly different flavor from the others. As far as I am concerned, there should be a clean break between the design language used for display and the coding language/s used by developers. I just want *one* language that I can use to design *everything* visible in a web page (OK except the images).

One thing I will say: XHTML has never properly caught on (check the source code for this page, for example: mindless lip service to <br /> and such, but not a well-formed declaration). IMHO this is because it tries too obsessively to be developer-friendly. As a result, it fails to provide a clean break between design and development - and worse, it actually attempts to impose restraints on designers, to constrain how we work - it tells us we are sloppy and talks down to us. So we designers tend to prefer good ol' slush-tolerant HTML4, with very good reason. If HTML 5 follows this trend, then it will not catch on either and we should all find something better to do instead. I want HTML 5 to be like 4 but more powerful (Indeed, isn't this the whole point of jumping off the XHTML bandwagon and back onto HTML?). If it can also be made more aesthetic for developers that's fine - but never make the mistake of thinking that's what it's for. Consider MediaWiki and blogging. Here we have basic markup which is dead simple to pick up. So the world has done. This kind of phenomenon highlights the direction we should be moving if HTML 5 is to mean anything at all - usability. </rant>

[wgabrie]

No one is expected to know all the web languages. A few people study one of the programing languages. And if they're nice than they put free tools online for the rest of us. Most people, like myself, just use x/html markup. If you want drop-down menu links than it is javascript you want. Drop-Down Menu Generator

Well, xhtml-1.0 is the same as html4. However, the w3.org is directing xhtml-2 towards a very differant, unfriendly language. That is why the whatwg.org was created and made x/HTML5. If you want to create web pages the only necessary knowlege is html. Although the current direction with style and formating is to seperate it from the html.

[bfrohs]

Here's my view on things. I've been a web designer for 5+ years now (at age 19) and I have had to learn a lot to catch up with the rest of you. I have never been one to work under anyone, so I decided to go the freelance route. This has forced me to learn HTML (and XHTML when I came upon it), CSS, JavaScript, and PHP. I have become quite fluent in all of these languages and have to say I'm glad they are separate. They are separate for a reason too.

(X)HTML: Content and Organization (text blocks, lists, etc)
CSS: Styling (colors, backgrounds, sizes, etc)
JavaScript: Browser-side Scripting
PHP: Server-side Scripting

Each of the languages are set up differently because each deals with a completely different part of the website. To put all of them together would be a move in the opposite direction and would destroy all of the organization that has been gained from the separation of the languages. Once you learn the basic syntax of each language, you find it much easier to use it. I'll give a nice, short cheatsheet below (basic syntax) for HTML and CSS.

HTML

<sometagname someattribute="somevalue">text</sometagname>

CSS

tagname { attribute:value; }
.classname { attribute:value; }
#idname { attribute:value; }

I hope this is of use to someone. Thank you.

If you want drop-down menu links than it is javascript you want. Drop-Down Menu Generator

A drop-down menu can easily be done with CSS. If you do not have enough experience with CSS to create one on your own, check out CSSPlay. There are a ton of examples and many of them can be used on your site without worrying about providing a link to the author. (some require link)

[zcorpan]

A drop-down menu can easily be done with CSS.

http://lists.w3.org/Archives/Public/pub ... /0262.html

[bfrohs]

A drop-down menu can easily be done with CSS.

http://lists.w3.org/Archives/Public/pub ... /0262.html

You can get around this by allowing the main entries to be links as well as the menu items. This would allow for CSS dropdown menus and also allow for the menus to be accessible by click-only devices (which would see the menu after clicking the item...either by JavaScript or on a new page).