ePortfolio/IDS 493
Vector Marketing Website
I created this website as an assignment for my Web Design class, while I was working as a Sales Representative for Cutco Marketing. I had to read along with a script when I scheduled meeting with potential customers. I quickly realized the importance in my delivery of this script. That was the make or break point of whether or not I’d end up making a sale. People appreciate when you can speak to them organically, even when you are there to talk about something specific… Make it personal. I think that this job helped tremendously with my interpersonal skills and comprehension of how to sell something. https://sites.google.com/view/wla-cutco-demo/phoning?pli=1
Code for my Web Page – Breakdown
Link for reference is above – “Vector Marketing Website”
<!DOCTYPE html>
<html lang="en">
<head>
<title> Vector Marketing - Sales Rep.</title>
The Heading reads “Vector Marketing – Sales Rep.” inside the Tab above the URL.
<style>
p {
margin-left: 100px
margin-right: 100px
}
body {
background-image: url("https://designingidea.com/wp-content/uploads/2020/02/black-and-white-kitchen-with-white-cabinets-black-island-black-lamp-shades.jpg");
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 1025px 695px;
}
</style>
This is the code for the background image I used of the kitchen. I wanted the image to stay in one spot and not move as you scroll. As you can read I kept the image center and adjust the size to my liking.
<style>
h1 {
color: DarkOliveGreen;
text-align: center;
}
p {
font-family: "Georgia", serif;
}
</style>
</head>
<body>
</nav>
</header>
<p> <h1> Representative for Vector Marketing! <br>
Selling and demonstrating Cutco products and kitchenware </h1></p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
At this point in the code I am customizing the Heading color (dark olive green), The Heading Font (Georgia), and the Heading message (” Rep. for Vector Marketing! > Selling and demonstrating Cutco Products and Kitchenware<“)
<body>
<style>
h4 {
color: tan;
text-align: center;
}
a:link {
color: brown;
}
a:visited {
color: white;
}
</style>
<p><h4><a href="https://www.cutco.com/"html>CUTCO IS AWESOME!</a> You can buy <a href="https://www.cutco.com/products/thumbnail.jsp?shop=knife-sets"html>sets</a>, pieces and we have tons of accessories and <a href="https://www.cutco.com/products/thumbnail.jsp?shop=gift-sets"html>gifts.</a>
</h4></p>
</body>
</html>
<br><br><br><br><br><br><br><br><br><br><br>Here is where I ended the first page of the HTML site as we can see here by “</html>”. I added the links to specific pages on Cutco’s website, for example you can click on “Cutco is awesome” and it will take you to their main page. You can click on “sets” and it will redirect you to their knife sets, and same with clicking on the word “gifts”. I edited the links so that they are one color before engagement and another after engagement so that uses can see what they have and have not clicked on.
<!DOCTYPE html>
<html>
<body>
<style>
h2 {
text-align: center;
color: white;
}
p {
text-align:center;
}
</style>
<h2> About Me! </h2>
<p style="background-color: tan;">
Hello, I am Alexandria. Currently a full time student an undergrad <br>
senior at Old Dominion University. I am studying cybercrime and minoring in <br>
cybersecurity. I plan to hopefully apply that and get into digital forensics<br>
I am apporaching 22 years old and for the first ime in my life I am supporting<br>
myself. I have a full time job serving at a restuarant and I have recently got<br>
a job as a Vector Marketing Representative, selling the worlds best cutlery, <br>
CUTCO! I am honored to be apart of such a great team of people who are super <br>
understanding of my situation and helpful! Cutco has is all about helping me <br>
gain real world skills, gain confidence, and make money! I am super thankful <br>
that I came across such a great company to work for on the side and still able<br>
to focus primarily on school.</p>
</body>
</html>
This entire section of code is its own page (<!DOCTYPE html>). The goal behind this page was to allow visitors to get to know a little bit about me. I wanted the page to look clean and follow along with the color theme of the previous page. I Blocked off the center of the page with a text box that held my “about me” and centered that as well. Then ended the page via (</html>).
<h2> Meeting Setup </h2>
<form action="/action_page.php">
First name:<br>
<input type="text" name="firstname" value="Tony">
<br>
Last name:<br>
<input type="text" name="lastname" value="Stark">
<br><br>
<input type="submit" value="Submit">
</form>
<style>
p {
color: white;
}
form {
color: white;
text-align: center;
}
</style>
<p>Click the "Submit" button once the form is complete</p>
</body>
</html>
<br><br><br><br><br><br><br><br>
<!DOCTYPE html>
<body>
<html>
<h2> Scheduled Meetings </h2>
<table align="center">
<tr>
<th>Lastname</th>
<th>Firstname</th>
<th>Homeowner?</th>
</tr>
<tr>
<th>Stark</th>
<th>Tony</th>
<th>Yes</th>
</tr>
<tr>
<th>Wayne</th>
<th>Bruce</th>
<th>Yes</th>
</tr>
<tr>
<th>Parker</th>
<th>Peter</th>
<th>No</th>
</tr>
</table>
<style>
table, th, td {
border: 2px solid white;
padding: 2px;
text-align: center;
width: 50%;
}
th {
background-color: tan;
}
</style>New page, I created a table where visitors can insert their information and schedule a meeting and it input their name into the table below upon submission.
<br><br><br><br><br><br><br><br><br><br><br><br><br>
<h2> Popular Items List </h2>
<ul style="list-style-type:circle;">
<ul style="background-color: tan;">
<br><li>HomeMaker Set +8
<ul>
<li> Comes with either 8 table or steak knives</li>
<li> Comes with Knife Block</li>
</ul> </li>
<li>Galley Set +6
<ul>
<li> Comes with either 6 table or steak knives</li>
<li> Comes with Knife Block</li>
</ul> </li>
<li>Signature Set w/ Steak knives and Block
<ul>
<li> Comes with Super Shears</li>
<li> Comes with Knife Sharpener</li>
<li> Comes with 3 cutting boards in 3 sizes</li>
</ul> </li>
<li>Super Shears
<ul>
<li> Indestructable scissors</li>
<li> Can cut through bone, copper, and MORE!</li>
</ul></li>
<br>
</ul>
<style>
ul {
text-align: center;
list-style-position: inside;
list-style-type: circle;
list-style-type-position: center;
}
</stlye>
</body>
</html>The final part of the page I thought it would be a nice touch to add the most popular items sold by Cutco. I felt like the site needed more and that it was a nice addition to get visitors to sign up and provide additional information as to what they can buy. Hopefully if they had not previously visited the Cutco links they went back after viewing the bottom portion of my webpage.
Recent Comments