인텔이 만든 HTML5hub.com

http://html5hub.com

WSJ : http://online.wsj.com/article/SB10001424052970203537304577030033160849296.html

http://realtime.wsj.com/korea/2011/11/14/html5-%EC%9B%B9%EC%9D%84-%EB%B3%80%ED%99%94%EC%8B%9C%ED%82%A4%EA%B3%A0-%EC%9E%88%EB%8A%94-%EA%B8%B0%EC%88%A0/

HTML5: A Look Behind the Technology Changing the Web

HTML5: 웹을 변화시키고 있는 기술

일련의 프로그래밍 기술인 HTML5는 스티브 잡스가 이례적 에세이에서 홍보를 한 지 1년 반이 지난 지금 웹 분야의 새로운 표준으로 빠르게 떠오르고 있다.

HTML5 기술을 통해 인터넷 브라우저에서 이용자들의 행동에 대한 다채로운 이미지와 효과를 보여줌으로써, 추가 소프트웨어 설치 없이도 마치 게임을 하는 듯한 쌍방향적 소통이 가능해진다. 개발자들은 HTML5를 사용해서, 특정 하드웨어나 온라인 스토어에 대한 맞춤형 앱 없이도 자신들이 개발한 컨텐츠를 다양한 스마트폰과 타블렛PC, 컴퓨터에서 구현할 수 있다.

.

8 Tips for Print Designers Switching to Web & Digital Design

More designers are working across platforms these days, switching back and forth between print and digital projects. Although much of the theory is the same, in practice there are a lot of technical differences when it comes to working on something that will be printed versus a website. It takes a specific set of knowledge and skills to work effectively and efficiently in both environments.

But it is possible. Here we share eight tips for print designers making the switch to digital projects. (And I can vouch for every single tip as a designer who has made the switch.)

Design is Fluid

One of the things that does not change in print design is size. Every document is designed and printed at a certain size. (And frequently on a single medium as well.)

This just is not how the web works. Every user could look at a website using a different browser width and height, or look at the site on a mobile phone or tablet. So every design must account for a variety of sizes and devices.

Familiarize yourself with responsive design, what it is and how it works. Responsive design (sometimes called RWD) is an approach to website design where sites are created to view optimally regardless of device – desktop, tablet or mobile. Designers create the design using fluid, proportion-based grid concepts and flexible typography and images.

In addition to size changes, space is “unlimited.” As a designer you are not stuck in the constraints of a 4 by 6 inch postcard or 11 by 17 poster. The canvas goes on for as many pages as you like and can scroll almost infinitely.

Learn a Little HTML

If you want to design for the web, you have to know the basics. And you can start by training yourself. (Check out this previous Design Shack article for a list of great places to start.)

Start with a little HTML, the language of the web. With just a little understanding of HTML, you can learn to easily change colors, fonts and sizes on a website. HTML is the foundation that everything web-based is built on and without it, you will struggle in digital design.

Once you get comfortable with the basics of HTML, branch out to CSS and basic code. CSS, or Cascading Style Sheets, allow you to create and alter a set of styles for your website based on a style sheet. It creates a set of design rules and can be used to create website hierarchy and maintain visual consistency. Understanding basic coding concepts will help you understand why things work they way they do on the web. Although coding looks like gibberish at first, it makes sense once you really start to look at it.

You don’t have to be a master of HTML or CSS or code to create a great digital project, but it will help tremendously.

Create Dynamic Content

Print design is innately flat. Text and images are rest on top of some type of paper or other flat surface. Digital design is dynamic and active. Remember this and use it to your advantage.

Objects can move, include sound or links and even tools that make items pop up or hover when the user gets close to them. Web and digital projects should be designed for the user experience. This might be quite a change from some of the philosophies you are used to in the print world.

It is also important to use common visual cues and user interface actions so that your website works in a way that users expect and know how to use.

Color is Different

Print designers work in CMYK. Digital design is based in RGB or HEX color.

Just as CMYK color is explained using numbers to represent color values of basic hues to make every possible color, RGB works using the same concept. RGB – red, green, blue – are mixed in different amounts to create every color in the digital spectrum.

The difference is in how colors are created. CMYK – cyan, magenta, yellow, black – is created by combining colors in the printing process. RGB is a combination of colors displayed in light.

Colors are named with RGB values (from 0 to 255 or each color) to create 16 million different combinations.

HEX values are an extension of RGB color and every value corresponds to an RGB color. A HEX value is simply the HTML expression of an RGB color. Colors are named using # followed by a six-digit number, where each number pair refers to red, green and blue. (HEX values also contain letters to represent numbers greater than 99.)

Understanding Web Typography

Print designers may be used to the idea that they can use any font and have an unlimited number of typefaces available. (Depending on licensing, of course.)

Web typography can be somewhat trickier, although it is improving all the time. The biggest challenge is understanding type and browser compatibility. Not every typeface will render the same way on different devices.

Then there are basic web standards and readability concerns that come from reading on a screen. Like it or not, sans serif typefaces are pretty much the standard when it comes to body text on the web. And the often-shunned typeface Arial, is everywhere. Why? Because it always renders as Arial. No surprises there.

The rest of the things you know about type remain the same. Practice good kerning, leading and tracking. Scale text proportionately to other type and elements in the design for a neat, clean overall look.

For the last couple of months, flat web design has been really a huge topic on the web. Up to now, it is steadily dominating the web. From UI, to the latest portfolio update, icons and even the top web design blogs are now using flat web design, not to mention Microsoft, Android and just recently Apple is going flat too!

So why are so many designers using this style?

Flat design makes things free from distractions, eliminating heavy background images, swirls, grunge that makes everything cluttered. It’s very easy to navigate, since there are no more gradients, drop shadows, glows and bevels. It puts more focus on the text, making everything readable from big screens down to mobile.

Oh, and besides if you want something more than inspiration we have nice flat countdown timer video tutorial created specially for You!

Okay, enough talking. Time to check our collection of flat web design for your inspiration!

Agency

Blocklevel

Nitrografix

Conversionforge

Madebyfibb

Fhoke

PSD2HTML

Pexelplant

Playgroundinc

Northbounddesign

App

Sumall

Nextr

Geckoboard

Numbrs

Triplagent

Inky

Kippt

Publiq

Product

Winds Phone

Fitbit

Wistia

Mailchimp

Teamsort

Yourkarma

Fusionads

Kinhr

Portfolio

Adam Rudzki

Theissland

Sammrkiewi

Ivomynttinen

Evan Richards

Builtbybuffalo

Daniel Pertrarolo

Stedesign

Others

WDMTG

Mint Themes

BYNC

Redbull Studios

MTCDC

Tree House

Square Space

Chilicon Graphic

Dunked

Adayinbigdata

Top 10 Most Gorgeous Website Builders from 2013

WebStartToday.com

They say the devil is in the details, and nobody knows it better than WebStartToday. Business websites are its specialty and it comes prepared with an arsenal of over 1000 templates to match even the newest and eccentric fields and domains, from limo service to night clubs. Yes, websites for everyone, but that doesn’t mean this will kill originality. WebStartToday knows that in the near future everyone will have a website, and to this end it makes it possible to have different customization for the same template. That’s how the thousand templates multiply exponentially. All you need to do in the end is put your text instead of the dummy text and you’re done.

Cubender

Cubender is another web builder focused on stores and business, but not exclusively. It’s very versatile and it combines the ease of use with thoroughness. Features include e-commerce, SEO optimization, mobile integration, Google Analytics and many more. The service is not free, but a demo is included. In 14 days you can test and build your website and then choose a package, which – considering the service quality – comes at a bargain, starting at $9.95 per month.

Wix

You’ve probably heard of Wix, as it’s been around for quite a while. It’s a balanced web builder, not too fancy and not too simple either, good for beginners in the sense that it makes suggestions based on the business domains you choose. Another nice aspect is that it doesn’t rush you to buy a package. With its free unlimited demo, you can take your time and build your site, and when you are ready, choose your plan.

Webydo

What makes Webydo different from other web builders is its focus on the needs of designers. Since designers work with multiple clients, meaning they are creating multiple websites, Webydo has an awesome CMS that they can take advantage of. Designers can focus on the website and the design of it, while still give their clients control over elements of their choosing. This way, the clients will not interfere with the design and the designer can focus on the appearance. Standard DIY site builders do not always fit the needs of designers because they start to lose control of how the site looks. However with Webydo, there are no limiting templates – everything is fully customizable, making each website created on Webydo unique. Some tools used on the platform are grid generators, smart guides and snapping, layers window, text caption, form generators and more.

Webzai

Webzai is one of the easiest to use and straightforward web builders. You can either use the templates or start from scratch and build everything yourself. The drag and drop menu allows you to modify anything in real time and contains everything a designer might need. SEO optimization and cloud hosting are included. Alongside the free package, there are three more premium options, priced at $6, $11, and $20 respectively.

MadeFreshly

Without registering, MadeFreshly takes you right in front of your virtual shelf, where you start adding your products. You’ve guessed it, it’s an online store web builder. For customization, it offers a few templates, not numerous but well done, and some of them are free. Without a premium plan your sales are pretty limited, i.e. one picture per product and only three pages per site, but the good news is that the plans are priced at $11.99, $19.99 and $34.99 respectively, and include promotion service, mobile support and Google Analytics, and, unlike many other web builders, you can actually have your own custom domain name.

Aircus

Aircus is a revolutionary among revolutionaries. Unlike its other brethren, it is a neat and simple web builder, preferring mature and elegant designs without too much complication, and big letter fonts that are easy to read. That doesn’t make it unprofessional – style is its forte, but not for the over-sophisticated. If you want a site built right now and don’t have the time to go through thousands of templates, you might wanna take a look at Aircus. And since it started on the vibe of quickness, why not be revolutionary all the way and be available from any phone or tablet? That’s right, with Aircus you can build your site in a few easy steps no matter where you are.

Ucoz

uCoz website builder is a reliable SaaS (software as a service) platform offering the best cloud hosting solutions. It’s not just a site constructor, but it’s a powerful infrastructure enabling you to create, maintain, publish and optimize your website easily.

uCoz is loved for its beneficial free package. Some of the features you can get on this constructor for free are as follows:

• Unlimited traffic.
• Extended statistics.
• User group management.
• Knowledgeable, timely technical support.
• Ability to attach your own domain name.
• Custom email and many more.

uCoz is an absolutely risk-free platform: you can explore its feature set as long as you need without any fees. But once you feel you’re ready to build your website – you may opt for one of their paid subscriptions (starting with $3.09).

Kopage

Kopage is a quick, complete and user friendly service with a lot of elements available ranging from slideshows to videos and galleries, even HTML.But what’s really convenient about it is that you can have it installed automatically in Cpanel. If your hosting service doesn’t have the option yet, you can always ask them to do it for you. Kopage is completely free for usual users, charging only the hosting companies.