SVG Authoring Guidelines[转] - Avlee‘s Blog - 博客园
来源:百度文库 编辑:神马文学网 时间:2024/04/29 13:20:55
在这篇文章里,作者列出了出现在很多SVG作品中的坏习惯,这些都可能会造成一些兼容的问题,只是Adobe的SVG Viewer忽略了这些错误(非标准的东西)。现在SVG还在发展初期,希望大家不要像在写HTML的时候被IE养成坏习惯一样给Adobe SVG Viewer养成坏习惯。
目前Adobe对SVG的支持还是未知数,如果大家希望自己的基于SVG的作品能有继续在其他SVG的实现上运行,如Mozilla, Batik,那么请看看我转载的这篇文章。
This is a work in progress. Pleasesend me your feedback and suggestions!
There are a lot of mistakes in the SVG documents currently found on the Web. Because Adobe‘s SVG Viewer ignores many of these errors, the maintainers of these documents usually don‘t realise when they‘re doing something wrong. Unfortunately, the result is that far too often SVG on the Web doesn‘t work in Mozilla, Batik or one of the other SVG implementations. It is important that these problems are addressed as soon as possible to prevent them from propagating into authoring tools and the SVG documents that people will write in the future.
This document highlights some of the most common mistakes made in SVG content, and explains what SVG maintainers can do to fix them. The hope is that the SVG community will read this document, and that individual members of the community will do what they can to make sure that SVG on the Web is as portable as possible. Please spread the word. If you see others making any of the mistakes described here, please let them know so that they can correct them. Even more important, if you know of SVG authoring tools that make these mistakes please contact the vendor and let me know. Feel free to link to this document, and please send me your feedback. My email address isjwatt@jwatt.org.
Contents
Configure your server for SVGDon‘t include a DOCTYPE declarationBind the required namespacesAvoid the ‘style‘ attribute where possibleSpecify units when assigning lengths to propertiesUse namespace aware DOM methodsDon‘t use Adobe‘s getter and setter extensions
Configure your server for SVG
This isn‘t really an issue with SVG content itself, but nevertheless, server misconfiguration is a very common reason for SVG failing to load. For security and correctness reasons, some browsers decides how to handle files by looking at the HTTP headers the server sends with them. If your server isn‘t configured to send the correct headers with the SVG files it serves, then a browser like Mozilla won‘t treat those files as SVG. Instead it will most likely show the markup of the files as text or encoded garbage, or even ask the viewer to choose an application to open them. For normal SVG files, servers should send the HTTP header:
Content-Type: image/svg+xml
For gzipped SVG files, servers should send the HTTP headers:
Content-Type: image/svg+xml
Content-Encoding: gzip
You can check that your server is sending the correct HTTP headers with your SVG files by using a site such asweb-sniffer.net. Submit the URL of one of your SVG files and look at the HTTP response headers. If you find that your server is not sending the headers with the values given above, then you should contact your Web host. If you have problems convincing them to correctly configure their servers for SVG, there may be ways to do it yourself. See theserver configuration page on the SVG wiki for a range of simple solutions.
Don‘t include a DOCTYPE declaration
XML Document Type Definitions, or DTDs for short, are a feature of XML used to validate the contents of a document. A DTD is associated with a document by placing a DOCTYPE declaration in the document. The following line is an example of an SVG DOCTYPE declaration.
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
Unfortunately the SVG DTDs are a source of so many issues that the SVG WG has decided not to write one for the upcoming SVG 1.2 standard. In fact SVG WG members are eventelling people not to use a DOCTYPE declaration in SVG 1.0 and 1.1 documents. Instead always include the ‘version‘ and ‘baseProfile‘ attributes on the root
目前Adobe对SVG的支持还是未知数,如果大家希望自己的基于SVG的作品能有继续在其他SVG的实现上运行,如Mozilla, Batik,那么请看看我转载的这篇文章。
This is a work in progress. Pleasesend me your feedback and suggestions!
There are a lot of mistakes in the SVG documents currently found on the Web. Because Adobe‘s SVG Viewer ignores many of these errors, the maintainers of these documents usually don‘t realise when they‘re doing something wrong. Unfortunately, the result is that far too often SVG on the Web doesn‘t work in Mozilla, Batik or one of the other SVG implementations. It is important that these problems are addressed as soon as possible to prevent them from propagating into authoring tools and the SVG documents that people will write in the future.
This document highlights some of the most common mistakes made in SVG content, and explains what SVG maintainers can do to fix them. The hope is that the SVG community will read this document, and that individual members of the community will do what they can to make sure that SVG on the Web is as portable as possible. Please spread the word. If you see others making any of the mistakes described here, please let them know so that they can correct them. Even more important, if you know of SVG authoring tools that make these mistakes please contact the vendor and let me know. Feel free to link to this document, and please send me your feedback. My email address isjwatt@jwatt.org.
Contents
Configure your server for SVGDon‘t include a DOCTYPE declarationBind the required namespacesAvoid the ‘style‘ attribute where possibleSpecify units when assigning lengths to propertiesUse namespace aware DOM methodsDon‘t use Adobe‘s getter and setter extensions
Configure your server for SVG
This isn‘t really an issue with SVG content itself, but nevertheless, server misconfiguration is a very common reason for SVG failing to load. For security and correctness reasons, some browsers decides how to handle files by looking at the HTTP headers the server sends with them. If your server isn‘t configured to send the correct headers with the SVG files it serves, then a browser like Mozilla won‘t treat those files as SVG. Instead it will most likely show the markup of the files as text or encoded garbage, or even ask the viewer to choose an application to open them. For normal SVG files, servers should send the HTTP header:
Content-Type: image/svg+xml
For gzipped SVG files, servers should send the HTTP headers:
Content-Type: image/svg+xml
Content-Encoding: gzip
You can check that your server is sending the correct HTTP headers with your SVG files by using a site such asweb-sniffer.net. Submit the URL of one of your SVG files and look at the HTTP response headers. If you find that your server is not sending the headers with the values given above, then you should contact your Web host. If you have problems convincing them to correctly configure their servers for SVG, there may be ways to do it yourself. See theserver configuration page on the SVG wiki for a range of simple solutions.
Don‘t include a DOCTYPE declaration
XML Document Type Definitions, or DTDs for short, are a feature of XML used to validate the contents of a document. A DTD is associated with a document by placing a DOCTYPE declaration in the document. The following line is an example of an SVG DOCTYPE declaration.
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
Unfortunately the SVG DTDs are a source of so many issues that the SVG WG has decided not to write one for the upcoming SVG 1.2 standard. In fact SVG WG members are eventelling people not to use a DOCTYPE declaration in SVG 1.0 and 1.1 documents. Instead always include the ‘version‘ and ‘baseProfile‘ attributes on the root
SVG Authoring Guidelines[转] - Avlee‘s Blog - 博客园
[转] .net开源项目 - godogoflive‘s blog - 博客园
博客园 - Rickie Lee‘s blog
4rthur's Blog - 博客园
博客园 - Rickie Lee‘s blog - Duwamish架构分析篇
情诗经典名句 - zhouwillpower ‘ s blog - 博客园
MOSS项目开发步骤 - 宋振乾's Blog - 博客园
探讨SSE指令 - cutepig's blog - 博客园
CnBlogs博文排版技巧 - YJingLee's Blog - 博客园
情诗经典名句 - zhouwillpower ‘ s blog - 博客园
迎迎的博客(迎迎'S Blog)
luox8093's blog - 细胞周期 | 丁香博客
C 博客-XGuru's Blog (九点)
卡巴斯基的博客 KEugene Kaspersky's Blog
2.A Teenager‘s Joke: Guidelines for Doing Schoolwork
2.A Teenager‘s Joke: Guidelines for Doing Schoolwork
博客园 - WDDAVID‘s BLOG - 《ASP.NET办公自动化系统开发实例导航》笔记三 人事管理模块
博客园 - Rickie Lee‘s blog - Duwamish Web Services分析篇
收集的一些经典搞笑的话 - MadGoat‘s Blog - 博客园
《商业周刊》:全球品牌100强 微软第2谷歌20 - Alpha‘s Blog - 博客园
SD2.0-大型网站架构讨论沙龙 - Duiker‘s Blog - 博客园
ASP.NET技术的学习顺序 - Leafer's Blog - 博客园
一个遍历当前子目录的Makefile模板 - Alpha Du's Blog - 博客园
值得收藏的JavaScript代码 - ξσ Dicky‘s Blog σξ - 博客园