In this Issue...
 INTRO
| A Fresh Look...
PixelMill is excited to present our new, fresh site
design and logo. We look at this redesign as the beginning
of our renewed focus and direction for PixelMill with a "building
blocks to success" model focused on providing you with the
products, education, and resources you need to continuously
add new features and functions to your Web site and
presentation portfolio. Stay tuned as we'll be building on
to this new foundation with more new and exciting solutions
you can use easily and effectively. We hope you find the new
site as refreshing as we do.
This month we also launch our new online seminar series
focused on helping you transition from tables-based sites to tableless CSS-based sites and from FrontPage to Expression
Web. These 'online seminars' are run in a classroom-like
online environment where attendees can participate and ask
questions within a maximum group size of 25 attendees. The
series are broken out into 6 weekly, 1-hour sessions to
allow time to focus on each specific subject. I encourage
you to review the article below, which will give you
more details and a link to register for these valuable
events.
Continuing her series on CSS this month, Corrie focuses
on Layers and Layout. If you use "layers" in Dreamweaver,
FrontPage, or Expression Web, or are new to the idea of
different approaches in CSS layouts,
then this is the article for you.
Finally, we have decided to re-run the ProStores Design
Certification Program article from last month. We feel this
is a very important opportunity for any Web site designers
in our community. This is your chance to receive some
excellent insight into one of the leading ecommerce
environments. Don't wait any longer. Get started today!
Thank you again for your continued interest in our
newsletter and for being a valued customer. Expect more from PixelMill
and yourself!
by Jason Reckers, President & CEO -
PixelMill Inc.
 ONLINE SEMINARS
|
Transitioning from Old to New
PixelMill introduces our first series of Online Seminar set
in a classroom-like environment. These fee-based
online seminars are essentially webinars but
provide the benefits of:
- Small Class Sizes - 25 attendees max
- Multi-week, 1 Hour Sessions - Oodles of content
- Toll-Free Conference Call Audio - Verbal Q&A
capabilities
- Video Recordings - Review seminars in your slippers
- Live Instructors - Raise your hand if you're not
sure
Over the last year, much of the Microsoft FrontPage
community has been struggling with the transition to
Expression Web. We have all had to change to newer versions
of software in the past. That's not the issue here. The
challenge is two fold this time. Not only is there a need to
transition to a new piece of software with a new user
interface, but also a growing need to adapt to web standards
that push for more CSS with fewer tables and ultimately no
tables.
Upcoming Online Seminars:
FrontPage to Expression Web Series
This is a 6-Week series designed to give you strong exposure to the new
Expression Web software and interface, along with tips
for transitioning from FrontPage. This series will
feature the following sessions:
-
The Expression Web Interface
Session 1: Sept. 18
-
Moving to Standards:
Semantic Markup and HTML
Session 2: Sept. 25
-
Introduction to CSS
Session 3: Oct. 2
- Expression Web and CSS
Session 4: Oct. 9
- Accessible Sites with Expression Web
Session 5: Oct. 16
- Scalable Sites for the Future
Session 6: Oct. 23
Time: 10:00am - 11:00am PDT
Registration: $149
Early Bird: $99 (Register by Sept. 14th)
Act Fast! - Only 25 Seats Available!
Tables to Tableless CSS Series
This
is a 6-Week series designed to help you transition from
building Tables-based Web site layouts to working
with CSS to edit and build Tableless Web site layouts.
For all Web builders using Dreamweaver, Expression Web,
or any other web editor.
This series will feature the following sessions:
- Beautiful Simplicity - About CSS Layouts
Session 1: Sept. 20
- The Basics
Session 2: Sept. 27
- Fun with Backgrounds
Session 3: Oct. 4
- Powerful Link Formatting
Session 4: Oct. 11
- Basic Static Layouts
Session 5: Oct. 18
- Q&A Session - Dedicated to answering your questions
Session 6: Oct. 25
Time: 10:00am - 11:00am PDT
Registration: $149
Early Bird: $99 (Register by Sept. 14th)
Act Fast! - Only 25 Seats Available!
by Jason Reckers, President & CEO -
PixelMill Inc.
 FEATURE
| Layers and Layout
Now that we're past the CSS knowledge
Level 3 mile marker with last month's newsletter article
about some basic CSS layout, we're ready to tackle Level
4: "CSS? Oh! Yes, I use divs for all my
layouts."
These people create layouts that are carefully crafted with
absolutely-positioned and layered divs. (Perhaps they use
"layers" in Dreamweaver, FrontPage, or Expression Web to
create their layouts.)
If you're new to the concept of what
"absolutely-positioned and layered divs" are, try
taking an existing HTML page that already has various
content on it and add this code to the page:
<div style="width: 200px; height: 100px;
background: #ffc; position: absolute; top: 100px; left:
200px;">
This is an absolutely-positioned div!
</div>
The first few properties give the div a width, height,
and background color so you can see it. When you set the position property to absolute,
it knocks the div out of the "flow" of content and puts it
in the coordinates that you specify. So that code can go at
the top of your HTML, at the bottom, or anywhere in the
middle, but the style properties put the box where you tell
it to go. You can achieve some layering effects, also, by
overlapping divs and setting the z-index property to affect
the stacking order.
The Level 4 description describes web sites that are
completely made up of these absolutely-positioned divs,
where each section -- or even subsection -- of content has a
width, height, and position. Often, editors (such as Dreamweaver,
FrontPage, Expression Web, or some other editor) refer to
these absolutely-positioned divs as "layers."
While people in Level 4 are definitely on the right track
with attempting to use CSS for layout, layers built in this
manner aren't
necessarily the best thing for a site. Here's why:
- If you're using an editor to create layered
boxes, you're most likely generating a lot of excess
code that isn't really necessary.
- By focusing on the layout of your site -- the way it
looks -- by making lots of different layers, the HTML itself
probably isn't semantic or meaningful. This results
in poor search engine optimization, poor accessibility, and
poor compatibility with other types of technologies (such as
mobile devices).
- The layers usually have a set width and height,
which means that the layout isn't flexible for
content that might grow.
So what is the "right" way to build a CSS layout? There
are two main approaches that many people have accepted for
achieving a column layout using CSS. Both involve using
content divs, but in a more flexible and semantic manner
than typical layers.
- Use content divs that have a defined width
and set the float property to get them to line up
next to each other to form columns.
- Pros: Pretty easy to grasp the concept and is a
foolproof way to have a footer that clears the
bottom of the colors.
- Cons: If the content inside of a float is too
wide, the next float may drop down under the
too-wide float in some browsers.
- Use content divs that have a defined width
and absolutely position them to line up next to
each other to form columns.
- Pros: Positioning columns makes intuitive sense,
and you don't have the too-wide float problem as
described above.
- Cons: It takes some
hacks to have a footer that clears the columns.
#2 is the exact same concept as "layers," except with the
main difference of using the div thoughtfully and
semantically, and controlling the position yourself instead
of depending on the editor to figure it out for you.
There are many resources for learning to use both
methods. I personally started with floats (#1) and have been
transitioning to absolute positioning (#2). If you'd like to
learn more,
HTML Dog has a nice basic overview of both methods with
lots of working examples. Other resources you may find
helpful are glish.com,
barelyfitz's quick overview of positioning, and
Smashing Magazine's comprehensive list of resources.
In next month's newsletter, I'll give an overview of what
semantic content means and an overview of my typical
workflow when I'm creating a new site so you can see how
design, semantic HTML, and CSS flow together for me!
by Corrie Haffly, PixelMill Staff Writer
 ANNOUNCEMENT
|
New PixelMill Look
PixelMill wraps up the summer with a new home
page and cleaned-up site with a new look and feel.
We've also been able to add some features that
customers have requested.
- The new home page has been simplified to bring you
quickly to the product catalog or PixelMill area that
you're interested in visiting. Be sure to check out the
top product searches and support searches listed in the
bottom right column!
- We've also fully converted all of our pages to CSS-based
layout for faster loading.
- The simplified URL makes it easier for you to let us
or others know which page you're looking at.
- The left column has a new Browse section for
distinguishing between tables-based and tableless CSS
templates.
- Product pages show your recently viewed products at
the bottom of the page for your convenience.
- Web template product pages now clearly indicate if a
layout is CSS-based or tables-based.
by Corrie Haffly, PixelMill Staff Writer
 DESIGNER
OPPORTUNITY
|
ProStores Design Certification Program
PixelMill started working with
ProStores, an eBay
Company, almost
two years ago. Over the course of those two years we
have built a catalog of
ProStores templates built specifically to work
on the ProStores platform. When we started with
ProStores we were confident
that their ecommerce platform was one of the best long-term
solutions for PixelMill customers, and
they have proven us right all along the way.
Not only does ProStores provide the unique combination of an affordable solution with virtually unlimited flexibility in store design,
but now they have taken the unprecedented step of
building a training and certification program designed just
for you.
The
ProStores Design Certification Program
provides Web site designers and builders:
Training:
- Free Training Videos
- Designer Starter Kit
- Live Interactive Webinars ($)
Exposure: (Upon program completion)
The program is focused on teaching you to build custom designed stores
around the ProStores solution. Most ecommerce platforms have
'Developer' programs, but
ProStores now provides one of the first Designer-specific
programs we have seen.
Steps to Certification:
- Study and Review Training Materials
- Purchase, Complete, and Submit Exam ($99)
- Approval - Exam results will be sent back to you
with feedback and either a Pass or Retake result.
- Submit company profile
- Receive Logo and Designer Directory Listing (upon
approval)
Jump on this
opportunity today - join the elite group of ProStores
Certified Designers and grow your business with ProStores. I'm confident you will be happy with
the results and the additional opportunities it drives.
Start
Training to become a ProStores Certified Designer Today!
by Jason Reckers, President & CEO -
PixelMill Inc.
|
