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 are translating into new languages, you should account for the expansion and contraction of text.

  • I definitely experienced this, um, in the past, where you swap the strings out and things start to go Really weird.

  • I mean, users want thio, you know, use a nice experience, and they can tell if it was quickly done.

  • So we're building websites in many different languages, right?

  • And there's over 7000 of them.

  • Um, but I think one of the really interesting things is that we're all programming in English.

  • And so these are the reserved words in Java script on.

  • They're all in English.

  • And this is true for every major language that we use, even languages like Ruby, which was invented actually in Japan.

  • Um, and it's kind of weird when we look at the spoken languages in the world.

  • Um, it's a really big disk act, so you know English is no more commonly spoken in Hindi and certainly less commonly spoken of in Chinese on what's happened here is that English has become a lingua franca, which means a common or trade language between groups of people.

  • For computing, it's actually become a lot more than that.

  • English has become a common language for diplomacy and for business and trade.

  • Um, and it's not a totally equitable history, either, Um, but adopting these common languages does have a lot of benefits.

  • It means that we can all be sitting in this room coming from different countries with our own, you know, first native languages and understand each other.

  • And I'm giving this talk in English, which is crazy because we're in the middle of Europe.

  • Um, and I don't have to translate, you know, a piece of your code into my language in order to run it.

  • First of all orders, understand what it's doing.

  • I mean, because we're programming sort of all in the same terminology and language.

  • It makes it easier for us to grow software together and build on top of each other's work rather than developing technology.

  • Sort of in parallel, separate language groups.

  • Um, but I also think it's important to recognize that code isn't really English.

  • I don't know it.

  • Ah, half means, um and I I don't think you actually need to be conversational English toe.

  • Learn how to code.

  • Um, I would probably describe code is like a new dialect, some weird morphed subset of English.

  • I'm in some programming tools.

  • This is scratch, which was developed by an I t.

  • A school in the U.

  • S.

  • It's used in libraries and classrooms around the world.

  • I'm skips this English based paradigm altogether, and they have this this block abstraction which makes it really easy to translate between different languages.

  • Um, research has shown that kids learn how to code faster in their native language, which makes a lot of sense.

  • Um, and just because reserved words in the programming languages we all use are in English doesn't mean they have to be on.

  • This is a, uh this is your language is a note like language in Yoruba, which is a language spoken in Nigeria.

  • Um, I think projects like this while they haven't, you know, hit a critical mass yet could be really useful for getting programmers who don't speak English in the door and past that first really big learning curve.

  • And then also I think that developers in general, especially developers who don't speak English really want to read documentation and debug issues in their native language.

  • It is again really important for developers who don't speak English.

  • Translations and channel and channels were talking in your native language about programming and code really benefit everybody.

  • It helps make these non English speaking developers lives easier, and for an open source project or a developer tool that can draw more developers into the project on I think, given the growth of you know, the Internet base in the years to come, it will become even more important.

  • And people find translations so important that they will do it themselves.

  • If you know an open source project doesn't have any.

  • And so this is Doc's China, which aggregates Chinese language translations of many of the open source projects we all use.

  • Um, I think it's a pretty incredible project in a really great example of, um, you know, just getting it done.

  • Um, but these unofficial translations do have some issues, so they're less discoverable because they're not a part of the core documentation on, and they have more opportunity to grow stale or be incorrect because they're not part.

  • They're not maintained by the official maintainers.

  • Um, the reactor.

  • Orig recently led a project to add a bunch of translations to their core documentation.

  • So on their site, there are now a bunch of different language versions.

  • I think is a really great example in a fantastic step to recognizing their super international community.

  • Um, they even built robot to open pull requests in each of the translations.

  • Whenever the core English stock exchange I know that this was inspired by the Vue jazz team, who are also doing a really good job.

  • I think it's a great strategy for including developers around the world.

  • I'm gonna take another sip of water.

  • I invite you all to do this as well.

  • Um, moving past language.

  • Let's talk about culture.

  • Um, cultural differences play a really big role in how technology is used in people's everyday lives.

  • Um, cultural attitudes referred to people's beliefs, their lifestyles, our customs, you know, how they greet each other in the morning or how they were coffee and what time they eat meals that on what kind of devices they used to do all of those things and talk to each other and culture is really hard to quantify.

  • There's a framework for doing it.

  • It's called Hoffs Ted's Cultural Dimensions on, and it's not perfect.

  • I really hate the gendered power versus nature nurture spectrum, but I think it is a good framework for understanding how different nations and cultural groups might be different from each other.

  • Um, like some might be more focused on preserving tradition or more oriented towards future and change.

  • Some cultures are really focused on collective success.

  • So the success of their family group or of their country, others are like Screw them.

  • I will just get rich myself, right?

  • Um and it makes more objective.

  • I won't say perfectly objective comparisons between different cultural groups possible.

  • So in this study, they surveyed a bunch of people around the world on Beacon.

  • See that Egypt, Egyptian, Japanese and Russian participants all have much higher avoidance of uncertain situations.

  • So these are situations where I might be like lack of information.

  • There's just generally uncertain outcome.

  • We can see that the U.

  • S.

  • In comparison is extremely indulgent and really values values Individual is, um, an individual success over these countries as well.

  • And I think that although these thes differences our subconscious, they show up in the way.

  • Uh, you would build a website or launch a product in these countries.

  • So this is a website for purchasing tickets for the Ghibli Museum near Tokyo.

  • It is a notoriously booked and really difficult to get into, uh, museum.

  • But on these sites is really common to see um, really elaborate instructions step by step with screenshots of the kind of software you would need to use and down to the buttons you'd press to get a ticket.

  • So you know exactly how to get the ticket.

  • And if you don't get one, you know why.

  • Um and to contrast this with the Broad Museum in Los Angeles, first of all, there's you can either show up or buy a ticket.

  • So there's a couple ways.

  • And once you start to dig into the site, you see all this uncertain language like, Oh, there's a best chance to view the exhibit and it's first come first serve.

  • So you don't actually know if you get to see the whole museum.

  • If you go which results in funny Reddit threads, Um, like, wouldn't it be easier to travel to Narnia on a flying pig than to get a ticket to go to this museum?

  • Um, and I think that we can think about cultural differences, not just in these really broad terms, in terms of like societies in nations, but also in terms of teams, teams that we work in or cities in our own countries.

  • So at my company ribbon, I help I build tools that help people manage the purchasing of homes.

  • So we built this really elaborate, um, sales tracking tool.

  • And we thought we designed the table really nicely.

  • But the team going back to Google Sheets, Um, and we couldn't keep up with all their requests and changes.

  • Um and so we eventually gave up because they just wouldn't use the tool.

  • And they kept doing all this data entry.

  • And we replaced it with this monstrosity, which is 1/3 party embed herbal spreadsheet tool.

  • Um, and they love it.

  • It turns out it's exactly what they needed.

  • They needed something compact, so we didn't need to optimize for readability or beauty.

  • Um, they didn't want a scroll.

  • They needed to see all the information all together in one screen, and they wanted it to be really flexible because their requirements on KP eyes were changing all the time.

  • And so, by building this presumably worst product, actually, by not building a product at all and deleting a bunch of code, we better met the needs of our team.

  • So just to go back to the cultural dimensions, let's compare the U.

  • S.

  • And China.

  • China is also pretty low on uncertainty avoidance, but much, much higher on future orientation and So this means that there were willing to deal with ambiguity, Sort of as a generalization, um, and more adaptable to changing technologies.

  • Um, So what we're seeing is that China has adopted mobile technology in all aspects of their lives, so cure codes are found literally everywhere.

  • Um, in transit advertisements, you use it to open websites to add contacts, to get information to buy tickets.

  • Now, to make payments we chat is a nab salute, Lee ubiquitous app with over a 1,000,000,000 users in China And in that area, um, that, uh, you know, has really spread throughout China years and years before we saw the cure technology catch on in the West.

  • So we're really starting to see China outpace the U.

  • S and the West in technological innovation.

  • And this kind of thing changes how you would launch startups, right?

  • So in a really mobile oriented country, you might skip a desktop at all together.

  • So this is a light app that you would build to be open from a Q R code in the wee chat in the wheat shot mobile browser.

  • Um, and, uh, there again, not meant to be viewed from desktop.

  • It just doesn't work on a desktop.

  • Um, it's a completely different kind of environment there.

  • And while we're on the topic of China, we can talk about the fact that the Internet is not actually equally free and available in every country in the same way.

  • So Internet infrastructure is provided through private companies and utilities subject to national laws.

  • So in the past, China has cracked down on, uh, foreign service is they have blocked Google Ap eyes, which will force developers to find mirrors and alternatives.

  • Um, the latest status is that Google AP is Irving served through servers in Beijing.

  • Here in Europe, there are new privacy regulations called GDP are so I'm sure everybody here is familiar with the requirement to get user's permission.

  • Thio set and use cookies.

  • Um, and unfortunately, in July 3 U S.

  • Sanction Iran, Um, and a developer in Iran named Shaheen wrote a really good block post about what it's like to be a developer living in a country with sanctions imposed on it talked about how really critical developer service's were cut off, like get lab Docker, android developer just the documentation site itself and even get hub so developers lose access to their code, the sites might go down.

  • They have to use proxies and VP ends, which is questionably legal and pretty dangerous to have them dio on.

  • And it's, you know, it's a very challenging situation on DS.

  • Continue.

  • It's gonna continue to be a problem.

  • Um, and finally, Internet access in general is very different across the world.

  • People don't use the Internet in the same way I'm so, for example, mobile traffic is much greater in Africa and Asia than it is in the Western Hemisphere.

  • So in 2018 I think 78% of visits to websites in India were on mobile devices, whereas in the U.

  • S, the split is more 50 50.

  • I'm so in a place like India where 3/4 of Internet traffic is from mobile, you would certainly build a mobile first website or a native app before you built a desktop site.

  • And if you look at high speed sort of broadband access, which is fast, stable Internet, it's not equally distributed either.

  • Um, there was a really good talk about this yesterday.

  • I think, um, well, I don't know, um and there's a you know, There's a really big gulf between the developed world and the developing world.

  • Um, and people in rural areas in every country also experienced this where with a slow Internet connection.

  • First of all, you have slower speeds, but your connection might also drop out, too, so it will be intermittent.

  • I mean, this could make using APS and websites really frustrating.

  • Um, and so, as a developer, you can improve this experience by offering on offline support.

  • I'm so by using techniques like local storage service workers by building progressive Web APS.

  • I mean, this is a progressive Web app from Kenya.

  • It's another e commerce site.

  • Um, and, uh, you use it by visiting the site and safari and actually adding it to your home screen.

  • And so, by doing that, it has the has the ability to cash content locally and use service workers to stay usable even if the Internet connection drops out.

  • Um, and these progressive Web apps also take up less space on a phone, which would be really important in a place where a lot of people use budget phones when they're not using really expensive iPhones.

  • On this article in Bill's Tech Africa covered how they saw really huge gains and usage and conversion after building this progressive Web app.

  • And so it's not just that by architect in the application differently.

  • It became better and easier for users to use actually resulted in a better business outcome and more money being made.

  • Um, so that's a really world wind tour of just some parts of the world and just some challenges that developers and other countries experience.

  • I think that it is really fun, um, and fascinating to talk about Andi.

  • I like it sort of in an academic sense.

  • Um, but I also think there are ways we can all apply this to our everyday, and the first is that we can always be thinking about it, including developers who might not have the same access as us.

  • You know, I think probably everybody in this room speaks English.

  • Not every developer does or will.

  • Um, if you are part of an open source project or build developer tools, consider making translations of priority.

  • Um, and if you have friends who are affected by sanctions and censorship, we should be giving them a platform.

  • Um, if you come across a website or an application that isn't what you're used to.

  • So if you travel to a new country and things feel differently, um, try to think about the cultural context in which it was made.

  • What led to it being built that way?

  • Um, try not to apply your own value system, Thio, uh, another person or another project that was built, um, with a completely different value system in mind.

  • And this is called cultural relativity.

  • It's a really core anthropological concept, and it helps us avoid using loaded terms to describe user interfaces like cluttered or ugly or text taxes old when it might be more of a lack of context.

  • Andi, I think this can generally make us more inclusive and empathetic with each other as well.

  • And finally, user empathy is not just for product managers and designers.

  • We, as engineers can use it to make better technical decisions for the tools and the products we build, and we can also use it to localize to our own users people in our own, you know, in our own cities.

  • So if you know that, um, your your product has users in an international market or that your company is growing to attract people from another country where they speak a different language.

  • Consider putting in more effort to providing a truly localized, strong translation or architect.

  • Your application to be a progressive Web app if your users experience slower or intermittent connections.

  • I mean, I think that the companies and the engineers that do this, um, we'll win the hearts of their users.

  • They will build better software, um, and ultimately benefit from the growth of the Internet in the decades to come.

  • And that's all I have today.

  • Thank you.

Thank you.

字幕與單字

單字即點即查 點擊單字可以查詢單字解釋

B1 中級

世界的網絡規範。探討西方以外的互聯網,作者:Kat Kitay|JSConf BP 2019。 (Web Norms of the World: An exploration of the internet beyond the West by Kat Kitay | JSConf BP 2019)

  • 2 0
    林宜悉 發佈於 2021 年 01 月 14 日
影片單字