关于门户网站焦点图设计的一些总结

焦点图——图片、文字与动态交互的完美结合

焦点图，这一融合了图片、文字与动态交互效果的内容呈现方式，无疑在吸引眼球、页面排版优化等方面扮演了重要角色。尤其在内容至上的门户型网站中，其地位更是举足轻重。在此，我想分享一些关于焦点图制作的经验，这些经验对于像搜狐、新浪等大型门户网站来说，或许有一定的借鉴意义，但对于个人网站、商务网站的适用性，还需另当别论。

编辑们的体验至关重要。在焦点图的制作过程中，我们追求的原则是“越傻瓜越好”。对于时效性高且频繁更新的页面，让编辑们直接在焦点图的html上套内容，虽然方便，但却可能带来致命的问题。我们需要寻找更为便捷且高效的方式，让编辑们能够轻松上手。

为了防止样式冲突，焦点图功能需要相对独立。很多时候，页面发布后可能突然需要更换焦点图。如果焦点图的类名过于通俗，套到页面中就容易出现莫名其妙的样式冲突。我们提倡使用独特的类名（css class），不怕类名长，前缀、后缀都可以添加，越另类越好。

可视化设计器的设计也是关键。我们期望通过设计器，让编辑们只需填写数据，便能一键迅速生成焦点图代码。这样不仅可以提高效率，还能降低出错率。

关于样式、结构与行为的分离，这也是我们不可忽视的一点。编辑应该能够方便地修改字体色、背景色等。为了达到这一目的，我们尽量使用html模板技术，使结构（html）和行为（js逻辑）也实现分离。这里，我们可以考虑使用jquery官方的模板插件。

而对于超大型门户网站（如搜狐新浪），SEO的优先级在某些时候可能要让步于内容更新。由于这种类型网站已经人人皆知，不需要通过搜索引擎进行推广。我们可以利用JS动态产生焦点图的Html代码。尽管这种HTML代码对SEO并不友好，但在大型门户型网站中却是可行的策略。

对于大型门户型网站的焦点图制作，我们可以采用json数据结合html模板技术，通过js动态生成焦点图。虽然这种方式可能会让编辑们感到不便，影响网站内容的更新效率，但在吸引用户眼球、优化页面排版等方面却有着显著的优势。在未来，我们期待更为智能、高效的焦点图制作方式的出现。