Web design and development trends

2.  Web development - a broad term for the work
involved in developing a Web Application for
the Internet (WWW) or an intranet (a private
network).
 Consist of:
◦ Web Design,
◦ Web Content Development,
◦ Client-side/Server-Side Scripting,
◦ Web-server and Network Security Configuration,
◦ E-Commerce Applications.
etc.

3.  Web design encompasses many different skills
and disciplines in the production and
maintenance of web applications.
 Basic Areas:
◦ Web Graphic Design,
◦ Interface Design,
◦ Authoring,
◦ Writing Standardized code,
◦ Search Engine Optimization.
etc.

4.  1989 - while working at CERN Tim Berners-
Lee proposed to create a global hypertext
project, which later became known as
the World Wide Web.
 1991 – HTTP, HTML1
 1993 - W3C which is responsible to set web
standards, Mosaic
 1994 – Netscape, HTML2, PHP
 1995 – Mozilla, Internet Explorer, SSL, HTML3,
JavaScript, Apache
 1996 – Java, Flash, XML, CSS, Hotmail

5.  1997 – HTML 3.2, HTML4, RSS
 1998 – CSS2
 1999 – Ajax, Web Fonts
 2001 – Wikipedia
 2002 – Safari
 2003 – iTunes Store
 2004 – Firefox, Gmail, Facebook
 2005 – Opera Mini, jQuery, YouTube
 2006 – XML HTTP REQUEST 2, Twitter
 2007 – First iPhone(iOS & Mobile Safari)

6.  2008 – Chrome, HTML5, Android
 2009 – CSS3 (Exciting Features: Transitions,
Transform, Animation, Gradient, Flexbox etc.),
Firefox for Mobile
 2010 – HTML 5 Date/time input types, Audio
Video Elements
 2011 – WEBGL JavaScript API for 3D, Content
Security Policy, Touch Events, Chrome OS ,
CSS3 Filters

7.  Web designers use a variety of different tools
depending on what part of the production
process they are involved in.
 Web graphic designers use vector and raster
graphics packages for creating web formatted
imagery or design prototypes.
 Technologies used for creating websites
include standardized mark up which could be
hand coded or generated by WYSIWYG editing
software.

8. Web Design and Development

9.  This is the next web design generation.
 With RWD a site is crafted to provide an optimal
viewing experience—easy reading and navigation
with a minimum of resizing, panning, and
scrolling—across a wide range of devices from
desktop computer monitors to laptops to mobile
phones.
 It is currently on top of the list of web trends.
 It has the ability to eliminate problems related to
the size of the layout.
 It looks promising in terms of working really well
on all of the devices and should make things
better for all of the web designers.

10.  These new design standards are ever growing
with new features.
 W3C has made a lot of headway in garnering
support from the most popular browsers.
 There are lots of good things for the future of
HTML5/CSS3 web development.
 Front-end designers were often overlooked
previously but no more! Front Designers are
GREAT! Their work have great importance to
the entire composition process.

11.  Steve Jobs famously
refuses to allow Flash
on the iOS due to the
many bugs and crashes
it experiences,
therefore HTML5 is
going to be a must for
those who want to
develop apps and iOS-
friendly websites.
• After Steve’s remarks and Google started HTML5-
friendly version of YouTube, many developers
started to how important this system will become in
the near future.

12.  These days many websites have both vertical and
horizontal scrolling for their mobile versions, which is
not very user-friendly because of too much actual
scrolling that a user has to make in order to see the
whole picture.
 Vertical scrolling will provide an easy and convenient
way to navigate the website. It allows scrolling a page
down with a header menu at the same time without
having to go back to see the menu,
 That is a vertical scrolling of buttons and menus with
the same kind of navigation for social buttons and
shopping carts.
 Its very much user-friendly approach in optimization
of websites.

13.  Large buttons, headings, full-width images
and full-sized sliders.
 As touch screens getting more and more
popular each day, oversizing of the objects
becomes unavoidable.
 This trend semi-originates from the
popularity of Mac OS X icon designs.
 As developer began to launch websites for
their Mac applications they enormous sizes
icons in web too as represented in branding.

14.  This technique now comfortably rests within
modern design culture.
 This style may lead to certain deceleration of
the websites, because bigger items need
more graphics and it will of bigger size.
 If web designers face difficulties with that
problem this trend may set out pretty soon.
www.panic.com/transmit

15.  The popularity of iPhone, iPad along with
Android-powered phones means designer have
to implement all touch commands on websites.

16.  Who can say they honestly don’t enjoy free
downloads? … NO ONE
 Web designers have been sharing their content
online for years, but only recently has this
become a very popular trend among digital
artists.
 There have been some communities offering free
downloads for web and graphic designers. (Eg.
downloadpsd.com, designmoo.com).

18.  This is all about 2D objects being placed on different
layers and being scrolled in the same direction at
different speeds with the closest layers moving the
fastest. That gives the impression of 3D.
 We will see a lot of parallax effects in the use of web
design.
 Previously it was mostly related to video games.
 Nowadays it is being used as a refreshing addition to
highlight a special event such as product or website
launch, or integrated into general webpages like
‘Home’ or ‘About’ to optimize the look and feel of
something standard.
 … and we all expect to see a lot of parallax scrolling
effects on regular websites.

19.  Fonts are a big part of the web design
tradition. The most notable fonts including
Arial, Helvetica, Georgia, and Trebuchet MS
have been around for years now.
 Although they continue to in web standards,
there are plenty of alternate options for
advanced webpage typography.
 There is a great deal of fonts to choose from
due to widely available typography variations.
And designers tend to prefer stylish
typography designs

20. • Typography is the
foundation of any
website so it is surely
going to win
important position in
web design.
E.g. Typekit only requires a couple lines of code to be included in
document head and a designer can specify which font names to
include and append them into your CSS. The best part on this is that
it relies on JavaScript, so the end user isn’t required to have the fonts
installed.
Another alternative is Google Web Fonts which behaves in a
similar manner to Typekit.

21.  Modal boxes are still fairly new to the Internet but
they’ve been appearing in desktop software for
years.
 The purpose of a modal window is to offer box
content (such as registration or login) on top of the
current page without loading onto a new one.

22.  Its simply because it remains the best tool for
interactive video, animation and 3D online.
 Many big brands will shift from Flash, to
HTML5 and CSS3. BUT for entertainment sites
like small games, Flash is – and will remain!
 In gaming, there could be an even bigger
return to Flash. Clients will try to steer things
towards HTML5, because that’s where the
hype is, but some may think its right to steer
back towards Flash.

23.  The importance of social networking sites will
continue to grow.
 Facebook, Twitter, Google+, Youtube,
Pinterest, Path, Instagram, Tumblr, Spotify
etc. will continually success on their way.

24.  The set-up of many companies will be atypical.
 A new generation of designers and developers
will enter to the workforce in a flexible time with
a variety of technologies at their fingertips,
 They will find jobs, network, and acquire new
skills from their bedrooms, the corner café, or
any place around the world.
 With a growing number of high-profile tech
companies embracing a mobile and distributed
workforce, employers looking for top-notch
talent need to re-evaluate their workplace
culture.

25.  This is something to expect from all web
designers.
 ‘the simpler the trendier’.
 Front-end frameworks will be seen around.
◦ Among them are such front-end frameworks as
Twitter Bootstrap, WordPress, and many others.

26.  Stop compromising standards and rushing
out poorly planned and poorly implemented
projects.
 Stop cutting corners and instead put in the
effort required to deliver your clients
exceptional value.
 Client will react positively on those attitudes
and understand that websites are never truly
finished, along with being more accepting of
an agile process.

27.  As web designers, they just don’t think to
build websites. They should also offer a
service to clients.
 Developers shouldn’t be obsessed just with
user experience, code and design that and
forget other important factors such as good
communication, understanding business
needs and exceeding client expectations.

28. 2013 will increasingly find designers and
developers pushing the boundaries of new
technology, experimenting, throwing away
what doesn’t work or that which has been
replaced with something better, and working
out new best practices based on what we now
have to work with.

29. Saroj Pandey
sarojpandey.com.np
Blog: weblog.sarojpandey.com.np
isaroz.tumblr.com
http://twitter.com/itscoolsky
http://fb.com/isaroz