Digital marketing advanced
Website
Structure
front-end code
Front end what you can see
Back end what you cant see
HTML, or HyperText Markup Language, is used to create the basic structure and content of a
webpage
CSS, or Cascading Style Sheets, is used for the design of a webpage – where everything is placed and
how it looks
JavaScript is used to define the interactive elements of a webpage that help to engage users
Optimized for different screen sizes (devices). Holy trinity:
- desktop
- tablet
- smartphone
website coding languages
Responsiveness
= This means that your website changes to the device size (phone, desktop & tablet)
1
,Bootstrap
Most used free open source front-end-framework= bootstrap
Advantages
- responsive
- cross browser compatibility
- short development time
- flexible
- free
Disadvantages
- unnecessary code included
- all bootstrap pages look similar
typical structure
internal linking
2
,Design (3pillars of a good design: accessiblity, purpose and
consistency)
Accessibility
3
, Purpose
What is the user looking for and what are you trying to achieve?
- Branding
- Showing expertise
- Creating awareness
- Generating sales
- Lead generation
- ...
Consistency
Consistency across all digital channels and devices in terms of
- visual style (importance of style guide!)
- writing style
- tone of voice
- message
Dark Patterns (EXAMENVRAAG)
Dark patterns are crafted to TRICK USERS into doing things they might want to do, but which benefit
the business in question zoals het kopen van een te dure verzekering bij hun aankoop of het
aanmelden voor terugkerende rekeningen
Bv
Amazon account verwijderen, (you cant delete your own account they have to do it fore you)
Roach motel= a design that makes it easy to get into a situation but hard to get out
Core Web vitals
Core web vitals measure qualitative users’ experiences on a web page. Having a good core vitals
score will optimize your ranking, and user experience
4
Website
Structure
front-end code
Front end what you can see
Back end what you cant see
HTML, or HyperText Markup Language, is used to create the basic structure and content of a
webpage
CSS, or Cascading Style Sheets, is used for the design of a webpage – where everything is placed and
how it looks
JavaScript is used to define the interactive elements of a webpage that help to engage users
Optimized for different screen sizes (devices). Holy trinity:
- desktop
- tablet
- smartphone
website coding languages
Responsiveness
= This means that your website changes to the device size (phone, desktop & tablet)
1
,Bootstrap
Most used free open source front-end-framework= bootstrap
Advantages
- responsive
- cross browser compatibility
- short development time
- flexible
- free
Disadvantages
- unnecessary code included
- all bootstrap pages look similar
typical structure
internal linking
2
,Design (3pillars of a good design: accessiblity, purpose and
consistency)
Accessibility
3
, Purpose
What is the user looking for and what are you trying to achieve?
- Branding
- Showing expertise
- Creating awareness
- Generating sales
- Lead generation
- ...
Consistency
Consistency across all digital channels and devices in terms of
- visual style (importance of style guide!)
- writing style
- tone of voice
- message
Dark Patterns (EXAMENVRAAG)
Dark patterns are crafted to TRICK USERS into doing things they might want to do, but which benefit
the business in question zoals het kopen van een te dure verzekering bij hun aankoop of het
aanmelden voor terugkerende rekeningen
Bv
Amazon account verwijderen, (you cant delete your own account they have to do it fore you)
Roach motel= a design that makes it easy to get into a situation but hard to get out
Core Web vitals
Core web vitals measure qualitative users’ experiences on a web page. Having a good core vitals
score will optimize your ranking, and user experience
4