\documentclass[10pt,a4paper]{article} % Packages \usepackage{fancyhdr} % For header and footer \usepackage{multicol} % Allows multicols in tables \usepackage{tabularx} % Intelligent column widths \usepackage{tabulary} % Used in header and footer \usepackage{hhline} % Border under tables \usepackage{graphicx} % For images \usepackage{xcolor} % For hex colours %\usepackage[utf8x]{inputenc} % For unicode character support \usepackage[T1]{fontenc} % Without this we get weird character replacements \usepackage{colortbl} % For coloured tables \usepackage{setspace} % For line height \usepackage{lastpage} % Needed for total page number \usepackage{seqsplit} % Splits long words. %\usepackage{opensans} % Can't make this work so far. Shame. Would be lovely. \usepackage[normalem]{ulem} % For underlining links % Most of the following are not required for the majority % of cheat sheets but are needed for some symbol support. \usepackage{amsmath} % Symbols \usepackage{MnSymbol} % Symbols \usepackage{wasysym} % Symbols %\usepackage[english,german,french,spanish,italian]{babel} % Languages % Document Info \author{{[}deleted{]}} \pdfinfo{ /Title (digital-technology-website-cheat-sheet.pdf) /Creator (Cheatography) /Author ({[}deleted{]}) /Subject (Digital Technology Website Cheat Sheet) } % Lengths and widths \addtolength{\textwidth}{6cm} \addtolength{\textheight}{-1cm} \addtolength{\hoffset}{-3cm} \addtolength{\voffset}{-2cm} \setlength{\tabcolsep}{0.2cm} % Space between columns \setlength{\headsep}{-12pt} % Reduce space between header and content \setlength{\headheight}{85pt} % If less, LaTeX automatically increases it \renewcommand{\footrulewidth}{0pt} % Remove footer line \renewcommand{\headrulewidth}{0pt} % Remove header line \renewcommand{\seqinsert}{\ifmmode\allowbreak\else\-\fi} % Hyphens in seqsplit % This two commands together give roughly % the right line height in the tables \renewcommand{\arraystretch}{1.3} \onehalfspacing % Commands \newcommand{\SetRowColor}[1]{\noalign{\gdef\RowColorName{#1}}\rowcolor{\RowColorName}} % Shortcut for row colour \newcommand{\mymulticolumn}[3]{\multicolumn{#1}{>{\columncolor{\RowColorName}}#2}{#3}} % For coloured multi-cols \newcolumntype{x}[1]{>{\raggedright}p{#1}} % New column types for ragged-right paragraph columns \newcommand{\tn}{\tabularnewline} % Required as custom column type in use % Font and Colours \definecolor{HeadBackground}{HTML}{333333} \definecolor{FootBackground}{HTML}{666666} \definecolor{TextColor}{HTML}{333333} \definecolor{DarkBackground}{HTML}{63E686} \definecolor{LightBackground}{HTML}{F5FDF7} \renewcommand{\familydefault}{\sfdefault} \color{TextColor} % Header and Footer \pagestyle{fancy} \fancyhead{} % Set header to blank \fancyfoot{} % Set footer to blank \fancyhead[L]{ \noindent \begin{multicols}{3} \begin{tabulary}{5.8cm}{C} \SetRowColor{DarkBackground} \vspace{-7pt} {\parbox{\dimexpr\textwidth-2\fboxsep\relax}{\noindent \hspace*{-6pt}\includegraphics[width=5.8cm]{/web/www.cheatography.com/public/images/cheatography_logo.pdf}} } \end{tabulary} \columnbreak \begin{tabulary}{11cm}{L} \vspace{-2pt}\large{\bf{\textcolor{DarkBackground}{\textrm{Digital Technology Website Cheat Sheet}}}} \\ \normalsize{by \textcolor{DarkBackground}{{[}deleted{]}} via \textcolor{DarkBackground}{\uline{cheatography.com/28372/cs/8434/}}} \end{tabulary} \end{multicols}} \fancyfoot[L]{ \footnotesize \noindent \begin{multicols}{3} \begin{tabulary}{5.8cm}{LL} \SetRowColor{FootBackground} \mymulticolumn{2}{p{5.377cm}}{\bf\textcolor{white}{Cheatographer}} \\ \vspace{-2pt}{[}deleted{]} \\ \uline{cheatography.com/deleted-28372} \\ \end{tabulary} \vfill \columnbreak \begin{tabulary}{5.8cm}{L} \SetRowColor{FootBackground} \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}} \\ \vspace{-2pt}Not Yet Published.\\ Updated 16th June, 2016.\\ Page {\thepage} of \pageref{LastPage}. \end{tabulary} \vfill \columnbreak \begin{tabulary}{5.8cm}{L} \SetRowColor{FootBackground} \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Sponsor}} \\ \SetRowColor{white} \vspace{-5pt} %\includegraphics[width=48px,height=48px]{dave.jpeg} Measure your website readability!\\ www.readability-score.com \end{tabulary} \end{multicols}} \begin{document} \raggedright \raggedcolumns % Set font size to small. Switch to any value % from this page to resize cheat sheet text: % www.emerson.emory.edu/services/latex/latex_169.html \footnotesize % Small font. \begin{multicols*}{3} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Report Format}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Report formatting: \newline % Row Count 1 (+ 1) Following are explanations of the various sections that usually make up a report: \newline % Row Count 3 (+ 2) Title Section: \newline % Row Count 4 (+ 1) If the report is short, the front cover can include any information that you feel is necessary including the author(s) and the date prepared. In a longer report, you may want to include a table of contents and definitions of terms. \newline % Row Count 9 (+ 5) Consider using a Microsoft Word Cover Page to improve the look of your title section. See \seqsplit{https://support.office.com/en-us/article/Add-a-cover-page-79df80ec-266d-46d6-9382-6d70f1d13777} for information on how to insert a Cover Page. \newline % Row Count 14 (+ 5) Introduction: \newline % Row Count 15 (+ 1) The first page of the report needs to have an introduction. You will explain what the report is about and why it is being made. \newline % Row Count 18 (+ 3) Summary: \newline % Row Count 19 (+ 1) There needs to be a summary of the major points, conclusions, and recommendations. It needs to be short as it is a general overview of the report. Some people will read the summary and only skim the report, so make sure you include all the relevant information. It would be best to write this last then insert it after the introduction section so you will include everything, even the points that might be added at the last minute. \newline % Row Count 28 (+ 9) Body: \newline % Row Count 29 (+ 1) This is the main section of the report. The previous sections needed to be written in plain English, but this section can include jargon from your industry. There needs to be several sections, with each having a subtitle. Information is usually arranged in order of importance with the most important information coming first. \newline % Row Count 36 (+ 7) } \tn \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Report Format (cont)}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Conclusion / Recommendations: \newline % Row Count 1 (+ 1) This is where everything comes together. Keep this section free of jargon as many people will read the Summary and Conclusion and not the rest of the report so you need it to be clear. \newline % Row Count 5 (+ 4) This is where you use what you have written in the body section to make a conclusion (your decision) and recommendations (what you think should happen.) Write this section in plain English and explain your recommendations, putting them in order of priority. \newline % Row Count 11 (+ 6) Note: As well as having the correct content, your report should also look professional. Consider using Microsoft Word to apply a Style to your headings and body text to improve the overall appearance of your report. See \seqsplit{http://www.gcflearnfree.org/word2013/29} for more information on how to use Styles. \newline % Row Count 18 (+ 7)   \newline % Row Count 19 (+ 1) Tips for Good Writing \newline % Row Count 20 (+ 1) Here are a few tips for good writing: \newline % Row Count 21 (+ 1) Keep it simple \newline % Row Count 22 (+ 1) Do not try to impress; try to communicate. Keep the sentences short and to the point. Do not go into a lot of detail unless it is needed. Make sure every word needs to be there and that each contributes to the purpose of the report. \newline % Row Count 27 (+ 5) Use an active voice rather than passive. \newline % Row Count 28 (+ 1) Active voice uses fewer words than the passive voice and gives impact to the writing by emphasizing the person or thing responsible for an action. The advantage of the active voice is that it makes the writing move smoothly and easily. Here is an example: Steve loves Amy. \newline % Row Count 34 (+ 6) } \tn \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Report Format (cont)}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{The passive voice is used to show interest in the person or object that experiences an action, rather than the person or object that is actually performing the action. Passive voice uses more words and is not generally used in academic writing. Here is an example: Amy is loved by Steve. \newline % Row Count 6 (+ 6) Grammar and punctuation are important \newline % Row Count 7 (+ 1) Having someone proofread is a good idea. Remember that the computer cannot catch all the mistakes, especially with words like "red, read" or "there, their."% Row Count 11 (+ 4) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{{\bf{Navigation Bars}}}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{{\bf{These bars refer to links usually at the top of a page, placed inside a bar, which help navigate us through a website. These are important because this is one of the first things a user will look at, especially if they know what they are looking for. If not done correctly, it can cause problems for the user and frustration. It is important all of the links work, and they also stand out, because without these links, the website would be only a homepage and nothing else.}}% Row Count 10 (+ 10) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Approach to take for the assessment:}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Approach to take for the assessment: \newline % Row Count 1 (+ 1) Use the six areas listed below as the main headings in your report. You can modify the way they are written if you wish, as long as the meaning remains clear: \newline % Row Count 5 (+ 4) 1. Advanced tools and techniques \newline % Row Count 6 (+ 1) 2. Standards and conventions \newline % Row Count 7 (+ 1) 3. Asset management and file management \newline % Row Count 8 (+ 1) 4. Data integrity and testing procedures \newline % Row Count 9 (+ 1) 5. Legal, ethical, and moral responsibilities \newline % Row Count 10 (+ 1) 6. Relationship between standards and conventions and legal, ethical, and moral considerations \newline % Row Count 12 (+ 2) For each of areas 1, 2, 4 and 5, take the following approach: \newline % Row Count 14 (+ 2) Identify between six and ten subtopics that you wish to include. Suggested lists of subtopics are on the next page. \newline % Row Count 17 (+ 3) For each subtopic, complete the following: \newline % Row Count 18 (+ 1) • What is it? Explain \newline % Row Count 19 (+ 1) • The advantages and disadvantages of it? How does it affect the quality of websites? Discuss \newline % Row Count 21 (+ 2) • Whether it has been done in the first site and how well? Provide examples from the code or screenshots of the site. You can also talk about pros and cons of what the site has done here if you wish. \newline % Row Count 26 (+ 5) • Whether it has been done in the second site and how well? Provide examples from the code or screenshots of the site. You can also talk about pros and cons of what the site has done here if you wish. \newline % Row Count 31 (+ 5) } \tn \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Approach to take for the assessment: (cont)}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{You may wish to write subheadings under each subtopic in your report before you tackle each of the above bullet points. Your subheadings could be something like "Explanation. Discussion. Worldvis. Virtalis." \newline % Row Count 5 (+ 5) For area 3, take the following approach: \newline % Row Count 6 (+ 1) Explain how asset management and file management are applied in developing websites. \newline % Row Count 8 (+ 2) Discuss why it is important that asset and file management techniques are effective and appropriate. \newline % Row Count 11 (+ 3) Suggested subtopics are on the next page. \newline % Row Count 12 (+ 1) For area 6, take the following approach: \newline % Row Count 13 (+ 1) Discuss the relationship between standards and conventions and legal, ethical, and moral considerations in relation to the requirements of websites. \newline % Row Count 16 (+ 3) In other words, how is the use of standards and conventions linked to the legal, ethical, and moral things we must consider when making websites.% Row Count 19 (+ 3) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Suggested list of subtopics:}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Advanced tools and techniques \newline % Row Count 1 (+ 1) - navigation bars \newline % Row Count 2 (+ 1) - search functions \newline % Row Count 3 (+ 1) - navigation icons \newline % Row Count 4 (+ 1) - digital-friendly style sheets \newline % Row Count 5 (+ 1) - use of external and/or multiple cascading style sheets (CSS) \newline % Row Count 7 (+ 2) - use of semantic layout techniques \newline % Row Count 8 (+ 1) - use of absolute/relative positioning \newline % Row Count 9 (+ 1) - use of responsive design (liquid layouts) so the content adjusts to the size of a user's screen. \newline % Row Count 12 (+ 3) - commenting code \newline % Row Count 13 (+ 1) - conditional commenting \newline % Row Count 14 (+ 1) - image positioning with code \newline % Row Count 15 (+ 1) - use of JavaScript \newline % Row Count 16 (+ 1) Standards and conventions \newline % Row Count 17 (+ 1) - use of metadata to aid searching \newline % Row Count 18 (+ 1) - use of a doc-type tag to indicate language and version used in the creation of the page \newline % Row Count 20 (+ 2) - use of the title tag \newline % Row Count 21 (+ 1) - correct opening and closing of HTML tags \newline % Row Count 22 (+ 1) - Indenting code \newline % Row Count 23 (+ 1) - separation of content from layout \newline % Row Count 24 (+ 1) - use of index, home, or default as file name of start page \newline % Row Count 26 (+ 2) - navigation placed consistently \newline % Row Count 27 (+ 1) - commented code \newline % Row Count 28 (+ 1) - object positioning \newline % Row Count 29 (+ 1) - using a shopping cart graphic and placing the shopping cart link in the upper right section of a page \newline % Row Count 32 (+ 3) } \tn \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Suggested list of subtopics: (cont)}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{- underlining links (and not using underlining unless it is for a usable link) \newline % Row Count 2 (+ 2) - a change in colour once a link has been activated \newline % Row Count 4 (+ 2) - using familiar, easy to read fonts \newline % Row Count 5 (+ 1) - consistency between web pages text colour and styles \newline % Row Count 7 (+ 2) - automating an order confirmation so that the customer is reassured that their order has been received and will be processed \newline % Row Count 10 (+ 3) - regular updating of the site \newline % Row Count 11 (+ 1) Asset management and file management \newline % Row Count 12 (+ 1) - a folder structure is used to keep assets separate \newline % Row Count 14 (+ 2) - sound files are provided in a compressed format \newline % Row Count 16 (+ 2) - video files are provided in a compressed format \newline % Row Count 17 (+ 1) - images are optimised (compressed, but not pixelated) \newline % Row Count 19 (+ 2) - a file naming convention is used \newline % Row Count 20 (+ 1) - image backgrounds are tiled repeats to save file space. \newline % Row Count 22 (+ 2) Data integrity and testing procedures \newline % Row Count 23 (+ 1) - proofreading for accuracy \newline % Row Count 24 (+ 1) - websites look different in different browsers \newline % Row Count 25 (+ 1) - testing for function in multiple browsers, perhaps using an emulator such as screenshots.org \newline % Row Count 27 (+ 2) - checking of dead/dysfunctional links \newline % Row Count 28 (+ 1) - checking the requirements of bandwidth and speed to ensure the website functions \newline % Row Count 30 (+ 2) } \tn \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Suggested list of subtopics: (cont)}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{- checking that e-commerce functions are secure and functional. \newline % Row Count 2 (+ 2) Legal, ethical, and moral responsibilities \newline % Row Count 3 (+ 1) - legal copyright – for example, reminding users that content must belong to them in order for them to be able to share it, and ignoring this can result in charges and fines \newline % Row Count 7 (+ 4) - compliance with the Fair Trading Act – for example, the need for a site to ensure that users agree imagery is not subject to copyright before uploading it \newline % Row Count 11 (+ 4) - moral – for example, ensuring that visual imagery on a site is appropriately inclusive and does not prejudice any particular group \newline % Row Count 14 (+ 3) - issues relating to security and authentication – for example, how users identify themselves on a site where they are required to log in and comparing this with a site that does not require logging in \newline % Row Count 19 (+ 5) - ethical – for example, ensuring that users are of an appropriate age, particularly where online shopping is offered.% Row Count 22 (+ 3) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Definitions}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{} \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Absolute/Relative Positioning}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{The width of a table in which web data is formatted can be set at a specific (absolute) size that will not change no matter what the size of the web visitor's browser window or it can be allowed to change in size (relative) in relation to the web visitor's browser.% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Branding}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Web visitors habitually scan pages looking for objects that confirm they are in the site they seek. An image, slogan or colour combination that immediately identifies a business or product visually will be remembered more easily than the business or product name.% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Breadcrumbs}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{A textual navigation aid, showing the path a visitor has taken to arrive at the web page they are currently viewing. The path is shown from site entry to current position so that a person can more easily find their way back to a level when they realise they have selected a wrong link (route).% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Drop Shadows}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Applying a shadow to a shape or graphic gives the illusion of depth so that the top 'layer' appears to be standing out from the text and other elements shown on the web visitor's screen.% Row Count 4 (+ 4) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Encryption}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Coding that protects a web page from being hacked with the view to reading or changing code, or accessing data that is considered confidential.% Row Count 3 (+ 3) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{External links}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Text or buttons that take a web user to a web page outside the web site that they are currently visiting. They should be formatted in a consistent style and listed separate from a paragraph or report so that the user is aware that they are leaving the host web site.% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Home}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{A web navigation term. Normally a button with text or a graphic that links web pages within a site back to the site's home page. The button normally remains in the same location of each web page. Text is formatted in title case and the graphic used is normally the outline of a house so that it is easily identified by all web users.% Row Count 7 (+ 7) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{HTML}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Hyper Text Markup Language. This is the main language used for creating web pages. It is a code that tells the web browser what to display, where and how. All computers are programmed so that they can read HTML files. This is why web pages can be viewed in any country – all that is needed is a computer and an internet connection.% Row Count 7 (+ 7) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{HTML opening and closing tags}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Positioned each side of a web content instruction, these tell a browser where an element, such as a heading, paragraph, italic text formatting, starts and finishes. The content between the tags should be written in lower case as this is a web standard. Line breaks are the only content element not requiring a closing tag. Images will not display if the file location is not specified between the tags.% Row Count 9 (+ 9) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Internal links}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Text or buttons that take a web user to a web page inside the web site that they are currently visiting. They should be formatted in a consistent style and are often contained in the body of text so that the visitor can seamlessly transfer to another section of the site to obtain specific information or move to an interactive tool such as an email form, interactive questionnaire or checkout.% Row Count 8 (+ 8) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{JavaScript}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{A computer program that runs within the browser to make elements within a web page interactive. For example, if a web visitor clicks a button titled 'Reset form', the program will activate the query 'Are you sure that you wish to reset the form?' and provide Yes/No options. JavaScript allows users to sign into specific web based accounts, such as Facebook, Personal Banking and Online retail sites.% Row Count 9 (+ 9) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Layouts}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Simple web page structures that are commonly used. These structures contain boxes of a variety of sizes into which text, images or text and images can be displayed. Navigation tools will be placed in a top or side bar. A web site's unique point of difference is attained through colour, text styles and content.% Row Count 7 (+ 7) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Download Friendly}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{A web page that downloads quickly and shows all elements is considered 'friendly'. If a web page takes too long to download or elements such as images are missing, the web user may consider the page 'unfriendly' and click to another site causing the potential loss of a customer.% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Doctype}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{A declaration of the document type that must be coded at the start of a web page to ensure that it is displayed correctly. The declaration states the HTML programming code version and whether the page is to be made available to the public or specified web users.% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{CSS}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Cascading style sheets are used to design the user interface - the visual display - of a web page that a web visitor will view. The sheets can be programmed with different text fonts, enhancements, colour, alignment, line and word spacing. The sheets can be layered over one another and, for example, over a graphic background, so that a more interesting and effective visual display is created for the web visitor.% Row Count 9 (+ 9) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Company Logo}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{An image that can be identified with a company, organisation or product. Most logos have been registered by the organisation they are identified with and are therefore subject to copyright laws.% Row Count 4 (+ 4) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Code Validation}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Software that checks that a website works effectively from the point of view of the web visitor. Commercial validation packages will check all codes and report problems such as broken links, slow downloading, spelling errors (in many languages), and password protection. This is necessary to ensure that the web visitor experience matches the intentions of the web designer.% Row Count 8 (+ 8) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Buttons}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Links formatted as boxes that are activated by a mouse click and will take the web visitor to another page within the web site. They can be labelled with text or an appropriate graphic. Consistency of alignment, style, size, colour coding and text formatting across the web site is essential. Oversized and block capital buttons are inappropriate as they detract from the web page content.% Row Count 8 (+ 8) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{www}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{World Wide Web. An unlimited and increasing number of documents (pages) that can be accessed through the Internet. The information contained within each document (page) may not be true or verifiable.% Row Count 5 (+ 5) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Wire framing}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Creating a visual plan of how a web site or page will be set up. This illustration is likely to contain the position of headings, text, images and other elements with limited explanation.% Row Count 4 (+ 4) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Web style or presentation}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{The way information appears on a web visitor's screen will influence how long they stay on the web page. If there is too much text or the layout is confusing, a visitor will often move to another web site. Elements such as colours, font size and amount of scrolling required will also influence the popularity of a web page.% Row Count 7 (+ 7) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Web interaction}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{A way of soliciting a response from web visitors. This could take the form of a 'Like' button, a questionnaire, quiz, a rating system or any other method that holds the visitor's attention and encourages them to spend more time exploring a web page.% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Web content}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{All elements found on a web page. This will include text, images, video, animations and sound.% Row Count 2 (+ 2) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{W3C}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{World Wide Web Consortium. An organisation that aims to maintain the usability of the web by recommending standards so that web pages are accessible to all web visitors. Go to http://www.w3.org/ to learn more.% Row Count 5 (+ 5) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Validating code}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Checks that the web page code is correct so that it will work effectively in a range of web browsers – that it is compatible. This will ensure the web page is viewed as intended by online visitors and that its content can be identified by search engines.% Row Count 6 (+ 6) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{URL}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Uniform Resource Locator. The global address of all documents on the World Wide Web. The print screen below shows the URL for the New Zealand Google home web page.% Row Count 4 (+ 4) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Title tag}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{Describes an online document. Essential for HTML and XHTML documents. You can only have one of these. It will appear in the top browser window. It has nothing to do with the HTML file name you saved it as.% Row Count 5 (+ 5) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Site map}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{A document providing a textual or graphic display of all web pages within a web site. Normally displayed in a hierarchy for ease of navigation, it also assists search engines to identify topics that may assist their users.% Row Count 5 (+ 5) } \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} % That's all folks \end{multicols*} \end{document}