Desarrollo web front-end


El desarrollo web front-end se refiere a la práctica de construir y diseñar la interfaz de usuario de un sitio web o aplicación. Esto implica trabajar con tecnologías del lado del cliente, como HTML, CSS y JavaScript, para crear páginas web interactivas y visualmente atractivas.

La expresión "front-end" tiene su origen en el principio de separación de preocupaciones, el cual aboga por establecer una clara distinción entre la interfaz de usuario (front-end) y la lógica del servidor (back-end) en una aplicación. Esta separación facilita la creación de un código más modular y fácil de mantener. De esta manera, el desarrollo front-end se centra en la parte del software con la que los usuarios interactúan directamente. Los desarrolladores de este ámbito son responsables de crear experiencias de usuario atractivas y funcionales, asegurándose de que los usuarios puedan navegar y utilizar una aplicación de manera efectiva. Esto implica trabajar en el diseño, la presentación y la interactividad de las páginas web y aplicaciones.

Características

Para brindar una buena experiencia de usuario, el desarrollo front-end se centra en distintos rubros, tales como:

  1. Interactividad del Usuario: Desarrollar interfaces de usuario interactivas y atractivas que mejoren la experiencia del usuario en el navegador.
  2. Compatibilidad con Navegadores: Asegurar que la aplicación sea compatible con diversos navegadores para garantizar una experiencia consistente para todos los usuarios.
  3. Diseño Responsivo: Implementar diseños que se adapten y funcionen de manera óptima en diferentes dispositivos y tamaños de pantalla.
  4. Optimización de Rendimiento: Optimizar el rendimiento de la interfaz para cargar rápidamente y proporcionar una experiencia fluida.
  5. Desarrollo Basado en Componentes: Adoptar enfoques basados en componentes para facilitar la reutilización de código y mejorar la mantenibilidad.
  6. Accesibilidad: Garantizar que la aplicación sea accesible para personas con discapacidades mediante el cumplimiento de estándares de accesibilidad.
  7. Integración de Diseño y Desarrollo: Colaborar estrechamente con diseñadores para implementar interfaces que reflejen la visión y la identidad visual del producto.
  8. Frameworks y Bibliotecas: Utilizar frameworks y bibliotecas como React, Angular o Vue.js para agilizar el desarrollo y facilitar la gestión del estado de la aplicación.

Herramientas usadas en el desarrollo front-end

Hay varias herramientas y plataformas (wordpress, magento, etc.) disponibles que pueden usarse para desarrollar el front-end de un sitio web, y saber qué herramientas son las que mejor se ajustan a tareas específicas marca la diferencia entre desarrollar un sitio comprometido de otro bien diseñado y escalable.[1]

Hyper Text Markup Language (HTML)

HTML, siglas en inglés de Hyper Text Markup Language (lenguaje de marcas de hipertexto), es la columna vertebral de cualquier proceso de desarrollo web, sin el cual las páginas web no existirían. Hipertexto significa que el texto tiene enlaces, denominados hipervínculos, incrustados en el mismo. Cuando el usuario hace clic en una palabra o una frase que tiene un hipervínculo, se realiza una llamada a otra página web. El lenguaje de marcas indica que el texto puede convertirse en imágenes, tablas, enlaces, y otras representaciones. El código HTML es el que provee un marco general de cuál será el aspecto del sitio. HTML fue desarrollado por Tim Berners-Lee. La última versión de HTML se llama HTML5 y se publicó en 28 de octubre de 2014, por recomendación de W3C. Esta versión contiene nuevas y eficientes maneras de manejar elementos como archivos de vídeo y audio.

Cascading Style Sheets (CSS)

Las hojas de estilo en cascada, en inglés Cascading Style Sheets, controlan la apariencia visual del sitio web y permiten darle un aspecto único. Esto se consigue con hojas de estilo que se sobreponen sobre otras reglas de estilo y se lanzan basándose en el tipo de entrada, como el tamaño y la resolución de la pantalla del dispositivo.

JavaScript

JavaScript es un lenguaje de programación imperativa basado en eventos (a diferencia del modelo de programación declarativa de HTML) que se utiliza para transformar una página HTML estática en una interfaz dinámica. El código JavaScript puede utilizar Document Object Model (DOM), proporcionado por el estándar HTML, para manipular una página web en la respuesta a eventos, como las entradas de usuario.

Utilizando una técnica llamada AJAX, el código JavaScript también puede recoger contenido activamente de la web (independientemente de la página HTML original recibida), y además reacciona ante eventos del lado del servidor, dotando de una naturaleza realmente dinámica a la experiencia de la página web.

WebAssembly

WebAssembly, soportado por todos los navegadores más conocidos (p. ej. aquellos desarrollados por Google, Apple, Mozilla y Microsoft), es la única alternativa a JavaScript para poder ejecutar código en navegadores web (sin la ayuda de complementos, como Flash, Java o Silverlight; todos ellos depreciados, ya que los navegadores están dejando de dar soporte a los complementos). Con anterioridad a esta medida, existía asm.js (un módulo de JavaScript; permitiendo así que funcione en todos los navegadores), que se usaba como compilador para navegadores como Internet Explorer 11; y para aquellos navegadores que no soportaban WebAssembly directamente, se podía compilar en asm.js y darle soporte de esa manera. En general, los programadores no codifican en WebAssembly (o en asm.js) directamente, sino que utilizan lenguajes como Rust, C, C++, o en teoría cualquier lenguaje que pueda compilarlo.

Objetivos del desarrollo

El desarrollador front-end tiene en mente los siguientes puntos, utilizando las herramientas y técnicas disponibles para alcanzar tales objetivos.[1]

Accesibilidad

Para el continuo desarrollo para dispositivos móviles, como los teléfonos inteligentes y tabletas, los diseñadores necesitan asegurar que sus sitios web se muestran correctamente en los navegadores de todos los dispositivos. Esto puede conseguirse creando un diseño web adaptable en las hojas de estilo CSS.

Rendimiento

La mayor preocupación en cuanto a rendimiento es el tiempo de espera, manipulando HTML, CSS y JavaScript para asegurar que el sitio web se cargue rápidamente.

Referencias

Read other articles:

Each of the 10 teams of Minor League Baseball's Florida State League carry a 30-man active roster.[1] Only these players are eligible to play. Teams may have any number of inactive players on their rosters at a given time who do not count toward active roster limits. Injured players may be placed on the injured list (7-day or 60-day).[2] The temporary inactive list and bereavement list are for players attending to personal matters.[2] Major league players may be place...

 

Polish nobleman and professor Ireneusz RoszkowskiRoszkowski in the 1970sBorn24 March 1910Łapy, PolandDied21 April 1996Warsaw, PolandResting placePowązki CemeteryNationalityPolishCitizenshipPolishAlma materUniversity of WarsawKnown for First in the world Laboratory of Experimental Embryology Latzko-Tausig-Roszkowski (LTR) method operatio crutiata method Awards Order of Polonia Restituta Golden Cross of Merit Medal for Sacrifice and Courage Ogończyk – Coat of arms of Ireneusz Ros...

 

Croatian politician You can help expand this article with text translated from the corresponding article in Croatian. (December 2020) Click [show] for important translation instructions. View a machine-translated version of the Croatian article. Machine translation, like DeepL or Google Translate, is a useful starting point for translations, but translators must revise errors as necessary and confirm that the translation is accurate, rather than simply copy-pasting machine-translated tex...

Rifle cartridge designed by Arne Brennan 45 RaptorPhoto of the 45 Raptor cartridgeTypeRiflePlace of originUnited StatesProduction historyDesignerArne BrennanDesigned2014ManufacturerNorth American Sportsman, LLCProduced2014–presentSpecificationsParent case.308 WinchesterCase typeRimless, straightBullet diameter.452 in (11.5 mm)Neck diameter.478 in (12.1 mm)Rim diameter.473 in (12.0 mm)Rim thickness.039 in (0.99 m...

 

Yasmina Khadra a Parigi nel 2010 Mohammed Moulessehoul, meglio noto con lo pseudonimo femminile di Yasmina Khadra (in arabo ياسمينة خضراء‎?) (10 gennaio 1955), è uno scrittore algerino. Membro dell'esercito fu testimone diretto della sanguinosa guerra civile che devastò l'Algeria per oltre un decennio, fu costretto per motivi di censura a usare lo pseudonimo femminile di Yasmina Khadra. Ha esordito come scrittore nel 1998 con il romanzo Morituri, seguito poco dopo da ...

 

American Quaker abolitionist and suffragist (1793–1880) Lucretia MottLucretia Mott, at 49 years old (1842), at the National Portrait Gallery in Washington, D.C.BornLucretia Coffin(1793-01-03)January 3, 1793Nantucket, Massachusetts, U.S.DiedNovember 11, 1880(1880-11-11) (aged 87)La Mott, Cheltenham, Pennsylvania, U.S.OccupationsAbolitionistsuffragistteacherSpouse James Mott ​ ​(m. 1811; died 1868)​Children6RelativesMartha Coffin Wright (si...

This article has an unclear citation style. The references used may be made clearer with a different or consistent style of citation and footnoting. (December 2023) (Learn how and when to remove this message) This article needs to be updated. Please help update this article to reflect recent events or newly available information. (December 2023) Kingdom of Eswatini This is a list of cities and towns in Eswatini. The table below also includes the population and region information. List Rank C...

 

継続中の戦闘については「2023年パレスチナ・イスラエル戦争」をご覧ください。 この記事は最新の出来事(2023年パレスチナ・イスラエル戦争)に影響を受ける可能性があります。情報は出来事の進行によって急速に変更される可能性があります。(2023年10月) パレスチナ紛争 戦争:中東戦争 年月日:中東戦争以降 場所:パレスチナ 結果:継続中 交戦勢力 イスラエ...

 

此條目需要补充更多来源。 (2021年7月4日)请协助補充多方面可靠来源以改善这篇条目,无法查证的内容可能會因為异议提出而被移除。致使用者:请搜索一下条目的标题(来源搜索:美国众议院 — 网页、新闻、书籍、学术、图像),以检查网络上是否存在该主题的更多可靠来源(判定指引)。 美國眾議院 United States House of Representatives第118届美国国会众议院徽章 众议院旗...

Voce principale: Eintracht Frankfurt. Eintracht FrankfurtStagione 1973-1974Sport calcio Squadra Eintracht Francoforte Allenatore Dietrich Weise All. in seconda Dieter Stinka Bundesliga4º posto Coppa di GermaniaFinale Maggiori presenzeCampionato: Kliemann, Körbel (34)Totale: Körbel (39) Miglior marcatoreCampionato: Hölzenbein (12)Totale: Hölzenbein (18) StadioWaldstadion Maggior numero di spettatori62 000 vs. Bayern Monaco Minor numero di spettatori8 000 vs. Werder Brema M...

 

Pour les articles homonymes, voir Cathédrale d'Helsinki et Ouspenski. Cet article est une ébauche concernant une église ou une cathédrale et Helsinki. Vous pouvez partager vos connaissances en l’améliorant (comment ?) selon les recommandations des projets correspondants. Cathédrale OuspenskyLa cathédrale de la Dormition, à HelsinkiPrésentationType CathédralePartie de Old part of Katajanokka (d)Culte Église orthodoxe de FinlandeFondation 1868Diocèse Éparchie d'Helsinki (d)...

 

This article needs additional citations for verification. Please help improve this article by adding citations to reliable sources. Unsourced material may be challenged and removed.Find sources: Jacob van Utrecht – news · newspapers · books · scholar · JSTOR (August 2020) (Learn how and when to remove this message) Painting Member of the Alardes family, by Jacob Claesz van Utrecht. National Museum, Stockholm. Jacob Claesz van Utrecht, also named by his...

Further information: International recognition of the State of Palestine Politics of Palestine Officeholders whose status is disputed are shown in italics Member state of the Arab League Government State of Palestine government (Ramallah) President: Mahmoud Abbasa Prime Minister: Mohammad Shtayyeh Hamas government (Gaza) National symbols Flag National anthem Coat of arms Legislative Council Palestinian National Council Palestinian Legislative Council Current members Speaker Aziz Dweik Electi...

 

هذه المقالة يتيمة إذ تصل إليها مقالات أخرى قليلة جدًا. فضلًا، ساعد بإضافة وصلة إليها في مقالات متعلقة بها. (ديسمبر 2018) جوك هندرسون معلومات شخصية الميلاد سنة 1871   دامفريس  [لغات أخرى]‏  الوفاة 30 أغسطس 1930(1930-08-30) مركز اللعب مهاجم الجنسية المملكة المتحدة المملكة المت...

 

Begole redirects here. For other uses, see Brian BeGole.American politician (1815–1896) This article has multiple issues. Please help improve it or discuss these issues on the talk page. (Learn how and when to remove these template messages) This article includes a list of references, related reading, or external links, but its sources remain unclear because it lacks inline citations. Please help improve this article by introducing more precise citations. (November 2020) (Learn how and when...

This article is about the Bon Jovi album. For the title track, see Keep the Faith (Bon Jovi song). For other uses, see Keep the Faith (disambiguation). 1992 studio album by Bon JoviKeep the FaithStudio album by Bon JoviReleasedNovember 3, 1992 (1992-11-03)RecordedJanuary–August 1992StudioLittle Mountain Sound Studios in VancouverGenre Hard rock pop metal Length65:04LabelMercuryProducerBob RockBon Jovi chronology Hard & Hot (Best of Bon Jovi)(1991) Keep the Faith(1...

 

فريق برتلينج النفاث   الموقع الرسمي الموقع الرسمي  تعديل مصدري - تعديل   يعد فريق برتلينج النفاث، (بالإنجليزية: Breitling Jet Team)‏.[1] أكبر فريق عرض للألعاب الجوية في أوروبا. مقرها في ديجون ، فرنسا ، وهي تطير سبع طائرات آيرو إل-39 ألباتروس التشيكية. الفريق يحلق الفريق في ع...

 

Pour les articles homonymes, voir Piché. Ron Piché Lanceur Frappeur droitier  Lanceur droitier Premier match 30 mai 1960 Dernier match 26 septembre 1966 Statistiques de joueur (1960-1966) Victoires-défaites 10-16 Moyenne de points mérités 4,19 Équipes Braves de Milwaukee (1960-1963) Angels de la Californie (1965) Cardinals de Saint-Louis (1966) modifier  Ronald Jacques Piché né le 22 mai 1934 à Verdun, Québec, Canada et mort le 3 février 2011[1],[2] à Montréal, es...

News CorporationТипМедіакорпораціяОрганізаційно-правова форма господарюванняпублічна компаніяГалузьіндустрія розваг[d] і засіб масової інформаціїЛістинг на біржіNYSE: NWSПопередник(и)Chris-Craft IndustriesdНаступник(и)(спадкоємці)21st Century FoxЗасновано1979Засновник(и)Руперт МердокЗ...

 

Questa voce sull'argomento autorità unitarie dell'Inghilterra è solo un abbozzo. Contribuisci a migliorarla secondo le convenzioni di Wikipedia. Distretto di EastbourneCittà e distrettoDistretto di Eastbourne – VedutaLa spiaggia a Eastbourne LocalizzazioneStato Regno Unito    Inghilterra RegioneSud Est Contea East Sussex TerritorioCoordinate50°46′N 0°16′E50°46′N, 0°16′E (Distretto di Eastbourne) Altitudine22 m s.l.m. Superficie4...