Files
aijianhua/website/index.html

303 lines
16 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="爱鉴花 - 专业的AI花卉识别平台提供精准的花卉识别服务包含数万种花卉知识库和智能识别技术准确率高达95%。">
<meta name="keywords" content="花卉识别,AI识别,植物识别,花卉知识,智能识别,爱鉴花">
<meta name="author" content="爱鉴花团队">
<!-- Open Graph -->
<meta property="og:title" content="爱鉴花 - 智能花卉识别平台">
<meta property="og:description" content="专业的AI花卉识别平台提供精准的花卉识别服务准确率高达95%。">
<meta property="og:type" content="website">
<meta property="og:url" content="https://www.aijianhua.com">
<meta property="og:image" content="https://www.aijianhua.com/images/og-image.png">
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="爱鉴花 - 智能花卉识别平台">
<meta name="twitter:description" content="专业的AI花卉识别平台提供精准的花卉识别服务。">
<title>爱鉴花 - 智能花卉识别平台</title>
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.7.2/css/all.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<!-- 导航栏 -->
<nav class="navbar navbar-expand-lg navbar-light bg-white fixed-top shadow-sm">
<div class="container">
<a class="navbar-brand" href="index.html">
<i class="fas fa-flower text-primary me-2"></i>
<span class="fw-bold text-primary">爱鉴花</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" href="index.html">首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">关于我们</a>
</li>
<li class="nav-item">
<a class="nav-link" href="products.html">产品介绍</a>
</li>
<li class="nav-item">
<a class="nav-link" href="news.html">新闻中心</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">联系我们</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- 英雄区域 -->
<section class="hero-section bg-gradient-primary text-white py-5">
<div class="container py-5">
<div class="row align-items-center min-vh-75">
<div class="col-lg-6">
<h1 class="display-4 fw-bold mb-4">智能花卉识别,发现自然之美</h1>
<p class="lead mb-4">爱鉴花为您提供精准的花卉识别服务通过AI技术快速识别各种花卉植物让您更好地了解和欣赏自然。</p>
<div class="d-flex gap-3">
<a href="#features" class="btn btn-light btn-lg px-4">了解更多</a>
<a href="contact.html" class="btn btn-outline-light btn-lg px-4">立即体验</a>
</div>
</div>
<div class="col-lg-6">
<img src="images/hero-image.png" alt="花卉识别" class="img-fluid rounded shadow lazy-load" loading="lazy">
</div>
</div>
</div>
</section>
<!-- 特性介绍 -->
<section id="features" class="py-5">
<div class="container py-5">
<div class="text-center mb-5">
<h2 class="display-5 fw-bold text-dark mb-3">核心功能</h2>
<p class="lead text-muted">爱鉴花为您提供全方位的花卉识别解决方案</p>
</div>
<div class="row g-4">
<div class="col-md-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body text-center p-4">
<div class="feature-icon bg-primary text-white rounded-circle mx-auto mb-3">
<i class="fas fa-camera fa-2x"></i>
</div>
<h5 class="card-title">智能识别</h5>
<p class="card-text text-muted">通过拍照或上传图片快速识别花卉种类准确率高达95%</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body text-center p-4">
<div class="feature-icon bg-success text-white rounded-circle mx-auto mb-3">
<i class="fas fa-book fa-2x"></i>
</div>
<h5 class="card-title">知识库</h5>
<p class="card-text text-muted">包含数万种花卉的详细信息,包括生长习性、养护方法等</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card h-100 border-0 shadow-sm">
<div class="card-body text-center p-4">
<div class="feature-icon bg-info text-white rounded-circle mx-auto mb-3">
<i class="fas fa-users fa-2x"></i>
</div>
<h5 class="card-title">社区交流</h5>
<p class="card-text text-muted">与花卉爱好者分享经验,交流养护心得,共同成长</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 产品展示 -->
<section class="bg-light py-5">
<div class="container py-5">
<div class="text-center mb-5">
<h2 class="display-5 fw-bold text-dark mb-3">热门产品</h2>
<p class="lead text-muted">探索我们的核心产品和服务</p>
</div>
<div class="row g-4">
<div class="col-md-4 mb-4">
<div class="card product-card border-0 shadow-sm h-100">
<img src="images/product-1.jpg" class="card-img-top lazy-load" alt="微信小程序" loading="lazy">
<div class="card-body text-center">
<h5 class="card-title fw-bold">微信小程序</h5>
<p class="card-text text-muted">随时随地识别花卉,操作简单便捷</p>
<div class="mt-3">
<span class="badge bg-success me-2">免费使用</span>
<span class="badge bg-info">95%准确率</span>
</div>
<a href="products.html" class="btn btn-primary mt-3">立即体验</a>
</div>
</div>
</div>
<div class="col-md-4 mb-4">
<div class="card product-card border-0 shadow-sm h-100">
<img src="images/product-2.jpg" class="card-img-top lazy-load" alt="API服务" loading="lazy">
<div class="card-body text-center">
<h5 class="card-title fw-bold">API服务</h5>
<p class="card-text text-muted">为开发者提供稳定可靠的识别接口</p>
<div class="mt-3">
<span class="badge bg-primary me-2">¥99/月</span>
<span class="badge bg-warning">1000次调用</span>
</div>
<a href="products.html" class="btn btn-primary mt-3">查看文档</a>
</div>
</div>
</div>
<div class="col-md-4 mb-4">
<div class="card product-card border-0 shadow-sm h-100">
<img src="images/product-3.jpg" class="card-img-top lazy-load" alt="企业版" loading="lazy">
<div class="card-body text-center">
<h5 class="card-title fw-bold">企业版</h5>
<p class="card-text text-muted">定制化解决方案,满足专业需求</p>
<div class="mt-3">
<span class="badge bg-dark me-2">私有部署</span>
<span class="badge bg-success">专属支持</span>
</div>
<a href="contact.html" class="btn btn-primary mt-3">咨询方案</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 新闻动态 -->
<section class="py-5">
<div class="container py-5">
<div class="text-center mb-5">
<h2 class="display-5 fw-bold text-dark mb-3">最新动态</h2>
<p class="lead text-muted">关注我们的最新进展和行业资讯</p>
</div>
<div class="row g-4">
<div class="col-md-4">
<div class="card news-card border-0 shadow-sm">
<div class="card-body">
<small class="text-muted">2024-01-15</small>
<h6 class="card-title mt-2">爱鉴花小程序正式上线</h6>
<p class="card-text text-muted">经过数月开发,我们的微信小程序正式上线,欢迎体验。</p>
<a href="news.html" class="text-primary text-decoration-none">阅读更多 →</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card news-card border-0 shadow-sm">
<div class="card-body">
<small class="text-muted">2024-01-10</small>
<h6 class="card-title mt-2">AI识别准确率再创新高</h6>
<p class="card-text text-muted">通过算法优化花卉识别准确率提升至95%。</p>
<a href="news.html" class="text-primary text-decoration-none">阅读更多 →</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card news-card border-0 shadow-sm">
<div class="card-body">
<small class="text-muted">2024-01-05</small>
<h6 class="card-title mt-2">新增1000种花卉数据</h6>
<p class="card-text text-muted">知识库新增1000种花卉信息覆盖更全面。</p>
<a href="news.html" class="text-primary text-decoration-none">阅读更多 →</a>
</div>
</div>
</div>
</div>
<div class="text-center mt-4">
<a href="news.html" class="btn btn-primary">查看更多新闻</a>
</div>
</div>
</section>
<!-- 页脚 -->
<footer class="bg-dark text-white py-5">
<div class="container">
<div class="row">
<div class="col-lg-4 mb-4">
<h5 class="mb-3">爱鉴花</h5>
<p class="text-muted">智能花卉识别平台,让您更好地了解和欣赏自然之美。</p>
<div class="social-links">
<a href="#" class="text-white me-3"><i class="fab fa-weixin"></i></a>
<a href="#" class="text-white me-3"><i class="fab fa-weibo"></i></a>
<a href="#" class="text-white"><i class="fab fa-github"></i></a>
</div>
</div>
<div class="col-lg-2 mb-4">
<h6 class="mb-3">产品</h6>
<ul class="list-unstyled">
<li><a href="products.html" class="text-muted text-decoration-none">微信小程序</a></li>
<li><a href="products.html" class="text-muted text-decoration-none">API服务</a></li>
<li><a href="products.html" class="text-muted text-decoration-none">企业版</a></li>
</ul>
</div>
<div class="col-lg-2 mb-4">
<h6 class="mb-3">支持</h6>
<ul class="list-unstyled">
<li><a href="#" class="text-muted text-decoration-none">帮助中心</a></li>
<li><a href="#" class="text-muted text-decoration-none">常见问题</a></li>
<li><a href="contact.html" class="text-muted text-decoration-none">联系我们</a></li>
</ul>
</div>
<div class="col-lg-4 mb-4">
<h6 class="mb-3">联系我们</h6>
<p class="text-muted mb-1"><i class="fas fa-map-marker-alt me-2"></i>北京市海淀区中关村大街</p>
<p class="text-muted mb-1"><i class="fas fa-phone me-2"></i>400-123-4567</p>
<p class="text-muted"><i class="fas fa-envelope me-2"></i>contact@aijianhua.com</p>
</div>
</div>
<hr class="my-4">
<div class="row align-items-center">
<div class="col-md-6 text-center text-md-start">
<p class="text-muted mb-0">&copy; 2024 爱鉴花. 保留所有权利.</p>
</div>
<div class="col-md-6 text-center text-md-end">
<p class="text-muted mb-0">
<a href="#" class="text-muted text-decoration-none me-3">隐私政策</a>
<a href="#" class="text-muted text-decoration-none me-3">服务条款</a>
<a href="#" class="text-muted text-decoration-none">京ICP备12345678号</a>
</p>
</div>
</div>
<div class="text-center mt-3">
<p class="text-muted small">
友情链接:
<a href="#" class="text-muted text-decoration-none me-2">中国花卉协会</a>
<a href="#" class="text-muted text-decoration-none me-2">植物智</a>
<a href="#" class="text-muted text-decoration-none">园林在线</a>
</p>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="js/main.js"></script>
<!-- Schema.org结构化数据 -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "爱鉴花",
"url": "https://aijianhua.com",
"logo": "https://aijianhua.com/images/logo.png",
"description": "专业的AI花卉识别平台提供精准的花卉识别服务",
"sameAs": [
"https://weixin.qq.com/",
"https://github.com/aijianhua"
]
}
</script>
</body>
</html>