blog.aaziz.org » Geek http://blog.aaziz.org ramblings and opinions of a geek Fri, 30 Apr 2010 18:11:26 +0000 http://wordpress.org/?v=2.9 en hourly 1 I Hate CSS http://blog.aaziz.org/i-hate-css http://blog.aaziz.org/i-hate-css#comments Fri, 04 Dec 2009 17:16:48 +0000 Anthony Aziz http://blog.aaziz.org/?p=145 My latest project at work is a bit confidential, but I can say that it has me designing a webpage. I grew up on this stuff and I’ve almost entirely self-taught myself it. This time, I was given the design prototype, and didn’t have to worry about the actual design of the document.

But it was still a huge bitch. I began by reading up on some extra CSS articles. Maybe this time I’ll try absolute positioning instead of floating divs. It has its own issues. Creating web pages is fun for me … up until I run into the issues. I seems the W3C specs aren’t designed to make things easy for web designers. Some of the most common practices in web design are using CSS specs that aren’t designed specifically for layouts. Absolute positioning is generic – it’s useful for positioning arbitrary elements, which has a lot of use in layout design, but it has limitations and problems. Using floating divs and wrappers and margins to create a particular layout is using these tools for something other than what they are design for.

Take float – it’s a property to make text flow around an object. It wasn’t designed to create columns on a webpage. And there’s no CSS property that creates columns, or a header. In simple cases and the beginnings of large projects, working with a web layout seems simpler than a desktop application layout. All you need are some elements and style rules – no worry about creating objects and adding them and listening for events.

But I’m beginning to wish we had a better approach to creating webpage layouts. Something that’s actually designed to create web forms and two-column pages. The SWING library for Java is a good example. It was designed to create layouts for people to use an application. CSS is designed to style documents. It does have its uses, and that is styling documents. But there are a lot of cases where that doesn’t apply. I would guess that the majority of uses of CSS are either web applications or websites (with columns, headings, footers, and the whole bit) I have no clue what the actual distribution is, or if even the majority of cases are that way, actually, but you can’t argue that there’s a lot of cases like that. And CSS simply doesn’t lend itself well to that.

I’m not saying to abolish CSS. It needs to be improved though, perhaps split into separate specifications. Give me something where I can layout a page as easily and reliably as I could with a table, without the actual horrible atrocities of table design. I’d like something where I can say “this element is going to be a left column that spans from below the header to the bottom of the document” and “the element is going to be a horizontal menu whose items are centered and spaced evenly”. I’m sure some would say that was too specific. Rules that would be used to do that simply would be very narrow-focused. But there are so many cases where this could be used.

CSS is about separating the content from the design. But we should be able to separate parts of a CSS document: style and layout. Fonts, colours, paragraph spacing, etc, are all design properties. Floating divs and absolutely positioned footers are all things that make up a layout. I haven’t looked into to HTML5 much, so maybe there’s a step in the right direction, but what about something like this?

<html>
<head>
	<title>FGC Sample</title>
	<style>
		page {
			width: 800px;
			horizontal-position: center;
		}

		header {
			width: page-width;
			height: 100px;
			color: white;
			background-color: black;
		}

		navigation {
			nav-style: horizontal;
			item-spacing: equal;
			item-position: center;
			background-color: blue;
		}

		item {
			color: white;
		}

		item:hover {
			font-weight: bold;
			background-color: green;
		}

		content#aside {
			type: column;
			top: auto;
			bottom: document-bottom;
			width: 300px;
			position: left;
		}

		content#aside h1 {
			text-transform: uppercase;
		}

		content#main {
			type: column;
			width: auto;
			position: center;
			height: auto;

			color: black;
			background-color: blue;
		}

		content#main #execphoto {
			float: left;
			margin: 5px;
		}

		footer {
			width: page-width;
			font-size: 0.8em;
			font-style: italic;
			color: grey;
			background-colour: black;
		}
	</style>
</head>
<body>
	<page>
		<header><img src="header.png" /></header>
		<navigation>
			<item href="#">Home</item>
			<item href="#">Products</item>
			<item href="#">About</item>
			<item href="#">Contact</item>
		</navigation>
		<content id="aside">
			<h1>New product launched!</h1>
			<p>We have launched a new product XXBBYY</p>
			<p>Herp derp derp</p>
			<p>FARBLE GARBLE FBRARFGARFGB</p>
		</content>
		<content id="main">
			<h1>Welcome to FarbleGarb CO</h1>
			<img id="execphoto" src="mrfarble.png" />
			<p>At FGC we have pride and garbs to make you garble in pride.</p>
			<p>These paragraphs will float around that image like in regular CSS</p>
		</content>
		<footer>Copyright &copy; FarbleGarb 2009</footer>
	</page>
</body>
</html>

I don’t even have to tell you what it would look like, really, because the CSS explains it. Not perfectly, perhaps, but that’s why I’m not working with the W3C to design the next specs. I’m not even that great of a web designer. But I do know what problems I run into when I’m working on a website, and all the articles across the web that take a genius to get a properly flowing 3-column layout with variable length columns and a footer.

I doubt there’s going to be anything like this soon, or even not soon. CSS3 is barely implemented, and IE still has troubles with most of CSS2 and some of CSS1. But I can dream (and rant), right? One day I’m going back to party like its ‘99 and make a table-based layout. Yes, <font> tags and all.

(I’m extremely interested in other folk’s opinions. I know there are a lot better web designers out there, and I know they don’t read this blog. But if there’s any post that I think deserves commentary and discussion, it’s this one.)

]]> http://blog.aaziz.org/i-hate-css/feed 10 Meatcard Challenge SUCCESS http://blog.aaziz.org/meatcard-challenge-success http://blog.aaziz.org/meatcard-challenge-success#comments Fri, 26 Jun 2009 19:09:47 +0000 Anthony Aziz http://blog.aaziz.org/?p=116

Yesterday I wrote about some photos we took for a challenge to win laser-etched beef jerky. Well, we were successfull! They even gave them a name: The Basement Series. I’m waiting to see the other submissions, but there hasn’t been too much activity. Anyone who’s reading this and thinking about it – JUST DO IT. It was hilarious fun.

I’ll get some photos of the stuff when I get it in. I’m thinking they’ll be A FIRE GIANT cards. Angelo wrote about it, too. I also think there was a segment of it on G4’s Attack of the Show (which I don’t get anymore, boo expensive cable).

]]> http://blog.aaziz.org/meatcard-challenge-success/feed 1 A Fire Giant Studios presents Frank Frazetta paintings reimagined http://blog.aaziz.org/a-fire-giant-studios-presents-frank-frazetta-paintings-reimagined http://blog.aaziz.org/a-fire-giant-studios-presents-frank-frazetta-paintings-reimagined#comments Fri, 26 Jun 2009 00:58:44 +0000 Anthony Aziz http://blog.aaziz.org/?p=110 Today I spotted a weird yet intriguing contest on tor.com, saying they’ll give business cards etched into beef jerky using lasers to the first 15 people who photograph a live recreation of one of three Frank Frazetta fantasy paintings. And guess what, we did it. Hit the jump to for pictures and more info.

We grabbed some props, and a bottle of Baijiu that tasted horrible. Then we got to work. We’ve tweeted these on @aazizorg and @GatesAndLogic, and hopefully we’ll get at least one set of those tasty looking business cards, but perhaps taking three different pictures will get us each a set! The first three are the ones we submitted, the others were less than stellar shots. I wish we would’ve been able to do even more, but damn, for such short notice and little amount of props. Check them out an share your thoughts, or post links to your own. Damn are these imagines awesome.

(Damn wordpress media uploader isn’t working – click the links below)

Moon Men (& first photo)
Fire And Ice (& first photo)
Cornered (& first photo)

If I do get some awesome laser jerky, I’m gonna take pictures of it and possibly frame it. I’ve gotta come up with something awesomely nerdy and witty to put on them. Looking for ideas. By the way, the other bro is Angelo, check out his blog.

]]> http://blog.aaziz.org/a-fire-giant-studios-presents-frank-frazetta-paintings-reimagined/feed 5 My favourite feeds http://blog.aaziz.org/my-favourite-feeds http://blog.aaziz.org/my-favourite-feeds#comments Sat, 13 Dec 2008 02:17:31 +0000 Anthony Aziz http://blog.aaziz.org/?p=87 Google Reader has become one of my most-used applications online. I never used to read RSS feeds – just a few here and there. But then I found some great ones.

Lifehacker (www.lifehacker.com)

Many geeky things, this place has original posts, as well as passes on posts from a large variety of other sites. The comments are very active – it’s a large part of the experience. They even have weekly posts dedicated to comment talk.

Hack A Day (www.hackaday.com)

This is a more techy/geeky place. A lot of harder mods and software projects from all over the place. I don’t really do any of the stuff posted here, but I like to see the cool ideas and fantasize about what I’d do if I had such mad skills. For instance, check out the frikkin sweet robo-dog.

Clientcopia (www.clientcopia.com)

This site is great for anyone dealing with Customers or users. It’s pretty much a pile of funny, bad, and awkward Client/User/Customer situations.

DailyLit (www.dailylit.com)

Not a blog, but full books, in email or RSS! You can “subscribe” to a book, most of them free, and have incremental parts emailed to you, or published to a private RSS feed. I first read A Place So Foreign, which got me into Cory Doctorow, and now I’m really into Down and Out in the Magic Kingdom. If you like reading, this is a great thing to have around during workdays. You can take a short breaks (5 minutes, maybe) every once in a while to read the next piece.

There’s a bunch of others I enjoy, too:

Computer Science Canada Blog – A great blog from a great community, talking about the study of computer science.

Zeroth Code – A member of CompSci.ca, he posts some interesting articles on computer science topics, like Python tricks and opinions on Canadian copyright law.

Futility Closet – Many odd facts, math quizes, and weird stories. No comments, though, which sometimes displeases me.

Dragonmount, WoTMania, Robert Jordan’s Blog, Brandon Sanderson’s Blog – great news updates and other information for any Wheel Of Time fan. Also, the Wheel Of Time newsgroup at Dragonmount is pretty good.

xkcd comics and blag - The comics are great, and the blag even put to test the airplane-on-treadmill conundrum that has kept /b/tards a /g/eeks arguing within themselves for ages.

And of course… Laura’s blog (and Sophie’s too!) doesn’t get updated (ever :( ), but she’s still pretty funny and I get bonus points for linking it.

I’m always on the look out for other good feeds, so if you’ve got any, let me know…

]]> http://blog.aaziz.org/my-favourite-feeds/feed 0