Responsive Web Designing Tips - iprismtech.com

1
Responsive Web Designing Tips

• www.iprismtech.com

2
Responsive Web Designing Tips

• Responsive design has become the new web
  standard. Many companies have accepted the
  challenge and have created specific design
  solutions (such as mobile only) or have attempted
  to address the issue cross-platform. In this
  article we look at several tips to help with your
  design process and make it more efficient.
• Tips for Responsive Web Designing
• Planning
• Prototyping Software
• Mobile Strategy
• Navigation
• Colour inspiration
• User flow

3
Responsive Web Designing Tips
Planning As always, planning is the number one
priority. Once you solve your design challenges
on paper, you are ready to build your
site(s). Prototyping Software One such
program is Adobe Edge Reflow, which allows you to
make use of media queries, set breakpoints within
the program and design your layouts to fit
desktop, tablet and mobile. You can then copy the
CSS into another program such as Adobe
Dreamweaver or other HTML editor to further
refine your design.
4
Responsive Web Designing Tips
Mobile Strategy This is where you build the
mobile site first, then scale up and build the
tablet and desktop designs. One of the major
concerns for all three is the logo and/or text.
If the text is easy to read on the mobile device
then you shouldnt have any issues with the
tablet or desktop. Navigation If your site has
only 2-3 navigational menus, you could include
those in a simple menu on the screen. If there
are more menu elements, you might want to
consider creating a single icon that opens into a
drop down menu of additional menu items.
5
Responsive Web Designing Tips
Colour inspiration Were already fans of Adobe
Kuler Martin Beeby has uncovered a use we hadn't
thought of "I'm colour blind and so when I'm
putting colour palettes together for a project I
always reach for Kuler," he explains. He also
recommends Colour Lovers - a creative community
where members share colour schemes, designs and
ideas. User flow Want to know what to do with
the rest of those Post-its? "You can expand this
exercise by planning out your user flow on a
series of Post-it notes," adds Elliott Fienberg.
"I guarantee your project will be far more
focused." Other sticky notes are available, of
course, including virtual Sticky Notes on Windows
and Stickies on OS X.
6
Responsive Web Designing Tips
Visit www.iprismtech.com Whatsapp/Call
8885617929 Like facebook.com/iprismtech Tweet
Twitter.com/iprismtech
7
Responsive Web Designing Tips
Thank You For Watching