返回作品集
Mpampetas & Sons 首页:绿色顶栏显示电话号码和位于 Kallithea, Katerini, Pieria 的地址;带拖拉机轮廓的 ΜΠΑΜΠΕΤΑΣ 标志,Home、About、Services、Equipment、Gallery、Contact 菜单和 ΕΛ | EN 切换;下方是一张偏绿色调的照片:夕阳下,一台拖拉机长长的引擎盖伸进高高的草丛,前方是一排排太阳能板;画面上叠有白色的“Mpampetas & Sons”和黄色的“Agricultural Services”标题、“Complete solutions for agricultural work and solar park vegetation clearing in Katerini and the wider Pieria region.”一句、黄色的“Get a Quote”按钮、描边的“Our Services”按钮和一个滚动提示。
在新标签页中打开 mpampetas.gr

Mpampetas & Sons — 农业服务

项目概述

我为Mpampetas & Sons设计并开发了一个双语(希腊语/英语)静态网站——这是一家2015年在皮埃里亚卡泰里尼成立的家族农业服务公司。该企业专注于农业作业和太阳能园区植被清理。网站具有滚动监测导航、展示John Deere 5075GL拖拉机和12种专业工具的设备展示、包含19张照片和7个视频的可筛选画廊(支持灯箱),以及联系板块。我使用纯HTML5、采用CSS自定义属性的CSS3(灵感来自John Deere色彩系统)和原生JavaScript构建项目。网站包含JSON-LD LocalBusiness Schema、完整的双语支持和IntersectionObserver驱动的滚动动画。

挑战

以专业方式展示重型机械和农业服务,同时保持网站作为零依赖静态构建的快速和易访问性。

解决方案

使用CSS自定义属性实现统一的John Deere色彩系统,IntersectionObserver实现高性能滚动动画,以及带视频灯箱的可筛选画廊——全部无需任何框架或构建工具。