Intuitive Graphical and Technical Web Design: Santa Susana High School
Intuitive Graphical and Technical Web Design: Santa Susana High School
Ivan Georgiev
CP English 12
Bradley
11/20/15
Georgiev |1
For my senior project in Santa Susana High School I choose to design and build
a website promoting an aspiring authors first book. I have studied web design and basic
computer programming since freshman year and I feel confident that I will be able to
design and code a proficient website that would satisfy my clients demands. I plan on
having a career in web design or in the web development field after high school or
college. I think my senior project will improve my skills and help me learn more about
how a website is created hands on. I have experience with maintaining our school
website using basic git, HTML5, CSS3, and JavaScript. I plan on incorporating these
languages and tools into my own website to help streamline the process of updating
and improving the website over time. By using these languages I plan on learning the
more advanced aspects of them and how they work together better to create a modern
site. Along the way I will most likely need to learn more languages and use other tools
in order to achieve my goals, I will be listing these as they come up in my project. I look
forward to creating an engaging and modern website for my client and promoting their
book on the internet.
Creating a website is no easy feat. When starting to make a website one must
consider a name and a hosting service for their website. There is a multitude of hosting
providers so you must find the one that suits your needs best at a reasonable price. The
things you need to take into account when searching for a domain and hosting provider
are numerous but to narrow it down the most important ones you will need to know are
the cost of the domain and server space, FTP services, scripting support and human to
Georgiev |2
human technical support. (Yu, Yan). These services and options will prove invaluable
to a web developer as he is faced with unexpected problems during the process of
creating the website. The live tech support you receive from your hosting company can
help you set up even the hardest of features. Having script support on your server will
allow you to develop and automate some of the more tedious processes, for example
deploying the website automatically by using git and Github.
Having a version control system is a key feature for any website or project. A
revision control system enables you to keep track of changes, revert anything that
breaks, and keep rolling backups of your project (McLellan, Drew). A version control
system like git will also let you keep track of the time spent working and the time
between changed to the website so you know if something has gone wrong and when it
went wrong and if you are working with a team it will tell you which persons changes
caused the error to occur. Hosting your code on a site like GitHub will let you easily
revert changes done to the code of the website and temporarily fix issues until a
permanent solution has been found for the bug or problem. Github is also a great tool to
use when working with a team on a single website or project as it lets multiple people
work on the same files without having conflicts from multiple versions of the same file
trying to sync with the repository. Another advantage of having a repository on Github is
that it lets you share your code and files with other people who may be interested in
seeing your skills at designing and creating a website.
The design is easily the most important part of a website. The first thing a person
sees is the color and layout of a page. That is what catches their eye. To have a
Georgiev |3
successful website you have to have good design, the colors must work together and be
appealing to the eye, the site has to have a layout that is not cluttered but also not full of
big empty spaces. A website must have and easy to navigate page system for all of the
content on the site. The navigation links to other sites and documents should be placed
in your central content area because they are the second thing a person sees and the
first thing they look for on a website. (Sharlin, Micole). It is good to have well-made
navigation buttons and links that are eye catching but also not intrusive, like big chunks
with bright colors. Another major factor in the design of a website is the legibility of the
text. The text needs to be easy to read and it needs to the rights type size so it fits on
the page appropriately. (Boyden, Caroline) A website should have a maximum of three
to five main colors on its homepage; you don't want the colors to draw attention away
from the content and the graphics or pictures. (Boyden, Caroline)
Communicating with your client is a highly regarded skill in the web development
industry. The web designer needs to be able to ask the right questions of his client and
get the most information possible while being the least disruptive. Corresponding with
your client is a good way to see if a website is coming out the way the client wants it to
look or if something needs to be changed in order to make it satisfactory. Email and
face-to-face meetings are a great way to discuss and catch up your client on the way
the website is going. An important question to ask your client is what the target
audiences of the site is going to be and what type of information is going to be going
on the website. (Sharlin, Micole) These questions will help you determine what type of
site you will be creating and what type of framework you will need in order to best fulfill
Georgiev |4
your clients needs. This will also determine if the client is looking for something to easily
manage by themselves or if they are looking to employ a web developer to maintain and
run the website. Your client will be providing a lot of the content that will be going on the
website, you need to make sure that you are able to get in touch with them and be
assertive about getting the material that needs to go on the website.
So you have finally finished designing and adding the needed material and
content to the website you have been hired to create, where do go from here? Well of
course you are going to have to deploy the website to the internet under the domain
name you have bought and upload the files. This is where the version control system
comes into the spotlight. Instead of using the old method of connecting to the server
using FTP and adding edited files to the live version of the website and praying they
work you can use git and Github and a little bit luck to set up and autodeploy webhook
which means every time you make a change to the website locally on your computer
you can push them straight to the live version of the website. This is easily the most
difficult and tedious part of setting up a proper system for your website but it lets the
developer have multiple versions of the website and it lets them test changes before
committing to them and sending them to the actual live version of the website. This way
the developer is able to catch any bugs or errors with his website. The auto deploy
feature also makes for much easier and safer way to update the website that is currently
being worked on. This also allows the site to be "rolled back" to a previous version in
case something goes terribly wrong.
Georgiev |5
I intend to implement and improve on all of these tools, skills and languages at
my disposal to create a modern and up to industry standard site which will promote an
aspiring authors book and meets all of their demands and needs. I have bought a
domain and rented server space to host my website, I have also implemented the auto
deploy feature using Github and php and have started the design of the website from
scratch. The websites layout has been inspired by multiple websites I have come
across on the internet and I have picked up the elements I liked most about those sites
and tried to implement them into my own site to the best of my abilities. I still have a
ways to go but all of the hard work of the website is mostly done as I have a template of
the site created, all that is left is adding the content and finishing the graphical design.
The research I did helped me improve the skills I already had and it also taught me new
ones, for example I had to figure out how to work with a remote server and how to
implement the auto deploy feature using Github and php. I also learned how to create a
more easy to use template for a website using php and injecting parts of the website
instead of redoing them every time I wanted to make a new page of content. I chose to
create a website for my senior project because I think it will greatly help me improve my
skills within the internet world with the hands on experience I will be receiving when I
am done with this project. I think that this website will also look great on a portfolio for
college and it would serve me well if I choose to seek a job right out of high school in
the web development field.
Sharlin, Micole, and Evelyn Tu. "Creating a Web Page and Adding Content."The
Essential Guide to Dreamweaver CS4 with CSS, Ajax, and PHP(2009): 1-43.
Web. <http://www.princeton.edu/communications/services/docs/IAguide2.pdf>.
Georgiev |6
McLellan, Drew. "What It Takes to Build a Website." 24 Ways. N.p., 1 Dec. 2014.
Web. 17 Sept. 2015. <https://24ways.org/2014/what-it-takes-to-build-a-website/>
Natda, Kailashkumar V. "Responsive Web Design." EDUVANTAGE Eduvantage 1.1
(2013): n.pag. Web. <http://uablogs.missouri.edu/wpcontent/presentations/responsive-web-design/presentation.pdf>.
Boyden, Caroline. "How to Design a Good Website." LSCR. N.p., 6 Aug. 2013. Web. 21
Sept. 2015. <http://lscr.berkeley.edu/advice/web/design>.
Yu, Yan. "What to Look for When Choosing a Web Hosting Service Provider." (2005):
93-97. Http://flc.losrios.edu/~tully/Misc/WebHostingCheckList.pdf. Web.