A Real Web Design Application
jasonsantamaria.com
jasonsantamaria.com
He mentions "true to browser type rendering" multiple times, which basically means "shitty type rendering." Browsers, at worst IE and followed closely by Firefox, are horribly bad at performing proper antialiasing for some reason. (The only exception to this rule is Safari, which does a decent job.)
I don't think we should bring the ridiculous shortcomings of browsers backwards into our design/mockup apps. I think we should continue designing stuff in a way that doesn't force us to conform to the lowest common denominator. Sure the depictions we might see in design apps are not strictly "accurate", but I don't have problems watching the graceful degradation of my designs through the various browsers.
It's the browsers that need improved type/graphics rendering, the not mockup/design applications that need to bow down to them.
----
Finally, I don't know if it's actually a good idea to create a web-focused design app yet. We're still in the very early days of the web, and I don't think the long term conventions and standards are in place yet. We're in the flux. The blank, non-assuming canvases in Photoshop and Illustrator are good for fostering new ideas and pushing forward the state of art on the web.
That those apps weren't designed strictly for the web might end up being a net positive, especially as we go into the future and define what the web will look like in the long term.
Also, a web-focused app may not be necessary, but I think a digital-focused app is (well, I guess that would be Fireworks). Photoshop and Illustrator really are terrible tools for designing digital applications, for the simple fact that working with pixel-level detail is a pain in the ass (e.g. try making a 92px by 147px rectangle with no sub-pixel edges in one of those applications). Fireworks actually comes pretty darn close to what Jason is asking for, but Adobe seems to neglect its core functionality in favor of expanding on useless export options and plugins.
And I still don't think there will be a tool that makes code better than a hand, not that such a tool couldn't assist in a great way. TextMate snippets and CSS preprocessors maybe, but that's not exactly WYSIWYG to HTML.
If you're interested in helping test it or have any feature requests, shoot me an email (see profile) or leave a comment below.
Mine too, and me too.
If you would like some help, the email is in my profile.
I took down your email. With your help, we can.
Of course Photoshop is incredibly expensive so I can see a market for a <$100 app.
- type rendering looks nothing like any browser or OS (as described in the article)
- subpixel rendering makes drawing shapes and lines with clean edges a chore.
- direct selection tool is difficult to use and therefore makes the layer palette the primary means of selecting layers, which becomes tedious with large files
- no support for multi-page documents
- positioning and resizing objects at a pixel-level is difficult
- slicing and image export system is kludgy
- no support for symbols
- objects with rounded corners are a pain
Do you use Photoshop for 5+ hours a day designing web layouts? I'd imagine you'd have a hard time going back to Photoshop after using an application that is better suited for interactive design. I actually started using Fireworks a couple years ago, and while I pretty much hate it, I will never again use Photoshop to design a website.
It was a company practice at my first job — didn't have much choice.
I've always found Illustrator to be equally bad for web, though. It's a vector tool, but the web is still a pixel medium.
For me: Photoshop for manipulating photos, Illustrator for illustration, Fireworks for web/application layouts (although it can handle some basic photo editing and illustrating, which makes it even better for layouts).
"Why Webkit? Do we really want a design application that is specific to a single rendering engine?
WebKit is just one option. Gecko could work too. I guess with the advent of Safari for Windows and Chrome, WebKit just seemed like the go-to. I don’t actually know that it’s important which browser gets used, just so long as it’s on a healthy development track and is consistent enough to be predictable. Whatever the option, it wouldn’t replace testing in the browser, just merely provide a consistent window to it."
Well http://en.wikipedia.org/wiki/KompoZer is exactly that. A web design app that uses a real web layout engine.
You've got a spec from Jason Santa Maria - is anyone going to go create? :)
But I've always left it on the burner because, as technology stands today, it'd have to be an installed application. Importing a bitmap and deleting its background pixels, complicated vector drawings, etc. etc. would be impossible (or so damned difficult/manpower intensive as to make them near impossible) to build in today's browsers. And for me to be interested in sinking several years of my life into it, it'd have to be a webapp.
So, I just end up waiting for someone smarter/ballsier than I to do it. And waiting...
My vision is something where you can create and use templates for stuff like header, menu, columns, footer, implement styles for fonts, edit styles such as gradients, shadows, corners.
Interface should be something like hovering to see which elements are affected by the current rule, and then picking attributes and changing them.
Basically a WYSIWYM for CSS3.
I am certain something like this will appear this year.