#14 Tīmekļa vietnes izstrāde - vārdnīca Kaspars Zemītis 07.11.2013.

Slides:



Advertisements
Similar presentations
3.04 Understand the use of direct marketing to attract attention and to build a brand.
Advertisements

V1.01 Embracing the Mobile Frontier and Reaching the Digital Natives Jonathan
The Power of and Social Media Marketing to Boost your Business presented by:
Where Do I Start REFERENCE: LEARNING WEB DESIGN (4 TH EDITION) BY ROBBINS 2012 – CHAPTER 1 (PP. 3 – 14)
Development of mobile applications using PhoneGap and HTML 5
Creating Web Page Forms
Responsive Wed Design : An Emerging Technology Archana Jain.
LEARN THE QUICK AND EASY WAY! VISUAL QUICKSTART GUIDE HTML and CSS 8th Edition Chapter 21: Publishing Your Pages on the Web.
Developing Content for Mobile Devices Larry D. Lee Web Developer for K4Health.
Web Design Basic Concepts.
Apps VS Mobile Websites Which is better?. Bizness Apps Survey Bizness Apps surveyed over 500 small business owners with both a mobile app and a mobile.
3 rd Party Data & Audience Targeting © All rights reserved. 3 rd Party Data – Collected both online and offline by 3 rd party data companies such.
AdWords Instructor: Dawn Rauscher. Quality Score in Action 0a2PVhPQhttp:// 0a2PVhPQ.
Principles of Web Design 6 th Edition Chapter 2 – Web Site Design Principles.
Diane Nelson Marketing Metrics 2012 Steel Blue Media Mobile Marketing: Harness the Power of a New Generation.
Getting The Most Out of Your Business Website Insert Your Logo.
What is Web Design?  Web design is the creation of a Web page using hypertext or hypermedia to be viewed on the World Wide Web.
Digital innovation. Introduction Personalised Videos iBeacons Reactive Websites.
Copyright ©: SAMSUNG & Samsung Hope for Youth. All rights reserved Tutorials Software: Building apps Suitable for: Advanced.
Introduction CIS 136 Building Mobile Apps 1. What is a mobile app? 2  Computer program  Designed for small devices  Smartphones  Tablets  Other handhelds.
#12Tīmekļa vietnes izstrāde - vārdnīca Kaspars Zemītis
Chapter 2 Developing a Web Page. A web page is composed of two distinct sections: –The head content –The body Creating Head Content and Setting Page Properties.
London April 2005 London April 2005 Creating Eyeblaster Ads The Rich Media Platform The Rich Media Platform Eyeblaster.
Tutorial 121 Creating a New Web Forms Page You will find that creating Web Forms is similar to creating traditional Windows applications in Visual Basic.
Copyright 2012 Adobe Systems Incorporated. All rights reserved. ® Copyright 2010 Adobe Systems Incorporated. All rights reserved. ® Copyright 2012 Adobe.
Copyright © 2002 Pearson Education, Inc. Slide 8-1.
HOW-TO: Driving Traffic with Twitter Cards & Analytics 9 types of Twitter Cards to install on your site and how to measure ROI for subscription sales.
1 Tradedoubler & Mobile Mobile web & app tracking technical overview.
Chapter 8 Browsing and Searching the Web. Browsing and Searching the Web FAQs: – What’s a Web page? – What’s a URL? – How does a browser work? – How do.
Chapter 2 Developing a Web Page. A web page is composed of two distinct sections: – The head content – The body Creating Head Content and Setting Page.
Good Web Design. The Four A’s of Good Design Accessible Accurate Appropriate Appealing.
Master the MULTI-SCREEN WORLD. AGENDA What is a multi-screen website? The growing importance of multi-screen sites What Google recommends What Google.
Proprietary and Confidential S TRONG V IEW M ARKETING S ERVICES TAKING YOUR MOBILE.
SEM Online Advertising
Lecture 6 Title: Web Planning, Designing, Developing for E-Marketing By: Mr Hashem Alaidaros MKT 445.
Mobile web Sebastian Lopienski IT Technical Forum 29 June 2012.
Web Page Terminology LinksShareware AnchorOrganic Search MarqueeWhite Space BacklinkHTML Bounce RateMarkup FirewallImpression SEOLanding Page Exit PageE-commerce.
Software. A web site is a collection of web pages on a particular topic. A web page is a document written in HTML code. Web pages are linked together.
Digital Media SM1001 Digital Media, Semester A School of Creative Media © Week 07, 2010.
Once posted, other YouTube users can post comments about the video, post their YouTube video responses, or rate the video. Videos that are uploaded to.
Cozi Home Organizer A complete family organizer app By: Joey Feigley.
Chapter 1 Getting Started With Dreamweaver. Exploring the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
Basics of testing mobile apps
Reading Flash. Training target: Read the following reading materials and use the reading skills mentioned in the passages above. You may also choose some.
Terms – Online Advertising Banner ads - embedding an ad into a web page – known as a click through due to interactive actions where the consumer clicks.
Defining Social Media Social Media Marketing Communications Digital Marketing Characteristics Types of Internet Advertising Mobile Marketing Social Behavior.
DIGITAL ADVERTISING Standard 4. THE ROLE OF DIGITAL ADVERTISING IS TO INCREASE SALES OR IMPROVE BRAND AWARENESS.
Google Analytics Workshop
Project 5: Using Pop-Up Windows Essentials for Design JavaScript Level One Michael Brooks.
Oman College of Management and Technology Course – MM Topic 7 Production and Distribution of Multimedia Titles CS/MIS Department.
+ Publishing Your First Post USING WORDPRESS. + A CMS (content management system) is an application that allows you to publish, edit, modify, organize,
10 Effective Website Tips Luana Mattey For Professionals in Private Practice Get Online, Get Found, Get Clients.
SEM Online Advertising
Chapter 1: Internet Marketing Foundations. Chapter Objectives Describe how computers and servers communicate to enable people to interact with webpages.
Chapter 7: Landing Page Optimization. Chapter Objectives Identify the various types of landing pages. Design a landing page that makes effective use of.
Web Design Principles. Designing a Website Choice of a site color scheme. Choice of text font and size. Placeholder text. Use of white space. Location.
Click to start Improve Your Response Rates Dawn Sims MARKETING:
Benefits of Mobile Responsive Website Design
Terms – Online Advertising
Mobi-sites and Apps for Mobile Devices “pros & cons of each”
VooTouch - Woocommerce Mobile App Builder
PIWIK JUNIOR TIDAL ASSOCIATE PROF., WEB SERVICES & MULTIMEDIA LIBRARIAN NEW YORK CITY COLLEGE OF TECHNOLOGY, CUNY.
Providing cutting edge technology and
3.04 Understand the use of direct marketing to attract attention and to build a brand.
Publishing and Maintaining a Website
Master the MULTI-SCREEN WORLD.
Download CIW 1D0-621 Exam Latest Questions Answers - Updated 1D Braindumps - Realexamdumps.com
Get Mobilized Today at 360Apps.me
WEB DESIGN FOR MULTIPLE SCREENS
Presentation transcript:

#14 Tīmekļa vietnes izstrāde - vārdnīca Kaspars Zemītis

Tīmekļa vietnes izstrāde Izstrādi var iedalīt soļos: 1.Ideja. Definēt prasības (kas ir jāizveido); 2.Izlemt, kas un ar kādiem rīkiem veidos tīmekļa vietni; 3.Kāda būs vietnes struktūra, saturs un kā to pasniegs; 4.Izvēlēties domēna vārdu; 5.Iegādāties hostingu (FTP pieeju serverim); 6.Izvēlēties dizainu – attēlus, fontus, grafiskos elementus; 7.Atcerēties par SEO (meklētāju optimizāciju):

Tīmekļa vietnes izstrāde 8.Testēt mājas lapu: a)Izmantot testa vidi; b)Lietotāju apskati – atsauksmes; c)Lapas veiktspējas pārbaudīšana uz dažādām pārlūkprogrammām; rīku izmantošana; d)Kļūdu dokumentēšana/ pārbaudīšana; 9.Tīmekļa vietnes atklāšana; 10.Tīmekļa vietnes uzturēšana; 11.Brenda identitāte;

Vēl neapskatītais -Vārdnīca

Call-to-Action (CTA) A call-to-action is a text link, button, image, or some other type of web link that encourages a website visitor to take an action on that website, such as visiting a landing page to download a piece of content.

A/B testing also known as split testing, is one of the most effective ways to make measurable (and scientific) improvements to your website. This practice creates two (or more) versions of a piece of content, such as a headline or call- to-action (CTA) button, and shows each version to a different, yet similarly sized audience to discover which test has a better response.

A/B testing

Above the Fold: This website design term is a legacy from printed newspaper days. “Above the fold” describes the part of a web page that the visitor can see without scrolling, and is usually considered the most important real estate on your page.

Above the Fold: Redzamā daļa ‘Neredzamā’ daļa

Bounce Rate The bounce rate of a page is the percentage of people who left your website after viewing that page. A page with a high bounce rate is performing poorly. Comparing your high bounce pages to your low bounce pages is a great way to find out what’s working for your visitors and what isn’t.

Bounce Rate in Google Analytics Avots:

Impression An impression (in the context of online advertising) is a measure of the number of times an ad is displayed, whether it is clicked on or not. [1] Each time an ad displays it is counted as one impression.online advertising [1] Avots:

Click-Through Rate (CTR) Click-through rate (CTR) is a way of measuring the success of an online advertising campaign for a particular website as well as the effectiveness of an campaign by the number of users that clicked on a specific link.online advertising The click-through rate is the number of times a click is made on the advertisement divided by the total impressions (the times an advertisement was served): Avots:

Cookie A cookie is a piece of data that a website stores in a visitor’s browser to track that visitor’s browsing history on your website. It's also a crucial component of the technology behind personalization.

Conversion A conversion happens when your site visitor completes the goal of your individual page, such as clicking a CTA button or making a purchase. Conversion Path: The conversion path is the step-by-step series of clicks that a visitor goes through on your website, from their first interaction with you to whatever goal you’re trying to accomplish on your site.conversion path Conversion Rate: The conversion rate of a page is the percentage of people who completed a desired action on a single page, such as filling out a form. Pages with high conversion rates are performing well, and pages with low conversion rates are performing poorly. Latent Conversion Conversion Rate Optimization (CRO)....

Conversion Path Avots:

Dynamic Content also called as "smart content" or "adaptive content" is a term for the aspects of a website, ad, or body that change based on the past behavior of the viewer. It creates an experience that's customized specifically for the visitor or reader at that moment.

Form A form is the place your page visitors will supply information in exchange for your offer. It’s also how those visitors can convert into precious sales leads. As a best practice, only ask for information you need from your leads in order to effectively follow up with and/or qualify them.

Friction Friction is any element of your website that is confusing, distracting, or causes stress for visitors, causing them to leave your page. Examples of friction-causing elements include dissonant colors, too much text, distracting website navigation menus, or landing page forms with too many fields.

Incentive An incentive is an element you add to your page that stimulates the visitor to convert. In optimization circles, online incentives are used to overcome the friction on the page. Examples include a visual that reinforces the value of your offer, or a free trial or cost calculator you offer in exchange for downloading a report or taking a survey.

Landing Page Literally the page where your prospects “land” on your website, a landing page also must exist to collect a visitor’s information through a form. landing page

Avots: com/optimal-local- landing-page- infographic/

Microsite A microsite is a cross between a landing page and a “regular” website. Microsites are used when marketers want to create a different online experience for their audience separate from their main website. These sites often have their own domain names and distinct visual branding. ‘They are not optimal for link-building. It’s true that your microsite could potentially score a lot of inbound links from other domains, which you can then redirect to your main site. But the problem is that you’ve only created one referring domain, which is your microsite. As a result of you making your microsite play middleman, you won’t get the benefits that come from trusted domains linking to your site. They require resources. When considering whether to implement a microsite, keep in mind that you will need adequate resources to create and maintain each one, including any necessary SEO-related efforts. They can help or hurt your branding. If you have multiple microsites, each with its own unique look, feel, and tone, you run the risk of losing your brand identity. On the other hand, if you are promoting a product, service, or initiative to a very specific target group — one that wouldn’t normally visit your main site — a microsite could be a viable option.’ Avots:

Microsite A microsite may contain information about a special event or initiative, promotional offers, specific products, or editorials.

Multivariate Test A multivariate test evaluates a number of different page elements on a web page simultaneously, in contrast to A/B testing, which compares the success of variations of one element. For example, a multivariate test may test three different images, two CTA buttons, and two headlines in an effort to find the page combination that performs best. An A/B test, on the other hand, would test two different images on one page, leaving all other variables constant. Because multivariate tests can be complicated and require significant traffic, they are generally reserved for more advanced marketing testers.advanced marketing testers Kādu testēšanas pakalpojumu izvēlēties: –

For example, a multivariate test may test three different images, two CTA buttons, and two headlines in an effort to find the page combination that performs best... Avots:

Personalization Personalization is a means of targeting your audience, so that each web page or message appears to have been created specifically for a single person. Examples of personalization include adding a name to an subject line, showing products based on the visitor’s past purchase history, or surfacing dynamic images based on location or industry.

Mobile Optimization Mobile optimization means designing and formatting your website so that it’s easy to read and navigate from a mobile device. This can be done by – either creating a separate mobile website (for example, m.mysite.com) – or incorporating responsive design in initial site layout.

So How Do I Get A Mobile Friendly Site? 3 options: – 1. Create a completely separate version of website (Two separate versions of the site. This makes website hard to maintain, because you have to make any changes to your website in 2 places. ) – 2. Create an adaptive layout (Easier to maintain, because all changes only have to be made once. However you'll need a professional to set it up for you.) – 3. Build a mobile landing page (This is the least expensive option. You basically build one mobile page with all the basics. You can can do this yourself.) Avots:

Mobile version vs desktop version Desktop site presents you with the idea of being able to look around, navigate to products you might want. The mobile website starts by finding your location, if possible taking advantage of mobile capabilities like information from the GPS, so we can show you where the closest store is.

Tīmekļa vietne, kas ir pielāgota mobīlajām ierīcēm, var palielināt vietnes lietošanas ērtumu un ne tikai!

Responsive Design PC, portatīvie datori, viedtālruņi, planšetdatori...

Responsive Design Būtu labi, ja katrā no ierīcēm būtu viss ērti atrodams un viegli navigēties...

Responsive Design Responsive web design is an approach to designing websites. Instead of building a separate, distinct website for each specific device it could be viewed on, the site recognizes the device that your visitor is using and automatically generates a page that is responsive to the device the content is being viewed on -- making websites always appear optimized for screens of any dimension.

Logo Menu Articles About/Contacts width and height (of the browser window) device width and height orientation – for example is a phone in landscape or portrait mode? resolution 1. Tiek izmantota viena HTML datne (tātad ir viena vietne) 2. Tiek noteiktas konkrētās ierīces ‘spējas’:

3. Un pateikts kāds būs izskats, izkārtojums konkrētajai ierīcei, piešķirot konkrētus CSS stilus elementam ‘Ierīce bez ierobežojumiem’ izmanto citus CSS sitla likumus Piemēram, platums nav ierobežots uz 400px, bet drīkst ‘izplesties’

Responsive and Adaptive (Similar in their goal) – Responsive and adaptive web design are essentially about creating web designs that are optimized for the size of the screen or the type of device that is used. – The basic concept is that you create a website that works on multiple screen sizes, most commonly to work well on at least three different screen sizes — a small mobile screen, a tablet-sized screen, and a larger desktop computer monitor.

Responsive vs Adaptive ( Different approaches) Responsive Pages are responsive by changing layouts when the viewport (or screen/window size) changes and the current layout cannot deliver and present contents effectively. Design change in real time! ‘You create one web page and then use multiple sets of CSS rules to change the format and layout based on the size of the browser window.’ Adaptive Pages are adaptive by changing layouts and selecting contents according to the device capabilities; screen or window size is just one of the many device capabilities to consider. Flash animations, for example, may be delivered on desktops but filtered or hidden on mobile devices. Adaptive design requires that you create many different versions of each web page, and install complicated programming on your web server that detects each device and delivers a version of the site optimized for the specific size and features of that cell phone visitor. With adaptive design you can send completely different versions of your site to each device. Adaptive design is more complex  more expensive. Flexible Predefined

Mobile apps A mobile application (or mobile app) is a software application designed to run on smartphones, tablet computers and other mobile devices.software applicationsmartphonestablet computersmobile devices

Mobile apps They are usually available through application distribution platforms, which are typically operated by the owner of the mobile operating system, such as the Apple App Store, Google Play, Windows Phone Store, and BlackBerry App Worldmobile operating systemApp StoreGoogle PlayWindows Phone StoreBlackBerry App World The term "app" has become popular, and in 2010 was listed as "Word of the Year"Word of the Year

OS

Application distribution platforms (kur var lejuplādēt aplikācijas)

App vs mobile site Avots:

Typical activities

Are there any other options? Web apps Run in the phone’s browser. This means the app works across all devices, and ensures cross-platform compatibility. The same base code can be used to support all devices, including iPhone and Android. However, web apps do not make use of the phone’s other features, such as the camera or geolocation. Web apps cannot be deployed to the phone’s marketplace.

Are there any other options? Hybrid mobile apps are a mix between these two types (native app and web app) of mobile applications. Using a development framework, companies can develop cross-platform applications that use web technologies (such as HTML, JavaScript and CSS), while still accessing the phone’s features. A hybrid app is a native app with embedded HTML. Selected portions of the app are written using web technologies.

Are there any other options? The web portions can be downloaded from the web, or packaged within the app. This option allows companies to reap all the benefits of native apps while ensuring longevity associated with well-established web technologies. The Facebook app is an example of a hybrid app; it is downloaded from the app store and has all the features of a native app, but requires updates from the web to function.

o 1.m.vietne – lētāk izveidot, bet maza atdeve lietotājam. ‘Gandrīz tā pati vietne’ 3. Hibrīd aplikācija, salīdzinoši dārgi izveidot. Katrai OS jāveido sava, bet var izmantot web tehnoloģiju priekšrocības. 2. Web aplikācija. Strādā no pārlūkprogrammas, bet nav piekļuves visām ierīces tehnoloģijām- kamerai, geolocation. Nevar ievietot – app izplatīšanas platformās - App store, Android market. 4. Aplikācija, dārgi izveidot, bet var izmantot visas ierīces iespējas – kamera, geolocation, kontaktu grāmata, kalendāru... Var strādāt offline režīmā. Iespējams izvietot - App store, Android market... Katrai OS jāveido sava.

Jāizvērtē prasības #1

Jāizvērtē prasības #2

Google ieteikumi par mobīlajām lapām: wer/72462?hl=en&ref_topic= wer/72462?hl=en&ref_topic=

Testēšana/ pielāgošana Avots:

MD 10 1.Aprakstīt vismaz 5 aspektus, kas jāņem vērā veicot SEO optimizāciju. – Aspekta nosaukums; – Aspekta pielietošana; – Aspekta pielietošana Wordpress vietnē; 2.Jāizvērtē vai tīmekļa vietnei ir nepieciešama – – m.versija, – aplikācija (kāda veida aplikācija – native, web aplikācija, hibrīdaplikācija). Jāapskata vismaz 4 kritēriji. 3.Notestēt savu tīmekļa vietni (tiks precizēts lekcijās )