DOCSLIB.ORG

CSS and Text Styles Specifying Colors in CSS

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text
CSS and Text Styles Specifying Colors in CSS ITIY3 Introduction to Web Publishing CSS and text styles Specifying Colors in CSS Colors can be expressed in any of the following forms with CSS: . color name – e.g. white, red, green, blue, black … see below . hexadecimal RGB values - #FFFFFF or #FFF (shortened) . RGB values – rgb(255,255,255) . RGB values as percentages – rgb(100%,100%,100%) . HSL values, CSS3 support – hsl(0,0%,100% RGB – Red Green Blue channel values, HSL – Hue Saturation Lightness values -> equivalent precision! The 16+1 basic color names (CSS2.1) are: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, oil, purple, red, silver, teal, white, and yellow + orange. orange = #FFA500 – CSS2.1 140 named colors altogether in CSS3 CSS3 color module: http://www.w3.org/TR/2011/REC-css3-color-20110607/ http://learningwebdesign.com/colornames.html http://learningwebdesign.com/webpalette.html http://htmlhelp.com/reference/css/units.html#color Colors in computers are expressed with the RGB color system. RGB represents the red, green, blue color channel components with values ranging from 0 to 255. RGB 0, 0, 0 = black RGB 255,255,255 = white The hexadecimal RGB values are calculated form RGB values and are equivalent: #RRGGBB -> a pair for each channel #000000 = black #FFFFFF = white University of Tampere, COMS 1 ITIY3 Introduction to Web Publishing Hexadecimal (hexa, 16 based) values may be shortened if all values are "pairs" for all 3 channels: #CCCCCC = #CCC, #22DDFF = #2DF, #000000 = #000 #134dff = #134dff (cannot be shortened!) You can use Adobe Photoshop or other image editors e.g. Pixlr online image editor (www.pixlr.com) to pick and define a color and see the hexadecimal or RGB values for the color. http://color.adobe.com http://www.colourlovers.com/palettes/add http://www.colorpicker.com/ You can also quickly test and copy color codes in the Chrome’s Developer tool. Select an element with a defined color. Check the color in the style tab. There is a small square to preview the color, click it to access the color picker. Newer versions of Chrome enable you to add text color in the browser to test it, as the styles of the selected element appear in the styles tab, move the mouse pointer to the right bottom corner and click the small “A” for the color picker. The color property controls the text color of text elements. Text color is an inherited property. Colors can be added to other properties like element background, element border in various elements. Hexadecimal values express the same colors as the RGB values or HSL values. Hexadecimal values are somewhat shorter to write. In the developer tool, just click the two-headed arrow to switch between color definition types easily. University of Tampere, COMS 2 ITIY3 Introduction to Web Publishing You can also use the color picker tool (next to the selected color disk) to pick a color from the viewport of the web browser. After defining the color, you can copy and paste the color values from the Developer tool. Either copy from the styles tab or click the color disk to copy the selected color value (right of the color picker). Hexadecimal values always start with a # mark -> #123456! RGB -> rgb(0,0,0) values range 0-255 or a less typical 0-100% HSL -> 360 degree for hue selection, 0-100% for saturation, 0-100% for lightness University of Tampere, COMS 3 ITIY3 Introduction to Web Publishing CSS3 color and alpha transparency CSS3 introduced the HSL color definitions and it can be used in modern browsers without problems, though support in older web browser was lacking. p { color: hsl(240,100%,50%) } = blue with 100% saturation and 50% lightness – hue 360 (degrees, red to red), saturation, lightness values are percentages 0-100%. Transparent (translucent) colors - RGBa and HSLa A colors are opaque with the previous color values, but can be also translucent and completely transparent by adding an extra alpha channel to RGB and HSL colors -> RGBA & HSLA a = alpha transparency – 0 is full transparent – 1 full opaque -> 0.1 = 10%, 0.75 = 75% transparent etc. h1 { color: rgba(0, 0, 0, .1) } h2 { color: rgba(0, 0, 0, .5) } h3 { color: rgba(0, 0, 0, 1) } h1 { color: hsla(0, 0%, 0%, .1) } h2 { color: hsla(0, 0%, 0%, .5) } h3 { color: hsla(0, 0%, 0%, 1) } You can also define the transparency values in the developer tool as above (second slider). The checked background means transparency. University of Tampere, COMS 4 ITIY3 Introduction to Web Publishing Length units and values Some CSS properties require values with specific units assigned. There is a need for length units when font-sizes are determined, you need space between or around elements, or you need to define the dimensions of element… Length unit values can be: . positive or negative – (e.g. margins can be negative) . numerical value, also fractions e.g. 0.5 (zero point five) or .5 (point five), 1.23118… . must define a unit of measurement, except for 0 (optional) and in a few other cases (ratios) p { width: 200px; } – no space between value and unit (200px)! width: 200 px or plain 200 won’t work! but p { width: 0; } is fine, 0 is 0 in any unit There are relative and absolute units. Absolute units are “fixed” units that are physically measurable and have a constant nature in a specific environment (e.g. screen, paper). Relative units are calculated by the web browser usually based on fixed units or on a ratio. pixel (px) = smallest unit in the viewport to display a color "square" (pixel). In CSS3 the pixel is redefined as an absolute unit, as 1/96 of an inch (matching a certain angle of view that users watch screens). em (em) = the font size of the text in the element – works like a scaling factor, its size is relative to the text size of the element or to the text size that is inherited by the element. (NOT to be confused with the “em” element in HTML!) The em unit size is not constant and depend on the context, based on which the browser calculates the unit size automatically. The em unit is not just for defining text sizes. It can be used for other purposes as well, e.g. for setting margins, widths and the like, though as a unit it will be relative to the element’s own text size. Absolute units can be used too, such are millimeter (mm), centimeter (cm), inch (in = 2,54cm), point (pt 1/72in), pica (pc 12pt). These work best when the physical characteristics of the output device are well known, for example print paper. Avoid these for screen rendering! Percentage (%) is also a relative unit, calculated based on element properties like text size or e.g. dimensions of the element or of its parent. root em (rem) = the font size of the root element, the html element, therefore defining a constant value for the particular document that can be controlled by changing the text size of that element. In contrast, em values are always relative to inherited text size or the element’s own text size. Note that rem units are not supported in older Internet Explorer web browsers (support only in IE11 and Edge). There are many other units as well; the above are the essential to start with. https://www.w3.org/Style/Examples/007/units.en.html University of Tampere, COMS 5 ITIY3 Introduction to Web Publishing Text and font properties – all inherit color -> text color of the element (color values as above) font-size -> can be defined in absolute or in relative length and percentage values As in the above example, relative values correspond to absolute values, the web browser calculates the values automatically. 200% is 2x the size, same as 2em. For a particular element, these will mean a certain absolute size, here 16px is a starting size. Default font size in most web browsers for normal texts is 16px The default size (16px) is used, if the text size is not defined for the document. An exception is present for monospace default font sizes, e.g. in pre or code elements, these typically have a different font size (smaller). The default text size for the browser can be change in the browser settings by the user. This freedom should be left intact for accessibility considerations. Font sizes, defined in style sheets with relative units, will be based on the default browser size (or otherwise inherited font sizes). Hence, text size is not locked and users have control. Absolute pixel values would lock the font size to the specified value and user defined sizes are ignored. Example: body { font-size: 100%; } – e.g. 100% = 1em - if browser default is 16px – calculated value is 16px h1 { font-size: 1.5em; } – 16px x 1.5 = 24px - relative size, 1.5 times bigger, scaled the inherited size from the parent (body) to 1.5 times bigger. Remember 24px is only true if the inherited text size is 16px. If the inherited size is e.g. 12px (body font-size: .75em or 12px), 1.5em size for the h1 element would give us only 18px (12px x 1.5). Here is the size of H1 elements if the default size is not changed: University of Tampere, COMS 6 ITIY3 Introduction to Web Publishing The image above shows Google Chrome’s Developer tool. The default browser styles for H1 element are marked as ”user agent stylesheet” (mid gray area). H1 -> default 2em size = twice the inherited size = 2x16px if the inherited size is 16px. If you switch the “Styles tab” to the “Computed tab”, you can see the actual calculated pixel values, the h1 element gets 32px = 2em (2 x 16).
Load more

Recommended publications
  • Typographic Specimen Poster
    Typographic Specimen Poster Type specimen posters were historically released by foundries and printers as a means of introducing new typefaces to designers. The design aesthetic of the posters was mostly utilitarian (simple and functional) with the goal of displaying a typeface in different sizes for the designer to visualize how the typeface could be used. As technology progressed from the linotype to the digital press, the emphasis on posters as the primary means of showing off a new typeface diminished, however the type specimen poster grew into their own form of expressive design. While modern type specimen posters are not as common, they are often far more expressive than their historical counterparts. Akzidenz Grotesk, design by Gunter Gerhard Lange in 1898 Homework: Put a Typeface to a Name This is a project that focuses on research and utilizing your knowledge of typography and layout skills learned over the past semester. Using InDesign, the objective of your type poster is to highlight the different qualities or characteristics of your chosen typeface, introduce the typographer, as well as generate a design that compliments the aesthetics of the prominent design movement of the time. Part 1) Research and Sketchbook Exercise: Research online and find at least 5 examples of type specimen sheets that inspire you, even if their design is different from the approach you will be taking. From your assigned century, choose a typographer and typeface they designed. Research the prominent design movement associated with your typographerʼs region and time period (Example: Typographer: Eric Gill, Typeface: Gill Sans, Time Period: 1920s England, Prominent Design Movement: Art Deco).
    [Show full text]
  • Cloud Fonts in Microsoft Office
    APRIL 2019 Guide to Cloud Fonts in Microsoft® Office 365® Cloud fonts are available to Office 365 subscribers on all platforms and devices. Documents that use cloud fonts will render correctly in Office 2019. Embed cloud fonts for use with older versions of Office. Reference article from Microsoft: Cloud fonts in Office DESIGN TO PRESENT Terberg Design, LLC Index MICROSOFT OFFICE CLOUD FONTS A B C D E Legend: Good choice for theme body fonts F G H I J Okay choice for theme body fonts Includes serif typefaces, K L M N O non-lining figures, and those missing italic and/or bold styles P R S T U Present with most older versions of Office, embedding not required V W Symbol fonts Language-specific fonts MICROSOFT OFFICE CLOUD FONTS Abadi NEW ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Abadi Extra Light ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Note: No italic or bold styles provided. Agency FB MICROSOFT OFFICE CLOUD FONTS ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Agency FB Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Note: No italic style provided Algerian MICROSOFT OFFICE CLOUD FONTS ABCDEFGHIJKLMNOPQRSTUVWXYZ 01234567890 Note: Uppercase only. No other styles provided. Arial MICROSOFT OFFICE CLOUD FONTS ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Arial Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Arial Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Arial Bold Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ
    [Show full text]
  • Avid Marquee Title Tool User's Guide
    Avid® Marquee® Title Tool User’s Guide ™ make manage move | media Avid ® Copyright and Disclaimer Product specifications are subject to change without notice and do not represent a commitment on the part of Avid Technology, Inc. The software described in this document is furnished under a license agreement. You can obtain a copy of that license by visiting Avid's Web site at www.avid.com. The terms of that license are also available in the product in the same directory as the software. The software may not be reverse assembled and may be used or copied only in accordance with the terms of the license agreement. It is against the law to copy the software on any medium except as specifically allowed in the license agreement. Avid products or portions thereof are protected by one or more of the following United States Patents: 4,746,994; 4,970,663; 5,045,940; 5,267,351; 5,309,528; 5,355,450; 5,396,594; 5,440,348; 5,452,378; 5,467,288; 5,513,375; 5,528,310; 5,557,423; 5,577,190; 5,583,496; 5,584,006; 5,627,765; 5,634,020; 5,640,601; 5,644,364; 5,654,737; 5,719,570; 5,724,605; 5,726,717; 5,729,673; 5,745,637; 5,752,029; 5,754,180; 5,754,851; 5,799,150; 5,812,216; 5,828,678; 5,842,014; 5,852,435; 5,995,115; 6,016,152; 6,061,758; 6,130,676; 6,532,043; 6,546,190; 6,636,869; 6,747,705; 6,813,622; D352,278; D392,267; D392,268; D392,269; D395,291; D396,853; D398,912.
    [Show full text]
  • WWII Book Project Project Based Learning
    World History Semester 11 Causes of WWII Book Project Project Based Learning Overview: The students will create a children’s book or a comic book / graphic novel over one, many, or all of the causes of WWII. The students will use the internet to look up pictures to include in their book as well as conduct research over the causes of WWII. At the culmination of the project, each student will read his or her book to the class. The last page of the book needs to be 1 page explanation of the student’s opinion of what the main cause of WWII was and why they feel that way. 21 Century outcomes: Core Subject: History Learning and Innovation Skills Think Creatively Use Systems of Thinking Communicate Clearly Information, Media and Technology Skills Access and Evaluate Information Use and Manage Information Apply Technology Effectively Life and Career Skills Manage Goals and Time Work Independently Manage Projects Produce Results Social Studies, FHSD curriculum World History Content SS2. Knowledge of principles and processes of governance systems Content SS3b. Knowledge of continuity and change in the history of the world Causes of WWII Project: Causes of WWII Children’s book / comic book / graphic novel Requirements: 1. Front Cover/Introduction 2. at least 5 pages of content (not including the front / back cover, the timeline, or the 1 page answer) 3. Each page of the story must include words AND pictures 4. Timeline of the most important events leading up to WWII 5. The student’s opinion as to what the main cause of WWII was and why.
    [Show full text]
  • Richard L. Baskerville
    Richard L. Baskerville Department of Computer Information Systems Robinson College of Business, Georgia State University PO Box 4015, Atlanta, Georgia 30032-4015, USA Tel +1 404 413 7362 Fax +1 404 413 7394 Internet: [email protected] Degrees Doctor in Natural Sciences (2014) -- honoris causa. Roskilde University Doctor of Philosophy (2014) -- honoris causa. University of Pretoria. Faculty of Engineering, Built Environment, and Information Technology. Doctor of Philosophy (1986) -- Systems Analysis. The London School of Economics and Political Science (University of London), supervised by Frank Land, Department of Information Systems. Master of Science (1980) -- Analysis, Design and Management of Information Systems (Accounting Option). The London School of Economics. Bachelor of Science summa cum laude (1979) -- Business and Management. University of Maryland, European Division, Heidelberg. Primary areas: Personnel Management and Business Law. Academic Appointments 1997 - present time. Georgia State University, J. Mack Robinson College of Business Administration, Department of Computer Information Systems, Regents’ Professor (2016 - present), Board of Advisors Professor of Information Systems (2007 - present), Professor of Information Systems (2001 - 2007), Chair of the Department (1999 - 2006), Associate Professor of Information Systems (1997 - 2001). 2014 - present time. School of Information Systems, Curtin Business School, Curtin University, Perth, Western Australia, Professor (partial appointment). 1988 - 1997. State University of New York at Binghamton, School of Management, Associate Professor of Information Systems with tenure (1994 - 1997, Assistant Professor, 1988-1994). 1984 - 1988. University of Tennessee at Chattanooga, School of Engineering, Associate Professor of Computer Science, (1987-1988), Assistant Professor (1984 to 1987). 1981 - 1984. Francis Marion University (then F. M. College), Department of Business, Assistant Professor of Computer Science.
    [Show full text]
  • Using Uportal
    Chapter 2 Using uPortal Introduction to uPortal Publishing New Channels XHTML Design of uPortal The Layout Making a New Skin Cascading Style Sheets uPortal Graphics Layout Fragments Appendix A: The Default uPortal Cascading Style Sheet GUI Format Text Format Note on the images in this document: Usually, the picutres that help someone understand how a program works will match exactly what that person will see on the screen of their computer. As they go from one screen to the next, the pictures in the book will move along with them so that they know that they are in the rigth place. A portal is very customizable in the way it looks and what options are made available for people using it. By this, each school or business can change the look and feel of their portal so that it matches their symbols and colors, as well as deciding to remove certain options and buttons. The pictures that are used in this manual were captured as uPortal was being created. It is almost certain that the look of the portal that you will be using will not match that of the one used during development. It may look different, but it will still work in the way described here. Introduction to uPortal uPortal is a framework for presenting aggregated content that is customizable by both the user and the administrators. It is built using a database to contain the information about each user, with XSL transformations and JAVA to take this abstract data and convert it into the final, structured layout.
    [Show full text]
  • HTML5 Favorite Twitter Searches App Browser-Based Mobile Apps with HTML5, CSS3, Javascript and Web Storage
    Androidfp_19.fm Page 1 Friday, May 18, 2012 10:32 AM 19 HTML5 Favorite Twitter Searches App Browser-Based Mobile Apps with HTML5, CSS3, JavaScript and Web Storage Objectives In this chapter you’ll: ■ Implement a web-based version of the Favorite Twitter Searches app from Chapter 5. ■ Use HTML5 and CSS3 to implement the interface of a web app. ■ Use JavaScript to implement the logic of a web app. ■ Use HTML5’s Web Storage APIs to store key-value pairs of data that persist between executions of a web app. ■ Use a CSS reset to remove all browser specific HTML- element formatting before styling an HTML document’s elements. ■ Save a shortcut for a web app to your device’s home screen so you can easily launch a web app. = DRAFT: © Copyright 1992–2012 by Deitel & Associates, Inc. All Rights Reserved. Androidfp_19.fm Page 2 Friday, May 18, 2012 10:32 AM 2 Chapter 19 HTML5 Favorite Twitter Searches App 19.1 Introduction 19.5 Building the App 19.2 Test-Driving the Favorite Twitter 19.5.1 HTML5 Document Searches App 19.5.2 CSS 19.5.3 JavaScript 19.3 Technologies Overview Outline 19.6 Wrap-Up 19.1 Introduction The Favorite Twitter Searches app from Chapter 5 allowed users to save their favorite Twit- ter search strings with easy-to-remember, user-chosen, short tag names. Users could then conveniently follow tweets on their favorite topics. In this chapter, we reimplement the Fa- vorite Twitter Searches app as a web app, using HTML5, CSS3 and JavaScript.
    [Show full text]
  • Choosing Fonts – Quick Tips
    Choosing Fonts – Quick Tips 1. Choose complementary fonts – choose a font that matches the mood of your design. For business cards, it is probably best to choose a classic font. *Note: These fonts are not available in Canva, but are in the Microsoft Office Suite. For some good Canva options, go to this link – https://www.canva.com/learn/canva-for-work-brand-fonts/ Examples: Serif Fonts: Sans Serif Fonts: Times New Roman Helvetica Cambria Arial Georgia Verdana Courier New Calibri Century Schoolbook 2. Establish a visual hierarchy – Use fonts to separate different types of information and guide the reader - Use different fonts, sizes, weights (boldness), and even color - Example: Heading (Helvetica, SZ 22, Bold) Sub-heading (Helvetica, SZ 16, Italics) Body Text (Garamond, SZ 12, Regular) Captions (Garamond, SZ 10, Regular 3. Mix Serifs and Sans Serifs – This is one of the best ways to add visual interest to type. See in the above example how I combined Helvetica, a sans serif font, with Garamond, a serif font. 4. Create Contrast, Not Conflict: Fonts that are too dissimilar may not pair well together. Contrast is good, but fonts need a connecting element. Conflict Contrast 5. Use Fonts from the Same Family: These fonts were created to work together. For example, the fonts in the Arial or Courier families. 6. Limit Your Number of Fonts: No more than 2 or 3 is a good rule – for business cards, choose 2. 7. Trust Your Eye: These are not concrete rules – you will know if a design element works or not! .
    [Show full text]
  • Handel Gothic Free Font Download Handel Gothic Light Font
    handel gothic free font download Handel Gothic Light Font. Use the text generator tool below to preview Handel Gothic Light font, and create appealing text graphics with different colors and hundreds of text effects. Font Tags. Search. :: You Might Like. About. Font Meme is a fonts & typography resource. The "Fonts in Use" section features posts about fonts used in logos, films, TV shows, video games, books and more; The "Text Generator" section features simple tools that let you create graphics with fonts of different styles as well as various text effects; The "Font Collection" section is the place where you can browse, filter, custom preview and download free fonts. Frequently Asked Questions. Can I use fonts from the Google Fonts catalog on any page? Yes. The open source fonts in the Google Fonts catalog are published under licenses that allow you to use them on any website, whether it’s commercial or personal. Search queries may surface results from external foundries, who may or may not use open source licenses. Should I host fonts on my own website’s server? We recommend copying the code snippets available under the "Embed" tab in the selection drawer directly into your website’s HTML and CSS. Read more about the performance benefits this will have in the “Will web fonts slow down my page?” section below. Can I download the fonts on Google Fonts to my own computer? Yes. To download fonts, simply create a selection of fonts, open the drawer at the bottom of the screen, then click the "Download" icon in the upper-right corner of the selection drawer.
    [Show full text]
  • Chapter 10 Document Object Model and Dynamic HTML
    Chapter 10 Document Object Model and Dynamic HTML The term Dynamic HTML, often abbreviated as DHTML, refers to the technique of making Web pages dynamic by client-side scripting to manipulate the document content and presen- tation. Web pages can be made more lively, dynamic, or interactive by DHTML techniques. With DHTML you can prescribe actions triggered by browser events to make the page more lively and responsive. Such actions may alter the content and appearance of any parts of the page. The changes are fast and e±cient because they are made by the browser without having to network with any servers. Typically the client-side scripting is written in Javascript which is being standardized. Chapter 9 already introduced Javascript and basic techniques for making Web pages dynamic. Contrary to what the name may suggest, DHTML is not a markup language or a software tool. It is a technique to make dynamic Web pages via client-side programming. In the past, DHTML relies on browser/vendor speci¯c features to work. Making such pages work for all browsers requires much e®ort, testing, and unnecessarily long programs. Standardization e®orts at W3C and elsewhere are making it possible to write standard- based DHTML that work for all compliant browsers. Standard-based DHTML involves three aspects: 447 448 CHAPTER 10. DOCUMENT OBJECT MODEL AND DYNAMIC HTML Figure 10.1: DOM Compliant Browser Browser Javascript DOM API XHTML Document 1. Javascript|for cross-browser scripting (Chapter 9) 2. Cascading Style Sheets (CSS)|for style and presentation control (Chapter 6) 3. Document Object Model (DOM)|for a uniform programming interface to access and manipulate the Web page as a document When these three aspects are combined, you get the ability to program changes in Web pages in reaction to user or browser generated events, and therefore to make HTML pages more dynamic.
    [Show full text]
  • Alien Heads Found in Georgia
    Georgia Alien heads found in Georgia Georgia is a serif typeface designed in 1993 by Matthew Carter and hinted by Tom Rickner for the Microsoft Corporation. The font is inspired by Scotch Roman designs of the 19th century and was based on designs for a print typeface in the same style Carter was working on when contacted by Microsoft. Georgia were released by Microsoft in 1996 as part of the Core Fonts for the Web collection. The typeface's name referred to a tabloid headline claiming“Alien heads found in Georgia.” As a transitional serif design, Georgia shows a number of traditional features of rational serif typefaces from around the early 19th century, such as alternating thick and thin strokes, ball terminals, a vertical axis and an italic taking inspiration from calligraphy. It features a large x-height (tall lower-case letters) and its thin strokes are thicker than would be common on a typeface designed for display use or the higher resolution of print. Besides, Georgia's bold is also unusually bold and bolder than most bolds. Georgia Alien heads found in Georgia Georgia is a serif typeface designed in 1993 by Matthew Carter and hinted by Tom Rickner for the Microsoft Corporation. The font is inspired by Scotch Roman designs of the 19th century and was based on designs for a print typeface in the same style Carter was working on when contacted by Microsoft. Georgia were released by Microsoft in 1996 as part of the Core Fonts for the Web collection. The typeface's name referred to a tabloid headline claiming“Alien heads found in Georgia.” As a transitional serif design, Georgia shows a number of traditional features of rational serif typefaces from around the early 19th century, such as alternating thick and thin strokes, ball terminals, a vertical axis and an italic taking inspiration from calligraphy.
    [Show full text]
  • “Det Är På Gott Och Ont” En Enkätundersökning Om Googles Insamling Av Användardata
    KANDIDATUPPSATS I BIBLIOTEKS- OCH INFORMATIONSVETENSKAP AKADEMIN FÖR BIBLIOTEK, INFORMATION, PEDAGOGIK OCH IT 2020 “Det är på gott och ont” En enkätundersökning om Googles insamling av användardata OLIVIA BÄCK SOFIA HERNQVIST © Författaren/Författarna Mångfaldigande och spridande av innehållet i denna uppsats – helt eller delvis – är förbjudet utan medgivande. Svensk titel: “Det är på gott och ont”: En enkätundersökning om Googles insamling av användardata Engelsk titel: “It’s for better and for worse”: A survey about Google’s collection of user data Författare: Olivia Bäck & Sofia Hernqvist Färdigställt: 2020 Abstract: This study focuses on Google’s user agreements and how students within the field of library and information science at the University of Borås are perceiving and relating to these agreements. User agreements are designed as contracts which makes the user data available for Google, but also for the user to protect his or her personal integrity. A problem recent studies show is that few internet users read these agreements and don’t know enough about what Google collect and do with their user data. In this study the concept of surveillance capitalism is used to describe how Google has become a dominant actor on a new form of market. This market is partly formed by Google’s business model which turns user data into financial gain for the company. It is discussed in recent studies that this form of exploitation of user data is problematic and is intruding on people’s personal integrity. The theoretical framework was constructed from theories that social norms influence human behaviour which makes people sign the agreements without reading them.
    [Show full text]