Design and Development of Web Designer Developer Website

Question: Discuss about theDesign and Development of Web Designer Developer Website. Answer: This report is about a portfolio website by the title of "Web Designer-Developer". The report will talk about the motivations, success criteria, technologies used, the rationale for the technologies selected in building the website, design process, and development process. Motivations for the Website A portfolio is essential for a service provider, be it an individual, or a company of any size. For an individual, a personal portfolio site is all about promoting him (Shaikh, 2012). He is a brand, and his name is a brand name. The author of this report is a web designer and developer in training and is pursuing a formal degree in the same field. Thus, it makes sense to get hands-on practice working on a topic that will become a necessity later on, whether the author works solo, as part of a small team, or part of an enterprise. Success Criteria for the Website The success criteria for the portfolio being design are many. The main aim is to get more incoming leads via email, call, or social networks. These leads should ideally be from customers looking to get a website built. Also, any side benefit like more followers/subscribers on the author's social networking profiles, more publicity on search engines (like Google) is also welcome. Another advantage, which concerns technically oriented visitors is the showcase of quality coding practices. Any visitor can view client-side technology source code of any website, and the author aims to display his attention to detail to those who are willing to examine the nuts and bolts of this site. Technologies Used The website is developed using client-side web technologies of HTML (Hypertext Markup Language), and CSS (Cascading Style Sheet). HTML is used for the content as well as annotating the content. CSS is used for providing the presentation to the content. A decision has been made to follow the Web Standards approach to web development keeping in mind the respect for the authority of W3C (World Wide Web Consortium), as well as business benefits (Mozilla Developer Network, 2014). Design Process The aim of the project is to be a portfolio about the author. The author has an inclination towards simple and functional things, and it is helpful is the author's portfolio mirrors his ideology. Thus, a simple design is the goal. The default white background is chosen and a fixed-width for the main content, which is to be center-aligned. Since the use of flashy animations or unwarranted graphics is not the goal of this project, visual variety will be included with the utilisation of variety of font families. Google Fonts will be used to provide a non-standard Serif font (a web font) for site heading as well subheadings, while the whole website will be in a standard Sans-Serif font. The header portion will contain the title of page, along with (coloured) social media icons to its right. The muted colours of the site are expected to encourage the users to notice the coloured icons and possibly follow the author on social networks. The site is designed primarily to be a single column, with a sidebar for on-page content. Since the website is supposed to be a single-page document and contains substantial text, an on-page menu list (unordered) is chosen. This menu may have a light background colour which highlights it without reducing the contrast (and thus the legibility) (Osborne, 2015) of the default coloured black text. Development Process Once the design was formed on the paper, and a basic wireframe drawn on a notebook using a pen, the coding process was started, beginning with the HTML5 doctype. The website is hand-coded to allow for full practice of the web development process, as well as any avoidance of bloated code that an automated software may be forced to produce. Industry best practices are followed throughout the code. W3C's validation services are utilised to verify that the coding process for the HTML and CSS are up to par. The code for the project passes all the validation tests. Writing validated HTML and CSS is a major part of ensuring that the content of the website will be served in all devices and browsers- of the past and future. Also, valid code covers non-traditional devices like large television screens, small mobile devices, and other upcoming technologies to access and interact with websites. During the development of the site, frequent checking of the final site was made by refreshing the pag e in the web browser, and making changes if required, and repeating the process. References Mozilla Developer Network. (2014, November 6). https://developer.mozilla.org/en-US/docs/The_Business_Benefits_of_Web_Standards. Retrieved from Mozilla Developer Network: https://developer.mozilla.org/en-US/docs/The_Business_Benefits_of_Web_Standards Osborne, T. (2015, March 3). Color Contrast for Better Readability. Retrieved from Viget Labs: https://www.viget.com/articles/color-contrast Shaikh, M. A. (2012, December 8). Importance of an Attractive Portfolio for Graphic Designers. Retrieved from InstantShift: https://www.instantshift.com/2012/12/08/importance-of-an-attractive-portfolio-for-graphic-designers/