Is this placement of <a> and <ul> legal?

Problem with that thinking is that most of the time you aren’t getting architects plans – you’re getting a oil painting of a house by someone who’s never learned architecture. It looks like a house, doesn’t meant it will actually stand upright.

Even if working from a PSD when writing the HTML you should pretend it doesn’t even exist, and if you hit up against limitations of the medium you need to be ready to pitch that pretty painting in the trash. To be brutally frank I consider the entire current approach being taught/advocated in the industry of sleazing out a picture in photoshop, working up a template and then shoe-horning the content into it to be the leading cause of broken layouts… and as a large font/120dpi user and a netbook users, all these fancy fixed width often with fixed height element garbage sites you see vomited up for small businesses and cruddy little personal websites are exactly that – BROKEN, inaccessible rubbish. It’s putting the cart before the horse.

Semantic markup of the content (or a reasonable facsimile of your content) first, bend that markup to your will to make the layout with CSS… then and only then do you start up the goofy paint program to hang graphics on it. The result may not be as artistically pleasing, but its’ a HELL of a lot more useful.

Because at the end of the day, people do NOT visit websites for the goofy graphics you hang on the content, they visit FOR the content… so putting the content as the first priority usually means a more successful site instead of the megabyte-plus sized monstrosities people are vomiting up and calling websites of late. Having worked in art/print before doing websites that was a hard pill to swallow – but my code and practicality of design benefited from taking all the artsy preconceptions and throwing them out the window.

Which is why the majority of successful websites aren’t exactly a graphical tour-de-force. eBay, Amazon, Google, Slashdot, the majority of forum skins… Just enough graphics to be pretty, not so much it gets in the way and certainly not wasting time vomiting up a PSD.

It’s also why I often refer to some things people try to do in HTML/CSS as “But I can do it in photoshop” idiocy. The web is not a static width delivery system, a desktop resolution screen is not/should not be your only target device, the web is not print… With the entire purpose/point of HTML being to deliver content to an endless combination of widths, heights, fonts, and device capabilities – ranging from teletype to print, from braile to screen reader – drawing a pretty picture for just one target (or even multiple targets) before you have semantic markup is just idiotic at best, completely crippling one’s ability to use HTML for what it’s actually FOR.

NOT that the majority of people sleazing out HTML 3.2 and slapping a 4 tranny or 5 lip service on it have any clue what the point/purpose of HTML is, and just keep their heads firmly wedged up 1998’s backside. Concepts like multiple media targets, separation of presentation from content, caching models going Pow-zoom-phwee right over their heads.

Part of my increasing disgust with the industry as a whole, part of why I’m visiting less and less websites as they are increasingly USELESS to me as a user, and part of why I can’t believe ANYONE is DUMB ENOUGH to be drinking the HTML 5 kool aid.

Don’t care how pretty the picture is, if the end result is bloated, slow and inaccessible, what in blazes good is it? Unless of course you’re “polishing a turd” by hanging pretty graphics on something without actual content of value – in which case it’s just a drain on everyone’s resources.

Sure, but the person giving me the mockup will not be doing the markup just like the architect will not necessarily be building the house. The builder will build the house and I will build the markup. If the person who made the mockup attempts to do the markup as well, then yes, it will probably be a mess just like if the architect builds the house then the house will probably fall over at the first hint of a breeze. But I can still create semantically correct and valid markup from a mockup (psd, hand drawn sketch etc etc). I just find it easier to create the markup if I know what the end product needs to look like.

Really the pretty painting is usually the request of a the client. Even people who don’t know how to work PS (at all) are not learning to do flexible shells for web designs… they want as a recent forum post to be “able to to fix the text given as per client request”. In order words, you do this o r you don’t eat. Ignorance is trickling UPHILL.

My question would be… what makes those LI… if they’re LI why do they need P inside them? What makes the text P? If it’s all one anchor, what makes it go inside a list?
Exactly, This was my original response.

Semantic markup of the content (or a reasonable facsimile of your content) first, bend that markup to your will to make the layout with CSS… then and only then do you start up the goofy paint program to hang graphics on it. The result may not be as artistically pleasing, but its’ a HELL of a lot more useful.

If given the semantic INTENT, a good Art director can cast a flexible and appealing template/interface, even before the actual content is placed. We forget what CSS is for STYLING. If this is considered during the creation of the graphics to support the CSS this is actually quite easy to accomplish and with only minor compromises at most. Again the problem starts with the facts that many clients only understand linking/not liking an oil painting.

As we concurred before, we don’t know the actual semantic intent of the OP. Is he trying to save tags ( as code economy is also twisted into a buzzword by some) because he sees that all links lead to the same URL? Is this beacuse of a poor background graphic/interface design? Is it bad copy and information architecture? Maybe each line is being pulled from a DB… as a LIST of data… but marketing has decided they all point to the same point of purchase. PSDs are not the only thing that ruin semantics.

So I hope you’re at least asking for multiple layouts for all those resolutions people have, right? A 320px version, a 480px version, a 600-780px version, a widescreen version and maybe even a TV version?

If I have the content and know what’s considered important by the client for the users, I can mark that shizzle up regardless if the user is viewing on a crappy sleaze1000 connection with Opera as a proxzy browser to save bandwidth, or sitting at a conference using a netbook, or relaxing at home behind a desktop, or being silly and using the Nintendo Wii-mote to move the silly onscreen cursor with great care and little precision to that link or button (yeah a friend of ours watches YouTube videos on his Wii cause the TV’s obscenely big).

I may not CSS it without seeing a layout, and I may end up adding some sandbags or whatever to the markup when I know which UAs I’m expected to support… but the importance of the content and what users MUST be able to do, versus what would be nice for them to do… Lorum Ipsum and a PSD at 1200 pixels wide can’t tell us that. That’s why I say it’s secondary.

But as Dresden said, clients are the ones who usually require that (a pretty layout), and yes it seems more web developers start with a PSD. But that’s them. They’re working harder now that “responsive” has become the trendy new buzzword. Or, the graphic designers they’re working with are.

I discuss numerous issues with my clients during the planning stage of their website.

Did your comment get cut off?

nope, I accidentally put a comma instead of a full stop at the end. Sorry about the confusion :frowning: (fixed now)