我一直在制作作品集，而且我并没有真正将自己限制在更容易编码的内容上。所以...我最终得到了这个（这是主页，但几乎所有其他页面都已在 Photoshop 中准备好）
http://postimg.org/image/z0w6wb4zb/
那么将其转换为 HTML/CSS 的最佳方法是什么？我应该将它分成区域还是单独的每一层（如云、树、岛……等）。有人告诉我使用语义 HTML，但我不确定我理解这意味着什么。我该怎么做按钮？图像映射？那不是个坏主意吗？
你觉得这个设计值得麻烦吗？
问问题
105 次
1 回答
1
我不能发表评论，我能做的就是回答，所以这里是：
李斯特先生是对的，图像地图可能是要走的路。但是，我认为还有一个值得注意的项目，SEO 价值，特别是对于家庭/投资组合/联系我/和关于锚点。一种潜在的解决方案是使用图像映射......但做一些特征检测，看看浏览器是否允许 css 旋转功能。
你的 HTML
<section class="homepage-navigation">
<a class="contact-me nav-link" href="/contact">Contact Me</a>
...
</section>
你的 CSS 可能是
.home-navigation{position:relative;}
.home-navigation .nav-link{position:absolute;}
.home-navigation .contact-me{transform: rotate(-95deg);left:10px;}
所以......这里有一个权衡。使用图像映射并在图像中嵌入链接文本要容易得多......但是您会在浏览器看到锚文本时丢失。如果你走 CSS 路线，你需要考虑支持允许转换 CSS 属性的浏览器和不允许的浏览器。:|
于 2013-10-07T05:27:44.187 回答