Emerging Web Trends

Web Resources and Tools

This webography contains the most useful links pertaining to Web Design that I've accumulated in the past two years. I have and will continue to use them to stay abreast of technologies, trends and standards in the web development field. I reviewed many of my 600+ bookmarks and selected the following 47 to be the ones I'm sharing for this learning plan discussion. They are organized into tools, devtools, educational and resources sections. Each item-URL contains additional attribute(s) to help distinguish them. I included a brief description for most resources or tools. Since these are my 'top' favorites they rate the highest ... no junk here! The best in each section are the golden ones.


Tools

UXPin blog.uxpin.com/category/tutorials

Mobile Layout

A cloud app to create wireframes and prototypes for different kinds of devices and resolutions. It has version control features to save iterations and has collaborative functionality. Convenient drag & drop from a large Library of UI elements styled for the web, iOS, Android. Backups are performed daily.

Macaw macaw.co

Responsive Web Design

A web design tool that also writes semantic HTML and CSS from the design layout and diagrams. Very useful as a wireframing and mockup tool. First release in March 2014, it has gained a lot of of media attention for its new graphical approach to web design.

Snagit techsmith.com/snagit

Utility

The premier screen capture tool for Windows or Mac. Snagit 12 provides a full suite of image-capture functionality and can output many image format types and supports output to social media sites and dropbox. I also does video/audio capture.

Affinity Designer affinity.serif.com

Vector Art and Design

A low cost mac-only vector app, $50 one-time, that competes with Illustrator. A recent Editor's Choice winner at the Apple App Store. Although a first release as of Fall 2014, it has almost everything that is typically used in web design work and is impressive for being a new product.

MailChimp MailChimp Resources

Email Services

MailChimp has all the features you'll need to create an effective email marketing campaign. They provide many newsletter and email templates or you can add your own HTML email design. With their subscriber activity reports chart you can review collected data in real time. You can see who received the email, when they opened it, the exact links they clicked on, who bounced the email or who didn't open it. Mailchimp integrates with hundreds of apps and services, notably social media sites and CMS and Ecommerce software.

Screen Ruler screenrulermac.com

Utility

Measure anything on your Mac screen and perform accurate color sampling. It's quick to access and has magnification to make selections easier.

Animoto animoto.com

Video Creation

Free or low cost video creation tool to blend photos and video. Use for making business, photography, education, and personal video clips.

Colorzillacolorzilla.com

CSS3

ColorZilla for Firefox is an add-on that assists web developers and graphic designers with color related tasks - both basic and advanced. Ultimate CSS Gradient Generator is powerful Photoshop-like CSS gradient editor.


Devtools

Apple Developer Homedeveloper.apple.com

Apple Dev

Home site for all Apple development technologies. Free downloads of the latest development tools and SDKs

Mozilla Developers Networkdeveloper.mozilla.org

Browser Dev

Firefox developer tools and documentation.

Chrome Developerdeveloper.chrome.com

Chrome Dev

Chrome devtools, forums, languages and libraries, and Open Web Docs.

Twitter Developerblog.uxpin.com/category/tutorials

Twitter Dev | Social Media

Home site for all twitter development. Also includes sections on Twitter for Web Sites, documentation, forums, blog, and events.

FaceBook Developerdevelopers.facebook.com

Facebook Dev | Social Media

Home site for all FaceBook development.

JqueryJquery

JQuery Dev

Repository of free plugins for many uses: forms; animations; images; responsive; sliders; ajax; and scrolling.

JQuery Pluginsplugins.jquery.com

JQuery Dev

Repository of free plugins for many uses: forms; animations; images; responsive; sliders; ajax; and scrolling.

phpmyadminphpmyadmin.net/

PHP Admin

Documentation, wiki, and support tools for the use of administrating MySQL over the web.

Xcodedeveloper.apple.com/xcode

Apple Dev

Complete toolset for developing Apple apps.

Paypal Businesspaypal.com/us/webapps/mpp/accept-payments-online

Ecommerce Dev

Guide to setting up Paypal for use on a website. As a leader in on-line payment processing, the PayPal Business site is likely to continue to be a trendsetter.

Lesslesscss.org

CSS Dev

Less is a CSS pre-processor, meaning that it extends the CSS language, adding features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable.


Educational

W3schools.com w3schools.com

Web Design Languages

Rich tutorials for HTML/CSS, JavaScript, HTML Graphics, Server Side programming, XML, and Web Building.

Codecademycodecademy.com/learn

Web Dev Languages

Learn core programming concepts and syntax for the world's most popular languages.

CSS-Trickscss-tricks.com

CSS

Blog, videos, snippets, and forum.

HTML and CSS Tutorialslearn.shayhowe.com

HTML and CSS

Many tutorials for learning to code HTML and CSS for general and advanced developers.

Canvas tutorialdeveloper.mozilla.org/Canvas_API

CSS3

This tutorial describes how to use the canvas element to draw 2D graphics, starting with the basics.

Responsivedesign.is responsivedesign.is

Responsive Development

A wealth of information regarding responsive design with many sub-categories: typography; grids; navigation; design patterns; content; strategy (i.e. page layout, mobile vs. responsive; advertising, content delivery); articles; resources; and examples.

Safari Web Inspector Guidedeveloper.apple.com/library/safari

Mobile Layout

Everything you need to know to use the web inspector in Safari.

UX Foundations webdesign.tutsplus.com/series/ux-foundations

UX Web Design

Contains many tutorials and examples that will guide you into the world of User Experience. Through straight-forward introductions, the tools of the trade and more detailed workflows, these tutorials and articles will teach you to pay attention to the User Experience challenge.

HTML5rocks.com html5rocks.com/en/tutorials

Web Design

Contemporary tutorials for all elements involved with web design.

Codropstympanus.net/codrops/

Web Design

Tutorials for in-depth how-tos involving common web development and web design techniques. The articles section has a wealth of information about web design, web development and related topics. Here we also feature inspirational collections, opinions and articles about best practices.

Entheosweb blogblog.entheosweb.com

Web Design

Comprehensive web design blog with oodles of tutorials, resources, ideas and inspiration, and templates.

Adobe TV

Creativity

Adobe’s categorized listing of all their video channels.


Resources

Githubgithub.com

Open Source Code

Popular open source development repository. Most of the code can be downloaded and many of the contributors have links to demonstration sites.

gotomedia and gotoresearchgotomedia.com and gotoresearch.com

Web Design, UX

Sites of a successful web development firm, headed by our favorite consultant, Kelly Goto, is on the cutting edge of web design for optimizing user experience. These two sites describe their business services and expose us to trends in the making.

The Joomla! Extensions Directoryextensions.joomla.org

Joomla!

Contains almost 9,000 Joomla! extensions for free download.

Joomla! Documentationdocs.joomla.org

Joomla!

An online collaborative community manual for Joomla! users & developers.

Envato Marketmarket.envato.com

Web Dev Resource Store

An ecommerce marketplace that sells over 4.5 million digital products created by a global community of designers, developers, photographers, illustrators & producers. Major categories include: themes; code; video; audio; graphics; photos; 3D files; and animations. Great for inspiration and insight into trends as, for example, the themes for WordPress, Joomla, HTML, etc. include full demos.

Brand and Marketing Blogbrandmc2.com

Branding | Marketing

R. Jay Olson is a branding professional that I encountered in a prior work life. He is now an independent consultant working with big clients. He has a lot of insights from many experiences regarding branding and marketing from his life’s work. He also contributes often on LinkedIn.

FreeDigitalPhotos.net freedigitalphotos.net

Images

Oodles of royalty free images for smaller sizes and low cost, watermark free for larger sizes

WHATWG community whatwg.org

Web Standards

The HTML living standard.

Adobe Typekit typekit.com

Font service

Typekit is a subscription font service that brings thousands of fonts from foundry partners into one library for quick browsing, easy use on the web or on your desktop, and endless typographic inspiration.

50 Value Propositions for Ecommerce Retailersc. cpcstrategy.com/blog

Ecommerce

A great list of 50 ideas and practices to set yourself apart from the crowd pertaining to marketing

The Next Webthenextweb.com

Technology News and Trends

The Next Web is a technology focused media company founded in 2008. It manages several initiatives focused on international technology news, business and culture.

JoomlaWorksjoomlaworks.net

Joomla!

JoomlaWorks is developing and supporting some of the most respected and popular extensions in the Joomla! community, including the groundbreaking K2, AllVideos, Simple Image Gallery (Free & Pro), Frontpage Slideshow, SocialConnect and Tabs & Sliders.

Ezinearticlesezinearticles.com

Article Sharing

A winner site owned by our friend, Chris Knight, at SparkNET.

1stwebdesigner1stwebdesigner.com

Web Design

Their mission statement reads ‘In this rapidly changing Web Design world, 1stWebDesigner helps you to succeed and live rockstar freelancer lifestyle you deserve!’

awesomeweb - Freelance Web Design Postingsawesomeweb.com

Web Designer Profiles

A freelance marketplace that caters to freelancers. By topic, you can search for freelancers, see their wage rates and skills (much like LinkedIn) and then view their profiles which contain lots of portfolio works. This is our competition!