The document provides tips for designers to help developers better understand design considerations for web development. It suggests that designers get an understanding of content management systems and how content can be structured, ask developers about existing solutions, use logical file naming and layer structure in Photoshop files, think about reusing page elements, discuss the differences between responsive and mobile designs, set realistic deadlines, communicate about costs based on a project's value rather than hourly rates, and discuss technical requirements like cross-browser compatibility, grid systems, and high-resolution assets up front to help projects go more smoothly. Good communication between designers and developers is emphasized as important throughout the design and development process.

1. Things Developers
wish Designers ‘got’
(in no particular order)
@nudgemelbourne@thewebprincess

2. Get an
understanding of
CMS & Content
i.e. Titles can be more than one
line - Content can be in long or
short form - (i.e. design meets
real-world use - think beyond the
Lorem Ipsum)
@nudgemelbourne@thewebprincess

3. Existing Solutions
Ask the dev if they have an existing
solution to accommodate your design
ideas... (Jquery library, plugin/
slideshow etc.) this saves the dev time
This is win/win in action
@nudgemelbourne@thewebprincess

4. Photoshop Best
Practice
Use logical file naming and layer structure
Provide fair warning for the dev about
design file format if it’s not PSD - Don’t
assume they’re all over (or even have access
to ID etc) (InDesign? Illustrator? Photoshop,
PDF or Fireworks?) - But realistically PSD pls
@nudgemelbourne@thewebprincess

5. Illustrator
If you MUST design for web in
Illustrator don’t outline your text...
But seriously... see below
(PSD = #winning)
@nudgemelbourne@thewebprincess

6. Widget Use
Think about reusing widgets on
page templates rather than a
different widget/content block on
every page - ok so this is WP
specific... but different content on
every page layout can be a p.i.t.a
@nudgemelbourne@thewebprincess

7. Responsive v
Mobile
Get across the differences between
a responsive layout over a
dedicated mobile design -
responsive layout flows existing
elements to fit - it isn’t a whole
new design
Don’t limit to fixed size (i.e. must
look like this at xxxpx etc.)
@nudgemelbourne@thewebprincess

8. Realistic Deadlines
Talk first and set reasonable
deadlines
Don’t keep asking ‘When will it be
ready?’ (talk about deadlines
upfront, agree, trust the dev to do
it - and to communicate if things
need stretching)
@nudgemelbourne@thewebprincess

9. Value versus Cost
I hate telling you how much I
think it will cost (hourly rates,
time taken to do the job etc.)... Tell
me what it’s worth to you... let’s
negotiate on that basis...
@nudgemelbourne@thewebprincess

10. Pixel Perfection
comes at a price
If you want your site to be EXACTLY the
same as the PSD be prepared to pay... it takes
time... it takes skill especially the further
back in IE you go.. (also fonts WILL look
different across browsers)
@nudgemelbourne@thewebprincess

11. On all Singing/all
Dancing sites
If you have promised the client the
world... make sure you’ve talked to
your dev about just what a world
that will be... BEFORE you make the
promise
@nudgemelbourne@thewebprincess

12. Fonts
On font sizes - measure in pixels NOT points -
& don’t use half pixels there is no such thing!!
Get across websafe fonts... helvetica neue is not
on typekit or google fonts... costs dollars... and
bitchy to implement via fonts.com (in my
experience)
Default font size on browsers is 16px - design
for that
@nudgemelbourne@thewebprincess

13. Width and Height
How will your design look on a big screen?
What happens to your background image?
Stretch? Tile? Something else?
Is your layout in finished pixel dimensions
i.e. at web resolution? (if not, insert wrist
slashing motion here)
@nudgemelbourne@thewebprincess

14. Grids
Let your dev know which grid
you’re using... OR ASK them which
they’d like you to use
If you’re not using a grid... WHY
NOT? (Seriously it will save you
money and save the dev time;
more win/win)
@nudgemelbourne@thewebprincess

15. Give up on IE 6
Seriously
or if you insist... sit down while I tell you what that
will cost - (think double)
@nudgemelbourne@thewebprincess

16. Retina
Get familiar with what you need to provide
as far as 2x images for retina displays... and
provide them
get across and use the naming convention
too... save your dev some headaches
this may mean buying bigger stock images or
making your elements in vector rather than
raster format
@nudgemelbourne@thewebprincess

17. Communicate
All in all, a lot of the designer/
dev issues could be solved by
talking up front... and during the
process... for it is written...
“assumption is the mother of all
fuckups”. (Jeff Crabtree)
@nudgemelbourne@thewebprincess