Placeholder Image

字幕表 動画を再生する

  • Thank you.

  • Hello.

  • Um, I'm really excited to be here in Budapest, Um, and to talk about, uh, the World Wide Web and all of those things.

  • Um, I have heard a ton of languages spoken, um, yesterday, which is really exciting for me.

  • Um, in quick intro.

  • My name is Cat Cafe.

  • I'm actually no longer at buzzfeed.

  • Um, I work at a startup called Ribbon in New York City.

  • Um, where I'm a product engineer.

  • I used to be a product manager.

  • Um, and although my worked in tech for a couple of years now, my background is actually an anthropology, which is the study of human societies.

  • Biology, evolution, culture on DSO.

  • Like Steve Jobs.

  • I like to think about, uh, uh, systems of people.

  • Um, and now in my job, I think about systems of code and logic on, and I think that understanding people is the key to building good software products.

  • And now that I'm an engineer, I think it's also a really important part of architect and software the right way.

  • And that's kind of the crux of what this talk is about.

  • I'm gonna see if this quicker works.

  • Um, so the talk is about the Web norms of the world.

  • It's based on the premise that the Web is different around the world in different countries.

  • And so I think everybody here, um, is probably familiar with traveling to a new country Looking up on event, they're trying to buy a train ticket, maybe, um, noticing that websites look a little bit different.

  • And I think especially here in Europe, this is a no surprise where I'm from the U.

  • S.

  • It is more shocking when you when you leave and things are so different.

  • And I wanted to jump just into a couple examples to warm us up.

  • Um, this is Rocket 10 which is tthe e top Japanese e commerce site, and this This talk was actually inspired by some friends going to Japan and coming back and talking about how different Japanese Web looked.

  • So what's different about it?

  • It's obviously it's like a familiar website, right, but it's obviously in Japanese.

  • Um, there's a lot of pointer on.

  • There's a lot of navigation options.

  • Um, really readily clickable.

  • Um, there's a heavy use of iconography paired with the navigation items.

  • I noticed, um, and I noticed also that in the product images themselves, there's a lot of baked in text.

  • So the marketing images, um, I'll have texted them and just to compare it to, ah, Western site Amazon on there are fewer navigation elements in general, so all of the product categories are hidden behind a really big hamburger menu.

  • There's no text in the product images themselves.

  • The text is natively rendered in the browser around them.

  • It's generally more spaced out and to move to a European example.

  • This is the French train travel portal.

  • Um, it's really normal here in Europe.

  • You probably know more than me.

  • Um, that is pretty normal to get on a train, to go for a vacation or to travel to a new city.

  • Um, and I've noticed that on a lot of European transit sites, it's very the doctor that's really friendly, rounded, color like candy colored design aesthetic with a really heavy focus on packages and hotels in destinations.

  • And so if we look at Amtrak, which is the largest rail system in the U.

  • S, it's way more serious.

  • Um, it's there's actually no destinations on this page at all.

  • Um, and I think it's probably more commuter focused, and so the differences are subtle, but they are.

  • They're they're right, they're different.

  • Um, and I've started to wonder why they're different.

  • Um, and as I think through them, I keep coming back to my background and studying culture.

  • Um, I always thought that there were clear right or wrong ways to develop websites, like if you're gonna make an e commerce site, it should look this way and figure to build a social network.

  • It needs to be super experiential.

  • Looked that way.

  • But I think that within a more cultural and anthropological lens, that might not be the best approach.

  • Um, I think the question of why our websites different around the world, it's kind of analogous to asking why are people different around the world, Which is really hard to answer.

  • Um, scientists have been trying to do that for hundreds of years, so I'm gonna try and 30 minutes to do it.

  • Um, but I think it comes down to sort of my new core belief, which is that technology is a mode of cultural expression, just like language music, dancing food, Um, and that technology that we use on phones laptops and ipads are just another social tool that humans used to express themselves and that even our technical decisions you know, the frameworks that programming languages.

  • The service is in the design we use in in the Web sites and the technology.

  • We build our driven by a combination of cultural factors.

  • So it's really what this talk is about.

  • It's kind of a mix of culture technology, Um, but just to preempt it a little bit, why is this important to talk about?

  • Why can't people and hungry figure it out for themselves and build websites for Hungarian audiences?

  • And people in the U.

  • S.

  • Will do it for us audiences?

  • Um, there's a couple of big reasons.

  • One is that, um we're really all in it together.

  • Uh, computer and Internet technology, I think, has globalized, truly and utterly faster than any other human technology.

  • We all rely on the same fundamental foundation for building software like operating systems.

  • We used to say mobile phones, mobile operating systems.

  • We're all here to talk about JavaScript.

  • Probably most of us are familiar with using some really core frameworks like react.

  • Um, we rely on the same developer tools and infrastructure like AWS, And we're seeing these huge, mega global corporations forming like Amazon, Google and Facebook.

  • Um, and the more and more of the world is coming online.

  • So there's this concept known as the digital divide.

  • So in 1990 most people on the Internet were like in the U.

  • S.

  • And may be in the UK Um, and today there are 3.5 1,000,000,000 people on the Internet, which is half of the world's population.

  • We just kind of shocking for how both large and small it is.

  • But it's definitely shrinking.

  • Um, some researchers estimate that, um, the entire world will be on line between 2030 and 2040 on emerging economies like India, Bangladesh, Ghana are adopting the Internet really exponential rates.

  • And so this is bringing new users under the Internet in those countries, which is creating demand for Internet service is and companies which will create demand for developers in those countries, and they'll be using and coming to a lot of the software and technology and tooling that is already existing.

  • And as developers, we benefit from being globally connected.

  • We can share code with each other.

  • I can look up answers to questions that were, you know, answered by somebody across the world.

  • We can more easily learn from each other.

  • We visit each other's countries for conferences like I'm doing right now, um, and innovations that we make in one place like a cool trick I pick up here I can take home and use in my home country.

  • And that's a really cool thing that not every industry benefits from.

  • I mean, finally, a lot of us work for Internet companies, and our users are online.

  • And as Internet based companies, um, we are uniquely able to reach new audiences in global markets again, this is especially true in Europe.

  • It's pretty common to attract users from neighboring countries, and so translation and localization is becoming a really core part of growth strategies for in an Internet companies.

  • And so learning to localize APS well is pretty critical and building successful software that's able to grow.

  • Um, so with all that in mind, how can we think about culture as technologists, as engineers?

  • As we approach building for the Web in building technology in general, um, we can start by understanding some of the different cultural factors that would contribute to differences in building software.

  • And the 1st 1 is language.

  • It's really the core activity of what we do every day.

  • It's we literally do all day and extends to programming.

  • Um, whether you, as a developed developer, can read the technical documentation for a project you want to try, um, and how you would design a website to, uh, be red in, ah, language by your users.

  • Um, the second are cultural attitudes, which are the really invisible but really strongly held true differences between people, which is how they have integrated technology into their daily lives.

  • But their lifestyles air like what their behaviors and their beliefs are like, um, there's government policy.

  • So some countries don't regulate the Internet.

  • Some of them passed restrictive or, you know, the sensible regulations.

  • Others censor the Internet, and then finally, people across the world access to Internet in different ways.

  • They use different types of devices, they have different levels of of speed and stability.

  • So I'd like to go through each of these and talk about how developers in different parts of the world are dealing with thes sort of different types of contexts and the challenges that they're facing.

  • And so let's start with language.

  • There are a lot of languages in the world on.

  • There are over 7000 known languages.

  • This is one of my favorite maps from school.

  • Um, and most of these languages have their own writing systems, and one of those writing systems is hung ghoul, which is the primary Korean rating system.

  • And when you take all of the unique characters in Hangul and put it into a Unicode block, you get a block that's about 11,000 characters.

  • Large.

  • Um, so this has challenges, right?

  • It's not the Latin alphabet.

  • There are no longer 26 some, um, that you might have to render on the screen.

  • And so, uh, that proposes challenges for natively rendering Chinese, Japanese and Korean on the Web.

  • First of all, it's expensive to design these fonts because each of these characters has certain spacing.

  • Um, and there are thousands of them again, Um, the files that contain these fonts can reach 15 megabytes, and so this becomes really prohibitive, especially on a mobile device or in a place with with slower Internet speeds.

  • So developers have to get really clever and one common work around.

  • This is a Korean e commerce site called G Market.

  • Um, in this case, every single piece of text on this page is an image, um, which is kind of unholy Tow us.

  • Maybe.

  • But there's huge benefits.

  • It loads faster than a 15 megabyte front file.

  • You can.

  • The developer can ensure the quality of the text rendering.

  • Um, and they know it's gonna look the same across browsers, uh, and mobile phones.

  • And there are some.

  • There are some newer ways Thio render these fonts more quickly through sub setting eso.

  • Sub setting is where you take a really large ah font file with a lot of character.

  • Zorg lifts in it and slice it into pieces and just load the pieces you need.

  • And some browsers like chrome.

  • Now we'll do this automatically on.

  • They're also really cool projects.

  • I'm so Google Fonts has this new Korean font library in it that uses machine learning to subset fonts based on how often they're, er, the characters are seen together on dhe.

  • When thes fonts are served through the Google font.

  • C p i.

  • It benefits from cross site cashing, which means the user would only need to load the font file wants in order to benefit from it.

  • I'm across many websites during their session.

  • It's our techniques like this are making it more possible and easier to render languages like Korean, Japanese and Chinese natively on the Web I'm in.

  • Other languages are written in other directions and in other ways, and so Hebrew and Arabic are written from right to left, and they require layouts that are bi directional.

  • So this is the Tel Aviv Museum of Art in English, Um, but Hebrew.

  • It's completely flipped really down to the navigation itself.

  • Um, and as a native reader of Hebrew, it wouldn't make sense if you had just translated this and it was from left to right.

  • It really has to be a mirrored layout in order to feel native and makes sense to a native reader.

  • There were some CSS frameworks to make this easier.

  • This is right to left CSS, which will flip, um, directional CSS properties like border left for margin, right, and when you translate text to begin with, it takes different amounts.

  • His face, um, different characters have different heights and wits.

  • Words maybe longer there might be more or less space is, um, and other rules like that.

  • So the word views and Italian is actually three times longer than it is in English, and this is a subtle difference.

  • But this is like a YouTube card where they had it pushes it to the next line.

  • And so if you sort of compound this across an entire layout, you can see how you would really need to allow for the expansion and contraction of text as you translated between languages.

  • And then my really informal test tie is about 1.7 times the space.

  • I'm just tow just in this sentence.

  • I'm so really localization is more than just translating strings.

  • You can't just walk the strings.

  • If you're gonna create an Arabic version of your website, you need to build a bi directional layout.

  • Um, and if you