Your SlideShare is downloading. ×
Web Design
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Web Design


Published on

Web Design Strategies -

Web Design Strategies -

Published in: Technology, Business
1 Like
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / WEB DESIGNSemantic HTML markup: o Tags applied to convey meaning and content structure o HTML5’s new elements and attributes such as <nav>, <footer>, <article> and <aside>, which replace common generic block <div> and inline <span>, or new <audio> and <video>, which replace generic <object>.Enhanced searchability and relevance o Up-to-date is imperativeInternal and external communications o Integrate a Submit an RFP form on your website with a lead generation database, such as SalesForce o A CMS function such as a Contact Us form or Submit Your Questions tool can enhance communications between lapsed or potential clients and you.Progressive Enhancement (PE) o Create websites that are accessible to all devices, using a layered approach with a set of core principals stressing accessibility of content and functionality. o Content layer = rich semantic HTML markup o Presentation layer = CSS and styling o Client-side scripting layer = JavaScript or jQuery behaviorsPresentation styling and CSS o Semantic markup found in HTML5 o Evolving CSS3 standards o Colors, images, backgrounds, gradients, shadowing, text effects and moreQuick updatesContent Management System (CMS) o Used in meetingsAdaptive Images o A PHP script that works on any website, can help in this regard o Detects screen sizes abd re-scales versions of your HTML imagesFitText o The JQuery plugin o Will allow you to resize your fonts and ensure that they fit where they are supposed to regardless of the device or browser.PhotoSwipe o Free HTML/CSS/JavaScript libraryLess FrameworkSkeleton o Use of a lightweight 960-grid
  • 2. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / o Lightly styled forms, tabs, buttons and other elements that form the basic foundation of any mobile website. Responsive Design Usability o Keep things the same Rapid prototyping o Process of quickly mocking up the future state of a system, and allowing all stakeholders to provide input, to see that input thought out visually, observe users using it, and finally, to participate in an open discussion about what is learned. o A way to visualize, influence, explore, discuss, learn, test, fail, and iterate the user experience o “Neutral” artifact owned by all.Tools Aptus o Mac App for testing your responsive, adaptive, or mobile site at custom screen sizes. o First, select the desired screen sizes and user agents of your ‘devices.’ o Then load your site’s URL. Test it at those set breakpoints. You can also take screenshots of websites with the app, and it has the full WebKit inspector built-in. o Aptus doesn’t allow you to preview local files. Instead, you have to use a local hosting solution such as MAMP, and test your site that way. Also, you can’t paste a URL into the path bar, which makes the app useless compared to the bookmarklets available. RWD Bookmarklet by Victor Coulon o It’s easy to view your design at iPad and iPhone sizes, in both landscape and portrait orientation. o There’s even a button to toggle the onscreen keyboard, so you can optimize your forms for iOS devices. o Lack of custom screen size values. The Responsinator o Display your site inside the frames of popular smartphones and tablets. o Just enter a URL, and preview it on an iPhone, iPad, Kindle, and too many Android phones. PHP5 o PHP - o PHP - Front-End Development o What does a front-end web developer do? - o Great User Experiences Require Great Front-End Development - great-front-end-development.php
  • 3. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / o Front-end development feeds to follow - development-feeds-to-follow/ o Front-end Code Standards & Best Practices - o 10 Skills to Become a Frontend Developer worth Millions - CSS (Cascading Style Sheets) o CSS Tutorials - o Cascading Style Sheets - o CSS Beginner Tutorial - o Cascading Style Sheets - Wordpress o - o Developer Documentation - o WordPress - HTML5 o HTML5 - o HTML5 Tutorial - o Browser Test - o The Power Of HTML5/Javascript: A GameBoy Color Emulator In Your Browser - emulator-in-your-browser/ o Mobile HTML5 over-hyped; not suited to enterprise - enterprise-130812 o Responsive HTML5 magento themes and WordPress themes – SmartStart - smartstart/ Jquery o jQuery - o jQuery UI - o jQuery - o jQuery Tutorial - o 50+ Amazing Jquery Examples- Part1 - jquery-examples-part1.html o jQuery Tools - Few Examples - an industrial painting contractor – a daycare, after school care, and summer camp provider – a lifestyle and business coach blogger – a couples and individual counselor
  • 4. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / - a non-profitHelpful Resources 7 Essential Books on Responsive Web Design You Do Not Want to Miss miss.html 4 ways a content management system makes it easy to keep your website fresh, keep-your-website-fresh/ Top 10 Responsive Web Design Tutorials development/responsive-web-design-tutorials Understanding progressive enhancement techniques in web design, techniques-in-web-design/1809 Responsive Web Design for the Ultimate User Experience - ultimate-user-experience-0243274 Rapid Prototyping the User Experience - 3 Tools for Testing Responsive Web Designs - testing-responsive-web-designs/ What Content Marketing Can Learn From Your Closet - from-your-closet-0242649 The Benefits of ‘Responsive Web Design’ - blogs/design/the-benefits-of-responsive-web-design/ 7 Tools for Responsive Web Design - responsive-web-design/ Separate Mobile Website Vs. Responsive Website - presidential-smackdown/ 10 Top Principles For Web Design (6) – Usability - principles-for-web-design-6-usability/ Responsive Web Design & What it Means for Future - responsive-web-design-what-it-means-for-the-future.html