Hypertext Markup Language (HTML) and its cousin, XHTML, along with the Cascading Style Sheet (CSS) language are the lifeblood of Web pages. Even experienced Web designers and authors need help sometimes, and this Cheat Sheet provides many helpful online resources, a quick color code guide, and a peek at the future of HTML with new HTML 5 elements.
>
>
Named Colors and Hex Values in HTML
The following table contains a list of named colors you can use in HTML and CSS code to create a more colorful Web site. The colors are given with their corresponding RGB hexcode values and a representative color swatch.
| Name | Hexcode |
|---|---|
| Aqua | #00FFFF |
| Black | #000000 |
| Blue | #0000FF |
| Fuchsia | #FF00FF |
| Gray | #808080 |
| Green | #008000 |
| Lime | #00FF00 |
| Maroon | #800000 |
| Navy | #000080 |
| Olive | #808000 |
| Purple | #800080 |
| Red | #FF0000 |
| Silver | #C0C0C0 |
| Teal | #008080 |
| White | #FFFFFF |
| Yellow | #FFFF00 |
>
>
>
HTML, XHTML, and CSS Resource Sites
There's no shortage of good HTML resources online, but some are simply so superlative that you'll want to check them all out. The following sites provide help on HTML, XHTML, and CSS, as well as Web graphics and design:
The World Wide Web Consortium is not just the fountain whence HTML, XML, XHTML, CSS, and a whole lot more springs, it's also a great source of information, tutorials, and tools.
The Web Design Group has the motto "Making the Web accessible to all," but they've also got great references and tools, as well as help forums, FAQs galore, and some great design guides and color code info.
W3 Schools has lots of free and useful stuff — including HTML and XML tutorials that cover the basics of markup, plus CSS, tons of XML applications, numerous scripting languages for client- and server-side scripts, and a whole lot more.
Webmonkey has an extensive how-to library that covers lots of interesting topics in (for openers) Web authoring, design, multimedia, and e-business, as well as quick references for everything from JavaScript to special characters and color codes.
A List Apart Magazine has great content (and ideas for aspiring Web designers and developers) to share. Lots of full-time, professional developers, designers, architects, and project managers are active on this site.
WebDesignerDepot is a Web design site that seeks out and describes new and different graphic design techniques. Additionally, it provides great examples and best practices for Web and graphics design.
Smashing Magazine aims its coverage squarely at Web designers and developers. It seeks to keep them abreast of the latest trends, tools, and techniques related to their design and development interests.
The Web Developer's Virtual Library is a treasure trove of information, tutorials, and tools coverage, with Web design and programming techniques.
Noupe is a Web-based magazine that targets Web designers and developers with the latest info, design approaches, and tips for HTML, CSS, AJAX, JavaScript, graphics, typography, and so forth.
CSS-Tricks is "curated" by über Web (and CSS) geek Chris Coyier. Look to this site for an outstanding collection of articles, how-to's, tutorials, and screen casts, and for an active set of forums on CSS, JavaScript, PHP, and content management systems (CMS).
>
>
>
New HTML 5 Elements
Below is a list of all the new elements proposed for introduction in the HTML5 specification in alphabetical order, with a brief description and an associated markup category.
| Element | Category | Description |
|---|---|---|
| article | Structure element | Provides section formatting for short expository items like articles, blogs, etc. |
| aside | Block semantic | Slightly related piece of content for host page |
| audio * | Embedded media | Used to add audio for playback associated with Web page |
| canvas | Dynamic graphics | Use to define a page region in which drawing can occur |
| command * | Metadata/flow/phrasing | Use to define user GUI elements |
| datalist | Forms & user input | Use to create a list of input elements for pull-down menus |
| details | Forms & user input | Provides additional information or controls to users on demand |
| embed * | Dynamic behavior | Links to external application or interactive content |
| figcaption | Graphics | Provide a caption for a figure element |
| figure | Graphics | Standalone flow content element; may be static or dynamic |
| footer | Structure element | Concluding information for a document section |
| header | Structure Element | Introductory or navigational aids at the start of any page |
| hgroup | Structure Element | Header for a section, or a collection of pages within a document |
| keygen | Forms & User input | User-accessible control to generate key pairs for security or encryption |
| mark | Semantic structure | Mark or highlight a run of text in one document, for reference in another document |
| meter | Graphics | Define a visual indicator for some type of measurement |
| nav | Structure element | Use to define a navigation bar or area in a Web page |
| output | Dynamic content | Some kind of output from script calculation or API call |
| progress | Graphics | A visual meter for task completion (progress bar) |
| ruby | Annotation | Use to annotate ideographic languages like Chinese or Japanese |
| section | Structure element | Generic document or application section; works with h1…h6 to delineate document structure |
| summary | Forms & user input | Summary, legend, or caption for input details information |
| time | Dynamic content | Value for representing date and/or time |
| video * | Embedded media | Use to playback video content in Web page |
| wbr * | Semantic structure | Use to denote possible line break point for text flow |
| * This is an empty element. | ||
>
>
dummies
Source:http://www.dummies.com/how-to/content/html-xhtml-css-for-dummies-cheat-sheet.html
No comments:
Post a Comment