forked from ISM6225/Assignment_LookAndFeel
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathimplementation.html
More file actions
144 lines (128 loc) · 7.27 KB
/
Copy pathimplementation.html
File metadata and controls
144 lines (128 loc) · 7.27 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Implementation Principles</title>
<link rel="stylesheet" href="css/font-awesome.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<!-- HEADER -->
<header id="main-header">
<div class="container">
<div class="row end-sm end-md end-lg center-xs middle-xs middle-sm middle-md middle-lg">
<div class="col-xs-12 col-sm-2 col-md-2 col-lg-2">
<h1>
<span class="primary-text"></span>IRON CULT</h1>
</div>
<div class="col-xs-12 col-sm-10 col-md-10 col-lg-10">
<nav id="navbar">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="contact.html">Contact</a></li>
<li class="current"><a href="implementation.html">Implementation</a>
</ul>
</nav>
</div>
</div>
</div>
</header>
<!-- SUBHEADER -->
<section id="subheader">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<h1>Implementation Principless</h1>
</div>
</div>
</div>
</section>
<!-- MAIN PAGE -->
<section id="page" class="implementation">
<div class="container">
<div class="row center-xs center-sm center-md center-lg">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<h2><span class="primary-text">Responsiveness</span></h2>
<p align="Left">Responsive in website design is using HTML and CSS to automatically resize, hide, shrink, enlarge, a website, to make it adapt and look good on all devices (desktops, tablets, and phones). Furthermore, Responsive Web design is the approach that suggests that design and development should respond to the user's behavior and environment based on screen size, platform and orientation. The practice consists of a mix of flexible grids and layouts, images and an intelligent use of CSS media queries. The website designed and submitted as part of this assignment complies with the quality of responsiveness.</p>
<hr>
<h2><span class="primary-text">Usability</span></h2>
<p align="Left">We have achieved the ease of usability by below-
<li align="Left">No broken links</li>
<li align="Left">Mobile responsiveness</li>
<li align="Left">Server uptime</li>
<li align="Left">Simplicity</li>
<li align="Left">Familiarity</li>
<li align="Left">Consistency</li>
<li align="Left">Guidance</li>
<li align="Left">Good information architecture</li>
<li align="Left">Relevancy</li>
</p>
<hr>
<h2><span class="primary-text">Content</span></h2>
<p align="Left">We have made sure that the content hosted on the website is highly relevant for the fitness users which provide highly credible information.</p>
<hr>
<h2><span class="primary-text">Design Principles</span></h2>
<p>
<li align="Left">Divine proportions</li>
<p align="Left">We have used the principle of divine proprtions to make sure that menus, forms and other associated form components are complying.</p>
<li align="Left">Simplicity</li>
<p align="Left">Many sites are over-designed, with too many elements on the page, distracting visitors from the purpose of the site. In effective web design, simplicity is significant aspect. Not only does a clean, fresh design make the site easier to navigate, but the aesthetics are more appealing and will stand the test of time. It is unnecessary, as well as distracting, to load a site with design features that don't serve a purpose.Our design is simple so the users can find their way naturally and easily.</p>
<li align="Left">Aesthetically appealing</li>
<p align="Left">Our target customers are gym aspirants. Our design is be crafted explicitly to appeal to that niche.</p>
<li align="Left">Usability and Functionality</li>
<p align="Left">In website design, usability and functionality must drive each decision – outstripping any other design consideration. To achieve a clear, easy, and ultimately, direct path to conversions, both design and technical issues come into play. Every link must function fast, and every button and call to action must be positioned correctly, demanding as little effort as possible for the visitor to move forward to the next step. We have made sure that our website is highly usable and functional.</p>
<li align="Left">Easily Understood</li>
<p align="left">Site visitors must be able to easily understand every word, phrase, and headline without any confusion. One unusual or less commonly used word or phrase will drive them off. Industry-specific terms that are not in common usage will hinder your appeal. Dense, complex content won’t work. Calls to action that are unclear or hard to find will be skipped – and you have one more lost customer. All site content and each visual element must be laid out clearly and cleanly, with all critical conversion points visible above the fold (not requiring scrolling to find). Any deviation merely creates a barrier to conversion. So, we have made sure that our wesite design is wasily understood.</p>
<li align="Left">Design elements inspire users to go deep</li>
<p align="left">Your homepage must have an initial appeal in design and usability. Every design feature is then developed with the specific purpose to inspire the visitor to find out more – and go deeper into your site, and in the end, convert and become a customer. It takes rare skills to achieve this purpose, as well as experience and insight into user behaviors. Nothing should be left to chance – your design should naturally lead them to where you want them to go.</p>
</p>
<hr>
</div>
</div>
</div>
</section>
<!-- COMPANY -->
<section id="company">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<h4>Contact Us</h4>
<ul>
<li>
<i class="fa fa-phone"></i> (813) 123-4567</li>
<li>
<i class="fa fa-envelope"></i> support@fitness.com</li>
<li>
<i class="fa fa-map"></i> 111, E Fowler Avenue, Tampa, FL</li>
</ul>
</div>
<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<h4>About Us</h4>
<p>We are dedicated and credible fitness training professionals aimed at training you from scratch</p>
</div>
<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<h4>Newsletter</h4>
<p>For more updates and information, Subscribe!</p>
<form>
<input type="text" name="email" placeholder="Enter Email">
<button type="submit" name="button">Submit</button>
</form>
</div>
</div>
</div>
</section>
<!-- FOOTER -->
<footer id="main-footer">
<div class="container">
<div class="row center-xs center-sm center-md center-lg">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<p>Copyright © 2018 | IRON CULT</p>
</div>
</div>
</div>
</footer>
</body>
</html>