1.
Introduction
"Artwork" is a captivating and dynamic website that serves as a virtual gallery and platform for
artists to showcase their diverse talents and creations. This platform brings together a wide range
of visual artworks, from paintings to digital art, offering a rich and immersive experience for art
enthusiasts and collectors alike.
Art is an act of expressing feelings, thoughts, and observations. Artwork has the power to evoke
emotions, challenge conventions, spark conversations, and inspire change.
Take your time to explore the diverse artworks, discover the artists behind them, and immerse yourself in
the rich tapestry of human creativity. We hope you find the journey through our digital gallery as inspiring
and enchanting as we do. So, without further ado, let the art captivate your senses and ignite your
imagination as you delve into the world of creativity that awaits you on our website.
Thank you for joining us on this artistic journey. We hope you find inspiration, beauty, and a
sense of wonder as you explore the world of art on our website. Your presence here contributes
to the vibrant and evolving tapestry of human creativity. Enjoy your visit!
2. Objectives
The objectives of an artwork website can vary depending on its purpose and the goals of its
creators, but here are some common objectives:
Showcase my art in an attractive and stylish way
Sell my artwork in an online shop
Establish myself as an artist in a particular arena
Introduce my work to a new audience
Build a following through an engaging and insightful blog
Strengthen and build relationships with my audience
Attract interest from galleries
The specific objectives of an artwork website can vary based on its mission, target audience, and
the goals of its creators. However, a successful artwork website often combines several of these
objectives to create a rich and engaging experience for artists and art enthusiasts alike.
3. Requirement specifications
Front end tools:
HTNL
CSS
JAVASCRIPT
Tool used:
Visual studio code
Netlify server hosting(https://artwork-site.netlify.app)
Web host manager(Netlify server hosting)
Microsoft edge browser
Hardware requirement:
Processor: Ryzen 3
Ram: 8 GB
Hard disk: 512 GB
User requirement:
Active internet connection
Laptop, mobile
Web browser
4. Modules
Home
The Home module is the landing page of your website. It should provide a visually
appealing introduction to your website, potentially featuring a slideshow of featured
artwork, a brief welcome message, and navigation links to other sections of your website .
Gallery
The Gallery module is where you showcase your artwork. This section typically contains
a collection of images displaying your creations. You can organize the gallery into
categories or themes, making it easy for visitors to explore your work.
About
The About module provides information about you as an artist. This is your opportunity
to share your background, artistic journey, inspiration, and any other relevant details that
help visitors connect with your work. You can include a bio, artist statement, and perhaps
a photo of yourself.
Contact
The Contact module enables visitors to get in touch with you. It usually includes a
contact form with fields for name, email, subject, and message .
5. Screenshots
Home
Gallery
About
Contact
6. Source code
Index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="shortcut icon" href="favicon.png">
<link rel="stylesheet" href="css/style.css">
<title>Artwork — Free artworks Website</title>
</head>
<body data-spy="scroll" data-target=".site-navbar-target" data-offset="200">
<div class="site-wrap">
<div class="site-mobile-menu site-navbar-target">
<div class="site-mobile-menu-header">
<div class="site-mobile-menu-close mt-3">
<span class="icon-close2 js-menu-toggle"></span>
</div>
</div>
<div class="site-mobile-menu-body"></div>
</div>
<header class="header-bar d-flex d-lg-block align-items-center site-navbar-target" data-
aos="fade-right">
<div class="site-logo">
<a href="index.html">Artwork</a>
</div>
<div class="d-inline-block d-lg-none ml-md-0 ml-auto py-3" style="position: relative; top:
3px;"><a href="#" class="site-menu-toggle js-menu-toggle "><span class="icon-menu
h3"></span></a></div>
<div class="main-menu">
<ul class="js-clone-nav">
<li><a href="#section-home" class="nav-link">Home</a></li>
<li><a href="#section-photos" class="nav-link">Gallery</a></li>
<li><a href="#section-about" class="nav-link">About</a></li>
<li><a href="#section-contact" class="nav-link">Contact</a></li>
</ul>
<ul class="social js-clone-nav">
<li><a href="#"><span class="icon-instagram"></span></a></li>
<li><a href="#"><span class="icon-facebook"></span></a></li>
<li><a href="#"><span class="icon-twitter"></span></a></li>
<li><a href="#"><span class="icon-linkedin"></span></a></li>
</ul>
</div>
</header>
<main class="main-content">
<section class="site-section-hero bg-image mb-5" style="background-image:
url('images/hero-min.jpg');" data-stellar-background-ratio="0.5" id="section-home">
<div class="row justify-content-center align-items-center">
<div class="col-md-7 text-center">
<h1 class=" heading text-uppercase text-white" data-aos="fade-up">Artwork</h1>
<p class="lead text-white mb-4" data-aos="fade-up" data-aos-delay="100">"Art is not a
thing, it is a way."</p>
<p data-aos="fade-up" data-aos-delay="100"><a href="#section-contact" class="btn btn-
primary btn-md smoothscroll">Available for hire</a></p>
</div>
</div>
</section>
<section class="site-section" id="section-contact">
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<h2 class=" mb-5 heading">Contact</h2>
<form action="#">
<div class="row form-group">
<div class="col-md-6 mb-3 mb-md-0">
<label class="" for="fname">First Name</label>
<input type="text" id="fname" class="form-control">
</div>
<div class="col-md-6">
<label class="" for="lname">Last Name</label>
<input type="text" id="lname" class="form-control">
</div>
</div>
<div class="row form-group">
<div class="col-md-12">
<label class="" for="email">Email</label>
<input type="email" id="email" class="form-control">
</div>
</div>
<div class="row form-group">
<div class="col-md-12">
<label class="" for="subject">Subject</label>
<input type="subject" id="subject" class="form-control">
</div>
</div>
<div class="row form-group mb-5">
<div class="col-md-12">
<label class="" for="message">Message</label>
<textarea name="message" id="message" cols="30" rows="7" class="form-
control"></textarea>
</div>
</div>
<div class="row form-group">
<div class="col-md-12">
<input type="submit" value="Send Message" class="btn btn-primary btn-md">
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<div class="row justify-content-center">
<div class="col-md-12 text-center py-5">
<p>Copyright ©<script>document.write(new Date().getFullYear());</script>. All
Rights Reserved. — Designed with love by Nandani Gupta
</p>
</div>
</div>
</div>
</main>
</div>
<script src="js/main.js"></script>
</body>
</html>
7. Conclusion
"Artwork" aims to bridge the gap between artists and their audience, fostering a sense of
connection and appreciation for the beauty and diversity of visual art. Whether you're an art
lover, a collector, or an aspiring artist, this website offers a virtual haven for artistic exploration
and appreciation.
In conclusion, our artwork website is more than just a virtual gallery; it's a celebration of human
creativity, a testament to the power of artistic expression, and a bridge between artists and art
enthusiasts. We are dedicated to providing a platform where artists can showcase their talent,
where visitors can find inspiration and beauty, and where the magic of art can be experienced
and appreciated by all.
Thank you for visiting our website and for being a part of our artistic journey. We look forward
to sharing the world of art with you, and we hope you find endless inspiration and wonder in the
creativity that graces our virtual walls. Welcome to our artistic oasis, where imagination knows
no boundaries, and art is truly alive.
8. Future scope
The future of an artwork website is not limited to a single path but can incorporate a combination
of these trends and innovations to stay relevant, provide value to its users, and continue
supporting the vibrant world of art. Adapting to technological advancements and the evolving
needs of the art community will be key to its ongoing success.
The future scope of an artwork website is both exciting and promising, with opportunities for
growth and innovation. Here are some key areas where artwork websites can expand and evolve:
Virtual Reality (VR) and Augmented Reality (AR): Integrating VR and AR technologies can
offer visitors immersive experiences. Users could virtually "walk" through galleries, view art in
their own space using AR, or even interact with three-dimensional representations of artworks.
Artificial Intelligence (AI) Integration: AI can be used to enhance user experiences by offering
personalized recommendations based on user preferences, assisting with art curation, or even
generating art itself through AI-driven algorithms.
Mobile Apps: Developing mobile apps can make it easier for users to engage with artwork on the
go, expanding the reach and accessibility of the platform.