维基百科讨论:2012年首頁設計建議/草案/Kuailong

設計簡介

大体上融合了英文Pretzels（包括Shizhao、林卯改版）的设计，另外每日图片部分参考了越南维基人Mxn的设计。主要是细节上的微调，阴影基本都去掉了，社区版面是比较大的改动。

个人技术所限，有一些想法暂时没有实现（实现也不美观），比如希望把特色、优良条目展示合并在同一个板块显示，提供类似tab的切换。另外还有标题板块的修饰。

由于本人很不喜欢混乱的字号和行距，也很讨厌繁杂的链接，所以不会在这方面修改。

还请大家多指教。 --Kuailong ™ 2012年12月19日 (三) 13:13 (UTC)[回复]

(＊)提醒：由于设计在不断变动，下面提供几个稳定版本：

优良、特色板块分离，特色条目无背景图的版本

推荐内容部分采用特色条目图片做背景图的版本

--Kuailong ™ 2012年12月20日 (四) 06:13 (UTC)[回复]

已知问题：（1）IE兼容模式下排版（基本

完成）和渐变效果（

未完成）的问题；（2）高分辨率下图片两段留白问题（无法解决）。--Kuailong ™ 2012年12月21日 (五) 11:20 (UTC)[回复]

意見收集

(！)意見：挺好，感觉头部和今日图片都比之前更协调了，或许今日图片那个白色渐变可以窄一点？草案可以像Shizhao那个一样加个白底，因为正式首页颜色和这个还不大一样。--Danielinblue（留言） 2012年12月19日 (三) 13:34 (UTC)[回复]

对今日图片做了修改。老版本的今日图片移步[1]。--Kuailong ™ 2012年12月19日 (三) 13:36 (UTC)[回复]

“已有‘XXX’位註冊用戶參與編纂”…－哆啦A夢^220‧284－~~世界末日將到來！（大誤）~~ 2012年12月19日 (三) 14:23 (UTC)[回复]

已修复--Kuailong ™ 2012年12月19日 (三) 14:30 (UTC)[回复]

优良往下移动一点？--铁铁的火大了（留言） 2012年12月19日 (三) 16:07 (UTC)[回复]

原因？--Kuailong ™ 2012年12月19日 (三) 16:16 (UTC)[回复]

首页一上来就放两篇文章太单调了，倒不如FA下面放DYK的各种提问有意思。而且GA不是“质量最好”的条目，不需要放太上面。--铁铁的火大了（留言） 2012年12月20日 (四) 01:15 (UTC)[回复]

DYK质量更差吧…… --Kuailong ™ 2012年12月20日 (四) 01:24 (UTC)[回复]

(！)意見：貼士一詞可能需要加上地區轉換，該詞似乎不是各地區皆通用的詞彙。--Alexchris（留言） 2012年12月19日 (三) 16:58 (UTC)[回复]

大陆、香港貌似还挺常用的，不知台湾是否常用？或者直接改回“提示”吧。--Kuailong ™ 2012年12月20日 (四) 01:33 (UTC)[回复]

台灣基本上好像不存在這種用法，我第一次看到。--Alexchris（留言） 2012年12月20日 (四) 05:31 (UTC)[回复]

已修复--Kuailong ™ 2012年12月20日 (四) 06:13 (UTC)[回复]

(！)意見：不错，页首右边的三个按钮或许居中对齐会好一些？另外社群信息的分隔条可能也是浅灰色吧。（个人觉得Pretzels原来的淡阴影边框其实还好，会比实线柔和些。另外是不是今日热门放最上有些太吸引读者注意了... 今日热门的条目质量很难说，首页最好还是引导阅读社群选出的优良内容吧）--Ericmetro（留言） 2012年12月19日 (三) 18:16 (UTC)[回复]

已修复，按钮居中是我的疏忽，感谢指正。个人不是很喜欢现在这个按钮的样式，不过不知道修改成什么样子。--Kuailong ™ 2012年12月20日 (四) 01:24 (UTC)[回复]

(＋)支持：木有違和感啊！的確柔邊效果較佳，要不要做個試試看？ ~~[伸手（誤）]~~ :》 @assanges [阿桑奇士] ‧ ^{(talk | cont | uploads)} 2012年12月19日 (三) 20:48 (UTC)[回复]

引入阴影效果见User:Kuailong/sandbox2。--Kuailong ™ 2012年12月20日 (四) 01:33 (UTC)[回复]

(！)意見，補充：右上三顆按鈕會否出現不兼容現象，因本人先所見之按鈕均向左偏移。有何解決妙方？ @assanges [阿桑奇士] ‧ ^{(talk | cont | uploads)} 2012年12月19日 (三) 21:31 (UTC)[回复]

(！)意見，公告栏这个很不错。不过说把“XXX个页面需维基化”放在首页是否合适？--耶叶爷♥VC XC 2012年12月20日 (四) 02:03 (UTC)[回复]

只是放置在那里做个样子，我个人其实希望做成类似ASN那样的滚动显示（每次2条）。至于什么适合放在首页，这就见仁见智了，而且也不是首页设计的讨论重点。--Kuailong ™ 2012年12月20日 (四) 02:32 (UTC)[回复]

嗯知道了。此外我个人还是比较喜欢有特色条目背景图片的那个版本，看上去十分震撼。有些问题可能也是无法避免的，像是优良条目版面被削弱，以及特色条目的背景图片与“你知道吗”的附图之间的样式看上去不太协调。--耶叶爷♥VC XC 2012年12月20日 (四) 06:58 (UTC)[回复]

“你知道吗”当然也可以做成这样，但是我觉得有滥用的嫌疑。优良条目我个人是倾向于削弱的，毕竟首页上展示条目的板块已经够多了（FA、GA、DYK）。或者我建议特色条目和优良条目交叉轮展，考虑到现有特、优比例大致为1:4，以5天为周期，1个特色配4个优良。--Kuailong ™ 2012年12月20日 (四) 07:28 (UTC)[回复]

话说有个小问题是有时推荐内容的图片不一定有大图，可能放大作背景后图像质量会降低。 --Ericmetro（留言） 2012年12月20日 (四) 10:20 (UTC)[回复]

推荐内容和每日图片的这种设计，想法不错。但是问题也不少：一、二个栏目展示效果几乎一样，看不出差别（一个是展示条目，一个是展示图片，现在几乎没差了）；二、如果没有合适的分辨率图片怎么办？那样会看起来很糟糕；三、没有右对齐。习惯上是左右对齐，下对齐差一点反而影响不大，但是不能右对齐，看起来会比较糟糕--百無一用是書生 (☎) 2012年12月20日 (四) 11:22 (UTC)[回复]

我当然考虑过分辨率的问题，但用几张分辨率一般的特色条目图片测试发现效果还是可以接受的，所以就这样用了。如果实在是没有合适的图片时，可以换用特色图片。（或者直接就展示特色图片算了？反正连特色列表都登录首页了。）右对齐那条没看懂。--Kuailong ™ 2012年12月20日 (四) 13:14 (UTC)[回复]

请比较特色条目（配图）、特色条目（不配图）+特色图片、特色条目（配图）+特色图片。--Kuailong ™ 2012年12月20日 (四) 14:34 (UTC)[回复]

(！)意見：神作啊！作者很好地理解了現代操作介面的發展趨勢。如果能消除下方空白（建議下移文字，既填補空白又使文字清晰），修正「你想參與嗎？」斷行問題，基本完美了。--H2NCH2COOH（留言） 2012年12月20日 (四) 12:45 (UTC)[回复]

您说的问题估计是分辨率导致的吧。--Kuailong ™ 2012年12月20日 (四) 13:19 (UTC)[回复]

(！)意見，使用chrome观看效果非常好，但不知能否改善IE的浏览效果。--Gakmo（留言） 2012年12月20日 (四) 15:30 (UTC)[回复]

借了电脑看了一眼……果然很糟糕。用IE10看是没有问题的，兼容模式下就会很错乱，个人技术水平有限，不知道谁能解决兼容问题。或者专门为这些已经过时了的浏览器做一个去掉部分效果的首页版本，根据user-agent判断跳转？--Kuailong ™ 2012年12月21日 (五) 06:54 (UTC)[回复]

这个每日图片效果赞！——但宽度锁定了？感觉上下不顺畅。如果一定要锁定宽度，间距扯开一些，从视觉上分离开如何？(我的分辨率是1920×1080)--林卯（留言） 2012年12月21日 (五) 03:43 (UTC)[回复]

图片大小好像只能设置成固定值，宽度不锁就只能看着留白，这点实在是很矛盾。当然间距拉开的话……跟Google+一样引发大家吐槽空白吗？--Kuailong ™ 2012年12月21日 (五) 11:18 (UTC)[回复]

字小。请把左右栏互换看看效果。多换两个POTD试试看。万一POTD是图形那就毁了，必须先禁止图形的FP上首页。右栏请再斟酌，现在这样并不好看。--达师－ 218 － 372 2012年12月22日 (六) 17:20 (UTC)[回复]

这个设计会让以后更新首页的管理员很痛苦，必须确定每一张图片的主体部分并相应计算偏移量。Liangent（留言） 2012年12月22日 (六) 18:17 (UTC)[回复]

我还以为是自动计算的，如果不是的话我反对。--马呵说念诶多哗铎★爱生活爱萝莉塔 2012年12月23日 (日) 03:04 (UTC)[回复]

这个能用机器人解决么？感觉整体效果很好。--Make cat 2012年12月23日 (日) 07:48 (UTC)[回复]

如果每一张图片都可以直接显示同一个位置那倒没问题，但即使不考虑达师提到的图形FP（File:History of Beijing Subway.gif），来换一张图试试看：[2]，显示出来一片黑[3]（没办法，图片上部本来就是全黑的）。这时管理员必须编辑首页[4]改像素偏移，才能展示“地出”图像[5]。Liangent（留言） 2012年12月23日 (日) 10:48 (UTC)[回复]

把图像显示区拉大，然后上下去掉同样百分比的区域，这样应该可以适用绝大部分图片吧？(当然地出这张只要遮住下半部分都会很尴尬的样子……)--Kuailong ™ 2012年12月23日 (日) 11:21 (UTC)[回复]

还有长宽比特殊的图片的问题：图呢？还是得改一下，可这样传输的图片大小太恐怖了，比较实际的解决方法可能是为首页展示专门制作一批大小内容适当的图片。Liangent（留言） 2012年12月23日 (日) 14:26 (UTC)[回复]

快雪时晴帖…… -_____-||| 这样的根本就没办法在首页展示啊。我已经去除掉了特色图片的偏移，尺寸正常的图片应该是无需再调整位置的。--Kuailong ™ 2012年12月23日 (日) 14:36 (UTC)[回复]

话说我觉得把下面的梯度块也链接到图像好一些，不过……bugzilla:43361。Liangent（留言） 2012年12月23日 (日) 14:52 (UTC)[回复]

清明上河图还不是FP呢 --达师－ 218 － 372 2012年12月26日 (三) 04:48 (UTC)[回复]

(！)意見：效果不錯，但我認為每日圖片欄目用這種方式展示已足夠，特色內容的圖片還是以正式方式展示與特色條目相關的圖片較好。另外雖然我用1280x1024解像度看來很好，但也擔心使用1920x1024或其他主流解像度看時的效果會否正常。--沙田友（留言） 2012年12月26日 (三) 06:58 (UTC)[回复]

(！)意見，特色图片太大，不一定与特色条目配对，但现在的感觉好像特色条目与特色图片是相关的，建议分割两个栏目，或用特色条目对应的图片代替现在的图片——Sakamotosan 2012年12月26日 (三) 13:11 (UTC)[回复]

之所以使用特色图片是担心特色条目图片质量。请比较特色条目（配图）、特色条目（不配图）+特色图片、特色条目（配图）+特色图片。感谢两位的意见。--Kuailong ™ 2012年12月27日 (四) 03:08 (UTC)[回复]

栏目的题头配图设计是一个不错的想法，但是可能并不适合维基百科目前的UI设计。目前维基百科页面内容部分不是定宽的（只有左侧导航栏是定宽的），因此首页的设计左右两栏中只能有一列定宽，而且必须是采用题头配图的那列用定宽，现在几个采用题头配图的设计都正好反过来，题头配图的那列不是定宽的，或者采用的是百分比的分配方式。这样做将会造成不同分辨率下题头配图的样式相差很大。例如本设计在1280x600下看起来恰到好处，而到了1920x900下，题头图片则变成了置中，距离栏目两侧的位置出现大幅空白，栏目标题也跑到了图片下面，而每日图片由正常的小图盖大图，变成了分别两个图放置。而在更小的分辨率下，可能会造成文字太多位于图片上，图片显示不全、图片所占比例太大等问题--百無一用是書生 (☎) 2012年12月31日 (一) 06:52 (UTC)[回复]

(！)意見：1. 左栏过宽，右栏过窄。 2. 图片上「推荐内容」和「每日图片」两个字的 text-shadow 需要修改，目前版本的不是很好看，下面 alt 版本的也还是需要再改改的。3. 针对图片大小问题可以尝试试用 CSS3 的 background-size:cover 解决？（缺点就是不兼容 IE ） Zeray Rice 2013年1月9日 (三) 07:04 (UTC)[回复]

为了IE兼容性妥协了很多，没办法。--Kuailong ™ 2013年1月10日 (四) 14:13 (UTC)[回复]

(！)意見：第一张图片和图下文字没有关系那不如分开。--Qa003qa003（留言） 2013年1月16日 (三) 11:39 (UTC)[回复]