HTML5: Web Speech API

웹표준 2014. 2. 16. 14:45
- [W3C] Web Speech API Specification  
- Introducing the Web Speech API  
- An Introduction to the getUserMedia API  
- How to Use HTML5 Speech Input Fields  






 

'웹표준' 카테고리의 다른 글

HTML5: Web Speech API  (0) 2014.02.16
HTML5: Battery API  (0) 2013.12.20
markdown  (0) 2013.12.03
UI: twitter Bootstrap  (0) 2013.03.21
zen coding  (0) 2012.12.18
HTML5: Application Cache API  (0) 2012.12.12

HTML5: Battery API

웹표준 2013. 12. 20. 19:00
- [W3C] Battery Status API  
- [MDN] Battery Status API  
-  JavaScript Battery API  
-  How to Use the HTML5 Battery Status API  
- HTML5: Battery Status API  


 


 

'웹표준' 카테고리의 다른 글

HTML5: Web Speech API  (0) 2014.02.16
HTML5: Battery API  (0) 2013.12.20
markdown  (0) 2013.12.03
UI: twitter Bootstrap  (0) 2013.03.21
zen coding  (0) 2012.12.18
HTML5: Application Cache API  (0) 2012.12.12

markdown

웹표준 2013. 12. 3. 19:18
- markdown  
- Markdown.css    
- [editor] Dillinger  
- [editor] Haroopad  
- [editor] MultiMarkdown  
-
Markdown Tools and Editors  
- GitHub Flavored Markdown(GFM)   
- 10 Free Online Markdown Editors  

 

'웹표준' 카테고리의 다른 글

HTML5: Web Speech API  (0) 2014.02.16
HTML5: Battery API  (0) 2013.12.20
markdown  (0) 2013.12.03
UI: twitter Bootstrap  (0) 2013.03.21
zen coding  (0) 2012.12.18
HTML5: Application Cache API  (0) 2012.12.12

UI: twitter Bootstrap

웹표준 2013. 3. 21. 20:42
Bootstrap, from Twitter  [nhn articles]
- [번역] 부트스트랩  
Twitter Bootstrap Tutorial
Themes for Twitter Bootstrap  
- 80 Awesome Twitter Bootstrap Templates To Get You Started  
- 35 Great Twitter Bootstrap Examples For Inspiration  
Bootstrap Generator
- How to use Twitter Bootstrap to Create a Responsive Website Design  
- Getting Started With Twitter Bootstrap  
- 트위터 부트스트랩 유용한 플러그인  
- 18 Useful Twitter Bootstrap Goodies You Should Know  
- 트위터 부트스트랩을 써야하는 이유 10가지  
- Bootstrap3 Grid System  
- Using Bootstrap 3 With Sass  
- Bootstrap 3 Tips and Tricks You Still Might Not Know  

- 50 Must-have plugins for extending Twitter Bootstrap  
- Bootsnipp - design elements and code snippets 
- [무료테마] Bootswatch  
- [유료테마] Themes for Twitter Bootstrap  
- StyleBootstrap.info  
- [bootstrap hero] List of 308 Useful Twitter Bootstrap Resources  
- Beautiful Buttons for Twitter Bootstrappers  
- Start Bootstrap  
- [admin] 15 Free Bootstrap Admin Themes  
- [snippet] Bootsnipp  
- [playground] Bootply  bootstrap starter templates  
Migrating to Bootstrap 3  
- [tool] Upgrade to Bootstrap 3  
- [tool] jetstrap - the bootstrap 3 builder  
- [tool] LayoutIt  


- Twitter Bootstrap GUI & Wireframe Toolbox  
- [book] 트위터부트스트랩 
- T Open Lap - Bootstrap  
- 8 Bootstrap Alternatives  
- Showcase of Useful Bootstrap Tools For Web Developers  
- Bootstrap Toolbox-Tools, Utilities, Generators and Templates  
- 50 Free Bootstrap 3 Templates and UI Kits  




 

'웹표준' 카테고리의 다른 글

HTML5: Battery API  (0) 2013.12.20
markdown  (0) 2013.12.03
UI: twitter Bootstrap  (0) 2013.03.21
zen coding  (0) 2012.12.18
HTML5: Application Cache API  (0) 2012.12.12
UI: Off Canvas Layout  (0) 2012.11.21

zen coding

웹표준 2012. 12. 18. 19:50
- HOME
- Video

- Zen Coding: A Speedy Way To Write HTML/CSS Code  


* Syntax

div#name: <div id="name"></div>

div.name: <div class="name"></div>
div.one.two: <div class="one two"></div>
div#name.one.two: <div id="name" class="one two"></div>

head>link
<head>
    <link/>
</head>

table>tr>td:
<table>
<tr>
<td></td>
</tr>
</table>

ul#name>li.item:
<ul id="name">
    <li class="item"></li>
</ul>

p+p:
<p></p>
<p></p>

div#name>p.one+p.two:
<div id="name">
    <p class="one"></p>
    <p class="two"></p>
</div>

p[title]: <p title=""></p>
td[colspan=2]: <td colspan="2"></td>
span[title="Hello" rel]: <span title="Hello" rel=""></span>
p.title|e: &lt;p class="title"&gt;&lt;/p&gt;

p*3
<p></p>
<p></p>
<p></p>

ul#name>li.item*3:
<ul id="name">
    <li class="item"></li>
    <li class="item"></li>
    <li class="item"></li>
</ul>

p.name-$*3:
<p class="name-1"></p>
<p class="name-2"></p>
<p class="name-3"></p>

select>option#item-$*3:
<select>
    <option id="item-1"></option>
    <option id="item-2"></option>
    <option id="item-3"></option>
</select>

ul+:
<ul>
    <li></li>
</ul>

table+:
<table>
<tr>
    <td></td>
</tr>
</table>

dl+:
<dl>
    <dt></dt>
    <dd></dd>
</dl>
 



- Emmet  
- Goodbye, Zen Coding.Hello, Emmet!   

- Write HTML & CSS Faster With Emmet    

 

'웹표준' 카테고리의 다른 글

markdown  (0) 2013.12.03
UI: twitter Bootstrap  (0) 2013.03.21
zen coding  (0) 2012.12.18
HTML5: Application Cache API  (0) 2012.12.12
UI: Off Canvas Layout  (0) 2012.11.21
UI: Progress Bar  (0) 2012.10.31

HTML5: Application Cache API

웹표준 2012. 12. 12. 16:46
- [html5rocks] a beginner's guide to usning the Application Cache  




 

'웹표준' 카테고리의 다른 글

UI: twitter Bootstrap  (0) 2013.03.21
zen coding  (0) 2012.12.18
HTML5: Application Cache API  (0) 2012.12.12
UI: Off Canvas Layout  (0) 2012.11.21
UI: Progress Bar  (0) 2012.10.31
CSS: Filter  (0) 2012.06.05

UI: Off Canvas Layout

웹표준 2012. 11. 21. 16:36
- A Multi-Device Web Layout Pattern  
- Off Canvas Multi-Device Layouts  
- Multi-Device Layout Pattens   
- Off Canvas Menu with CSS :target



 

'웹표준' 카테고리의 다른 글

zen coding  (0) 2012.12.18
HTML5: Application Cache API  (0) 2012.12.12
UI: Off Canvas Layout  (0) 2012.11.21
UI: Progress Bar  (0) 2012.10.31
CSS: Filter  (0) 2012.06.05
mobile web template  (0) 2012.05.22

UI: Progress Bar

웹표준 2012. 10. 31. 19:18

CSS: Filter

웹표준 2012. 6. 5. 14:14
- [w3] Filter Effects 1.0
- [w3c] Compositing and Blending Level 1  
- [html5rocks]
Understanding CSS Filter Effects
- [ms] Introduction to Filters and Transitions
- [adobe] CSS FilterLab

- CSS Filters
- CSS filter effects in action
- CSS Visual Filters
- CSS Filter Effects
- Abstract Painting with CSS Filters
- Say Hello to Webkit Filters 
- Have You Heard About CSS Filters Yet?
- Animating CSS3 Image Filters 
- Convert Images To Black And White With CSS
- Introducing CSS blending
- Introducing CSS shaders: Cinematic Effects for the web
- Simple hover effects with CSS(webkit) filters
- Image Adjustment With CSs Filter Effects  
- CSS3 Image Filter 
- Visual Effects with CSS3 Filters  
- Create a Trendy Retro Photo Effect Purely with CSS   
- How to Pull Off a Tilt Shift Effect With Webkit CSS Filters  





 

'웹표준' 카테고리의 다른 글

UI: Off Canvas Layout  (0) 2012.11.21
UI: Progress Bar  (0) 2012.10.31
CSS: Filter  (0) 2012.06.05
mobile web template  (0) 2012.05.22
HTML5: Server-Sent Events (SSEs)  (0) 2012.05.18
HTML5 Best Practice  (0) 2012.03.17

mobile web template

웹표준 2012. 5. 22. 15:11
- [safari] Supported Meta Tags  
- [safari] Configuring the Viewport
- [safari] Configuring Web Applications
- [MDN] Using the viewport meta tag to control layout on mobile browsers 
- [opera] An Introduction to meta viewport and @viewport
 
  
- Create native-looking iPhone/iPad application from HTML, CSS and JavaScript 
Viewport Scale on iPhone, iPad. 
- Coding a Mobile Web List View in HTML5 & CSS3
 

- <meta name="apple-mobile-web-app-capable" content="yes" />
- <meta name="apple-mobile-web-app-status-bar-style" content="default" />
- <meta name="viewport" content="user-scalebale=no, width=device-width" />
- <link rel="apple-touch-icon" href="/img/apple-touch-icon.png" /> : 72X72
- <link rel="apple-touch-startup-image" href="/img/startup.png" /> : 320X460


'웹표준' 카테고리의 다른 글

UI: Progress Bar  (0) 2012.10.31
CSS: Filter  (0) 2012.06.05
mobile web template  (0) 2012.05.22
HTML5: Server-Sent Events (SSEs)  (0) 2012.05.18
HTML5 Best Practice  (0) 2012.03.17
HTML5: Communication APIs  (0) 2012.02.14

HTML5: Server-Sent Events (SSEs)

웹표준 2012. 5. 18. 01:34
- [w3] Server-Sent Events
- [wikipedia] Server-sent events
- [MDN] Using server-sent events
- [Opera] Event Streaming to Web Browsers
- [opera] Server-sent event demos [what time is it?]
- [w3schools] HTML5 Server-Sent Events

- [blog] Server-Sent Events: 박종명의 아름다운 개발
- [html5doctor] Server-Sent Events 
- [html5Rocks] Stream Updates with Server-sent Events
- Real-time display of server push data using Server-Sent Events(SSE)
- Chrome supporting EventSouce for server push, and richer Worker API
- HTML5 and Server-Sent Events
- WebSockets vs Server-Sent Events vs Long-polling
- [MDN] A Wall Powered by EventSource and Server-Sent Events
- [python] Avoid Using EventSource
- what time is it?
- [gizrak] Server-Sent Events


- [web worker] Getting Started with Web Workers 
- 7 Things You Need To Know About Web Workers   


 

'웹표준' 카테고리의 다른 글

CSS: Filter  (0) 2012.06.05
mobile web template  (0) 2012.05.22
HTML5: Server-Sent Events (SSEs)  (0) 2012.05.18
HTML5 Best Practice  (0) 2012.03.17
HTML5: Communication APIs  (0) 2012.02.14
UI: mouse cursor  (0) 2012.02.09

HTML5 Best Practice

웹표준 2012. 3. 17. 19:35

HTML5: Communication APIs

웹표준 2012. 2. 14. 14:12

- XHR & XHR2 with CORS
- Web Messaging
- Web Sockets
- Server Sent Events
- Web Workers


- [opera] An Introduction to HTML5 web messaging
- An Introduction to HTML5 Web Workers





'웹표준' 카테고리의 다른 글

HTML5: Server-Sent Events (SSEs)  (0) 2012.05.18
HTML5 Best Practice  (0) 2012.03.17
HTML5: Communication APIs  (0) 2012.02.14
UI: mouse cursor  (0) 2012.02.09
HTML5: Fullscreen API  (0) 2012.02.07
HTML5: History API  (0) 2012.01.17

UI: mouse cursor

웹표준 2012. 2. 9. 17:45
- [w3] User interface 
-
w3schools: CSS cursor Property
Invisible cursors in Google Chrome with CSS
- [site] cursors-4u
- [stackoverflow] CSS: Hiding cursor without any external files
- Custom CSS Cursors
- Custom Cursors using javascript
- Cross Browser CSS cursor Images In Depth
- Cross-browser CSS Grab cursors for dragging  
-
CSS Grab hand cursor  



'웹표준' 카테고리의 다른 글

HTML5 Best Practice  (0) 2012.03.17
HTML5: Communication APIs  (0) 2012.02.14
UI: mouse cursor  (0) 2012.02.09
HTML5: Fullscreen API  (0) 2012.02.07
HTML5: History API  (0) 2012.01.17
HTML5: Local Storage (web storage)  (0) 2012.01.11

HTML5: Fullscreen API

웹표준 2012. 2. 7. 12:41

HTML5: History API

웹표준 2012. 1. 17. 16:33

HTML5: Local Storage (web storage)

웹표준 2012. 1. 11. 18:41
- [w3] Web Storage
- [w3] Web SQL Database
- [w3] Indexed Database API
- [wikipedia]
Web Storage
- [MDN] DOM Storage
- [HTML5Rocks] Storage  [client-side storage]
- [adobe] Introducing the HTML5 storage APIs

-
Local Storage And How To Use It On Websites
- Building Web Pages with Local Storage
- How to use HTML5 local storage with jQuery Mobile
- HTML5 Storage In Action
-
HTML5 Local Storage - Complete Guide
- localStorage for Forms
- [book] Client-Side Data Storage
- Getting Started with HTML5 Local Database
- Building a Sample App InTiggr Mobile Apps Builder
- HTML5 localStorage - part one   part two
- Let's Take This Offline
- Go offline with application cache
- Saving images and files in localStorage
- Storing images and files in IndexedDB
- Browser Storage for HTML5 Apps
- Persistent client side data storage
- Building Mobile Apps with HTML and a Local Database
- Web SQL Database와 Geolocation
- A Quick Guide to Web Storage  

- [IndexedDB]
Getting Started with IndexedDB
- [library] HTML5SQL.js



'웹표준' 카테고리의 다른 글

HTML5: Fullscreen API  (0) 2012.02.07
HTML5: History API  (0) 2012.01.17
HTML5: Local Storage (web storage)  (0) 2012.01.11
CSS3 Mask  (0) 2012.01.10
UI: CSS3 Image Reflection  (0) 2012.01.10
HTML5: File Access  (0) 2011.12.28

CSS3 Mask

웹표준 2012. 1. 10. 19:02

UI: CSS3 Image Reflection

웹표준 2012. 1. 10. 18:55
* Reflection
-
Create Reflection effect using CSS3
- Pure CSS3 Reflections
- Image Reflections with CSS
- [safari] CSS Reflections
- [jQuery] Reflection.js for jQuery
- CSS Image Reflection with Webkit
- Mastering CSS Reflections in Webkit
- CSS3 Image Reflection


* object-fit, object-position
- Control image aspect ratios with CSS3
- [opera] The CSS3 object-fit and object-position properties



'웹표준' 카테고리의 다른 글

HTML5: Local Storage (web storage)  (0) 2012.01.11
CSS3 Mask  (0) 2012.01.10
UI: CSS3 Image Reflection  (0) 2012.01.10
HTML5: File Access  (0) 2011.12.28
CSS selector  (0) 2011.11.08
HTML5: WebSocket  (0) 2011.10.29

HTML5: File Access

웹표준 2011. 12. 28. 14:07
- [W3] File API: Directories and System
- [W3] XMLHttpRequest Level 2
- [MDN] Drag and Drop 
- [HTML5ROCKS] File Access 
- [html5doctor] 
Native Drag and Drop
- [XHR] New Tricks in XMLHttpRequest2  
- The Drag dnd Drop API
- HTML5 File Uploading Tutorials for Designers and Developers
- Toying With the HTML5 File System API
- Real-world example of the HTML5 FileSystem API
- [HTML5Rocks] Exploring the Filesystem APIs
- Working with files in JavaScript, Part 1  [ part 2 ]
- Getting to Grips with the HTML5 File API  
- How to: Drag and Drop with HTML5  
- Create Files and Store Them Locally Using JavaScript and Webkit  


*Libraries
- webfs: a client side implementation of the nodejs filesystem
- filer.js: a wrapper library for the HTML5 Filesystem API
- resumable.js   








'웹표준' 카테고리의 다른 글

CSS3 Mask  (0) 2012.01.10
UI: CSS3 Image Reflection  (0) 2012.01.10
HTML5: File Access  (0) 2011.12.28
CSS selector  (0) 2011.11.08
HTML5: WebSocket  (0) 2011.10.29
CSS snippets  (0) 2011.09.27