Windows -> Actions
> (button in top right corner of actions box)
> New Set (name)
> New Action (name) — recording

Image Size
[] untick resample image – redo resolution – OK

File automate -> Fit image
(keep the x and y the same) OK

File -> Save as -> Place
File close (For save for web must have “No, don”t save original” after close)

Actions -> Stop button

File -> Automate -> Batch

Source -> CHOOSE (button) (supress color profile warnings)

p.s. – open an image before you start this procedure.

Here”s a link to the pre-sliced Photoshop image: mac_browser_sml.psd

Add some extra padding to the bottom and a reflection to the bottom of the browser frame to get that web 2.0 look.

Here”s the CSS

#browserWrap {
float: left;
margin: 0 12px 12px 0;
}

#browserWrap .browsershot {
width: 306px;
background: url(images/mac_browser_bot.gif) no-repeat bottom left;
margin: 0;
padding: 0 0 6px 0;
float: left;
position: relative;
}

#browserWrap .browsershot a {
width: 305px;
background: transparent url(images/mac_browser_top.gif) no-repeat top left;
margin: 0;
padding: 20px 0 0 1px;
float: left;
display: block;

}
#browserWrap .browsershotscroll {
width: 306px;
background: transparent url(images/mac_browser_scroll.gif) repeat-y right;
margin: 0;
padding: 0 0 0 10;
float: left;
z-index: 2;
}
#browserWrap .browsershotscrolltop {
background: transparent url(images/mac_browser_scrolltop.gif) no-repeat top right;
margin: 0;
width: 100%;
z-index: 3;
}
#browserWrap .browsershotscrollbot {
width: 6px;
height: 15px;
background: transparent url(images/mac_browser_scrollbot.gif) no-repeat bottom right;
margin: 0;
position: absolute;
bottom: 6px;
right: 0;
z-index: 3;
}
#browserWrap img {
border: 0;
}

The mark-up

<div id="browserWrap">
<div class="browsershot">
<div class="browsershotscroll"><div class="browsershotscrolltop">
<a href="/log/"><img src="/images/blog/website_thumbnail.jpg" width="300" height="263" alt="Eklog" /></a>
<div class="browsershotscrollbot"></div></div></div></div> <!– /.browsershot –>
</div> <!– /#browserWrap –>’, ‘Browser shots

Wikipedia will tell you that the international symbol for accessibility is the wheelchair symbol. The International Commission on Technology and Accessibility have designated (and copyrighted) this as the International Symbol of Access (ISA).

The symbol is clear, and it denotes wheelchair access. An alternative to stairs or other obstacles which obstruct the access to wheelchairs will not be found where you see this symbol.

Here are a few symbols that could be used as an alternative to a wheelchair:

In the world of the world wide web, access is not about limitations or disabilities, it’s about alternative ways of accessing shared information.

Some people like to use their finger tips or a little plastic mouse to peruse their digital feeds, as odd as that may sound, and some people like to use their ears, and others use their mobile devices or computer game consoles.

If you don’t have keyboard access for your user interfaces, people with physical disabilities may not be able to navigate your site, and people with touch screen phones may also be denied access. If your movies don’t have captioning they’ll be missed by people with visual impairments and automated internet robots (search engines use these to access to your site’s content).

The symbols could denote adherence to the following:

• Content is accessible with a screen reader
• Content is clear with CSS and JavaScript turned off
• Visual content has alternative text
• Moving visual media is captioned
• User interface controls have keyboard access
• Hyperlinks have titles describing the links destination
• Text can still be accessed when enlarged or reduced in size

Handy accessibility link: joeclark.org.