Archive for the ‘Web Development’ Category

CSSEdit 2.5 is out

Tuesday, April 24th, 2007 | No Comments

CSSEditWell, it seems like some people have been talking to some people. Almost the same day as Panic released Coda, MacRabbit released CSSEdit 2.5. The biggest news is the tabs, but there are more stuff to be happy about:

From the macrabbit blog

Tabs. Yes, this one may not come as a surprise anymore. However, I am sure you will be quite surprised once you try them out. Pictures simply don’t do them justice.

X-ray Inspector. This must absolutely be the most popular feature request of all time. Lo and behold, here it is: the X-ray inspector shows you what styles apply to the selected element in X-ray

Selector Builder. Selector what? This is a brand new innovation that should make life much, much easier for anyone starting out with CSS (or teaching it). Define your selectors in plain English, and it generates the necessary code for you.

Various improvements all over the application: a navigation bar in the Preview, a font picker, selector CodeSense, a text shadow editor, brand new shiny wonderful HUD inspectors, etc. Major changes everywhere!

Version 2.5 is free for all 2.x users and costs less than a pair of shoes for everyone else.

Using <h1> the right way

Tuesday, April 24th, 2007 | 2 Comments

Smashing Magazine publishes something called 35 WebDesigners - 5 Questions, which is basically a collection of handy tip for CSS designers. While most of it is an interesting read, some of the answers only reflects their personal opinions, like favourite fonts and how to use a <h1> properly.

I’m always amazed how popular it is to use the <h1> for logotype rendering using image replacements. A meaningful <h1> should reflect the page’s content, not the entire site’s author. I guess it’s a misunderstanding that came up when designers all of a sudden realized they needed a <h1> for search engine optimization and semantic meaning, but still wanted their logo on top. Which is an entirely different matter.

So here’s my noble opinion: It’s better to use a <span> for the logo and a good old <img> tag inside it, with a proper alt attribute of course. If the screen layout is negative, f. ex using a black background and white logotype, you can use CSS to replace the background image of that span to a positive logotype and hide the image using a negative text-indent in your print/handheld CSS file.

If you don’t want the <h1> to show in a layout - use display: none; on the h1 in your CSS file, don’t hide it in behind your logo.

From w3.org:

<h1> is the HTML element for the first-level heading of a document:

  • If the document is basically stand-alone, for example Things to See and Do in Geneva, the top-level heading is probably the same as the title.
  • If it is part of a collection, for example a section on Dogs in a collection of pages about pets, then the top level heading should assume a certain amount of context; just write while the title should work in any context: Dogs - Your Guide to Pets.

Unlike the title, this element can include links, emphasis and other HTML phrase elements.

The default font size for <h1> in some browsers have, unfortunately, motivated many writers and tools to use an <h2> element instead. This is misleading to tools that take advantage of heading structure of pages, such as Amaya’s
table of contents view
. Consider using Cascading Style Sheets, which are designed to express the author’s preferred font sizes corresponding to elements such as <h1> and <h2>

Panic Releases Coda - Grow Beautiful Code

Tuesday, April 24th, 2007 | 3 Comments

CodaPanic, creator of Transmit and other delightful OS X software has released it’s new baby - Coda. Coda is a web development tool for coders, not a WYSIWYG editor, even though is has a handy preview tab (it uses the Safari engine). A first scan of the application makes it quite obvious that Coda has “borrowed” some features and interface details from the popular TextMate, wich is not a bad thing since TextMate is an all-time favourite text editor for Mac. Some other handy features are the built-in terminal, easy site publishing and an integrated FTP editor (bye bye Transmit).

One thing missing from most popular text editors like BBEdit, TextMate and the new member Coda is the possibility to customize shortcuts. Especially for all of us who don’t use American keybboards, the shortcut for indenting text using “[” and “]” is impossible and very annoying.

From the creators:

So, we code web sites by hand. And one day, it hit us: our web workflow was wonky. We’d have our text editor open, with Transmit open to save files to the server. We’d be previewing in Safari, running queries in Terminal, using a CSS editor, and reading references on the web. “This could be easier,” we realized. “And much cooler.”

Roles for Accessible Rich Internet Applications

Tuesday, April 24th, 2007 | No Comments

Martin Kliehm has written a brief article at A List Apart where he takes a closer look at the Accessible Web 2.0 Applications with WAI-ARIA. Based on one of the most recent W3 family member Accessible Rich Internet Applications (WAI-ARIA) Suite Overview, Martin dives in to the the nest of role attributes as well as some of the states and properties W3 has been suggesting as the new accessibility drafts for web applications.

Roles are simply added as attributes into certain HTML tags, and they are already supported in FF1.5+. As far as I can see, roles makes a lot of sence just looking at the HTML. We are getting used to using tags like <ul> for navigation and other link lists, but how can a user agent tell the difference without proper markup? Main navigation lists are crucial parts of a document, and it deserves proper definitions. Roles gives us just that, and since it’s an attribute, it will not affect the rendering in “regular” browsers.

In other words: get used to adding some roles to your markup already now. It can’t hurt and it will most probably be a standard rule for the future.

Page 5 of 5« First...«12345

You are currently browsing the archives for the Web Development category.

Content

Archives

Externals

Feeds

Add

Users Online